|
1 | | -/* Classes for the index page. */ |
2 | | -.home-tiles { |
3 | | - display: grid; |
| 1 | +.home-card-grid { |
4 | 2 | grid-template-columns: repeat(2, minmax(0, 1fr)); |
5 | | - gap: 1rem; |
6 | | - margin: 1.25rem 0 1rem; |
7 | 3 | } |
8 | 4 |
|
9 | | -.home-tile { |
10 | | - display: flex; |
11 | | - flex-direction: column; |
12 | | - align-items: center; |
13 | | - gap: 0.55rem; |
14 | | - padding: 1rem 1.1rem; |
15 | | - border: 1px solid rgba(15, 23, 42, 0.14); |
16 | | - border-radius: 14px; |
17 | | - background: #ffffff; |
18 | | - color: inherit; |
19 | | - text-decoration: none; |
| 5 | +.home-card-grid li { |
20 | 6 | text-align: center; |
21 | | - box-shadow: 0 3px 10px rgba(15, 23, 42, 0.11); |
22 | | - transition: |
23 | | - transform 120ms ease-in-out, |
24 | | - box-shadow 120ms ease-in-out, |
25 | | - border-color 120ms ease-in-out; |
26 | | -} |
27 | | - |
28 | | -.home-tile, |
29 | | -.home-tile:hover, |
30 | | -.home-tile:focus, |
31 | | -.home-tile:focus-visible, |
32 | | -.home-tile * { |
33 | | - text-decoration: none; |
34 | | -} |
35 | | - |
36 | | -.home-tile:hover { |
37 | | - transform: translateY(-2px); |
38 | | - box-shadow: 0 10px 22px rgba(15, 23, 42, 0.16); |
39 | | - border-color: #91a9ca; |
40 | | -} |
41 | | - |
42 | | -.md-typeset a.home-tile, |
43 | | -.md-typeset a.home-tile:hover, |
44 | | -.md-typeset a.home-tile:focus, |
45 | | -.md-typeset a.home-tile:focus-visible, |
46 | | -.md-typeset a.home-tile:active, |
47 | | -.md-typeset a.home-tile:visited { |
48 | | - text-decoration: none !important; |
49 | | - border-bottom: 0 !important; |
50 | | - background-image: none !important; |
51 | | - color: inherit !important; |
52 | 7 | } |
53 | 8 |
|
54 | | -body[data-md-color-scheme="default"] .md-typeset a.home-tile, |
55 | | -body[data-md-color-scheme="default"] .md-typeset a.home-tile:hover, |
56 | | -body[data-md-color-scheme="default"] .md-typeset a.home-tile:focus, |
57 | | -body[data-md-color-scheme="default"] .md-typeset a.home-tile:focus-visible, |
58 | | -body[data-md-color-scheme="default"] .md-typeset a.home-tile:active, |
59 | | -body[data-md-color-scheme="default"] .md-typeset a.home-tile:visited { |
60 | | - background: #ffffff !important; |
61 | | - background-color: #ffffff !important; |
62 | | -} |
63 | | - |
64 | | -.md-typeset a.home-tile *, |
65 | | -.md-typeset a.home-tile:hover *, |
66 | | -.md-typeset a.home-tile:focus *, |
67 | | -.md-typeset a.home-tile:focus-visible *, |
68 | | -.md-typeset a.home-tile:active *, |
69 | | -.md-typeset a.home-tile:visited * { |
70 | | - text-decoration: none !important; |
71 | | - border-bottom: 0 !important; |
72 | | - background-image: none !important; |
73 | | -} |
74 | | - |
75 | | -.home-tile h3 { |
76 | | - margin: 0; |
77 | | - font-size: 1.05rem; |
78 | | -} |
79 | | - |
80 | | -.home-tile p { |
81 | | - margin: 0; |
82 | | - color: inherit; |
83 | | - line-height: 1.45; |
84 | | -} |
85 | | - |
86 | | -.home-tile img { |
| 9 | +.home-card-icon { |
| 10 | + display: block; |
| 11 | + margin: 0 auto 0.75rem; |
87 | 12 | width: 44px; |
88 | 13 | height: 44px; |
89 | | - object-fit: contain; |
90 | 14 | } |
91 | 15 |
|
92 | | -@media (max-width: 760px) { |
93 | | - .home-tiles { |
94 | | - grid-template-columns: 1fr; |
95 | | - } |
| 16 | +.home-card-title, |
| 17 | +.home-card-title:hover, |
| 18 | +.home-card-title:focus, |
| 19 | +.home-card-title:focus-visible, |
| 20 | +.home-card-title:visited { |
| 21 | + color: inherit !important; |
| 22 | + text-decoration: none !important; |
| 23 | + font-size: 1.15em; |
96 | 24 | } |
97 | 25 |
|
98 | 26 | pre, |
99 | 27 | li pre { |
100 | 28 | padding-left: 0; |
101 | 29 | } |
102 | 30 |
|
103 | | -body[data-md-color-scheme="slate"] .home-tile { |
104 | | - border-color: rgba(203, 213, 225, 0.24); |
105 | | - background: rgba(15, 23, 42, 0.38); |
106 | | - box-shadow: 0 4px 12px rgba(2, 6, 23, 0.38); |
107 | | -} |
108 | | - |
109 | | -body[data-md-color-scheme="slate"] .home-tile:hover { |
110 | | - border-color: rgba(147, 197, 253, 0.55); |
111 | | - box-shadow: 0 12px 26px rgba(2, 6, 23, 0.46); |
112 | | -} |
113 | | - |
114 | | -body[data-md-color-scheme="slate"] .home-tile p { |
115 | | - color: inherit; |
116 | | -} |
117 | | - |
118 | | -@media (prefers-color-scheme: dark) { |
119 | | - .home-tile { |
120 | | - border-color: rgba(203, 213, 225, 0.24); |
121 | | - background: rgba(15, 23, 42, 0.38); |
122 | | - box-shadow: 0 4px 12px rgba(2, 6, 23, 0.38); |
123 | | - } |
124 | | - |
125 | | - .home-tile:hover { |
126 | | - border-color: rgba(147, 197, 253, 0.55); |
127 | | - box-shadow: 0 12px 26px rgba(2, 6, 23, 0.46); |
128 | | - } |
129 | | -} |
130 | | - |
131 | 31 | .md-typeset dl.cli-reference { |
132 | 32 | margin: 0.75rem 0 1.25rem; |
133 | 33 | } |
|
0 commit comments