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