@abrasileirado/dsgovbr-bootstraped 0.7.0 → 0.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -29,26 +29,29 @@ MIT. Os textos das páginas são próprios deste projeto.
29
29
  - Origem: <https://gitlab.com/govbr-ds/bibliotecas/javascript/govbr-ds-core>
30
30
  - Licença: MIT — Copyright (c) 2022 SERPRO.
31
31
 
32
- ## Ativos externos (não redistribuídos)
32
+ ## Ativos externos
33
33
 
34
- Carregados pelo consumidor via CDN, como no próprio GOV.BR DS (DP-05). Nenhum
35
- arquivo de fonte ou de ícone está neste pacote nem neste repositório; o CSS
36
- apenas referencia a fonte pelo nome.
34
+ O pacote npm não inclui arquivo de fonte nem de ícone: o CSS só referencia a
35
+ fonte pelo nome, e o consumidor carrega os dois via CDN, como no próprio
36
+ GOV.BR DS (DP-05). A exceção é o **site de documentação**, que hospeda uma
37
+ cópia da Rawline (abaixo).
37
38
 
38
39
  ### Fonte Rawline
39
40
 
40
- - Uso: `font-family: "Rawline", "Raleway", sans-serif` (só o nome; sem arquivo).
41
+ - Uso: `font-family: "Rawline", "Raleway", sans-serif` (só o nome no pacote).
41
42
  - Origem documentada pelo GOV.BR DS (CDN do SERPRO):
42
43
  `https://cdngovbr-ds.estaleiro.serpro.gov.br/design-system/fonts/rawline/css/rawline.css`
43
- - Licença: **não confirmada em fonte oficial.** A página de
44
+ - Licença: **SIL Open Font License 1.1**, conforme a tabela `name` das próprias
45
+ fontes (campo de licença e copyright "The Raleway Project Authors"). A
46
+ Rawline deriva da Raleway. A página de
44
47
  [tipografia do Padrão Digital de Governo](https://www.gov.br/ds/fundamentos-visuais/tipografia)
45
- indica a fonte e remete ao CDNFonts, sem texto de licença. Um comentário de
46
- terceiros em [issue do suap-companion/chamados](https://github.com/suap-companion/chamados/issues/124)
47
- afirma SIL OFL 1.1 com nome reservado "RAWLINE" — **não verificado**. A
48
- Rawline deriva da Raleway (SIL OFL).
49
- - Efeito neste projeto: como não redistribuímos nem modificamos a fonte, não
50
- assumimos obrigação de licença de fonte. Quem hospedar a Rawline por conta
51
- própria deve confirmar a licença com o SERPRO/gov.br antes.
48
+ indica a fonte sem texto de licença; o CDN não publica arquivo de licença.
49
+ - **Redistribuída só no site** (issue #45): `src/site/fonts/rawline/` contém os
50
+ 18 `woff2` do CDN, sem modificação, um `rawline.css` próprio que só os
51
+ referencia e o `OFL.txt`; o build copia tudo para `docs/assets/fonts/rawline/`.
52
+ Motivo: o CDN não envia `Access-Control-Allow-Origin`, então o navegador
53
+ recusa o `<link>` com `integrity` (SRI) e o alerta `missing-integrity` do
54
+ Semgrep não tinha correção. Não vai para o pacote npm (fora de `files`).
52
55
 
53
56
  ### Font Awesome 5 (Free)
54
57
 
@@ -127,18 +127,18 @@
127
127
 
128
128
  [data-bs-theme=dark] {
129
129
  color-scheme: dark;
130
- --bs-body-color: #dee2e6;
131
- --bs-body-color-rgb: 222, 226, 230;
132
- --bs-body-bg: #212529;
133
- --bs-body-bg-rgb: 33, 37, 41;
130
+ --bs-body-color: #fff;
131
+ --bs-body-color-rgb: 255, 255, 255;
132
+ --bs-body-bg: #071d41;
133
+ --bs-body-bg-rgb: 7, 29, 65;
134
134
  --bs-emphasis-color: #fff;
135
135
  --bs-emphasis-color-rgb: 255, 255, 255;
136
- --bs-secondary-color: rgba(222, 226, 230, 0.75);
137
- --bs-secondary-color-rgb: 222, 226, 230;
136
+ --bs-secondary-color: rgba(255, 255, 255, 0.75);
137
+ --bs-secondary-color-rgb: 255, 255, 255;
138
138
  --bs-secondary-bg: #343a40;
139
139
  --bs-secondary-bg-rgb: 52, 58, 64;
140
- --bs-tertiary-color: rgba(222, 226, 230, 0.5);
141
- --bs-tertiary-color-rgb: 222, 226, 230;
140
+ --bs-tertiary-color: rgba(255, 255, 255, 0.5);
141
+ --bs-tertiary-color-rgb: 255, 255, 255;
142
142
  --bs-tertiary-bg: rgb(16.6666666667%, 18.6274509804%, 20.5882352941%);
143
143
  --bs-tertiary-bg-rgb: 43, 48, 53;
144
144
  --bs-primary-text-emphasis: rgb(44.4705882353%, 59.0588235294%, 82.3529411765%);
@@ -166,12 +166,12 @@
166
166
  --bs-light-border-subtle: #495057;
167
167
  --bs-dark-border-subtle: #343a40;
168
168
  --bs-heading-color: inherit;
169
- --bs-link-color: rgb(44.4705882353%, 59.0588235294%, 82.3529411765%);
170
- --bs-link-hover-color: rgb(55.5764705882%, 67.2470588235%, 85.8823529412%);
171
- --bs-link-color-rgb: 113, 151, 210;
172
- --bs-link-hover-color-rgb: 142, 171, 219;
169
+ --bs-link-color: #c5d4eb;
170
+ --bs-link-hover-color: #c5d4eb;
171
+ --bs-link-color-rgb: 197, 212, 235;
172
+ --bs-link-hover-color-rgb: 197, 212, 235;
173
173
  --bs-code-color: rgb(90.3529411765%, 52%, 71.0588235294%);
174
- --bs-highlight-color: #dee2e6;
174
+ --bs-highlight-color: #fff;
175
175
  --bs-highlight-bg: rgb(40%, 30.2745098039%, 1.0980392157%);
176
176
  --bs-border-color: #495057;
177
177
  --bs-border-color-translucent: rgba(255, 255, 255, 0.15);
@@ -208,10 +208,10 @@ body {
208
208
 
209
209
  hr {
210
210
  margin: 1rem 0;
211
- color: inherit;
211
+ color: #ccc;
212
212
  border: 0;
213
213
  border-top: var(--bs-border-width) solid;
214
- opacity: 0.25;
214
+ opacity: 1;
215
215
  }
216
216
 
217
217
  h6, .h6, h5, .h5, h4, .h4, h3, .h3, h2, .h2, h1, .h1 {
@@ -2318,7 +2318,7 @@ textarea.form-control-lg {
2318
2318
  }
2319
2319
 
2320
2320
  [data-bs-theme=dark] .form-select {
2321
- --bs-form-select-bg-img: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23dee2e6' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
2321
+ --bs-form-select-bg-img: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
2322
2322
  }
2323
2323
 
2324
2324
  .form-check {
@@ -3884,23 +3884,23 @@ textarea.form-control-lg {
3884
3884
 
3885
3885
  .navbar {
3886
3886
  --bs-navbar-padding-x: 0;
3887
- --bs-navbar-padding-y: 0.5rem;
3888
- --bs-navbar-color: rgba(var(--bs-emphasis-color-rgb), 0.65);
3889
- --bs-navbar-hover-color: rgba(var(--bs-emphasis-color-rgb), 0.8);
3890
- --bs-navbar-disabled-color: rgba(var(--bs-emphasis-color-rgb), 0.3);
3891
- --bs-navbar-active-color: rgba(var(--bs-emphasis-color-rgb), 1);
3892
- --bs-navbar-brand-padding-y: 0.3359375rem;
3887
+ --bs-navbar-padding-y: 16px;
3888
+ --bs-navbar-color: #1351b4;
3889
+ --bs-navbar-hover-color: #1351b4;
3890
+ --bs-navbar-disabled-color: #888;
3891
+ --bs-navbar-active-color: #0c326f;
3892
+ --bs-navbar-brand-padding-y: 4px;
3893
3893
  --bs-navbar-brand-margin-end: 1rem;
3894
- --bs-navbar-brand-font-size: 1.09375rem;
3895
- --bs-navbar-brand-color: rgba(var(--bs-emphasis-color-rgb), 1);
3896
- --bs-navbar-brand-hover-color: rgba(var(--bs-emphasis-color-rgb), 1);
3897
- --bs-navbar-nav-link-padding-x: 0.5rem;
3898
- --bs-navbar-toggler-padding-y: 0.25rem;
3899
- --bs-navbar-toggler-padding-x: 0.75rem;
3900
- --bs-navbar-toggler-font-size: 1.09375rem;
3901
- --bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%2851, 51, 51, 0.75%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
3902
- --bs-navbar-toggler-border-color: rgba(var(--bs-emphasis-color-rgb), 0.15);
3903
- --bs-navbar-toggler-border-radius: 50rem;
3894
+ --bs-navbar-brand-font-size: 14px;
3895
+ --bs-navbar-brand-color: #333;
3896
+ --bs-navbar-brand-hover-color: #333;
3897
+ --bs-navbar-nav-link-padding-x: 16px;
3898
+ --bs-navbar-toggler-padding-y: 8px;
3899
+ --bs-navbar-toggler-padding-x: 8px;
3900
+ --bs-navbar-toggler-font-size: 16px;
3901
+ --bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%231351b4' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
3902
+ --bs-navbar-toggler-border-color: transparent;
3903
+ --bs-navbar-toggler-border-radius: 50%;
3904
3904
  --bs-navbar-toggler-focus-width: 0;
3905
3905
  --bs-navbar-toggler-transition: box-shadow 0.15s ease-in-out;
3906
3906
  position: relative;
@@ -4295,18 +4295,18 @@ textarea.form-control-lg {
4295
4295
 
4296
4296
  .navbar-dark,
4297
4297
  .navbar[data-bs-theme=dark] {
4298
- --bs-navbar-color: rgba(255, 255, 255, 0.55);
4299
- --bs-navbar-hover-color: rgba(255, 255, 255, 0.75);
4298
+ --bs-navbar-color: #c5d4eb;
4299
+ --bs-navbar-hover-color: #c5d4eb;
4300
4300
  --bs-navbar-disabled-color: rgba(255, 255, 255, 0.25);
4301
4301
  --bs-navbar-active-color: #fff;
4302
4302
  --bs-navbar-brand-color: #fff;
4303
4303
  --bs-navbar-brand-hover-color: #fff;
4304
- --bs-navbar-toggler-border-color: rgba(255, 255, 255, 0.1);
4305
- --bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
4304
+ --bs-navbar-toggler-border-color: transparent;
4305
+ --bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23c5d4eb' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
4306
4306
  }
4307
4307
 
4308
4308
  [data-bs-theme=dark] .navbar-toggler-icon {
4309
- --bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
4309
+ --bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23c5d4eb' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
4310
4310
  }
4311
4311
 
4312
4312
  .card {
@@ -7097,7 +7097,7 @@ textarea.form-control-lg {
7097
7097
  width: var(--bs-border-width);
7098
7098
  min-height: 1em;
7099
7099
  background-color: currentcolor;
7100
- opacity: 0.25;
7100
+ opacity: 1;
7101
7101
  }
7102
7102
 
7103
7103
  .align-baseline {
@@ -12017,6 +12017,25 @@ textarea.form-control-lg {
12017
12017
  box-shadow: none;
12018
12018
  }
12019
12019
 
12020
+ .btn.rounded-circle {
12021
+ width: 40px;
12022
+ padding: 0;
12023
+ font-size: 16.8px;
12024
+ text-decoration: none;
12025
+ }
12026
+
12027
+ .btn-sm.rounded-circle, .btn-group-sm > .rounded-circle.btn {
12028
+ width: 32px;
12029
+ }
12030
+
12031
+ .btn-lg.rounded-circle, .btn-group-lg > .rounded-circle.btn {
12032
+ width: 48px;
12033
+ }
12034
+
12035
+ .btn-link.rounded-circle:hover {
12036
+ background-image: linear-gradient(rgba(19, 81, 180, 0.16), rgba(19, 81, 180, 0.16));
12037
+ }
12038
+
12020
12039
  .card {
12021
12040
  box-shadow: var(--bs-card-box-shadow);
12022
12041
  }
@@ -12248,4 +12267,221 @@ a:focus-visible,
12248
12267
  background-size: 16px;
12249
12268
  }
12250
12269
 
12270
+ .vr {
12271
+ background-color: #ccc;
12272
+ }
12273
+
12274
+ .navbar {
12275
+ box-shadow: 0 1px 6px rgba(0, 0, 0, 0.16);
12276
+ }
12277
+
12278
+ .navbar-brand {
12279
+ font-weight: normal;
12280
+ }
12281
+
12282
+ @media (min-width: 576px) {
12283
+ .navbar-brand {
12284
+ font-size: 20.16px;
12285
+ }
12286
+ }
12287
+ @media (min-width: 1200px) {
12288
+ .navbar-brand {
12289
+ font-size: 24.192px;
12290
+ }
12291
+ }
12292
+ .navbar-text {
12293
+ color: var(--bs-body-color);
12294
+ }
12295
+
12296
+ .navbar-brand + .navbar-text {
12297
+ display: none;
12298
+ padding: 4px 0 0;
12299
+ font-size: 11.662px;
12300
+ font-weight: 500;
12301
+ }
12302
+
12303
+ @media (min-width: 576px) {
12304
+ .navbar-brand + .navbar-text {
12305
+ display: block;
12306
+ }
12307
+ }
12308
+ @media (min-width: 1200px) {
12309
+ .navbar-brand + .navbar-text {
12310
+ font-size: 14px;
12311
+ }
12312
+ }
12313
+ .navbar-toggler {
12314
+ border: 0;
12315
+ }
12316
+
12317
+ .navbar-nav .nav-link {
12318
+ border-radius: 100em;
12319
+ }
12320
+ .navbar-nav .nav-link.active {
12321
+ font-weight: 600;
12322
+ }
12323
+
12324
+ .navbar-nav .nav-link:hover:not(.disabled),
12325
+ .navbar-toggler:hover {
12326
+ background-image: linear-gradient(rgba(19, 81, 180, 0.16), rgba(19, 81, 180, 0.16));
12327
+ }
12328
+
12329
+ [data-bs-theme=dark] .navbar-nav .nav-link:hover:not(.disabled),
12330
+ [data-bs-theme=dark] .navbar-toggler:hover,
12331
+ [data-bs-theme=dark].navbar .navbar-toggler:hover {
12332
+ background-image: linear-gradient(rgba(197, 212, 235, 0.16), rgba(197, 212, 235, 0.16));
12333
+ }
12334
+
12335
+ .navbar .btn-light {
12336
+ --bs-btn-bg: #f8f8f8;
12337
+ --bs-btn-color: #1351b4;
12338
+ --bs-btn-hover-bg: #f8f8f8;
12339
+ --bs-btn-hover-color: #1351b4;
12340
+ --bs-btn-active-bg: #f8f8f8;
12341
+ --bs-btn-active-color: #0c326f;
12342
+ gap: 8px;
12343
+ padding-top: 0;
12344
+ padding-bottom: 0;
12345
+ font-size: 16.8px;
12346
+ }
12347
+ .navbar .btn-light:hover {
12348
+ background-image: linear-gradient(rgba(19, 81, 180, 0.16), rgba(19, 81, 180, 0.16));
12349
+ }
12350
+
12351
+ .navbar [role=search] {
12352
+ position: relative;
12353
+ }
12354
+ .navbar [role=search] .form-control {
12355
+ height: 40px;
12356
+ padding-top: 0;
12357
+ padding-bottom: 0;
12358
+ padding-right: 40px;
12359
+ font-size: 16.8px;
12360
+ font-weight: 500;
12361
+ background-color: #f8f8f8;
12362
+ border-color: transparent;
12363
+ }
12364
+ .navbar [role=search] .form-control::placeholder {
12365
+ font-style: italic;
12366
+ }
12367
+ .navbar [role=search] .btn.rounded-circle {
12368
+ position: absolute;
12369
+ top: 50%;
12370
+ right: 4px;
12371
+ transform: translateY(-50%);
12372
+ }
12373
+
12374
+ .offcanvas-start .offcanvas-header,
12375
+ .offcanvas-end .offcanvas-header {
12376
+ padding: 8px 8px 8px 16px;
12377
+ border-bottom: 1px solid #ccc;
12378
+ }
12379
+ .offcanvas-start .list-group-item,
12380
+ .offcanvas-end .list-group-item {
12381
+ display: flex;
12382
+ align-items: center;
12383
+ padding: 16px;
12384
+ color: #1351b4;
12385
+ text-align: left;
12386
+ border-color: #ccc;
12387
+ }
12388
+ .offcanvas-start .list-group-item > i,
12389
+ .offcanvas-end .list-group-item > i {
12390
+ flex: 0 0 24px;
12391
+ margin-right: 16px;
12392
+ text-align: center;
12393
+ }
12394
+ .offcanvas-start .list-group-item.active,
12395
+ .offcanvas-end .list-group-item.active {
12396
+ color: #fff;
12397
+ background-color: #0c326f;
12398
+ border-color: #ccc;
12399
+ }
12400
+ .offcanvas-start .list-group-item[data-bs-toggle=collapse]::after,
12401
+ .offcanvas-end .list-group-item[data-bs-toggle=collapse]::after {
12402
+ flex: 0 0 16px;
12403
+ height: 16px;
12404
+ margin-left: auto;
12405
+ content: "";
12406
+ background-color: currentcolor;
12407
+ mask: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e") center/16px no-repeat;
12408
+ transition: transform 0.2s ease-in-out;
12409
+ }
12410
+ @media (prefers-reduced-motion: reduce) {
12411
+ .offcanvas-start .list-group-item[data-bs-toggle=collapse]::after,
12412
+ .offcanvas-end .list-group-item[data-bs-toggle=collapse]::after {
12413
+ transition: none;
12414
+ }
12415
+ }
12416
+ .offcanvas-start .list-group-item[data-bs-toggle=collapse][aria-expanded=true]::after,
12417
+ .offcanvas-end .list-group-item[data-bs-toggle=collapse][aria-expanded=true]::after {
12418
+ transform: rotate(-180deg);
12419
+ }
12420
+ .offcanvas-start .collapse > .list-group,
12421
+ .offcanvas-start .collapsing > .list-group,
12422
+ .offcanvas-end .collapse > .list-group,
12423
+ .offcanvas-end .collapsing > .list-group {
12424
+ background-color: #f8f8f8;
12425
+ }
12426
+ .offcanvas-start .collapse > .list-group > .list-group-item,
12427
+ .offcanvas-start .collapsing > .list-group > .list-group-item,
12428
+ .offcanvas-end .collapse > .list-group > .list-group-item,
12429
+ .offcanvas-end .collapsing > .list-group > .list-group-item {
12430
+ padding-left: 40px;
12431
+ background-color: transparent;
12432
+ border-width: 0;
12433
+ }
12434
+ .offcanvas-start .collapse > .list-group > .list-group-item.active,
12435
+ .offcanvas-start .collapsing > .list-group > .list-group-item.active,
12436
+ .offcanvas-end .collapse > .list-group > .list-group-item.active,
12437
+ .offcanvas-end .collapsing > .list-group > .list-group-item.active {
12438
+ background-color: #0c326f;
12439
+ }
12440
+
12441
+ footer[data-bs-theme=dark] {
12442
+ padding-top: 48px;
12443
+ border-top: 1px solid #ccc;
12444
+ }
12445
+ footer[data-bs-theme=dark] h2, footer[data-bs-theme=dark] .h2 {
12446
+ display: flex;
12447
+ align-items: center;
12448
+ min-height: 56px;
12449
+ margin: 0;
12450
+ padding: 8px 16px;
12451
+ font-size: 11.662px;
12452
+ font-weight: 700;
12453
+ color: #c5d4eb;
12454
+ text-transform: uppercase;
12455
+ }
12456
+ footer[data-bs-theme=dark] .nav-link {
12457
+ display: flex;
12458
+ align-items: center;
12459
+ min-height: 56px;
12460
+ padding: 8px 16px;
12461
+ }
12462
+
12463
+ [data-bs-theme=dark] {
12464
+ color: var(--bs-body-color);
12465
+ }
12466
+
12467
+ [data-bs-theme=dark] :focus-visible,
12468
+ [data-bs-theme=dark]:focus-visible {
12469
+ outline-color: #ffbe2e;
12470
+ }
12471
+
12472
+ [data-bs-theme=dark] .nav-link:hover:not(.active):not(.disabled),
12473
+ [data-bs-theme=dark] .list-group-item-action:hover:not(.active) {
12474
+ background-image: linear-gradient(rgba(197, 212, 235, 0.16), rgba(197, 212, 235, 0.16));
12475
+ }
12476
+
12477
+ [data-bs-theme=dark] .btn-link {
12478
+ --bs-btn-color: #c5d4eb;
12479
+ --bs-btn-hover-color: #c5d4eb;
12480
+ --bs-btn-active-color: #fff;
12481
+ }
12482
+
12483
+ [data-bs-theme=dark] .btn-link.rounded-circle:hover {
12484
+ background-image: linear-gradient(rgba(197, 212, 235, 0.16), rgba(197, 212, 235, 0.16));
12485
+ }
12486
+
12251
12487
  /*# sourceMappingURL=dsgovbr-bootstraped.css.map */