Project

General

Profile

Feature #43700 » 0001-Replace-physical-CSS-properties-with-logical-ones-in.patch

application.css - Go MAEDA, 2026-01-21 11:50

View differences:

app/assets/stylesheets/application.css
42 42
  --fonts-main: "Noto Sans", sans-serif;
43 43
}
44 44

  
45
html, body { min-height: 100vh; }
45
html, body { min-block-size: 100vh; }
46 46
html {overflow-y:scroll;}
47
body { font-family: var(--fonts-main); font-size: 0.875rem; color: var(--oc-gray-9); margin: 0; padding: 0; min-width: 900px; }
47
body { font-family: var(--fonts-main); font-size: 0.875rem; color: var(--oc-gray-9); margin: 0; padding: 0; min-inline-size: 900px; }
48 48

  
49 49
h1, h2, h3, h4, h5, h6 {
50 50
  font-family: var(--fonts-main);
......
56 56
#content h1, h2, h3, h4, h5, h6 {color: var(--oc-gray-7);}
57 57
h2 {font-size: 1.25rem;}
58 58
h3 {font-size: 1.0625rem;}
59
h4 {font-size: 0.875rem; border-bottom: 1px solid var(--oc-gray-4); font-weight:normal;}
59
h4 {font-size: 0.875rem; border-block-end: 1px solid var(--oc-gray-4); font-weight: normal;}
60 60
pre, code {font-family: Consolas, Menlo, "Liberation Mono", Courier, monospace;}
61 61
.wiki h1 {font-size: 1.6em;}
62 62
.wiki h2 {font-size: 1.4em;}
......
67 67

  
68 68
/***** Layout *****/
69 69
#wrapper {
70
  min-height: inherit;
70
  min-block-size: inherit;
71 71
  background: white;
72 72
  overflow: hidden;
73 73
  display: flex;
......
85 85
#top-menu li {
86 86
  float:inline-start;
87 87
  list-style-type:none;
88
  margin: 0px 0px 0px 0px;
89
  padding: 0px 0px 0px 0px;
88
  margin: 0;
89
  padding: 0;
90 90
  white-space:nowrap;
91 91
}
92 92
#top-menu a {color: var(--oc-white); margin-inline-end: 8px; font-weight: bold;}
......
95 95
#account {float:inline-end;}
96 96

  
97 97
#header {
98
  min-height: 8.7ex;
98
  min-block-size: 8.7ex;
99 99
  margin: 0;
100 100
  background: linear-gradient(180deg, #628DB6 30%, #356D92); /* no match in Open Color, using hex code */
101 101
  color: var(--oc-gray-0);
......
108 108
#header h1 .breadcrumbs { display:block; font-size: 0.8rem; font-weight: normal; line-height: 100%;}
109 109

  
110 110
#quick-search {float:inline-end;}
111
#quick-search #q {width:130px; height:24px; box-sizing:border-box; vertical-align:middle; border:1px solid var(--oc-gray-4); border-radius:3px;}
111
#quick-search #q {inline-size: 130px;
112
  block-size: 24px;
113
  box-sizing: border-box;
114
  vertical-align: middle;
115
  border: 1px solid var(--oc-gray-4);
116
  border-radius: 3px;
117
}
112 118
#quick-search form {float:inline-start; margin-inline-end:3px;}
113
#quick-search form input {margin-top:0; margin-bottom:0;}
119
#quick-search form input {margin-block: 0;}
114 120
#quick-search form label {vertical-align:middle;}
115 121
#quick-search #project-jump {float:inline-start;}
116 122

  
117 123
#main-menu {
118 124
  position: absolute;
119
  bottom: 0px;
125
  inset-block-end: 0px;
120 126
  inset-inline-start: 10px;
121 127
  margin-inline-end: -500px;
122
  width: 100%;
128
  inline-size: 100%;
123 129
}
124
#main-menu ul {margin: 0;  padding: 0; width: 100%; white-space: nowrap;}
130
#main-menu ul {margin: 0;  padding: 0; inline-size: 100%; white-space: nowrap;}
125 131
#main-menu li {
126 132
  float:none;
127 133
  list-style-type:none;
......
136 142
  text-decoration: none;
137 143
  font-size: 93%;
138 144
  margin: 0;
139
  padding: 4px 10px 4px 10px;
145
  padding-block: 4px;
146
  padding-inline: 10px;
140 147
  border-start-start-radius: 3px;
141 148
  border-start-end-radius: 3px;
142 149
}
......
148 155
#main-menu .menu-children {
149 156
  display: none;
150 157
  position:absolute;
151
  width: inherit;
158
  inline-size: inherit;
152 159
  z-index:45;
153 160
  background-color:var(--oc-white);
154 161
  border-block-end: 1px solid var(--oc-blue-7);
......
156 163
  border-inline-end: 1px solid var(--oc-blue-7);
157 164
  box-shadow: 0 2px 4px rgba(var(--oc-gray-9-rgb), 0.1);
158 165
}
159
#main-menu .menu-children li {float: inline-start; clear: both; width: 100%;}
166
#main-menu .menu-children li {float: inline-start; clear: both; inline-size: 100%;}
160 167
#main-menu .menu-children li a {color: var(--oc-gray-7); background-color:var(--oc-white); font-weight:normal; border-radius: 0;}
161 168
#main-menu .menu-children li a:hover {color: var(--oc-white); background-color: var(--oc-blue-7);}
162 169

  
163 170
#main-menu .tabs-buttons {
164 171
  inset-inline-end: 6px;
165 172
  background-color: transparent;
166
  border-bottom-color: transparent;
173
  border-block-end-color: transparent;
167 174
}
168 175

  
169 176
#admin-menu ul {margin: 0;  padding: 0;}
170
#admin-menu li {margin: 0;  padding: 0 0 6px 0; list-style-type:none;}
177
#admin-menu li {margin: 0;  padding-block: 0 6px; padding-inline: 0; list-style-type: none;}
171 178

  
172 179
#main {flex-grow: 2; display: flex; flex-direction: row-reverse;}
173 180

  
......
178 185
@media screen and (min-width: 1600px) and (max-width: 1919px) {#sidebar{width: 320px;}}
179 186
@media screen and (min-width: 1920px) and (max-width: 2559px) {#sidebar{width: 360px;}}
180 187
@media screen and (min-width: 2560px) {#sidebar{width: 380px;}}
181
#sidebar h3{ font-size: 0.875rem; margin-top: 14px; color: var(--oc-gray-7); }
182
#sidebar h3:first-child{ margin-top: 0; }
183
#sidebar hr{ width: 100%; margin: 0 auto; height: 1px; background: var(--oc-gray-4); border: 0; }
188
#sidebar h3{ font-size: 0.875rem; margin-block-start: 14px; color: var(--oc-gray-7); }
189
#sidebar h3:first-child{ margin-block-start: 0; }
190
#sidebar hr{ inline-size: 100%; margin: 0 auto; block-size: 1px; background: var(--oc-gray-4); border: 0; }
184 191
#sidebar .contextual { margin-inline-end: 1em; }
185 192
#sidebar ul, ul.flat {margin: 0;  padding: 0;}
186 193
#sidebar ul li, ul.flat li {
......
194 201
#sidebar a.icon-only svg {margin-inline-start: 5px;}
195 202
#sidebar a.icon-only:hover svg {opacity: 1;}
196 203
#sidebar span.icon-warning {margin-inline-start: 5px;}
197
#sidebar li input[type=checkbox] {height: 20px;}
204
#sidebar li input[type=checkbox] {block-size: 20px;}
198 205

  
199 206
#sidebar-switch-panel {
200 207
  margin-inline-start: -20px;
201 208
  padding-inline-end: 28px;
202
  width: 100%;
209
  inline-size: 100%;
203 210
}
204 211

  
205 212
#sidebar-switch-button {
206 213
  display: block;
207 214
  padding-block: 3px;
208 215
  padding-inline: 0 28px;
209
  width: 100%;
216
  inline-size: 100%;
210 217
}
211 218

  
212 219
#sidebar-switch-button svg {
......
227 234
}
228 235

  
229 236
#main.nosidebar #sidebar { display: none; }
230
#main.collapsedsidebar #sidebar { width: 0; padding-inline-end: 0 }
237
#main.collapsedsidebar #sidebar { inline-size: 0; padding-inline-end: 0 }
231 238
#main.collapsedsidebar #sidebar-wrapper { display: none; }
232 239

  
233
#footer {clear: both; border-top: 1px solid var(--oc-gray-4); font-size: 0.9em; color: var(--oc-gray-5); padding: 5px; text-align:center; background:var(--oc-white);}
240
#footer {clear: both; border-block-start: 1px solid var(--oc-gray-4); font-size: 0.9em; color: var(--oc-gray-5); padding: 5px; text-align: center; background: var(--oc-white);}
234 241

  
235
#login-form {margin:5em auto 2em auto; padding:20px; width:340px; background-color: var(--oc-orange-1); border-radius:4px; box-sizing: border-box;}
236
#login-form label {display:block; margin-bottom:5px; font-weight:bold;}
242
#login-form {
243
  margin-block: 5em 2em;
244
  margin-inline: auto;
245
  padding: 20px;
246
  inline-size: 340px;
247
  background-color: var(--oc-orange-1);
248
  border-radius: 4px;
249
  box-sizing: border-box;
250
}
251
#login-form label {display: block; margin-block-end: 5px; font-weight: bold;}
237 252
#login-form label[for=autologin] {font-weight:normal;}
238
#login-form input {height: 29px;}
239
#login-form input[type=text], #login-form input[type=password], #login-form input[type=submit] {display: block; width: 100%;}
240
#login-form input[type=text], #login-form input[type=password] {margin-bottom: 15px;}
253
#login-form input {block-size: 29px;}
254
#login-form input[type=text], #login-form input[type=password], #login-form input[type=submit] {display: block; inline-size: 100%;}
255
#login-form input[type=text], #login-form input[type=password] {margin-block-end: 15px;}
241 256
#login-form a.lost_password {float:inline-end; font-weight:normal;}
242 257
#login-form h3 {text-align: center;}
243 258

  
244 259
div.modal { border-radius:5px; background:var(--oc-white); z-index:50; padding:4px;}
245 260
div.modal h3.title {display:none;}
246
div.modal p.buttons {margin-bottom:0;}
247
div.modal .box p {margin: 0.3em 0;}
261
div.modal p.buttons {margin-block-end: 0;}
262
div.modal .box p {margin-block: 0.3em; margin-inline: 0;}
248 263

  
249
.clear:after{ content: "."; display: block; height: 0; clear: both; visibility: hidden; }
264
.clear:after{ content: "."; display: block; block-size: 0; clear: both; visibility: hidden; }
250 265

  
251 266
.mobile-show {display: none;}
252 267
.hidden {display: none;}
......
264 279
a.user.locked, a.user.locked:link, a.user.locked:visited {color: var(--oc-gray-6);}
265 280
a.user.user-mention {
266 281
  background-color: var(--oc-blue-0);
267
  padding: 0.1em 0.1em;
282
  padding: 0.1em;
268 283
  border-radius: 0.1em;
269 284
}
270 285

  
......
302 317
  display:none;
303 318
  position:absolute;
304 319
  inset-inline-end:0px;
305
  top:25px;
306
  min-width:100px;
320
  inset-block-start:25px;
321
  min-inline-size:100px;
307 322
  background-color:var(--oc-white);
308 323
  border:1px solid var(--oc-gray-4);
309 324
  border-radius:4px;
......
315 330
.drdn-content .quick-search {margin:8px; display: flex; align-items: center;}
316 331
.drdn-content .quick-search svg {margin-inline-start: 5px; position: absolute;}
317 332
.drdn-content .quick-search input.autocomplete {background: none; padding-inline-start: 24px !important;}
318
.drdn-content .autocomplete {box-sizing: border-box; width:100% !important; height:28px;}
333
.drdn-content .autocomplete {box-sizing: border-box; inline-size: 100% !important; block-size: 28px;}
319 334
.drdn-content .autocomplete:focus {border-color: var(--oc-blue-5);}
320
.drdn-items {max-height:400px; overflow:auto;}
321
div + .drdn-items {border-top:1px solid var(--oc-gray-4);}
335
.drdn-items {max-block-size: 400px; overflow: auto;}
336
div + .drdn-items {border-block-start: 1px solid var(--oc-gray-4);} 
322 337
.drdn-items>* {
323 338
  display:block;
324 339
  border:1px solid var(--oc-white);
325 340
  overflow:hidden;
326 341
  text-overflow: ellipsis;
327 342
  white-space:nowrap;
328
  padding:4px 8px;
343
  padding-block: 4px;
344
  padding-inline: 8px;
329 345
}
330 346
.drdn-items>a:hover {text-decoration:none;}
331 347
.drdn-items>*:focus {border:1px dotted var(--oc-gray-5);}
......
334 350
  content:' ';
335 351
  display:inline-block;
336 352
  line-height:1em;
337
  width:1em;
338
  height:1em;
353
  inline-size:1em;
354
  block-size:1em;
339 355
  margin-inline-end:4px;
340 356
  font-weight:bold;
341 357
}
......
348 364
.drdn-items>span {color:var(--oc-gray-6);}
349 365

  
350 366
.contextual .drdn-content, .journal-actions .drdn-content {
351
  top: 18px;
367
  inset-block-start: 18px;
352 368
}
353 369

  
354 370
.contextual .drdn-items, .journal-actions .drdn-items {
355 371
  padding: 2px;
356
  min-width: 160px;
372
  min-inline-size: 160px;
357 373
}
358 374

  
359 375
.contextual .drdn-items > a, .journal-actions .drdn-items > a {
360 376
  display: flex;
361
  padding: 5px 8px;
377
  padding-block: 5px;
378
  padding-inline: 8px;
362 379
}
363 380

  
364 381
.contextual .drdn-items > a:hover, .journal-actions .drdn-items > a:hover {
......
368 385
  border-radius: 3px;
369 386
}
370 387

  
371
#project-jump.drdn {width:200px;display:inline-block;}
388
#project-jump.drdn {inline-size: 200px; display: inline-block;}
372 389
#project-jump .drdn-trigger {
373
  width:100%;
374
  height:24px;
390
  inline-size: 100%;
391
  block-size: 24px;
375 392
  display:inline-block;
376
  padding:1.5px 18px 3px 6px;
393
  padding-block: 1.5px 3px;
394
  padding-inline: 6px 18px;
377 395
  border-radius:3px;
378 396
  border:1px solid var(--oc-gray-4);
379 397
  margin:0 !important;
......
382 400
  background:var(--oc-white) url(/chevron-down.svg) no-repeat 98% 50%;
383 401
}
384 402
#project-jump .drdn.expanded .drdn-trigger {background-image:url(/arrow_up.png);}
385
#project-jump .drdn-content {width:280px;}
403
#project-jump .drdn-content {inline-size: 280px;}
386 404
#project-jump .drdn-items>* {color:var(--oc-gray-7) !important;}
387 405
#project-jump .drdn-items>a:hover {background-color: var(--oc-blue-7); color:var(--oc-white) !important;}
388 406

  
......
390 408
table.list, .table-list {
391 409
  font-size: 0.8125rem;
392 410
  font-variant-numeric: tabular-nums;
393
  border-top: 1px solid var(--oc-gray-4);
394
  border-bottom: 1px solid var(--oc-gray-4);
411
  border-block-start: 1px solid var(--oc-gray-4);
412
  border-block-end: 1px solid var(--oc-gray-4);
395 413
  border-collapse: collapse;
396
  width: 100%;
397
  margin-bottom: 4px;
414
  inline-size: 100%;
415
  margin-block-end: 4px;
398 416
  overflow: hidden;
399 417
}
400
table.list th, .table-list-header { background-color:var(--oc-gray-2); padding: 4px; white-space:nowrap; font-weight:bold; border-bottom: 2px solid var(--oc-gray-4); }
418
table.list th, .table-list-header { background-color: var(--oc-gray-2); padding: 4px; white-space: nowrap; font-weight: bold; border-block-end: 2px solid var(--oc-gray-4); }
401 419
table.list th.whitespace-normal {white-space: normal;}
402
table.list td {text-align:center; vertical-align:middle; padding-block: 3px; padding-inline-end: 10px; border-top: 1px solid var(--oc-gray-4);}
403
table.list td.icon {width: 100%;} /* Prevents border from disappearing due to inline-flex shrinking */
404
table.list td.id { width: 2%; text-align: center;}
420
table.list td {text-align: center; vertical-align: middle; padding-block: 3px; padding-inline-end: 10px; border-block-start: 1px solid var(--oc-gray-4);}
421
table.list td.icon {inline-size: 100%;} /* Prevents border from disappearing due to inline-flex shrinking */
422
table.list td.id { inline-size: 2%; text-align: center;}
405 423
table.list td.name, table.list td.description, table.list td.subject, table.list td.parent-subject, table.list td.comments, table.list td.roles, table.list td.attachments, table.list td.text,  table.list td.short_description {text-align: start;}
406
table.list td.estimated_hours, table.list td.total_estimated_hours, table.list td.estimated_remaining_hours, table.list td.spent_hours, table.list td.total_spent_hours {text-align: right;}
424
table.list td.estimated_hours, table.list td.total_estimated_hours, table.list td.estimated_remaining_hours, table.list td.spent_hours, table.list td.total_spent_hours {text-align: right;} /* Numbers should be right aligned even in RTL */
407 425

  
408
table.list td.attachments span.attachment-filename {display: block; height: 16px;}
426
table.list td.attachments span.attachment-filename {display: block; block-size: 16px;}
409 427
table.list td.attachments span.attachment-filename a.icon-download {visibility: hidden;}
410 428
table.list td.attachments span.attachment-filename:hover a.icon-download {visibility: visible;}
411
table.list td.tick {width:15%}
412
table.list td.checkbox { width: 15px; padding: 2px 0 0 0; }
413
table.list .checkbox input {padding:0px; height: initial;}
429
table.list td.tick {inline-size: 15%}
430
table.list td.checkbox { inline-size: 15px; padding-block: 2px 0; padding-inline: 0;}
431
table.list .checkbox input {padding: 0; block-size: initial;}
414 432
table.list td.buttons, div.buttons { white-space:nowrap; text-align: end; }
415 433
table.list td.buttons a, div.buttons a, table.list td.buttons span.icon-only { margin-inline-end: 0.6em; }
416 434
table.list td.buttons a:last-child, div.buttons a:last-child { margin-inline-end: 0; }
417 435
table.list td.buttons img, div.buttons img {vertical-align:middle;}
418
table.list td.reorder {width:15%; white-space:nowrap; text-align:center; }
419
table.list table.progress td {padding-inline-end: 0; border-top: none;}
436
table.list td.reorder {inline-size: 15%; white-space: nowrap; text-align: center; }
437
table.list table.progress td {padding-inline-end: 0; border-block-start: none;}
420 438
table.list caption {text-align: start; padding-block: 0.5em; padding-inline: 0 0.5em;}
421 439
table.list tr.overdue:not(.context-menu-selection) td.due_date  { color: var(--oc-red-9); }
422 440
table.list thead.related-issues th { background-color: inherit; font-size: 11px; border: none; }
......
426 444
}
427 445

  
428 446
.table-list-cell {display: table-cell; vertical-align: top; padding:2px; }
429
.table-list div.buttons {width: 15%;}
447
.table-list div.buttons {inline-size: 15%;}
430 448

  
431 449
tr.project td.name a { white-space:nowrap; }
432 450
tr.project.closed, tr.project.archived { color: var(--oc-gray-5); }
......
434 452

  
435 453
tr.issue { text-align: center; white-space: nowrap; }
436 454
tr.issue td.subject, tr.issue td.parent-subject, tr.issue td.category, td.assigned_to, td.last_updated_by, tr.issue td.string, tr.issue td.text, tr.issue td.list, tr.issue td.relations, tr.issue td.parent, tr.issue td.watcher_users { white-space: normal; }
437
tr.issue td.relations { text-align: left; }
455
tr.issue td.relations { text-align: start; }
438 456
tr.issue td.done_ratio table.progress { margin-inline-start:auto; margin-inline-end: auto;}
439 457
tr.issue td.relations span, tr.issue td.watcher_users a {white-space: nowrap;}
440 458
tr.issue td.watcher_users ul {list-style: none; padding: 0; margin: 0}
......
449 467
  text-align:start;
450 468
  white-space:normal;
451 469
}
452
table.issues td.block_column>span {font-weight: bold; display: block; margin-bottom: 4px;}
470
table.issues td.block_column>span {font-weight: bold; display: block; margin-block-end: 4px;}
453 471
table.issues td.block_column>pre {white-space:normal;}
454 472

  
455 473
tr.idnt :is(td.subject, td.name) {background: url(/chevron-right-idnt.svg) no-repeat 2px center;}
......
474 492
[dir="rtl"] tr.idnt-9 :is(td.subject, td.name) {background-position: right 132px center;}
475 493

  
476 494
table.issue-report {table-layout:fixed;}
477
table.issue-report tr.total, table.issue-report-detailed tr.total { font-weight: bold; border-top:2px solid var(--oc-gray-4);}
478
.issue-report-graph {width: 75%; margin: 2em 0;}
495
table.issue-report tr.total, table.issue-report-detailed tr.total { font-weight: bold; border-block-start: 2px solid var(--oc-gray-4);}
496
.issue-report-graph {inline-size: 75%; margin-block: 2em; margin-inline: 0;}
479 497

  
480 498
tr.entry td { white-space: nowrap; }
481
tr.entry td.filename {width: 30%; text-align: start;}
482
tr.entry td.filename_no_report {width: 70%; text-align: start;}
499
tr.entry td.filename {inline-size: 30%; text-align: start;}
500
tr.entry td.filename_no_report {inline-size: 70%; text-align: start;}
483 501
tr.entry td.size { text-align: right; font-size: 90%; } /* Numbers should be right aligned even in RTL */
484 502
tr.entry td.revision, tr.entry td.author { text-align: center; }
485 503
tr.entry td.age { text-align: end; }
......
488 506

  
489 507
tr span.expander {margin-inline-start: 0; cursor: pointer;}
490 508

  
491
tr.changeset { height: 20px }
492
tr.changeset :is(ul, ol) { margin-top: 0px; margin-bottom: 0px; }
493
tr.changeset td.author { text-align: center; width: 15%; white-space:nowrap;}
494
tr.changeset td.committed_on { text-align: center; width: 15%; white-space:nowrap;}
509
tr.changeset { block-size: 20px }
510
tr.changeset :is(ul, ol) { margin-block: 0; }
511
tr.changeset td.author { text-align: center; inline-size: 15%; white-space: nowrap;}
512
tr.changeset td.committed_on { text-align: center; inline-size: 15%; white-space: nowrap;}
495 513

  
496 514
table.files tbody th {text-align:start;}
497 515
table.files tr.file td.filename { text-align: start; }
498 516
table.files tr.file td.digest { font-size: 86%; }
499 517

  
500
table.members td.roles, table.memberships td.roles { width: 45%; }
501
table.members td.buttons { text-align: start; width: 1px; white-space: nowrap;}
518
table.members td.roles, table.memberships td.roles { inline-size: 45%; }
519
table.members td.buttons { text-align: start; inline-size: 1px; white-space: nowrap;}
502 520

  
503 521
table.messages td.last_message {text-align: start;}
504
tr.message { height: 2.6em; }
522
tr.message { block-size: 2.6em; }
505 523
tr.message td.created_on { white-space: nowrap; }
506 524
tr.message td.last_message { font-size: 93%; white-space: nowrap; }
507 525
tr.message.sticky td.subject { font-weight: bold; }
......
512 530
tr.version td.date, tr.version td.status, tr.version td.sharing { text-align: center; white-space:nowrap; }
513 531

  
514 532
#principals_for_new_member .icon-user, #users_for_watcher .icon-user {background:transparent;}
515
#principals_for_new_member svg, #principals_for_new_member .avatar  {margin-right: 4px;}
533
#principals_for_new_member svg, #principals_for_new_member .avatar  {margin-inline-end: 4px;}
516 534

  
517 535
tr.user td {white-space: nowrap;}
518 536
td.login, td.firstname, td.lastname, td.mail {text-align:start !important;}
......
520 538
tr.user.locked a, tr.user.registered a { color: var(--oc-gray-5); }
521 539

  
522 540
table.permissions td.role {color:var(--oc-gray-6);font-size:90%;font-weight:normal !important;text-align:center;vertical-align:bottom;}
523
table.permissions td.name {min-width: 10rem;}
541
table.permissions td.name {min-inline-size: 10rem;}
524 542
table.permissions tr.group>td:nth-of-type(1),
525 543
table.tracker-summary tr.group>td:nth-of-type(1) {font-weight: bold;}
526 544

  
......
533 551

  
534 552
table.plugins td { vertical-align: middle; }
535 553
table.plugins td.configure { text-align: end; padding-inline-end: 1em; }
536
table.plugins span.name { font-weight: bold; display: block; margin-bottom: 6px; }
554
table.plugins span.name { font-weight: bold; display: block; margin-block-end: 6px; }
537 555
table.plugins span.description { display: block; font-size: 0.9em; }
538 556
table.plugins span.url { display: block; font-size: 0.9em; }
539 557

  
540
table.list.enumerations {table-layout: fixed; margin-bottom: 2em;}
558
table.list.enumerations {table-layout: fixed; margin-block-end: 2em;}
541 559

  
542 560
tr.group td {
543 561
  padding-block: 0.8em 0.5em;
544 562
  padding-inline: 0.3em 0;
545
  border-bottom: 2px solid var(--oc-gray-4);
563
  border-block-end: 2px solid var(--oc-gray-4);
546 564
  text-align: start;
547 565
  background-color: var(--oc-white);
548 566
}
549
tr.group span.count {top:-1px;}
567
tr.group span.count {inset-block-start: -1px;}
550 568
tr.group span.name {font-weight:bold;}
551 569
tr.group span.totals {color: var(--oc-gray-5); font-size: 93%;}
552 570
tr.group span.totals .value {font-weight:bold; color:var(--oc-gray-6);}
553
tr.group a.toggle-all { color: var(--oc-gray-5); font-size: 93%; display:none; float:right; margin-right:4px;}
571
tr.group a.toggle-all { color: var(--oc-gray-5); font-size: 93%; display: none; float: inline-end; margin-inline-end: 4px;}
554 572
tr.group:hover a.toggle-all { display:inline;}
555 573
a.toggle-all:hover {text-decoration:none;}
556 574

  
......
572 590

  
573 591
table.boards td.last-message {text-align:start;font-size:93%;}
574 592

  
575
div.table-list.boards .table-list-cell.name {width: 30%;}
576
#message_subject { max-width: 99%; }
593
div.table-list.boards .table-list-cell.name {inline-size: 30%;}
594
#message_subject { max-inline-size: 99%; }
577 595

  
578 596
#query_form_content {font-size:90%;}
579
#query_form_with_buttons > p.contextual {font-size:0.75rem; margin:12px 0px;}
597
#query_form_with_buttons > p.contextual {font-size: 0.75rem; margin-block: 12px; margin-inline: 0;}
580 598

  
581 599
.query_sort_criteria_count {
582 600
  display: inline-block;
583
  min-width: 1em;
601
  min-inline-size: 1em;
584 602
}
585 603

  
586 604
/* query form - options */
587 605
#list-definition {
588
  margin: 0 15px;
589
  width: auto !important;
606
  margin-block: 0;
607
  margin-inline: 15px;
608
  inline-size: auto !important;
590 609
}
591 610
#list-definition > div {
592
  margin: 6px 0;
611
  margin-block: 6px;
612
  margin-inline: 0;
593 613
  display: flex;
594 614
  flex-wrap: wrap;
595 615
  align-items: center;
596 616
  gap: 5px 10px;
597 617
}
598 618
#list-definition > div .field{
599
  width: 160px;
619
  inline-size: 160px;
600 620
}
601 621
.query-columns label {
602 622
  display:block;
603 623
}
604 624
#list-definition .buttons input[type=button] {
605
  width:35px;
625
  inline-size:35px;
606 626
  display:block;
607 627
}
608 628
.query-columns select {
609
  min-width:150px;
629
  min-inline-size: 150px;
610 630
}
611 631

  
612 632
.query-totals {text-align: end; margin-block-start: -2.3em; font-size: 93%;}
......
623 643

  
624 644
td.center {text-align:center;}
625 645

  
626
#watchers select {width: 95%; display: block;}
627
#watchers .avatar {margin: 0 4px 2px 0;}
628
#watchers svg.icon-svg {margin: 0 2px 2px 0;}
629
#users_for_watcher .avatar {padding-bottom: 2px; margin-right: 4px;}
630
#users_for_watcher svg {margin-right: 4px;}
646
#watchers select {inline-size: 95%; display: block;}
647
#watchers .avatar {margin-block: 0 2px; margin-inline: 0 4px;}
648
#watchers svg.icon-svg {margin-block: 0 2px; margin-inline: 0 2px;}
649
#users_for_watcher .avatar {padding-block-end: 2px; margin-inline-end: 4px;}
650
#users_for_watcher svg {margin-inline-end: 4px;}
631 651
#users_for_watcher span.icon-user {display: inline;}
632 652

  
633 653
span#watchers_inputs {overflow:auto; display:block;}
......
648 668

  
649 669
.box{
650 670
  padding: 10px;
651
  margin-bottom: 12px;
671
  margin-block-end: 12px;
652 672
  background-color: var(--oc-gray-0);
653 673
  color: var(--oc-gray-7);
654 674
  line-height: 1.5em;
......
661 681
  float: inline-end;
662 682
  white-space: nowrap;
663 683
  line-height: 1.4em;
664
  margin: 5px 0px;
665 684
  margin-block: 5px;
666 685
  margin-inline: 0;
667 686
  padding-inline-start: 10px;
......
675 694
.splitcontenttop {flex: 2; flex-basis: 100%;}
676 695

  
677 696
form {display: inline;}
678
input, select, button {vertical-align: middle; margin-top: 1px; margin-bottom: 1px; height: 24px; padding: 0 7px;}
697
input, select, button {
698
  vertical-align: middle;
699
  margin-block: 1px;
700
  block-size: 24px;
701
  padding-block: 0;
702
  padding-inline: 7px;
703
}
679 704
input, select, textarea, button { color: var(--oc-gray-9); background-color: var(--oc-white); border:1px solid var(--oc-gray-4); border-radius:3px; box-sizing: border-box;}
680 705
select {
681 706
  -webkit-appearance: none;
......
686 711
  background-image: url(/chevron-down.svg);
687 712
  background-repeat: no-repeat;
688 713
  background-position: calc(100% - 2px) 50%;
689
  padding-right: 20px;
714
  padding-inline-end: 20px;
690 715
}
691
input[type="file"] {border: 0; padding-left: 0; padding-right: 0; height: initial; background-color: initial; }
716
[dir="rtl"] select {background-position: 2px 50%;}
717
input[type="file"] {border: 0; padding-inline: 0; block-size: initial; background-color: initial; }
692 718
input[type="submit"], button[type="submit"] {
693 719
  -webkit-appearance: button;
694 720
  cursor: pointer;
695 721
  background-color: var(--oc-white);
696
  height: 28px;
722
  block-size: 28px;
697 723
  -webkit-transition: background-color 100ms linear;
698 724
  -moz-transition: background-color 100ms linear;
699 725
  -o-transition: background-color 100ms linear;
......
717 743
  text-overflow: ellipsis;
718 744
}
719 745

  
720
select[multiple=multiple] {background: var(--oc-white); padding-right: initial; height: auto;}
721
fieldset {border: 1px solid var(--oc-gray-4); margin:0; min-width: inherit;}
746
select[multiple=multiple] {background: var(--oc-white); padding-inline-end: initial; block-size: auto;}
747
fieldset {border: 1px solid var(--oc-gray-4); margin: 0; min-inline-size: inherit;}
722 748
legend {color: var(--oc-gray-9);}
723
hr { width: 100%; height: 1px; background: var(--oc-gray-4); border: 0;}
749
hr { inline-size: 100%; block-size: 1px; background: var(--oc-gray-4); border: 0;}
724 750
blockquote { font-style: italic; border-inline-start: 3px solid var(--oc-gray-3); padding-inline-start: 0.6em; margin-inline-start: 0;}
725 751
blockquote blockquote { margin-inline-start: 0;}
726
abbr, span.field-description[title] { border-bottom: 1px dotted var(--oc-gray-5); cursor: help; }
727
textarea.wiki-edit {width:99%; resize:vertical; box-sizing: border-box;}
752
abbr, span.field-description[title] { border-block-end: 1px dotted var(--oc-gray-5); cursor: help; }
753
textarea.wiki-edit {inline-size: 99%; resize: vertical; box-sizing: border-box;}
728 754
body.textarea-monospace textarea.wiki-edit {font-family: Consolas, Menlo, "Liberation Mono", Courier, monospace;}
729 755
body.textarea-proportional textarea.wiki-edit {font-family: var(--fonts-main);}
730
li p {margin-top: 0;}
756
li p {margin-block-start: 0;}
731 757
div.issue {
732 758
  background: var(--oc-yellow-0);
733 759
  padding: 16px;
734
  margin-bottom: 6px;
760
  margin-block-end: 6px;
735 761
  border-radius: 3px;
736 762
}
737
p.breadcrumb { font-size: 0.8125rem; margin: 4px 0 4px 0;}
738
p.subtitle { font-size: 0.8125rem; margin: -6px 0 12px 0; font-style: italic; }
739
p.footnote { font-size: 0.9em; margin-top: 0px; margin-bottom: 0px; }
763
p.breadcrumb { font-size: 0.8125rem; margin-block: 4px; margin-inline: 0;}
764
p.subtitle { font-size: 0.8125rem; margin-block: -6px 12px; margin-inline: 0; font-style: italic; }
765
p.footnote { font-size: 0.9em; margin-block: 0; }
740 766
.wiki-class-ltr {direction:ltr !important;}
741 767
.wiki-class-rtl {direction:rtl !important;}
742 768

  
743 769
div.issue div.subject div div { padding-inline-start: 16px; word-break: break-word; }
744
div.issue div.subject p {margin: 0; margin-bottom: 0.1em; font-size: 90%; color: var(--oc-gray-6);}
745
div.issue div.subject>div>p { margin-top: 0.5em; }
746
div.issue div.subject h3 {margin: 0; margin-bottom: 0.1em;}
747
div.issue p.author {margin-top:0.5em; font-size: 93%}
770
div.issue div.subject p {margin-block: 0 0.1em; margin-inline: 0; font-size: 90%; color: var(--oc-gray-6);}
771
div.issue div.subject>div>p { margin-block-start: 0.5em; }
772
div.issue div.subject h3 {margin-block: 0 0.1em; margin-inline: 0;}
773
div.issue p.author {margin-block-start: 0.5em; font-size: 93%}
748 774
div.issue span.private, div.journal span.private {font-size: 60%;}
749 775
div.issue .next-prev-links {color:var(--oc-gray-6);}
750
div.issue .attributes {margin-top: 2em;}
751
div.issue .attributes .attribute {padding-inline-start: 180px; clear: inline-start; min-height: 1.8em;}
752
div.issue .attributes .attribute .label {width: 170px; margin-inline-start: -180px; font-weight: bold; float: inline-start; overflow: clip visible; text-overflow: ellipsis;}
776
div.issue .attributes {margin-block-start: 2em;}
777
div.issue .attributes .attribute {padding-inline-start: 180px; clear: inline-start; min-block-size: 1.8em;}
778
div.issue .attributes .attribute .label {inline-size: 170px; margin-inline-start: -180px; font-weight: bold; float: inline-start; overflow: clip visible; text-overflow: ellipsis;}
753 779
div.issue .attribute .value {overflow:auto; text-overflow: ellipsis;}
754
div.issue .attribute.string_cf .value .wiki p {margin-top: 0; margin-bottom: 0;}
755
div.issue .attribute.text_cf .value .wiki p:first-of-type {margin-top: 0;}
780
div.issue .attribute.string_cf .value .wiki p {margin-block: 0;}
781
div.issue .attribute.text_cf .value .wiki p:first-of-type {margin-block-start: 0;}
756 782
div.issue.overdue .due-date .value { color: var(--oc-red-9); }
757
body.controller-issues h2.inline-flex {padding-right: 0}
783
body.controller-issues h2.inline-flex {padding-inline-end: 0}
758 784
div#sticky-issue-header {
759 785
  display: none;
760 786
  position: fixed;
761
  top: 0;
762
  left: 0;
763
  right: 0;
787
  inset-block-start: 0;
788
  inset-inline-start: 0;
789
  inset-inline-end: 0;
764 790
  background-color: white;
765
  border-bottom: 1px solid var(--oc-gray-4);
791
  border-block-end: 1px solid var(--oc-gray-4);
766 792
  box-shadow: 0 2px 6px rgba(var(--oc-black-rgb), 0.15);
767 793
  font-size: 0.8125rem;
768 794
  align-items: center;
769 795
  z-index: 1000;
770
  padding: 10px 6px;
796
  padding-block: 10px;
797
  padding-inline: 6px;
771 798
  border-radius: 0px;
772 799
}
773 800
div#sticky-issue-header.is-visible {
......
776 803
div#sticky-issue-header .issue-heading {
777 804
  flex-shrink: 0;
778 805
  white-space: nowrap;
779
  margin-right: 6px;
806
  margin-inline-end: 6px;
780 807
}
781 808
div#sticky-issue-header .subject {
782 809
  font-weight: bold;
......
791 818
#issue_tree td.checkbox, #relations td.checkbox {display:none;}
792 819
#issue_tree td.buttons, #relations td.buttons {padding:0;}
793 820
#issue_tree .issues-stat, #relations .issues-stat {font-size: 93%}
794
#issue_tree .issues-stat .badge, #relations .issues-stat .badge {bottom: initial;}
821
#issue_tree .issues-stat .badge, #relations .issues-stat .badge {inset-block-end: initial;}
795 822
#issue_tree .issue > td, #relations .issue > td, #issue_tree .issue .user {
796 823
  text-overflow: ellipsis; /* if text exceeds its space, add ... */
797 824
  overflow: hidden;
798 825
}
799 826
#issue_tree .issue > td.subject, #relations .issue > td.subject {
800
  width: 50%;
827
  inline-size: 50%;
801 828
  word-break: break-word; /* break word if subject is too long */
802
  padding-right: 25px; /* this is the spaces that .buttons uses next to subject */
829
  padding-inline-end: 25px; /* this is the spaces that .buttons uses next to subject */
803 830
}
804 831
#issue_tree .issue > td.assigned_to, #relations .issue > td.assigned_to {
805 832
  white-space: nowrap;
806 833
}
807 834
#trackers_description, #issue_statuses_description {display:none;}
808 835
#trackers_description dt, #issue_statuses_description dt {font-weight: bold; text-decoration: underline;}
809
#trackers_description dd, #issue_statuses_description dd {margin: 0; padding: 0 0 1em 0;}
836
#trackers_description dd, #issue_statuses_description dd {margin: 0; padding-block: 0 1em; padding-inline: 0;}
810 837

  
811
#issue-form .assign-to-me-link { padding-left: 5px; }
838
#issue-form .assign-to-me-link { padding-inline-start: 5px; }
812 839
#issue-form fieldset, #bulk_edit_form fieldset {
813
  border-right: none; border-bottom: none; border-left: none;
840
  border-block-end: none;
841
  border-inline: none;
814 842
}
815 843

  
816 844
fieldset.collapsible {border-width: 1px 0 0 0;}
817 845
fieldset.collapsible>legend { cursor:pointer;}
818
fieldset#date-range p { margin: 2px 0 2px 0; }
846
fieldset#date-range p {margin-block: 2px; margin-inline: 0;}
819 847

  
820 848
#query_form_content > fieldset {
821
  min-width: 0;
822
  max-width: 100%;
849
  min-inline-size: 0;
850
  max-inline-size: 100%;
823 851
}
824 852
#filters-table {
825 853
  float: inline-start;
826
  width: auto;
854
  inline-size: auto;
827 855
}
828 856
#filters-table .field {
829
  width: 230px;
857
  inline-size: 230px;
830 858
}
831 859
#filters-table .filter {
832 860
  margin-block: 5px 0;
......
841 869

  
842 870
.add-filter {width: 35%; float: inline-end; text-align: end; vertical-align: top;}
843 871

  
844
#issue_is_private_wrap {float:right; margin-right:1em;}
872
#issue_is_private_wrap {float: inline-end; margin-inline-end: 1em;}
845 873
.toggle-multiselect { margin-inline-end:5px; cursor:pointer;}
846
.buttons { font-size: 0.9em; margin-bottom: 1.4em; margin-top: 1em; }
874
.buttons {font-size: 0.9em; margin-block: 1em 1.4em;}
847 875

  
848
.changeset-comments {margin-bottom:1em;}
876
.changeset-comments {margin-block-end: 1em;}
849 877

  
850
#update {margin-bottom: 1.4em;}
878
#update {margin-block-end: 1.4em;}
851 879

  
852 880
#history p.nodata {display: none;}
853 881
/* Prevent content from being hidden behind a #sticky-issue-header when scrolling via anchor links. */
......
855 883
.controller-issues.action-show #history div[id^="note-"],
856 884
.controller-issues.action-show #history div[id^="change-"],
857 885
.controller-issues.action-show #update {
858
  scroll-margin-top: 50px;
886
  scroll-margin-block-start: 50px;
859 887
}
860 888

  
861 889
div#activity dl, #search-results { margin-inline-start: 2em; }
862 890
div#activity dd, #search-results dd {
863
  margin-bottom: 1em;
891
  margin-block-end: 1em;
864 892
  padding-inline-start: 22px;
865 893
  font-size: 0.8125rem;
866 894
}
867 895
div#activity dt svg.icon-svg {margin-inline-end: 4px;}
868
div#activity dt.me .time { border-bottom: 1px solid var(--oc-gray-6); }
896
div#activity dt.me .time { border-block-end: 1px solid var(--oc-gray-6); }
869 897
div#activity dt .time {
870 898
  color: var(--oc-gray-7);
871 899
  font-size: 0.8125rem;
872 900
  margin-inline-end: 4px;
873 901
}
874
div#activity dd .description, #search-results dd .description { font-style: italic; margin: 2px 0;}
902
div#activity dd .description, #search-results dd .description { font-style: italic; margin-block: 2px; margin-inline: 0;}
875 903
div#activity span.project:after, #search-results span.project:after { content: " - "; white-space: pre;}
876 904
div#activity dd span.description, #search-results dd span.description { display:block; color: var(--oc-gray-6); }
877 905
div#activity dt.grouped {padding-inline-start:5em;}
......
881 909
  background-color: var(--oc-gray-1);
882 910
}
883 911
div#activity dt {
884
  padding-top: 10px;
885
  border-top: 1px solid var(--oc-gray-2);
912
  padding-block-start: 10px;
913
  border-block-start: 1px solid var(--oc-gray-2);
886 914
  width: 100%; /* Prevents border from disappearing due to inline-flex shrinking */
887 915
  box-sizing: border-box;
888 916
  display: flex;
......
897 925
}
898 926

  
899 927
#search-results dd {
900
  margin-bottom: 1em;
928
  margin-block-end: 1em;
901 929
  padding-inline-start: 20px;
902 930
  margin-inline-start: 0;
903 931
}
904 932

  
905 933
div#search-results-counts {float: inline-end;}
906
div#search-results-counts ul { margin-top: 0.5em; }
934
div#search-results-counts ul { margin-block-start: 0.5em; }
907 935
div#search-results-counts  li {
908 936
  list-style-type: none;
909 937
  float: inline-start;
910 938
  margin-inline-start: 1em;
911 939
}
912 940

  
913
div#roadmap .related-issues { margin-bottom: 1em; }
941
div#roadmap .related-issues { margin-block-end: 1em; }
914 942
div#roadmap .related-issues td.checkbox { display: none; }
915
div#roadmap .related-issues td.assigned_to { width:1px; white-space:nowrap; padding: 0; }
916
div#roadmap .related-issues td.assigned_to img { padding-left: 4px; padding-right: 4px;}
943
div#roadmap .related-issues td.assigned_to { inline-size: 1px; white-space: nowrap; padding: 0; }
944
div#roadmap .related-issues td.assigned_to img { padding-inline: 4px;}
917 945
div#roadmap .wiki h1:first-child { display: none; }
918 946
div#roadmap .wiki h1 { font-size: 120%; }
919 947
div#roadmap .wiki h2 { font-size: 110%; }
920
div#roadmap h2, div#roadmap h3 {padding-right: 0;}
921
div#roadmap h3 svg {margin-right: 4px;}
922
body.controller-versions.action-show div#roadmap .related-issues {width:70%;}
948
div#roadmap h2, div#roadmap h3 {padding-inline-end: 0;}
949
div#roadmap h3 svg {margin-inline-end: 4px;}
950
body.controller-versions.action-show div#roadmap .related-issues {inline-size: 70%;}
923 951

  
924
div#roadmap .version-article {padding-bottom: 12px;}
952
div#roadmap .version-article {padding-block-end: 12px;}
925 953

  
926
div#version-summary { float: inline-end; width: 28%; margin-inline-start: 16px; margin-block-end: 16px; background-color: var(--oc-white); }
927
div#version-summary fieldset { margin-bottom: 1em; }
928
div#version-summary fieldset.time-tracking table { width:100%; }
954
div#version-summary { float: inline-end; inline-size: 28%; margin-inline-start: 16px; margin-block-end: 16px; background-color: var(--oc-white); }
955
div#version-summary fieldset { margin-block-end: 1em; }
956
div#version-summary fieldset.time-tracking table { inline-size: 100%; }
929 957
div#version-summary th, div#version-summary td.total-hours { text-align: end; }
930 958

  
931 959
table#time-report td.hours, table#time-report th.period, table#time-report th.total { text-align: right; padding-right: 0.5em; } /* Numbers should be right aligned even in RTL */
932 960
table#time-report tbody tr.subtotal { font-style: italic; color:var(--oc-gray-6);}
933 961
table#time-report tbody tr.subtotal td.hours { color:var(--oc-gray-6); }
934
table#time-report tbody tr.total { font-weight: bold; background-color:var(--oc-gray-2); border-top:2px solid var(--oc-gray-4);}
962
table#time-report tbody tr.total { font-weight: bold; background-color: var(--oc-gray-2); border-block-start: 2px solid var(--oc-gray-4);}
935 963
table#time-report .hours-dec { font-size: 0.9em; }
936 964

  
937 965
div.wiki-page .contextual a {opacity: 0.4}
......
943 971

  
944 972
.wiki-update-info {text-align: end; color: var(--oc-gray-6); font-size: 90%;}
945 973

  
946
form .attributes select { width: 60%; }
947
form .attributes select + a.icon-only { vertical-align: middle; margin-left: 4px; }
948
input#issue_subject, input#document_title { width: 99%; }
949
select#issue_done_ratio { width: 95px; }
974
form .attributes select { inline-size: 60%; }
975
form .attributes select + a.icon-only { vertical-align: middle; margin-inline-start: 4px; }
976
input#issue_subject, input#document_title { inline-size: 99%; }
977
select#issue_done_ratio { inline-size: 95px; }
950 978

  
951 979
ul.projects {margin: 0; padding-inline-start: 1em;}
952 980
ul.projects ul.projects {padding-inline-start: 1.6em;}
......
964 992
  -moz-column-count: auto;
965 993
  -moz-column-width: 400px;
966 994
  -moz-column-gap : 0.5rem;
967
  margin-bottom: 1.2em;
995
  margin-block-end: 1.2em;
968 996
}
969 997
#projects-index li.root ul.projects { border-inline-start: 3px solid var(--oc-gray-3); padding-inline-start: 1em;}
970 998
#projects-index ul.projects li.root {
971
  margin-bottom: 1em;
972
  padding: 15px 20px;
999
  margin-block-end: 1em;
1000
  padding-block: 15px;
1001
  padding-inline: 20px;
973 1002
  border: 1px solid var(--oc-gray-4);
974 1003
  border-radius: 3px;
975 1004
  box-sizing: border-box;
......
982 1011
  page-break-inside:avoid;
983 1012
  -webkit-column-break-inside: avoid;
984 1013
  -moz-column-break-inside: avoid;
985
  width: 100%;
1014
  inline-size: 100%;
986 1015
}
987
#projects-index ul.projects li.child {margin-top: 1em;}
1016
#projects-index ul.projects li.child {margin-block-start: 1em;}
988 1017
#projects-index ul.projects div.root a.project {
989 1018
  font-family: var(--fonts-main);
990 1019
  font-weight: bold;
991 1020
  font-size: 1rem;
992
  margin: 0 0 10px 0;
1021
  margin-block: 0 10px;
1022
  margin-inline: 0;
993 1023
  /* @ToDo: Remove below lines when legacy icon styles are removed */
994 1024
  background-image: none;
995 1025
  padding-inline-start: 0;
......
1000 1030
}
1001 1031
#projects-index ul.projects div.root .icon-bookmarked-project svg, #projects-index ul.projects div.root .my-project svg {
1002 1032
  stroke-width: 2;
1003
  margin-bottom: 10px;
1033
  margin-block-end: 10px;
1004 1034
}
1005 1035
#projects-index ul.projects div.description {
1006
  padding-top: 0.5em;
1036
  padding-block-start: 0.5em;
1007 1037
}
1008 1038
#projects-index a.icon-user, #projects-index a.icon-bookmarked-project {
1009 1039
  background-image: none;
1010 1040
  padding-inline-start: 0;
1011 1041
}
1012 1042
#projects-index div.wiki p {
1013
  margin-top: 0px;
1043
  margin-block-start: 0px;
1014 1044
}
1015 1045

  
1016 1046
table.projects td.name .icon-bookmarked-project svg,
......
1018 1048
  margin-inline-start: 4px;
1019 1049
}
1020 1050

  
1021
#notified-projects>ul, #tracker_project_ids>ul, #custom_field_project_ids>ul {max-height:250px; overflow-y:auto;}
1051
#notified-projects>ul, #tracker_project_ids>ul, #custom_field_project_ids>ul {max-block-size: 250px; overflow-y: auto;}
1022 1052

  
1023 1053
ul.subprojects {list-style: none; display: inline-block; padding: 0; margin: 0;}
1024 1054
ul.subprojects li {float: inline-start;}
......
1033 1063
.total-hours { font-size: 110%; font-weight: bold; }
1034 1064
.total-hours span.hours-int { font-size: 120%; }
1035 1065

  
1036
.autoscroll {overflow-x: auto; padding:1px; margin-bottom: 1.2em; position: relative;}
1066
.autoscroll {overflow-x: auto; padding: 1px; margin-block-end: 1.2em; position: relative;}
1037 1067
#user_login, #user_firstname, #user_lastname, #user_mail, #my_account_form select, #user_form select { width: 90%; }
1038 1068

  
1039
#workflow_copy_form select { width: 200px; }
1069
#workflow_copy_form select { inline-size: 200px; }
1040 1070
table.transitions td.enabled {background: var(--oc-green-2);}
1041
#workflow_form table select {font-size:90%; max-width:100px;}
1071
#workflow_form table select {font-size: 90%; max-inline-size: 100px;}
1042 1072
table.fields_permissions td.readonly {background:var(--oc-gray-4);}
1043 1073
table.fields_permissions td.required {background:var(--oc-red-4);}
1044 1074

  
1045 1075
select.expandable {vertical-align:top;}
1046 1076

  
1047
textarea#custom_field_possible_values {width: 95%; resize:vertical}
1048
textarea#custom_field_default_value {width: 95%; resize:vertical}
1077
textarea#custom_field_possible_values {inline-size: 95%; resize: vertical;}
1078
textarea#custom_field_default_value {inline-size: 95%; resize: vertical;}
1049 1079
.sort-handle { cursor: move; }
1050 1080

  
1051
input#content_comments {width: 99%}
1081
input#content_comments {inline-size: 99%}
1052 1082

  
1053
span.pagination {margin-left:3px; color:var(--oc-gray-6); display:block;}
1083
span.pagination {margin-inline-start: 3px; color: var(--oc-gray-6); display: block;}
1054 1084
.pagination ul.pages {
1055
  margin: 0 5px 0 0;
1085
  margin-block: 0;
1086
  margin-inline: 0 5px;
1056 1087
  padding: 0;
1057 1088
  display: inline;
1058 1089
}
......
1060 1091
  display: inline-block;
1061 1092
  padding: 0;
1062 1093
  border: 1px solid var(--oc-gray-4);
1063
  margin-left: -1px;
1094
  margin-inline-start: -1px;
1064 1095
  line-height: 2em;
1065
  margin-bottom: 1em;
1096
  margin-block-end: 1em;
1066 1097
  white-space: nowrap;
1067 1098
  text-align: center;
1068 1099
}
1069 1100
.pagination ul.pages li a,
1070 1101
.pagination ul.pages li span {
1071
  padding: 3px 8px;
1102
  padding-block: 3px;
1103
  padding-inline: 8px;
1072 1104
}
1073 1105
.pagination ul.pages li:first-child {
1074
  border-top-left-radius: 4px;
1075
  border-bottom-left-radius: 4px;
1106
  border-start-start-radius: 4px;
1107
  border-end-start-radius: 4px;
1076 1108
}
1077 1109
.pagination ul.pages li:last-child {
1078
  border-top-right-radius: 4px;
1079
  border-bottom-right-radius: 4px;
1110
  border-start-end-radius: 4px;
1111
  border-end-end-radius: 4px;
1080 1112
}
1081 1113
.pagination ul.pages li.current {
1082 1114
  color: white;
......
1097 1129
span.pagination>span {white-space:nowrap;}
1098 1130
.controller-attachments.action-show span.pagination, .controller-repositories.action-entry span.pagination {
1099 1131
  display: block;
1100
  margin-top: 1.2em;
1132
  margin-block-start: 1.2em;
1101 1133
}
1102 1134

  
1103
#search-form fieldset p {margin:0.2em 0;}
1135
#search-form fieldset p {margin-block: 0.2em; margin-inline: 0;}
1104 1136

  
1105 1137
/***** Tabular forms ******/
1106 1138
.tabular p{
1107 1139
  margin: 0;
1108 1140
  padding-block: 3px;
1109 1141
  padding-inline: 180px 0; /* width of left column containing the label elements */
1110
  min-height: 2em;
1142
  min-block-size: 2em;
1111 1143
  clear: inline-start;
1112 1144
}
1113 1145
html>body .tabular p {overflow:hidden;}
1114 1146

  
1115
.tabular input, .tabular select {max-width:95%}
1116
.tabular textarea {width:95%; resize:vertical;}
1117
input#twofa_code, img#twofa_code { width: 140px; }
1147
.tabular input, .tabular select {max-inline-size: 95%}
1148
.tabular textarea {inline-size: 95%; resize: vertical;}
1149
input#twofa_code, img#twofa_code { inline-size: 140px; }
1118 1150
ul.twofa_backup_codes { list-style-type: none; padding: 0; display: inline-block; columns: 14em 2;}
1119 1151
ul.twofa_backup_codes code { font-size: 1rem; line-height: 2em }
1120 1152

  
......
1125 1157
  /* width of left column */
1126 1158
  margin-inline-start: -180px;
1127 1159
  /* width of labels. Should be smaller than left column to create some right margin */
1128
  width: 175px;
1160
  inline-size: 175px;
1129 1161
  line-height: 24px;
1130 1162
}
1131 1163

  
......
1133 1165
  font-weight: normal;
1134 1166
  margin-inline-start: 0px;
1135 1167
  text-align: start;
1136
  width: 270px;
1168
  inline-size: 270px;
1137 1169
}
1138 1170

  
1139 1171
label.block {
......
1152 1184
  font-weight: normal;
1153 1185
  float:none;
1154 1186
  margin-inline-start: 5px !important;
1155
  width: auto;
1187
  inline-size: auto;
1156 1188
}
1157 1189

  
1158 1190
.tabular label.error {
......
1168 1200
  float:none;
1169 1201
  text-align:start;
1170 1202
  margin-inline-start:0px;
1171
  width:auto;
1203
  inline-size: auto;
1172 1204
}
1173
input#time_entry_comments { width: 90%;}
1174
input#months { width: 46px; }
1205
input#time_entry_comments { inline-size: 90%;}
1206
input#months { inline-size: 46px; }
1175 1207

  
1176
.jstBlock .jstTabs, .jstBlock .wiki-preview { width: 99%; }
1208
.jstBlock .jstTabs, .jstBlock .wiki-preview { inline-size: 99%; }
1177 1209

  
1178
.jstBlock .jstTabs { padding-right: 6px; }
1210
.jstBlock .jstTabs { padding-inline-end: 6px; }
1179 1211
.jstBlock .wiki-preview { padding: 2px; }
1180
.jstBlock .wiki-preview > p:first-child { padding-top: 0 !important; margin-top: 0 !important;}
1181
.jstBlock .wiki-preview > p:last-child { padding-bottom: 0 !important; margin-bottom: 0 !important;}
1212
.jstBlock .wiki-preview > p:first-child { padding-block-start: 0 !important; margin-block-start: 0 !important;}
1213
.jstBlock .wiki-preview > p:last-child { padding-block-end: 0 !important; margin-block-end: 0 !important;}
1182 1214

  
1183
.tabular .wiki-preview, .tabular .jstTabs {width: 95%;}
1184
.tabular.settings .wiki-preview, .tabular.settings .jstTabs { width: 99%; }
1215
.tabular .wiki-preview, .tabular .jstTabs {inline-size: 95%;}
1216
.tabular.settings .wiki-preview, .tabular.settings .jstTabs { inline-size: 99%; }
1185 1217
.tabular.settings .wiki-preview p {padding-inline-start: 0 !important}
1186 1218
.tabular .wiki-preview p {
1187
  min-height: initial;
1219
  min-block-size: initial;
1188 1220
  overflow: initial;
1189 1221
}
1190 1222

  
1191 1223
.tabular.settings p { padding-inline-start: 300px; font-size: 93%; }
1192
.tabular.settings label{ margin-inline-start: -300px; width: 295px; }
1193
.tabular.settings textarea, .tabular.settings .wiki-preview, .tabular.settings .jstTabs { width: 99%; }
1224
.tabular.settings label{ margin-inline-start: -300px; inline-size: 295px; }
1225
.tabular.settings textarea, .tabular.settings .wiki-preview, .tabular.settings .jstTabs { inline-size: 99%; }
1194 1226

  
1195 1227
.settings.enabled_scm table {width:100%}
1196 1228
.settings.enabled_scm td.scm_name{ font-weight: bold; }
......
1203 1235

  
1204 1236
.check_box_group {
1205 1237
  display:block;
1206
  width:95%;
1207
  max-height:120px;
1238
  inline-size: 95%;
1239
  max-block-size: 120px;
1208 1240
  overflow-y:auto;
1209 1241
  padding-block: 2px 4px;
1210 1242
  padding-inline: 2px 4px;
......
1223 1255
.check_box_group.bool_cf {border:0; background:inherit;}
1224 1256
.check_box_group.bool_cf label {display: inline;}
1225 1257

  
1226
.attachments_fields input.description, #existing-attachments input.description {margin-inline-start: 4px; width: 340px;}
1258
.attachments_fields input.description, #existing-attachments input.description {margin-inline-start: 4px; inline-size: 340px;}
1227 1259
.attachments_fields>span, #existing-attachments>span {display:block; white-space:nowrap;}
1228 1260
/* ToDo: delete this line when legacy icons are deleted */
1229 1261
.attachments_fields .icon-attachment, #existing-attachments .icon-attachment {background-image: none; padding-inline-start: 0}
1230
.attachments_fields input.filename, #existing-attachments .filename {border:0; width:250px; color:var(--oc-gray-7); background-color:inherit; }
1231
.tabular input.filename {max-width:75% !important;}
1262
.attachments_fields input.filename, #existing-attachments .filename {border: 0; inline-size: 250px; color: var(--oc-gray-7); background-color: inherit; }
1263
.tabular input.filename {max-inline-size: 75% !important;}
1232 1264
.attachments_fields div.ui-progressbar {
1233
  width: 100px;
1234
  height: 14px;
1265
  inline-size: 100px;
1266
  block-size: 14px;
1235 1267
  margin-block: 2px -5px;
1236 1268
  margin-inline: 8px 0;
1237 1269
  display: inline-block;
1238 1270
}
1239 1271
.attachments_fields input.filename {
1240
  height: 1.8em;
1272
  block-size: 1.8em;
1241 1273
  padding-inline: 3px 0;
1242 1274
}
1243 1275

  
......
1250 1282
div.attachments span.author { font-size: 0.9em; color: var(--oc-gray-6); }
1251 1283

  
1252 1284
div.thumbnails {margin:0.6em;}
1253
div.thumbnail {background:var(--oc-white);border:2px solid var(--oc-gray-3);display:inline-block;margin-right:2px;}
1285
div.thumbnail {
1286
  background: var(--oc-white);
1287
  border: 2px solid var(--oc-gray-3);
1288
  display: inline-block;
1289
  margin-inline-end: 2px;
1290
}
1254 1291
div.thumbnail img {margin: 3px; vertical-align: middle;}
1255 1292

  
1256 1293
p.other-formats { text-align: end; font-size:0.9em; color: var(--oc-gray-6); }
......
1260 1297
em.info.error {padding-inline-start: 20px; background: url(/exclamation.png) no-repeat left 50%;}
1261 1298
[dir="rtl"] em.info.error {background-position: right 50%;}
1262 1299

  
1263
textarea.text_cf {width:95%; resize:vertical;}
1264
input.string_cf, input.link_cf {width:95%;}
1265
select.bool_cf {width:auto !important;}
1300
textarea.text_cf {inline-size: 95%; resize: vertical;}
1301
input.string_cf, input.link_cf {inline-size: 95%;}
1302
select.bool_cf {inline-size: auto !important;}
1266 1303

  
1267
#users_for_watcher {height: 200px; overflow:auto;}
1304
#users_for_watcher {block-size: 200px; overflow: auto;}
1268 1305
#users_for_watcher label {display: block;}
1269 1306

  
1270
input#principal_search, input#user_search {width:90%}
1271
.roles-selection label {display:inline-block; width:210px;}
1307
input#principal_search, input#user_search {inline-size: 90%}
1308
.roles-selection label {display: inline-block; inline-size: 210px;}
1272 1309

  
1273 1310
input.autocomplete {
1274 1311
  background: var(--oc-white) url(/search.svg) no-repeat 2px 50%; padding-inline-start: 20px !important;
......
1283 1320
.role-visibility {padding-inline-start: 2em;}
1284 1321

  
1285 1322
.objects-selection {
1286
  height: 300px;
1323
  block-size: 300px;
1287 1324
  overflow: auto;
1288
  margin-bottom: 1em;
1325
  margin-block-end: 1em;
1289 1326
}
1290 1327

  
1291 1328
.objects-selection label {
......
1309 1346
#errorExplanation, div.flash, .nodata, .warning, .conflict {
1310 1347
  padding-block: 12px;
1311 1348
  padding-inline: 30px 4px;
1312
  margin-bottom: 12px;
1349
  margin-block-end: 12px;
1313 1350
  font-size: 1.1em;
1314 1351
  border: 1px solid;
1315 1352
  border-radius: 3px;
1316 1353
}
1317 1354

  
1318
div.flash {margin-top: 8px;}
1355
div.flash {margin-block-start: 8px;}
1319 1356
div.flash svg.icon-svg, #errorExplanation svg.icon-svg, .conflict svg.icon-svg {
1320 1357
  margin-inline: -26px 4px;
1321 1358
}
......
1335 1372

  
1336 1373
#errorExplanation > svg.icon-svg {
1337 1374
  position: absolute;
1338
  top: 50%;
1339
  bottom: 50%;
1375
  inset-block-start: 50%;
1376
  inset-block-end: 50%;
1340 1377
  margin-inline-start: -24px;
1341 1378
  margin-block-start: -9px;
1342 1379
}
......
1368 1405
}
1369 1406

  
1370 1407
.warning .oauth-permissions { display:inline-block;text-align:start; }
1371
.warning .oauth-permissions p { margin-top:0;-webkit-margin-before:0;}
1408
.warning .oauth-permissions p { margin-block-start: 0; -webkit-margin-before: 0;}
1372 1409

  
1373 1410
#errorExplanation ul { font-size: 0.9em;}
1374 1411
#errorExplanation h2, #errorExplanation p { display: none; }
......
1379 1416
.markdown-alert {
1380 1417
  border-inline-start: 4px solid;
1381 1418
  padding-inline-start: 0.6em;
1382
  margin: 1em 0;
1419
  margin-block: 1em;
1420
  margin-inline: 0;
1383 1421
}
1384 1422

  
1385 1423
.markdown-alert-title {
......
1412 1450
position: fixed;
1413 1451
background-color:var(--oc-gray-2);
1414 1452
border: 1px solid var(--oc-gray-5);
1415
top: 50%;
1416
left: 50%;
1453
inset-block-start: 50%;
1454
inset-inline-start: 50%;
1417 1455
transform: translate(-50%, -50%);
1418
width:20%;
1456
inline-size: 20%;
1419 1457
font-weight:bold;
1420 1458
text-align:center;
1421 1459
padding:0.6em;
......
1426 1464
/***** Calendar *****/
1427 1465
ul.cal {
1428 1466
  list-style: none;
1429
  width: 100%;
1467
  inline-size: 100%;
1430 1468
  padding: 0;
1431 1469
  display: grid;
1432 1470
  grid-template-columns: 2rem repeat(7, 1fr);
......
1463 1501
  border-block-end: 0;
1464 1502
  border-inline-end: 0;
1465 1503
  line-height: 1.2;
1466
  min-height: calc(1.2em * 6);
1504
  min-block-size: calc(1.2em * 6);
1467 1505
  padding: 2px;
1468 1506
  box-shadow: 0 1px 2px rgba(var(--oc-gray-9-rgb), 0.05);
1469 1507
}
......
1476 1514
.cal .calbody.today {background:var(--oc-yellow-0);}
1477 1515
.cal .calbody.today p.day-num {font-weight: bold;}
1478 1516

  
1479
.cal .calbody .icon {padding-top: 2px; padding-bottom: 3px;}
1517
.cal .calbody .icon {padding-block-start: 2px; padding-block-end: 3px;}
1480 1518
.cal .calbody.nwday:not(.other-month) {background-color:var(--oc-gray-1);}
1481 1519

  
1482 1520
p.cal.legend span {display:flex;}
1483
.controller-calendars p.buttons {margin-top: unset;}
1521
.controller-calendars p.buttons {margin-block-start: unset;}
1484 1522

  
1485 1523
/***** Tooltips ******/
1486 1524
.tooltip{position:relative;z-index:24;}
......
1496 1534
div.tooltip:hover span.tip{
1497 1535
display:block;
1498 1536
position:absolute;
1499
top:12px; width:270px;
1537
inset-block-start: 12px; inline-size: 270px;
1500 1538
border:1px solid var(--oc-gray-7);
1501 1539
border-radius: 3px;
1502 1540
background-color:var(--oc-white);
......
1507 1545
}
1508 1546

  
1509 1547
table.cal div.tooltip:hover span.tip {
1510
  top: 25px;
1548
  inset-block-start: 25px;
1511 1549
}
1512 1550

  
1513 1551
img.ui-datepicker-trigger {
......
1519 1557
/***** Documents *****/
1520 1558

  
1521 1559
#document-list .document-group {
1522
  margin-bottom: 15px;
1560
  margin-block-end: 15px;
1523 1561
}
1524 1562

  
1525 1563
/***** Progress bar *****/
......
1531 1569
  float: inline-start;
1532 1570
  margin-block: 1px;
1533 1571
  margin-inline: 0 6px;
1534
  width:80px;
1572
  inline-size: 80px;
1535 1573
}
1536 1574

  
1537
table.progress td { height: 1em; }
1575
table.progress td { block-size: 1em; }
1538 1576
table.progress td.closed { background: var(--oc-green-7) none repeat scroll 0%; }
1539 1577
table.progress td.done { background: var(--oc-green-4) none repeat scroll 0%; }
1540 1578
table.progress td.todo { background: var(--oc-gray-3) none repeat scroll 0%; }
1541 1579
p.percent {font-size: 86%; margin:0;}
1542
p.progress-info {clear: inline-start; font-size: 86%; margin-top:-4px; color:var(--oc-gray-6);}
1580
p.progress-info {clear: inline-start; font-size: 86%; margin-block-start: -4px; color: var(--oc-gray-6);}
1543 1581

  
1544
.version-overview table.progress {width:40em;}
1545
.version-overview table.progress td { height: 1.2em; }
1582
.version-overview table.progress {inline-size: 40em;}
1583
.version-overview table.progress td { block-size: 1.2em; }
1546 1584

  
1547 1585
/***** Tabs *****/
1548
#content .tabs {height: 2.6em; margin-bottom:1.2em; position:relative; overflow:hidden;}
1586
#content .tabs {block-size: 2.6em; margin-block-end: 1.2em; position: relative; overflow: hidden;}
1549 1587
#content .tabs ul {
1550 1588
  margin: 0;
1551 1589
  position: absolute;
1552
  bottom:0;
1590
  inset-block-end:0;
1553 1591
  padding-inline-start: 0.5em;
1554
  min-width: 2000px;
1555
  width: 100%;
1556
  border-bottom: 1px solid var(--oc-gray-4);
1592
  min-inline-size: 2000px;
1593
  inline-size: 100%;
1594
  border-block-end: 1px solid var(--oc-gray-4);
1557 1595
}
1558 1596
#content .tabs ul li {
1559 1597
  float:inline-start;
......
1561 1599
  white-space:nowrap;
1562 1600
  margin-inline-end:4px;
1563 1601
  position:relative;
1564
  margin-bottom:-1px;
1602
  margin-block-end:-1px;
1565 1603
}
1566 1604
#content .tabs ul li a{
1567 1605
  display:block;
1568 1606
  font-size: 0.9em;
1569 1607
  text-decoration:none;
1570 1608
  line-height:1.3em;
1571
  padding:4px 6px 4px 6px;
1609
  padding-block: 4px;
1610
  padding-inline: 6px;
1572 1611
  border: 1px solid var(--oc-gray-4);
1573
  border-bottom: 1px solid var(--oc-gray-4);
1612
  border-block-end: 1px solid var(--oc-gray-4);
1574 1613
  color:var(--oc-gray-6);
1575 1614
  font-weight:bold;
1576 1615
  border-start-start-radius:3px;
......
1585 1624
#content .tabs ul li a.selected {
1586 1625
  background-color: var(--oc-white);
1587 1626
  border: 1px solid var(--oc-gray-4);
1588
  border-bottom: 1px solid var(--oc-white);
1627
  border-block-end: 1px solid var(--oc-white);
1589 1628
  color: var(--oc-gray-8);
1590 1629
  box-shadow: 0 1px 2px rgba(var(--oc-black-rgb), 0.1);
1591 1630
}
......
1595 1634
div.tabs-buttons {
1596 1635
  position: absolute;
1597 1636
  inset-inline-end: 0;
1598
  width: 54px;
1599
  height: 24px;
1637
  inline-size: 54px;
1638
  block-size: 24px;
1600 1639
  background: white;
1601
  bottom: 0;
1602
  border-bottom: 1px solid var(--oc-gray-5);
1640
  inset-block-end: 0;
1641
  border-block-end: 1px solid var(--oc-gray-5);
1603 1642
}
1604 1643

  
1605 1644
button.tab-left, button.tab-right {
1606 1645
  font-size: 0.9em;
1607 1646
  cursor: pointer;
1608
  height:24px;
1647
  block-size: 24px;
1609 1648
  border: 1px solid var(--oc-gray-4);
1610
  border-bottom: 1px solid var(--oc-gray-5);
1649
  border-block-end: 1px solid var(--oc-gray-5);
1611 1650
  position:absolute;
1612
  padding:4px;
1613
  width: 24px;
1614
  bottom: -1px;
1651
  padding: 4px;
1652
  inline-size: 24px;
1653
  inset-block-end: -1px;
1615 1654
}
1616 1655
button.tab-left:hover, button.tab-right:hover {
1617 1656
  background-color: var(--oc-gray-0);
......
1626 1665

  
1627 1666
button.tab-left {
1628 1667
  inset-inline-end: 28px;
1629
  border-top-left-radius:3px;
1668
  border-start-start-radius:3px;
1630 1669
}
1631 1670

  
1632 1671
button.tab-right {
1633 1672
  inset-inline-end: 4px;
1634
  border-top-right-radius:3px;
1673
  border-start-end-radius:3px;
1635 1674
}
1636 1675

  
1637 1676
button.tab-left.disabled, button.tab-right.disabled {
......
1661 1700
/* Wiki tables */
1662 1701
div.wiki table {
1663 1702
  border-collapse: collapse;
1664
  margin-bottom: 1em;
1703
  margin-block-end: 1em;
1665 1704
}
1666 1705

  
1667 1706
div.wiki table, div.wiki td, div.wiki th {
......
1669 1708
  padding: 4px;
1670 1709
}
1671 1710

  
1672
div.wiki table td[align=left], div.wiki table th[align=left] { text-align: left; }
1673
div.wiki table td[align=right], div.wiki table th[align=right] { text-align: right; }
1711
div.wiki table td[align=left], div.wiki table th[align=left] { text-align: start; }
1712
div.wiki table td[align=right], div.wiki table th[align=right] { text-align: end; }
1674 1713

  
1675 1714
div.wiki .wiki-class-noborder, div.wiki .wiki-class-noborder td, div.wiki .wiki-class-noborder th {border:0;}
1676 1715

  
......
1690 1729

  
1691 1730
div.wiki p {
1692 1731
  line-height: 1.6;
1693
  margin-top: 1em;
1694
  margin-bottom: 1em;
1732
  margin-block: 1em;
1695 1733
  padding: 0;
1696 1734
}
1697
div.wiki ul, div.wiki ol {margin-bottom:1em;}
1698
div.wiki li {line-height: 1.6; margin-bottom: 0.125rem;}
1699
div.wiki li>ul, div.wiki li>ol {margin-bottom: 0;}
1735
div.wiki ul, div.wiki ol {margin-block-end: 1em;}
1736
div.wiki li {line-height: 1.6; margin-block-end: 0.125rem;}
1737
div.wiki li>ul, div.wiki li>ol {margin-block-end: 0;}
1700 1738

  
1701 1739
div.wiki div.pre-wrapper {
1702 1740
  position: relative;
......
1709 1747
  background-color: var(--oc-gray-0);
1710 1748
  border: 1px solid var(--oc-gray-4);
1711 1749
  border-radius: 3px;
1712
  width:auto;
1750
  inline-size: auto;
1713 1751
  overflow-x: auto;
1714 1752
  overflow-y: hidden;
1715 1753
}
......
1717 1755

  
1718 1756
div.wiki *:not(pre)>code, div.wiki>code {
1719 1757
  background: rgba(var(--oc-gray-9-rgb), 0.08);
1720
  padding: 0.1em 0.1em;
1758
  padding: 0.1em;
1721 1759
  border-radius: 0.1em;
1722 1760
  white-space: pre-wrap;
1723 1761
}
... This diff was truncated because it exceeds the maximum size that can be displayed.
(1-1/6)