| |
| /* |
| * Copyright 2017-present Open Networking Foundation |
| |
| * Licensed under the Apache License, Version 2.0 (the "License"); |
| * you may not use this file except in compliance with the License. |
| * You may obtain a copy of the License at |
| |
| * http://www.apache.org/licenses/LICENSE-2.0 |
| |
| * Unless required by applicable law or agreed to in writing, software |
| * distributed under the License is distributed on an "AS IS" BASIS, |
| * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
| * See the License for the specific language governing permissions and |
| * limitations under the License. |
| */ |
| |
| |
| // |
| // Grid system |
| // -------------------------------------------------- |
| |
| |
| // Container widths |
| // |
| // Set the container width, and override it for fixed navbars in media queries. |
| |
| .container { |
| @include container-fixed; |
| |
| @media (min-width: $screen-sm-min) { |
| width: $container-sm; |
| } |
| @media (min-width: $screen-md-min) { |
| width: $container-md; |
| } |
| @media (min-width: $screen-lg-min) { |
| width: $container-lg; |
| } |
| } |
| |
| |
| // Fluid container |
| // |
| // Utilizes the mixin meant for fixed width containers, but without any defined |
| // width for fluid, full width layouts. |
| |
| .container-fluid { |
| @include container-fixed; |
| } |
| |
| |
| // Row |
| // |
| // Rows contain and clear the floats of your columns. |
| |
| .row { |
| @include make-row; |
| } |
| |
| |
| // Columns |
| // |
| // Common styles for small and large grid columns |
| |
| @include make-grid-columns; |
| |
| |
| // Extra small grid |
| // |
| // Columns, offsets, pushes, and pulls for extra small devices like |
| // smartphones. |
| |
| @include make-grid(xs); |
| |
| |
| // Small grid |
| // |
| // Columns, offsets, pushes, and pulls for the small device range, from phones |
| // to tablets. |
| |
| @media (min-width: $screen-sm-min) { |
| @include make-grid(sm); |
| } |
| |
| |
| // Medium grid |
| // |
| // Columns, offsets, pushes, and pulls for the desktop device range. |
| |
| @media (min-width: $screen-md-min) { |
| @include make-grid(md); |
| } |
| |
| |
| // Large grid |
| // |
| // Columns, offsets, pushes, and pulls for the large desktop device range. |
| |
| @media (min-width: $screen-lg-min) { |
| @include make-grid(lg); |
| } |