@dictu/navigation-bar 1.1.0 → 1.1.2
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.
- package/CHANGELOG.md +12 -0
- package/dist/index.css +1 -1
- package/dist/index.css.map +1 -1
- package/package.json +1 -1
- package/src/_mixin.scss +22 -28
- package/src/index.scss +2 -0
package/CHANGELOG.md
CHANGED
package/dist/index.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.dictu-navigation-bar{--govnl-nav-bar-max-inline-size: 1280px;--govnl-nav-bar-container-inline-size: 100%;--govnl-nav-bar-icon-size: 1.5em;--govnl-nav-bar-link-text-decoration: none;--govnl-nav-bar-menu-label-background-color: none;--govnl-nav-bar-mobile-max-inline-size: 100%;--govnl-nav-bar-border-block-end-width: var(--govnl-border-border-width-sm);--govnl-nav-bar-padding-inline: var(--govnl-space-sm);--govnl-nav-bar-
|
|
1
|
+
.dictu-navigation-bar{--govnl-nav-bar-max-inline-size: 1280px;--govnl-nav-bar-container-inline-size: 100%;--govnl-nav-bar-content-column-gap: 0px;--govnl-nav-bar-icon-size: 1.5em;--govnl-nav-bar-link-text-decoration: none;--govnl-nav-bar-menu-label-background-color: none;--govnl-nav-bar-mobile-max-inline-size: 100%;--govnl-nav-bar-border-block-end-width: var(--govnl-border-border-width-sm);--govnl-nav-bar-padding-inline: var(--govnl-space-sm);--govnl-nav-bar-icon-color: var(--govnl-brand-primary-500);--govnl-nav-bar-icon-active-color: var(--govnl-brand-primary-500);--govnl-nav-bar-link-active-background-color: var(--govnl-brand-primary-500);--govnl-nav-bar-link-active-color: var(--govnl-document-inverse-color);--govnl-nav-bar-link-background-color: var(--govnl-document-background-color);--govnl-nav-bar-link-color: var(--govnl-brand-primary-500);--govnl-nav-bar-link-focus-background-color: var(--govnl-brand-primary-50);--govnl-nav-bar-link-focus-color: var(--govnl-brand-primary-500);--govnl-nav-bar-link-hover-background-color: var(--govnl-brand-primary-50);--govnl-nav-bar-link-hover-color: var(--govnl-brand-primary-500);--govnl-nav-bar-link-padding-block: var(--govnl-space-sm);--govnl-nav-bar-link-padding-inline: var(--govnl-space-xs);--govnl-nav-bar-link-column-gap: var(--govnl-gap-content-min) / 2;--govnl-nav-bar-background-color: var(--govnl-document-background-color);--govnl-nav-bar-color: var(--govnl-brand-primary-500);--govnl-nav-bar-border-color: var(--govnl-brand-primary-400);--govnl-nav-bar-search-padding-block: var(--govnl-space-xs);--govnl-nav-bar-search-padding-inline: var(--govnl-space-xs);--govnl-nav-bar-menu-label-gap: var(--govnl-gap-content-min) / 2;--govnl-nav-bar-menu-label-padding-inline: var(--govnl-space-sm);--govnl-nav-bar-menu-label-padding-block: var(--govnl-space-2xs);--govnl-nav-bar-menu-label-color: var(--govnl-brand-primary-500);--govnl-nav-bar-menu-label-font-size: var(--govnl-document-font-size);--govnl-nav-bar-font-size: var(--govnl-document-font-size)}.dictu-focus-ring:focus-visible{outline:var(--govnl-focus-outline-color, revert) var(--govnl-focus-outline-style, revert) var(--govnl-focus-outline-width, revert);outline-offset:var(--govnl-focus-outline-offset, revert);z-index:1}.dictu-navigation-bar{margin-block:0;margin-inline:0;background-color:var(--govnl-nav-bar-background-color);border-block-end:var(--govnl-nav-bar-border-block-end-width) solid var(--govnl-nav-bar-border-color);color:var(--govnl-nav-bar-color);display:flex;max-inline-size:var(--govnl-nav-bar-max-inline-size);padding-inline:var(--govnl-nav-bar-padding-inline)}.dictu-navigation-bar__list{display:flex;gap:var(--govnl-nav-bar-content-column-gap);list-style:none;margin:0;padding:0}.dictu-navigation-bar__item{align-items:center;display:flex}.dictu-navigation-bar__link{align-items:center;background-color:var(--govnl-nav-bar-link-background-color);color:var(--govnl-nav-bar-link-color);column-gap:calc(var(--govnl-nav-bar-link-column-gap));display:flex;padding-block:var(--govnl-nav-bar-link-padding-block);padding-inline:var(--govnl-nav-bar-link-padding-inline);text-decoration:var(--govnl-nav-bar-link-text-decoration)}.dictu-navigation-bar__link:hover{background-color:var(--govnl-nav-bar-link-hover-background-color);color:var(--govnl-nav-bar-link-hover-color)}.dictu-navigation-bar__link:focus{background-color:var(--govnl-nav-bar-link-focus-background-color);color:var(--govnl-nav-bar-link-focus-color)}.dictu-navigation-bar__link:focus-visible{background-color:var(--govnl-nav-bar-link-focus-background-color);color:var(--govnl-nav-bar-link-focus-color)}.dictu-navigation-bar__link-active{background-color:var(--govnl-nav-bar-link-active-background-color);color:var(--govnl-nav-bar-link-active-color)}.dictu-navigation-bar__icon{align-items:center;block-size:var(--govnl-nav-bar-icon-size);color:var(--govnl-nav-bar-icon-color);display:inline-flex;inline-size:var(--govnl-nav-bar-icon-size);justify-content:center}.dictu-navigation-bar__toggle{display:none}.dictu-navigation-bar__menu-label{align-items:center;background:none;border:none;color:inherit;cursor:pointer;display:none;font-size:1rem;gap:.5rem;padding:.5rem 1rem}@media(width <= 48em){.dictu-navigation-bar{align-items:center;box-sizing:border-box;display:grid;grid-template-columns:repeat(6, minmax(0, 1fr));grid-template-rows:auto auto;justify-content:space-between;max-inline-size:100%}.dictu-navigation-bar .dictu-navigation-bar__toggle{grid-column:2;grid-row:1}.dictu-navigation-bar .dictu-navigation-bar__home{display:block;grid-column:1;grid-row:1}.dictu-navigation-bar .dictu-navigation-bar__menu-label{display:flex;grid-column:2;grid-row:1}.dictu-navigation-bar .dictu-navigation-bar__list{background:var(--govnl-nav-bar-background-color);display:none;flex-direction:column;grid-column:1/span 6;grid-row:2}.dictu-navigation-bar__toggle:checked~.dictu-navigation-bar__list{display:flex}}@media(width >= 48.01em){.dictu-navigation-bar__menu-label{display:none}.dictu-navigation-bar__home{display:none}.dictu-navigation-bar__list{box-shadow:none;display:flex;flex-direction:row}}/*# sourceMappingURL=index.css.map */
|
package/dist/index.css.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sourceRoot":"","sources":["../../../node_modules/@dictu/design-tokens/dist/navigation-bar.css","../src/index.scss","../src/_mixin.scss"],"names":[],"mappings":"AAIA,sBACE,wCACA,4CACA,iCACA,2CACA,kDACA,6CACA,4EACA,sDACA,
|
|
1
|
+
{"version":3,"sourceRoot":"","sources":["../../../node_modules/@dictu/design-tokens/dist/navigation-bar.css","../../../node_modules/@dictu/utility-focus-ring/dist/index.css","../src/index.scss","../src/_mixin.scss"],"names":[],"mappings":"AAIA,sBACE,wCACA,4CACA,wCACA,iCACA,2CACA,kDACA,6CACA,4EACA,sDACA,2DACA,kEACA,6EACA,uEACA,8EACA,2DACA,2EACA,iEACA,2EACA,iEACA,0DACA,2DACA,kEACA,yEACA,sDACA,6DACA,4DACA,6DACA,iEACA,iEACA,iEACA,iEACA,sEACA,2DCrCF,sOCUA,sBCJE,eACA,gBAMA,uDACA,qGACA,iCACA,aACA,qDACA,mDDJF,4BCQE,aACA,4CACA,gBACA,SACA,UDRF,4BCYE,mBACA,aDTF,4BCaE,mBACA,4DACA,sCACA,sDACA,aACA,sDACA,wDACA,0DAEA,kCACE,kEACA,4CAGF,kCACE,kEACA,4CAGF,0CACE,kEACA,4CAGF,mCACE,mEACA,6CDnCJ,4BCwCE,mBACA,0CACA,sCACA,oBACA,2CACA,uBDzCF,8BC6CE,aDzCF,kCC6CE,mBACA,gBACA,YACA,cACA,eACA,aACA,eACA,UACA,mBDhDF,sBCqDE,sBACE,mBACA,sBACA,aACA,gDACA,6BACA,8BACA,qBAIF,oDACE,cACA,WAGF,kDACE,cACA,cACA,WAGF,wDACE,aACA,cACA,WAGF,kDACE,iDACA,aACA,sBACA,qBACA,WAGF,kEACE,cDrFJ,yBC2FE,kCACE,aAGF,4BACE,aAGF,4BACE,gBACA,aACA","file":"index.css"}
|
package/package.json
CHANGED
package/src/_mixin.scss
CHANGED
|
@@ -50,8 +50,11 @@
|
|
|
50
50
|
&:focus {
|
|
51
51
|
background-color: var(--govnl-nav-bar-link-focus-background-color);
|
|
52
52
|
color: var(--govnl-nav-bar-link-focus-color);
|
|
53
|
-
|
|
54
|
-
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
&:focus-visible {
|
|
56
|
+
background-color: var(--govnl-nav-bar-link-focus-background-color);
|
|
57
|
+
color: var(--govnl-nav-bar-link-focus-color);
|
|
55
58
|
}
|
|
56
59
|
|
|
57
60
|
&-active {
|
|
@@ -95,46 +98,37 @@
|
|
|
95
98
|
grid-template-rows: auto auto;
|
|
96
99
|
justify-content: space-between;
|
|
97
100
|
max-inline-size: 100%;
|
|
101
|
+
}
|
|
98
102
|
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
}
|
|
104
|
-
|
|
105
|
-
&.dictu-navigation-bar__home {
|
|
106
|
-
grid-column: 1;
|
|
107
|
-
grid-row: 1;
|
|
108
|
-
}
|
|
109
|
-
|
|
110
|
-
&.dictu-navigation-bar__menu-label {
|
|
111
|
-
grid-column: 2;
|
|
112
|
-
grid-row: 1;
|
|
113
|
-
}
|
|
114
|
-
|
|
115
|
-
&.dictu-navigation-bar__list {
|
|
116
|
-
grid-column: 1 / span 6;
|
|
117
|
-
grid-row: 2;
|
|
118
|
-
}
|
|
103
|
+
// Place first 3 children in first row, fourth in second row
|
|
104
|
+
.dictu-navigation-bar .dictu-navigation-bar__toggle {
|
|
105
|
+
grid-column: 2;
|
|
106
|
+
grid-row: 1;
|
|
119
107
|
}
|
|
120
108
|
|
|
121
|
-
.dictu-navigation-bar__home {
|
|
109
|
+
.dictu-navigation-bar .dictu-navigation-bar__home {
|
|
122
110
|
display: block;
|
|
111
|
+
grid-column: 1;
|
|
112
|
+
grid-row: 1;
|
|
123
113
|
}
|
|
124
114
|
|
|
125
|
-
.dictu-navigation-
|
|
115
|
+
.dictu-navigation-bar .dictu-navigation-bar__menu-label {
|
|
116
|
+
display: flex;
|
|
117
|
+
grid-column: 2;
|
|
118
|
+
grid-row: 1;
|
|
119
|
+
}
|
|
120
|
+
|
|
121
|
+
.dictu-navigation-bar .dictu-navigation-bar__list {
|
|
126
122
|
background: var(--govnl-nav-bar-background-color);
|
|
127
123
|
display: none;
|
|
128
124
|
flex-direction: column;
|
|
125
|
+
grid-column: 1 / span 6;
|
|
126
|
+
grid-row: 2;
|
|
129
127
|
}
|
|
130
128
|
|
|
131
129
|
.dictu-navigation-bar__toggle:checked ~ .dictu-navigation-bar__list {
|
|
132
130
|
display: flex;
|
|
133
131
|
}
|
|
134
|
-
|
|
135
|
-
.dictu-navigation-bar__menu-label {
|
|
136
|
-
display: flex;
|
|
137
|
-
}
|
|
138
132
|
}
|
|
139
133
|
|
|
140
134
|
// Desktop styles > 768px
|