@gemeentenijmegen/semantic-html 0.0.2-alpha.1 → 0.0.2-alpha.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/dist/index.css +82 -0
- package/package.json +2 -2
- package/src/link-list/_mixin.scss +3 -0
package/dist/index.css
CHANGED
|
@@ -808,4 +808,86 @@ however browsers don't seem to have implemented great looking supixel tweening y
|
|
|
808
808
|
mask-size: 100%;
|
|
809
809
|
width: var(--nijmegen-icon-functional-size-width, 1.5rem); /* stylelint-disable-line property-disallowed-list */
|
|
810
810
|
padding-inline-end: 0;
|
|
811
|
+
}
|
|
812
|
+
.nijmegen-html ul.nijmegen-html-linklist li a {
|
|
813
|
+
color: var(--utrecht-link-color);
|
|
814
|
+
text-decoration: var(--nijmegen-link-list-item-text-decoration, none);
|
|
815
|
+
}
|
|
816
|
+
.nijmegen-html ul.nijmegen-html-linklist li a:active, .nijmegen-html ul.nijmegen-html-linklist li a.nijmegen-link-list__link--active {
|
|
817
|
+
--_utrecht-link-forced-colors-color: activetext;
|
|
818
|
+
--_utrecht-link-state-color: var(--utrecht-link-active-color);
|
|
819
|
+
color: var(--nijmegen-link-list-item-active-color, #0c483d);
|
|
820
|
+
text-decoration: var(--nijmegen-link-list-item-active-text-decoration, underline);
|
|
821
|
+
}
|
|
822
|
+
.nijmegen-html ul.nijmegen-html-linklist li a:active::before, .nijmegen-html ul.nijmegen-html-linklist li a.nijmegen-link-list__link--active::before {
|
|
823
|
+
background-color: var(--nijmegen-link-list-item-active-color, #0c483d);
|
|
824
|
+
}
|
|
825
|
+
.nijmegen-html ul.nijmegen-html-linklist li a:hover, .nijmegen-html ul.nijmegen-html-linklist li a.nijmegen-link-list__link--hover {
|
|
826
|
+
--_utrecht-link-forced-colors-color: linktext;
|
|
827
|
+
--_utrecht-link-state-color: var(--utrecht-link-hover-color);
|
|
828
|
+
--_utrecht-link-state-text-decoration: var(--utrecht-link-hover-text-decoration);
|
|
829
|
+
--_utrecht-link-state-text-decoration-thickness: var(--utrecht-link-hover-text-decoration-thickness);
|
|
830
|
+
text-decoration-skip: none;
|
|
831
|
+
text-decoration-skip-ink: none;
|
|
832
|
+
color: var(--nijmegen-link-list-item-hover-color, #116253);
|
|
833
|
+
text-decoration: var(--nijmegen-link-list-item-hover-text-decoration, underline);
|
|
834
|
+
}
|
|
835
|
+
.nijmegen-html ul.nijmegen-html-linklist li a:hover::before, .nijmegen-html ul.nijmegen-html-linklist li a.nijmegen-link-list__link--hover::before {
|
|
836
|
+
background-color: var(--nijmegen-link-list-item-hover-color, #116253);
|
|
837
|
+
}
|
|
838
|
+
.nijmegen-html ul.nijmegen-html-linklist li a:focus, .nijmegen-html ul.nijmegen-html-linklist li a.nijmegen-link-list__link--focus {
|
|
839
|
+
--_utrecht-link-state-color: var(--utrecht-link-focus-color);
|
|
840
|
+
background-color: var(--utrecht-link-focus-background-color, transparent);
|
|
841
|
+
text-decoration-skip: none;
|
|
842
|
+
text-decoration-skip-ink: none;
|
|
843
|
+
color: var(--nijmegen-link-list-item-focus-color, #000);
|
|
844
|
+
text-decoration: var(--nijmegen-link-list-item-focus-text-decoration, none);
|
|
845
|
+
}
|
|
846
|
+
.nijmegen-html ul.nijmegen-html-linklist li a:focus::before, .nijmegen-html ul.nijmegen-html-linklist li a.nijmegen-link-list__link--focus::before {
|
|
847
|
+
background-color: var(--nijmegen-link-list-item-focus-color, #000);
|
|
848
|
+
}
|
|
849
|
+
.nijmegen-html ul.nijmegen-html-linklist li a:focus-visible, .nijmegen-html ul.nijmegen-html-linklist li a.nijmegen-link-list__link--focus-visible {
|
|
850
|
+
--_utrecht-link-state-color: var(--utrecht-link-focus-color);
|
|
851
|
+
background-color: var(--utrecht-link-focus-background-color, transparent);
|
|
852
|
+
text-decoration-skip: none;
|
|
853
|
+
text-decoration-skip-ink: none;
|
|
854
|
+
/*
|
|
855
|
+
* WCAG SC 2.4.12: Focus Not Obscured
|
|
856
|
+
* Use `z-index` to ensure the focus ring is stacked above adjecent elements with a `background`
|
|
857
|
+
*/
|
|
858
|
+
/* - The browser default focus ring should apply when these CSS custom properties are not set.
|
|
859
|
+
* - Make the `box-shadow` value available, so components that have their own `box-shadow`
|
|
860
|
+
* can combine it with the focus ring box shadow.
|
|
861
|
+
*/
|
|
862
|
+
--_utrecht-focus-ring-box-shadow: 0 0 0 var(--utrecht-focus-outline-width, 0)
|
|
863
|
+
var(--utrecht-focus-inverse-outline-color, transparent);
|
|
864
|
+
box-shadow: var(--_utrecht-focus-ring-box-shadow);
|
|
865
|
+
outline-color: var(--utrecht-focus-outline-color, revert);
|
|
866
|
+
outline-offset: var(--utrecht-focus-outline-offset, revert);
|
|
867
|
+
outline-style: var(--utrecht-focus-outline-style, revert);
|
|
868
|
+
outline-width: var(--utrecht-focus-outline-width, revert);
|
|
869
|
+
z-index: 1;
|
|
870
|
+
/*
|
|
871
|
+
* The following tokens are deprecated, but we keep them for backwards compatibility for now:
|
|
872
|
+
*
|
|
873
|
+
* `--utrecht-link-focus-text-decoration`
|
|
874
|
+
* `--utrecht-link-focus-text-decoration-thickness`
|
|
875
|
+
*/
|
|
876
|
+
--_utrecht-link-state-text-decoration: var(
|
|
877
|
+
--utrecht-link-focus-visible-text-decoration,
|
|
878
|
+
var(--utrecht-link-focus-text-decoration)
|
|
879
|
+
);
|
|
880
|
+
--_utrecht-link-state-text-decoration-thickness: var(
|
|
881
|
+
--utrecht-link-focus-visible-text-decoration-thickness,
|
|
882
|
+
var(--utrecht-link-focus-text-decoration-thickness)
|
|
883
|
+
);
|
|
884
|
+
z-index: var(--utrecht-stack-focus-z-index, 1);
|
|
885
|
+
color: var(--nijmegen-link-list-item-focus-visible-color, #000);
|
|
886
|
+
}
|
|
887
|
+
.nijmegen-html ul.nijmegen-html-linklist li a:focus-visible::before, .nijmegen-html ul.nijmegen-html-linklist li a.nijmegen-link-list__link--focus-visible::before {
|
|
888
|
+
background-color: var(--nijmegen-link-list-item-focus-visible-color, #000);
|
|
889
|
+
}
|
|
890
|
+
.nijmegen-html ul.nijmegen-html-linklist li a:visited, .nijmegen-html ul.nijmegen-html-linklist li a.nijmegen-link-list__link--visited {
|
|
891
|
+
--_utrecht-link-forced-colors-color: visitedtext;
|
|
892
|
+
--_utrecht-link-state-color: var(--utrecht-link-visited-color);
|
|
811
893
|
}
|
package/package.json
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
{
|
|
2
|
-
"version": "0.0.2-alpha.
|
|
2
|
+
"version": "0.0.2-alpha.2",
|
|
3
3
|
"author": "gemeente Nijmegen",
|
|
4
4
|
"description": "Default html element styling for the gemeente Nijmegen design system",
|
|
5
5
|
"license": "EUPL-1.2",
|
|
@@ -41,5 +41,5 @@
|
|
|
41
41
|
"rollup": "4.12.1",
|
|
42
42
|
"rollup-plugin-postcss": "4.0.2"
|
|
43
43
|
},
|
|
44
|
-
"gitHead": "
|
|
44
|
+
"gitHead": "c1d82bf94b3308a8f1a25ad722e42b87e78b9185"
|
|
45
45
|
}
|