| 76 |
76 |
}
|
| 77 |
77 |
|
| 78 |
78 |
#top-menu {
|
| 79 |
|
background: #3E5B76; /* no match in Open Color, using hex code */
|
| 80 |
|
color: var(--oc-white);
|
| 81 |
|
font-size: 0.8em;
|
| 82 |
|
padding-block: 2px;
|
| 83 |
|
padding-inline: 16px 14px;
|
|
79 |
background: #234761; /* no match in Open Color, using hex code */
|
|
80 |
color: rgba(var(--oc-white-rgb), 0.76);
|
|
81 |
font-size: 0.75rem;
|
|
82 |
padding-block: 3px;
|
|
83 |
padding-inline: 20px;
|
| 84 |
84 |
}
|
| 85 |
85 |
#top-menu ul {margin: 0; padding: 0;}
|
| 86 |
86 |
#top-menu li {
|
| 87 |
87 |
float:inline-start;
|
| 88 |
88 |
list-style-type:none;
|
| 89 |
|
margin: 0;
|
|
89 |
margin-block: 0;
|
|
90 |
margin-inline: 0 14px;
|
| 90 |
91 |
padding: 0;
|
| 91 |
92 |
white-space:nowrap;
|
| 92 |
93 |
}
|
| 93 |
|
#top-menu a {color: var(--oc-white); margin-inline-end: 8px; font-weight: bold;}
|
| 94 |
|
#top-menu #loggedas { float: inline-end; margin-inline-end: 0.5em; color: var(--oc-white); }
|
|
94 |
#top-menu a {
|
|
95 |
color: rgba(var(--oc-white-rgb), 0.94);
|
|
96 |
margin-inline-end: 0;
|
|
97 |
text-decoration: none;
|
|
98 |
transition: color 0.18s ease, opacity 0.18s ease;
|
|
99 |
}
|
|
100 |
#top-menu a:hover {
|
|
101 |
color: var(--oc-white);
|
|
102 |
text-decoration: underline;
|
|
103 |
text-underline-offset: 0.18em;
|
|
104 |
}
|
|
105 |
#top-menu #loggedas {
|
|
106 |
float: inline-end;
|
|
107 |
margin-inline-end: 20px;
|
|
108 |
color: rgba(var(--oc-white-rgb), 0.62);
|
|
109 |
}
|
|
110 |
#top-menu #loggedas a {
|
|
111 |
color: var(--oc-white);
|
|
112 |
font-weight: bold;
|
|
113 |
}
|
| 95 |
114 |
|
| 96 |
115 |
#account {float:inline-end;}
|
|
116 |
#account li:last-of-type {margin-inline-end: 0;}
|
|
117 |
|
| 97 |
118 |
|
| 98 |
119 |
#header {
|
| 99 |
|
min-block-size: 8.7ex;
|
| 100 |
120 |
margin: 0;
|
| 101 |
|
background: linear-gradient(180deg, #628DB6 30%, #356D92); /* no match in Open Color, using hex code */
|
| 102 |
|
color: var(--oc-gray-0);
|
| 103 |
|
padding-block: 4px 20px;
|
| 104 |
|
padding-inline: 20px;
|
|
121 |
background: #3A78A3; /* no match in Open Color, using hex code */
|
|
122 |
color: var(--oc-white);
|
|
123 |
padding-block: 0.25rem 0;
|
|
124 |
padding-inline: 1.25rem;
|
| 105 |
125 |
position: relative;
|
| 106 |
126 |
}
|
| 107 |
|
#header a {color: var(--oc-gray-0);}
|
| 108 |
|
#header h1 { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 1.4375rem; font-weight: normal;}
|
| 109 |
|
#header h1 .breadcrumbs { display:block; font-size: 0.8rem; font-weight: normal; line-height: 100%;}
|
|
127 |
body.has-main-menu #header {
|
|
128 |
padding-block-end: 2rem;
|
|
129 |
}
|
|
130 |
#header a {color: rgba(var(--oc-white-rgb), 0.96);}
|
|
131 |
#header h1 {
|
|
132 |
overflow: hidden;
|
|
133 |
white-space: nowrap;
|
|
134 |
display: flex;
|
|
135 |
flex-direction: column;
|
|
136 |
justify-content: center;
|
|
137 |
font-size: 1.375rem;
|
|
138 |
font-weight: normal;
|
|
139 |
line-height: 1.15;
|
|
140 |
margin-inline: 0;
|
|
141 |
padding: 0;
|
|
142 |
/* `#header h1` and `#quick-search` should have the same min-block-size to align vertically */
|
|
143 |
min-block-size: 2.75rem;
|
|
144 |
}
|
|
145 |
#header h1 .breadcrumbs {
|
|
146 |
display:block;
|
|
147 |
margin-block-end: 1px;
|
|
148 |
font-size: 0.8rem;
|
|
149 |
font-weight: normal;
|
|
150 |
line-height: 1.1;
|
|
151 |
color: rgba(var(--oc-white-rgb), 0.72);
|
|
152 |
letter-spacing: 0.04em;
|
|
153 |
}
|
|
154 |
#header h1 .current-project {
|
|
155 |
overflow: hidden;
|
|
156 |
text-overflow: ellipsis;
|
|
157 |
}
|
| 110 |
158 |
|
| 111 |
|
#quick-search {float:inline-end;}
|
| 112 |
|
#quick-search #q {inline-size: 130px;
|
|
159 |
#quick-search {
|
|
160 |
float:inline-end;
|
|
161 |
display: flex;
|
|
162 |
align-items: center;
|
|
163 |
gap: 8px;
|
|
164 |
min-block-size: 2.75rem;
|
|
165 |
}
|
|
166 |
#quick-search #q {
|
|
167 |
inline-size: 130px;
|
| 113 |
168 |
block-size: 24px;
|
| 114 |
169 |
box-sizing: border-box;
|
| 115 |
170 |
vertical-align: middle;
|
| 116 |
171 |
border: 1px solid var(--oc-gray-4);
|
| 117 |
172 |
border-radius: 3px;
|
| 118 |
173 |
}
|
| 119 |
|
#quick-search form {float:inline-start; margin-inline-end:3px;}
|
|
174 |
#quick-search form {float:none; margin-inline-end:0;}
|
| 120 |
175 |
#quick-search form input {margin-block: 0;}
|
| 121 |
|
#quick-search form label {vertical-align:middle;}
|
|
176 |
#quick-search form label {
|
|
177 |
display: inline-block;
|
|
178 |
margin-inline-end: 6px;
|
|
179 |
vertical-align: middle;
|
|
180 |
color: rgba(var(--oc-white-rgb), 0.88);
|
|
181 |
white-space: nowrap;
|
|
182 |
}
|
| 122 |
183 |
#quick-search #project-jump {float:inline-start;}
|
| 123 |
184 |
|
| 124 |
185 |
#main-menu {
|
| 125 |
186 |
position: absolute;
|
| 126 |
187 |
inset-block-end: 0px;
|
| 127 |
|
inset-inline-start: 14px;
|
| 128 |
|
margin-inline-end: -500px;
|
|
188 |
inset-inline-start: 0;
|
|
189 |
inset-inline-end: 0;
|
|
190 |
margin-inline-end: 0;
|
|
191 |
padding-block: 2px;
|
|
192 |
padding-inline: 20px;
|
|
193 |
inline-size: auto;
|
|
194 |
background: var(--oc-indigo-0);
|
|
195 |
}
|
|
196 |
#main-menu ul {
|
|
197 |
margin: 0;
|
|
198 |
padding: 0;
|
| 129 |
199 |
inline-size: 100%;
|
|
200 |
min-block-size: 28px;
|
|
201 |
white-space: nowrap;
|
|
202 |
display: flex;
|
|
203 |
align-items: center;
|
| 130 |
204 |
}
|
| 131 |
|
#main-menu ul {margin: 0; padding: 0; inline-size: 100%; white-space: nowrap;}
|
| 132 |
205 |
#main-menu li {
|
| 133 |
206 |
float:none;
|
| 134 |
207 |
list-style-type:none;
|
| 135 |
208 |
margin-block: 0px;
|
| 136 |
|
margin-inline: 0px 2px;
|
|
209 |
margin-inline: 0;
|
| 137 |
210 |
white-space:nowrap;
|
| 138 |
211 |
display:inline-block;
|
| 139 |
212 |
}
|
|
213 |
#main-menu li:has(a#new-object) {padding-inline-end: 8px;}
|
| 140 |
214 |
#main-menu li a {
|
| 141 |
|
display: block;
|
| 142 |
|
color: var(--oc-white);
|
|
215 |
display: inline-block;
|
|
216 |
color: var(--oc-gray-8);
|
| 143 |
217 |
text-decoration: none;
|
| 144 |
|
font-size: 93%;
|
|
218 |
font-size: 0.8125rem;
|
| 145 |
219 |
margin: 0;
|
| 146 |
|
padding-block: 4px;
|
| 147 |
|
padding-inline: 10px;
|
| 148 |
|
border-start-start-radius: 3px;
|
| 149 |
|
border-start-end-radius: 3px;
|
|
220 |
padding-block: 7px 5px;
|
|
221 |
padding-inline: 12px;
|
|
222 |
background: transparent;
|
|
223 |
font-weight: normal;
|
|
224 |
line-height: 1.2;
|
|
225 |
transition: background-color 0.18s ease, color 0.18s ease;
|
|
226 |
}
|
|
227 |
#main-menu li a:hover {
|
|
228 |
background: var(--oc-indigo-1);
|
|
229 |
color: var(--oc-gray-9);
|
| 150 |
230 |
}
|
| 151 |
|
#main-menu li a:hover {background: rgba(var(--oc-white-rgb), 0.4); color: var(--oc-white); }
|
| 152 |
231 |
#main-menu li:hover ul.menu-children, #main-menu li ul.menu-children.visible {display: block;}
|
| 153 |
|
#main-menu li a.selected, #main-menu li a.selected:hover {background: var(--oc-white); color: var(--oc-gray-7); font-weight: bold;}
|
| 154 |
|
#main-menu li a.new-object {background-color: rgba(var(--oc-white-rgb), 0.4); }
|
|
232 |
#main-menu li a.selected, #main-menu li a.selected:hover {
|
|
233 |
background: var(--oc-white);
|
|
234 |
color: var(--oc-gray-9);
|
|
235 |
font-weight: bold;
|
|
236 |
box-shadow: inset 0 -2px 0 var(--oc-indigo-5);
|
|
237 |
}
|
|
238 |
#main-menu li a.new-object {
|
|
239 |
background-color: var(--oc-indigo-1);
|
|
240 |
border: 1px solid var(--oc-blue-7);
|
|
241 |
color: var(--oc-gray-9);
|
|
242 |
padding-block: 3px;
|
|
243 |
padding-inline: 9px;
|
|
244 |
margin-block: 1px;
|
|
245 |
border-radius: 3px;
|
|
246 |
box-shadow: inset 0 1px 0 rgba(var(--oc-white-rgb), 0.45);
|
|
247 |
}
|
|
248 |
#main-menu li a.new-object:hover {
|
|
249 |
background-color: var(--oc-indigo-2);
|
|
250 |
color: var(--oc-gray-9);
|
|
251 |
}
|
| 155 |
252 |
|
| 156 |
253 |
#main-menu .menu-children {
|
| 157 |
254 |
display: none;
|
| ... | ... | |
| 165 |
262 |
box-shadow: 0 2px 4px rgba(var(--oc-gray-9-rgb), 0.1);
|
| 166 |
263 |
}
|
| 167 |
264 |
#main-menu .menu-children li {float: inline-start; clear: both; inline-size: 100%;}
|
| 168 |
|
#main-menu .menu-children li a {color: var(--oc-gray-7); background-color:var(--oc-white); font-weight:normal; border-radius: 0;}
|
|
265 |
#main-menu .menu-children li a {
|
|
266 |
display: block;
|
|
267 |
color: var(--oc-gray-7);
|
|
268 |
background-color:var(--oc-white);
|
|
269 |
padding-block: 4px;
|
|
270 |
padding-inline: 10px;
|
|
271 |
font-weight:normal;
|
|
272 |
border-radius: 0;
|
|
273 |
}
|
| 169 |
274 |
#main-menu .menu-children li a:hover {color: var(--oc-white); background-color: var(--oc-blue-7);}
|
| 170 |
275 |
|
| 171 |
276 |
#main-menu .tabs-buttons {
|
| ... | ... | |
| 1664 |
1769 |
inline-size: 54px;
|
| 1665 |
1770 |
block-size: 24px;
|
| 1666 |
1771 |
background: white;
|
| 1667 |
|
inset-block-end: 0;
|
|
1772 |
inset-block-end: 0px;
|
| 1668 |
1773 |
border-block-end: 1px solid var(--oc-gray-5);
|
| 1669 |
1774 |
}
|
| 1670 |
1775 |
|
