1/**
2 * Copyright (c) 2024-2025, The Linux Foundation.
3 * SPDX-License-Identifier: Apache-2.0
4 */
5
6/* Board overview "card" on board documentation pages */
7.sidebar.board-overview {
8    border-radius: 12px;
9    padding: 0px;
10    background: var(--admonition-note-background-color);
11    color: var(--admonition-note-title-color);
12    border-color: var(--admonition-note-title-background-color);
13}
14
15@media screen and (max-width: 480px) {
16    .sidebar.board-overview {
17        float: none;
18        margin-left: 0;
19    }
20}
21
22.sidebar.board-overview {
23    color: var(--admonition-note-color);
24}
25
26.sidebar.board-overview .sidebar-title {
27    font-family: var(--header-font-family);
28    background: var(--admonition-note-title-background-color);
29    color: var(--admonition-note-title-color);
30    border-radius: 12px 12px 0px 0px;
31    margin: 0px;
32    text-align: center;
33}
34
35.sidebar.board-overview figure {
36    padding: 1rem;
37    margin-bottom: -1rem;
38}
39
40.sidebar.board-overview figure img {
41    height: auto !important;
42}
43
44.sidebar.board-overview figure figcaption p {
45    margin-bottom: 0px;
46}
47
48.sidebar.board-overview dl.field-list {
49    align-items: center;
50    margin-top: 12px !important;
51    margin-bottom: 12px !important;
52    grid-template-columns: auto 1fr !important;
53    padding-right: 1em;
54}
55
56.sidebar.board-overview dl.field-list>dt {
57    background: transparent !important;
58}
59
60.sidebar.board-overview dl.field-list>dd {
61    margin-left: 1em;
62    text-overflow: ellipsis;
63    overflow: hidden;
64}
65
66.sidebar.board-overview dl.field-list>dd code {
67    font-size: 0.9em;
68}
69
70.sidebar.board-overview #board-github-link {
71    text-align: center;
72    margin-bottom: 1em;
73    font-size: 0.9em;
74}
75
76.sidebar.board-overview #board-github-link a {
77    display: inline-block;
78    white-space: nowrap;
79    overflow: hidden;
80    text-overflow: ellipsis;
81    max-width: 80%;
82}
83
84.legend {
85    font-size: 0.9em;
86    border-radius: 6px;
87    margin: auto;
88
89    .supported-hardware {
90        margin-bottom: 0px !important;
91        grid-template-columns: auto auto !important;
92
93        dt {
94            display: table-cell !important;
95            padding-left: 0em;
96            padding-bottom: 0.5em;
97            text-align: center;
98            background: none !important;
99        }
100
101        dd {
102            margin-top:4px;
103            line-height: 1.1em;
104        }
105    }
106}
107
108
109.hardware-features {
110    th {
111        background: var(--navbar-background-color);
112        color: var(--navbar-level-1-color);
113        border: none !important;
114        font-weight: 600;
115        text-transform: uppercase;
116        font-size: 0.8em;
117        letter-spacing: 0.5px;
118    }
119
120    td,
121    th {
122        padding: 8px 12px;
123        border-left: none !important;
124        text-align: left;
125    }
126
127    td {
128        font-size: 0.85em;
129        background: transparent !important;
130        vertical-align: middle;
131
132        p {
133            white-space: normal;
134        }
135    }
136
137    /* Column widths and specific styling */
138    .type {
139        font-weight: 600;
140    }
141
142    .location {
143        font-size: 0.9em;
144    }
145
146    .description {
147    }
148
149    .compatible {
150        font-family: var(--monospace-font-family);
151
152        code {
153            background: transparent;
154            border: none;
155            padding: 0;
156            font-size: 0.9em;
157        }
158
159        code.literal {
160            display: inline-block;
161            width:190px;
162            white-space: nowrap;
163            text-overflow: ellipsis;
164            overflow: hidden;
165        }
166    }
167}
168
169.count {
170    line-height: 1rem;
171    display: inline-flex;
172    align-items: center;
173    padding: 1px 4px;
174    border-radius: 4px;
175    font-size: 0.7em;
176    font-weight: 600;
177    margin-left: 4px;
178    padding-right: 6px !important;
179
180    &::before {
181        content: "×";
182        margin-right: 2px;
183    }
184
185    &.okay-count {
186        background: rgba(46, 204, 113, 1);
187        color: white;
188    }
189
190    &.disabled-count {
191        background: rgba(241, 196, 15, 1);
192        color: black;
193    }
194}
195
196.location-chip {
197    line-height: 1em;
198    display: inline-block;
199    width: 7em;
200    padding: 0.6em;
201    border-radius: 12px;
202    font-size: 0.8em;
203    font-weight: 600;
204    text-transform: lowercase;
205    text-align: center;
206    white-space: nowrap;
207
208    &.onboard {
209        background: var(--admonition-note-title-background-color);
210        color: var(--admonition-note-title-color);
211    }
212
213    &.onchip {
214        background: var(--admonition-tip-title-background-color);
215        color: var(--admonition-tip-title-color);
216    }
217}
218
219/* Status indicators */
220.status {
221    display: flex;
222    align-items: center;
223    gap: 6px;
224}