Mercurial > minori

comparison dep/fmt/doc/bootstrap/grid.less @ 343:1faa72660932

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
*: transfer back to cmake from autotools autotools just made lots of things more complicated than they should have and many things broke (i.e. translations)
author Paper <paper@paper.us.eu.org>
date Thu, 20 Jun 2024 05:56:06 -0400
parents
children
comparison
equal deleted inserted replaced
342:adb79bdde329 343:1faa72660932
1 //
2 // Grid system
3 // --------------------------------------------------
4
5
6 // Container widths
7 //
8 // Set the container width, and override it for fixed navbars in media queries.
9
10 .tb-container {
11 .container-fixed();
12
13 @media (min-width: @screen-sm-min) {
14 width: @container-sm;
15 }
16 @media (min-width: @screen-md-min) {
17 width: @container-md;
18 }
19 @media (min-width: @screen-lg-min) {
20 width: @container-lg;
21 }
22 }
23
24
25 // Fluid container
26 //
27 // Utilizes the mixin meant for fixed width containers, but without any defined
28 // width for fluid, full width layouts.
29
30 .container-fluid {
31 .container-fixed();
32 }
33
34
35 // Row
36 //
37 // Rows contain and clear the floats of your columns.
38
39 .row {
40 .make-row();
41 }
42
43
44 // Columns
45 //
46 // Common styles for small and large grid columns
47
48 .make-grid-columns();
49
50
51 // Extra small grid
52 //
53 // Columns, offsets, pushes, and pulls for extra small devices like
54 // smartphones.
55
56 .make-grid(xs);
57
58
59 // Small grid
60 //
61 // Columns, offsets, pushes, and pulls for the small device range, from phones
62 // to tablets.
63
64 @media (min-width: @screen-sm-min) {
65 .make-grid(sm);
66 }
67
68
69 // Medium grid
70 //
71 // Columns, offsets, pushes, and pulls for the desktop device range.
72
73 @media (min-width: @screen-md-min) {
74 .make-grid(md);
75 }
76
77
78 // Large grid
79 //
80 // Columns, offsets, pushes, and pulls for the large desktop device range.
81
82 @media (min-width: @screen-lg-min) {
83 .make-grid(lg);
84 }