@rijkshuisstijl-community/components-css 1.0.0-alpha.36 → 1.0.0-alpha.38

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.
Files changed (17) hide show
  1. package/accordion/index.scss +2 -2
  2. package/blockquote/index.scss +6 -6
  3. package/button/_mixin.scss +2 -2
  4. package/button/index.scss +4 -4
  5. package/checkbox/index.scss +6 -6
  6. package/dot-badge/index.scss +2 -2
  7. package/hero/_mixin.scss +10 -0
  8. package/hero/index.scss +22 -18
  9. package/index.scss +36 -36
  10. package/link/index.scss +10 -10
  11. package/logo/index.scss +7 -7
  12. package/message-list/index.scss +8 -8
  13. package/navigation-list/index.scss +8 -8
  14. package/package.json +2 -2
  15. package/radio-group/index.scss +2 -2
  16. package/skip-link/index.scss +4 -4
  17. package/toggletip/index.scss +11 -11
package/accordion/index.scss CHANGED
@@ -3,7 +3,7 @@
3
3
  * Copyright (c) 2021 Community for NL Design System
4
4
  */
5
5
 
6
- @import "../button/mixin";
6
+ @use "../button/mixin";
7
7
 
8
8
  .utrecht-accordion {
9
9
  color: var(--rhc-accordion-color, inherit);
@@ -54,7 +54,7 @@
54
54
 
55
55
  .utrecht-accordion__button:focus-visible,
56
56
  .utrecht-accordion__button--focus-visible {
57
- @include rhc-button--focus-visible;
57
+ @include mixin.rhc-button--focus-visible;
58
58
  }
59
59
 
60
60
  .utrecht-accordion__button-icon {
package/blockquote/index.scss CHANGED
@@ -3,14 +3,14 @@
3
3
  * Copyright (c) 2021 Community for NL Design System
4
4
  */
5
5
 
6
- @import "./mixin";
6
+ @use "mixin";
7
7
 
8
8
  .rhc-blockquote {
9
9
  --utrecht-blockquote-color: var(--utrecht-blockquote-content-color);
10
10
  --utrecht-blockquote-font-size: var(--utrecht-blockquote-content-font-size);
11
11
  --utrecht-document-font-family: var(--utrecht-blockquote-content-font-family);
12
12
 
13
- @include rhc-blockquote;
13
+ @include mixin.rhc-blockquote;
14
14
  }
15
15
 
16
16
  .utrecht-blockquote__attribution {
@@ -25,17 +25,17 @@
25
25
  }
26
26
 
27
27
  .rhc-blockquote--blue-corner-border-variation {
28
- @include rhc-blockquote-variation("blue-corner-border-variation");
28
+ @include mixin.rhc-blockquote-variation("blue-corner-border-variation");
29
29
  }
30
30
 
31
31
  .rhc-blockquote--pink-background-variation {
32
- @include rhc-blockquote-variation("pink-background-variation");
32
+ @include mixin.rhc-blockquote-variation("pink-background-variation");
33
33
  }
34
34
 
35
35
  .rhc-blockquote--pink-left-border-variation {
36
- @include rhc-blockquote-variation("pink-left-border-variation");
36
+ @include mixin.rhc-blockquote-variation("pink-left-border-variation");
37
37
  }
38
38
 
39
39
  .rhc-blockquote--pink-corner-border-variation {
40
- @include rhc-blockquote-variation("pink-corner-border-variation");
40
+ @include mixin.rhc-blockquote-variation("pink-corner-border-variation");
41
41
  }
package/button/_mixin.scss CHANGED
@@ -4,7 +4,7 @@
4
4
  * Copyright (c) 2020-2022 Frameless B.V.
5
5
  */
6
6
 
7
- @import "../link/mixin";
7
+ @use "../link/mixin";
8
8
 
9
9
  @mixin rhc-button--icon-only {
10
10
  --utrecht-button-padding-block-end: var(--rhc-icon-only-button-padding-block-end, inherit);
@@ -14,7 +14,7 @@
14
14
  }
15
15
 
16
16
  @mixin rhc-button--focus-visible {
17
- @include rhc-link--focus-visible;
17
+ @include mixin.rhc-link--focus-visible;
18
18
  }
19
19
 
20
20
  @mixin invisible-but-accessible {
package/button/index.scss CHANGED
@@ -2,17 +2,17 @@
2
2
  * @license EUPL-1.2
3
3
  * Copyright (c) 2021 Community for NL Design System
4
4
  */
5
- @import "./mixin";
5
+ @use "mixin";
6
6
 
7
7
  .rhc-button:focus-visible,
8
8
  .rhc-button--focus-visible {
9
- @include rhc-button--focus-visible;
9
+ @include mixin.rhc-button--focus-visible;
10
10
  }
11
11
 
12
12
  .rhc-button--icon-only {
13
- @include rhc-button--icon-only;
13
+ @include mixin.rhc-button--icon-only;
14
14
  }
15
15
 
16
16
  .rhc-button--icon-only .rhc-button__sr-only {
17
- @include invisible-but-accessible;
17
+ @include mixin.invisible-but-accessible;
18
18
  }
package/checkbox/index.scss CHANGED
@@ -3,26 +3,26 @@
3
3
  * Copyright (c) 2021 Community for NL Design System
4
4
  */
5
5
 
6
- @import "./mixin";
6
+ @use "mixin";
7
7
 
8
8
  .utrecht-checkbox {
9
9
  margin-block-start: var(--rhc-space-50);
10
10
  &--disabled {
11
- @include utrecht-checkbox--disabled;
11
+ @include mixin.utrecht-checkbox--disabled;
12
12
  }
13
13
  &--invalid {
14
- @include utrecht-checkbox--invalid;
14
+ @include mixin.utrecht-checkbox--invalid;
15
15
  }
16
16
  }
17
17
  .utrecht-checkbox--custom.utrecht-checkbox--html-input,
18
18
  .utrecht-custom-checkbox--html-input {
19
- @include utrecht-custom-checkbox--html-input;
19
+ @include mixin.utrecht-custom-checkbox--html-input;
20
20
  }
21
21
  .utrecht-checkbox--custom.utrecht-checkbox--html-input:indeterminate {
22
- @include utrecht-checkbox--indeterminate;
22
+ @include mixin.utrecht-checkbox--indeterminate;
23
23
  }
24
24
  .utrecht-checkbox--custom.utrecht-checkbox--html-input[aria-invalid="true"]:hover {
25
- @include utrecht-checkbox--invalid;
25
+ @include mixin.utrecht-checkbox--invalid;
26
26
  }
27
27
 
28
28
  .rhc-checkbox-group {
package/dot-badge/index.scss CHANGED
@@ -2,8 +2,8 @@
2
2
  * @license EUPL-1.2
3
3
  * Copyright (c) 2021 Community for NL Design System
4
4
  */
5
- @import "./mixin";
5
+ @use "mixin";
6
6
 
7
7
  .rhc-dot-badge {
8
- @include rhc-dot-badge;
8
+ @include mixin.rhc-dot-badge;
9
9
  }
package/hero/_mixin.scss CHANGED
@@ -91,3 +91,13 @@
91
91
  font-weight: var(--rhc-hero-sub-heading-font-weight);
92
92
  line-height: var(--rhc-hero-sub-heading-line-height);
93
93
  }
94
+
95
+ @mixin rhc-hero__children {
96
+ box-sizing: border-box;
97
+ display: flex;
98
+ flex-direction: row;
99
+ inset-block-start: 50%;
100
+ position: absolute;
101
+ row-gap: var(--rhc-hero-message-row-gap);
102
+ transform: translateY(-50%);
103
+ }
package/hero/index.scss CHANGED
@@ -2,72 +2,76 @@
2
2
  * @license EUPL-1.2
3
3
  * Copyright (c) 2021 Community for NL Design System
4
4
  */
5
- @import "./mixin";
5
+ @use "mixin";
6
6
 
7
7
  .rhc-hero {
8
- @include rhc-hero;
8
+ @include mixin.rhc-hero;
9
9
  }
10
10
 
11
11
  .rhc-hero--aspect-ratio-16-9 {
12
- @include rhc-hero--aspect-ratio-16-9;
12
+ @include mixin.rhc-hero--aspect-ratio-16-9;
13
13
  }
14
14
 
15
15
  .rhc-hero--aspect-ratio-1-1 {
16
- @include rhc-hero--aspect-ratio-1-1;
16
+ @include mixin.rhc-hero--aspect-ratio-1-1;
17
17
  }
18
18
 
19
19
  .rhc-hero--aspect-ratio-4-3 {
20
- @include rhc-hero--aspect-ratio-4-3;
20
+ @include mixin.rhc-hero--aspect-ratio-4-3;
21
21
  }
22
22
 
23
23
  .rhc-hero__message {
24
- @include rhc-hero__message;
24
+ @include mixin.rhc-hero__message;
25
+ }
26
+
27
+ .rhc-hero__children {
28
+ @include mixin.rhc-hero__children;
25
29
  }
26
30
 
27
31
  .rhc-hero__message .utrecht-heading-group {
28
- @include rhc-hero__heading-group;
32
+ @include mixin.rhc-hero__heading-group;
29
33
  }
30
34
 
31
35
  .rhc-hero--text-align-start:not(.rhc-hero--custom-border-radius-corner) {
32
- @include rhc-hero--border-radius-corner-start-start;
36
+ @include mixin.rhc-hero--border-radius-corner-start-start;
33
37
  }
34
38
 
35
39
  .rhc-hero--text-align-start .rhc-hero__message {
36
- @include rhc-hero__message--text-align-start;
40
+ @include mixin.rhc-hero__message--text-align-start;
37
41
  }
38
42
 
39
43
  .rhc-hero--text-align-end:not(.rhc-hero--custom-border-radius-corner) {
40
- @include rhc-hero--border-radius-corner-start-end;
44
+ @include mixin.rhc-hero--border-radius-corner-start-end;
41
45
  }
42
46
 
43
47
  .rhc-hero--text-align-end .rhc-hero__message {
44
- @include rhc-hero__message--text-align-end;
48
+ @include mixin.rhc-hero__message--text-align-end;
45
49
  }
46
50
 
47
51
  .rhc-hero--custom-border-radius-corner.rhc-hero--border-radius-corner-start-start {
48
- @include rhc-hero--border-radius-corner-start-start;
52
+ @include mixin.rhc-hero--border-radius-corner-start-start;
49
53
  }
50
54
 
51
55
  .rhc-hero--custom-border-radius-corner.rhc-hero--border-radius-corner-start-end {
52
- @include rhc-hero--border-radius-corner-start-end;
56
+ @include mixin.rhc-hero--border-radius-corner-start-end;
53
57
  }
54
58
 
55
59
  .rhc-hero--custom-border-radius-corner.rhc-hero--border-radius-corner-end-start {
56
- @include rhc-hero--border-radius-corner-end-start;
60
+ @include mixin.rhc-hero--border-radius-corner-end-start;
57
61
  }
58
62
 
59
63
  .rhc-hero--custom-border-radius-corner.rhc-hero--border-radius-corner-end-end {
60
- @include rhc-hero--border-radius-corner-end-end;
64
+ @include mixin.rhc-hero--border-radius-corner-end-end;
61
65
  }
62
66
 
63
67
  .rhc-hero__image {
64
- @include rhc-hero__image;
68
+ @include mixin.rhc-hero__image;
65
69
  }
66
70
 
67
71
  .rhc-hero__heading {
68
- @include rhc-hero__heading;
72
+ @include mixin.rhc-hero__heading;
69
73
  }
70
74
 
71
75
  .rhc-hero__sub-heading {
72
- @include rhc-hero__sub-heading;
76
+ @include mixin.rhc-hero__sub-heading;
73
77
  }
package/index.scss CHANGED
@@ -3,39 +3,39 @@
3
3
  * Copyright (c) 2021 Community for NL Design System
4
4
  */
5
5
 
6
- @import "accordion/index";
7
- @import "action-group/index";
8
- @import "alert/index";
9
- @import "article/index";
10
- @import "blockquote/index";
11
- @import "breadcrumb-nav/index";
12
- @import "button/index";
13
- @import "dot-badge";
14
- @import "checkbox/index";
15
- @import "figure/index";
16
- @import "form/index";
17
- @import "form-field/index";
18
- @import "form-field-error-message/index";
19
- @import "form-field-radio-option/index";
20
- @import "footer/index";
21
- @import "hero/index";
22
- @import "link-list/index";
23
- @import "link-list-card/index";
24
- @import "link/index";
25
- @import "logo/index";
26
- @import "navbar/index";
27
- @import "message-list/index";
28
- @import "navigation-list/index";
29
- @import "ordered-list/index";
30
- @import "radio/index";
31
- @import "radio-group/index";
32
- @import "select/index";
33
- @import "separator/index";
34
- @import "side-nav/index";
35
- @import "skip-link/index";
36
- @import "table/index";
37
- @import "textarea/index";
38
- @import "textbox/index";
39
- @import "toggletip/index";
40
- @import "unordered-list/index";
41
- @import "badgecounter/index";
6
+ @use "accordion/index" as accordion;
7
+ @use "action-group/index" as actionGroup;
8
+ @use "alert/index" as alert;
9
+ @use "article/index" as article;
10
+ @use "blockquote/index" as blockquote;
11
+ @use "breadcrumb-nav/index" as breadcrumb;
12
+ @use "button/index" as button;
13
+ @use "dot-badge";
14
+ @use "checkbox/index" as checkbox;
15
+ @use "figure/index" as figure;
16
+ @use "form/index" as form;
17
+ @use "form-field/index" as formField;
18
+ @use "form-field-error-message/index" as formFieldError;
19
+ @use "form-field-radio-option/index" as formFieldRadioOption;
20
+ @use "footer/index" as footer;
21
+ @use "hero/index" as hero;
22
+ @use "link-list/index" as linkList;
23
+ @use "link-list-card/index" as linkListCard;
24
+ @use "link/index" as link;
25
+ @use "logo/index" as logo;
26
+ @use "navbar/index" as navbar;
27
+ @use "message-list/index" as messageList;
28
+ @use "navigation-list/index" as navigationList;
29
+ @use "ordered-list/index" as orderedList;
30
+ @use "radio/index" as radio;
31
+ @use "radio-group/index" as radioGroup;
32
+ @use "select/index" as select;
33
+ @use "separator/index" as separator;
34
+ @use "side-nav/index" as sideNav;
35
+ @use "skip-link/index" as skipLink;
36
+ @use "table/index" as table;
37
+ @use "textarea/index" as textarea;
38
+ @use "textbox/index" as textbox;
39
+ @use "toggletip/index" as toggletip;
40
+ @use "unordered-list/index" as unorderedList;
41
+ @use "badgecounter/index" as badgecounter;
package/link/index.scss CHANGED
@@ -2,43 +2,43 @@
2
2
  * @license EUPL-1.2
3
3
  * Copyright (c) 2021 Community for NL Design System
4
4
  */
5
- @import "../button/mixin";
6
- @import "./mixin";
5
+ @use "../button/mixin" as button-mixin;
6
+ @use "mixin";
7
7
 
8
8
  .utrecht-rich-text .utrecht-link {
9
9
  margin-block-end: var(--utrecht-link-margin-block-end);
10
10
  }
11
11
 
12
12
  .utrecht-link:any-link {
13
- @include rhc-link--any-link;
13
+ @include mixin.rhc-link--any-link;
14
14
  }
15
15
 
16
16
  .utrecht-link:any-link .utrecht-icon {
17
- @include rhc-link--icon;
17
+ @include mixin.rhc-link--icon;
18
18
  }
19
19
 
20
20
  .utrecht-link:visited,
21
21
  .utrecht-link--visted {
22
- @include rhc-link--visited;
22
+ @include mixin.rhc-link--visited;
23
23
  }
24
24
 
25
25
  .utrecht-link:visited .utrecht-icon {
26
- @include rhc-link--visited-icon;
26
+ @include mixin.rhc-link--visited-icon;
27
27
  }
28
28
 
29
29
  .utrecht-link:active,
30
30
  .utrecht-link--active {
31
- @include rhc-link--active;
31
+ @include mixin.rhc-link--active;
32
32
  }
33
33
 
34
34
  .utrecht-link:focus-visible,
35
35
  .utrecht-link--focus-visible,
36
36
  .utrecht-link:focus,
37
37
  .utrecht-link--focus {
38
- @include rhc-link--focus-visible;
39
- @include rhc-link--focus;
38
+ @include mixin.rhc-link--focus-visible;
39
+ @include mixin.rhc-link--focus;
40
40
  }
41
41
 
42
42
  .utrecht-link .rhc-link__sr-only {
43
- @include invisible-but-accessible;
43
+ @include button-mixin.invisible-but-accessible;
44
44
  }
package/logo/index.scss CHANGED
@@ -2,25 +2,25 @@
2
2
  * @license EUPL-1.2
3
3
  * Copyright (c) 2021 Community for NL Design System
4
4
  */
5
- @import "./mixin";
5
+ @use "mixin";
6
6
 
7
7
  .rhc-logo {
8
- @include rhc-logo;
8
+ @include mixin.rhc-logo;
9
9
  }
10
10
 
11
11
  .rhc-logo__img {
12
- @include rhc-logo__img;
12
+ @include mixin.rhc-logo__img;
13
13
  }
14
14
 
15
15
  .rhc-logo__caption {
16
- @include rhc-logo__caption;
16
+ @include mixin.rhc-logo__caption;
17
17
  }
18
18
 
19
19
  .rhc-logo__title {
20
- @include rhc-logo__title;
20
+ @include mixin.rhc-logo__title;
21
21
  }
22
22
 
23
23
  .rhc-logo__subtitle {
24
- @include rhc-logo__subtitle;
25
- @include rhc-logo__title;
24
+ @include mixin.rhc-logo__subtitle;
25
+ @include mixin.rhc-logo__title;
26
26
  }
package/message-list/index.scss CHANGED
@@ -3,26 +3,26 @@
3
3
  * Copyright (c) 2021 Community for NL Design System
4
4
  */
5
5
 
6
- @import "./mixin";
6
+ @use "mixin";
7
7
 
8
8
  .rhc-message-list {
9
- @include rhc-message-list;
9
+ @include mixin.rhc-message-list;
10
10
  &__item {
11
- @include rhc-message-list__item;
11
+ @include mixin.rhc-message-list__item;
12
12
  &-content {
13
- @include rhc-message-list__item-content;
13
+ @include mixin.rhc-message-list__item-content;
14
14
  }
15
15
  &__label {
16
- @include rhc-message-list__item__label;
16
+ @include mixin.rhc-message-list__item__label;
17
17
  }
18
18
  &__description {
19
- @include rhc-message-list__item__description;
19
+ @include mixin.rhc-message-list__item__description;
20
20
  }
21
21
  &__meta-data {
22
- @include rhc-message-list__item__meta-data;
22
+ @include mixin.rhc-message-list__item__meta-data;
23
23
  }
24
24
  &__end-icon {
25
- @include rhc-navigation-list__item__end-icon;
25
+ @include mixin.rhc-navigation-list__item__end-icon;
26
26
  }
27
27
  }
28
28
  }
package/navigation-list/index.scss CHANGED
@@ -2,26 +2,26 @@
2
2
  * @license EUPL-1.2
3
3
  * Copyright (c) 2021 Community for NL Design System
4
4
  */
5
- @import "./mixin";
5
+ @use "mixin";
6
6
 
7
7
  .rhc-navigation-list {
8
- @include rhc-navigation-list;
8
+ @include mixin.rhc-navigation-list;
9
9
  &__item {
10
- @include rhc-navigation-list__item;
10
+ @include mixin.rhc-navigation-list__item;
11
11
  &-content {
12
- @include rhc-navigation-list__item-content;
12
+ @include mixin.rhc-navigation-list__item-content;
13
13
  }
14
14
  &__label {
15
- @include rhc-navigation-list__item__label;
15
+ @include mixin.rhc-navigation-list__item__label;
16
16
  }
17
17
  &__description {
18
- @include rhc-navigation-list__item__description;
18
+ @include mixin.rhc-navigation-list__item__description;
19
19
  }
20
20
  &__start-icon {
21
- @include rhc-navigation-list__item__start-icon;
21
+ @include mixin.rhc-navigation-list__item__start-icon;
22
22
  }
23
23
  &__end-icon {
24
- @include rhc-navigation-list__item__end-icon;
24
+ @include mixin.rhc-navigation-list__item__end-icon;
25
25
  }
26
26
  }
27
27
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rijkshuisstijl-community/components-css",
3
- "version": "1.0.0-alpha.36",
3
+ "version": "1.0.0-alpha.38",
4
4
  "author": "Community for NL Design System",
5
5
  "description": "CSS Components for a design system based on the NL Design System architecture",
6
6
  "license": "EUPL-1.2",
@@ -17,5 +17,5 @@
17
17
  "url": "git@github.com:nl-design-system/rijkshuisstijl-community.git",
18
18
  "directory": "packages/components-css"
19
19
  },
20
- "gitHead": "039361310e53c40ff58339fa60e3a7f483b78544"
20
+ "gitHead": "3a5505a22ea69456e28029a4ebd7e7cbc65d575a"
21
21
  }
package/radio-group/index.scss CHANGED
@@ -3,8 +3,8 @@
3
3
  * Copyright (c) 2021 Community for NL Design System
4
4
  */
5
5
 
6
- @import "./mixin";
6
+ @use "mixin";
7
7
 
8
8
  .rhc-radio-group {
9
- @include rhc-radio-group;
9
+ @include mixin.rhc-radio-group;
10
10
  }
package/skip-link/index.scss CHANGED
@@ -3,10 +3,10 @@
3
3
  * Copyright (c) 2021 Community for NL Design System
4
4
  */
5
5
 
6
- @import "./mixin";
6
+ @use "mixin";
7
7
 
8
8
  .rhc-skip-link {
9
- @include rhc-skip-link;
9
+ @include mixin.rhc-skip-link;
10
10
  }
11
11
 
12
12
  .rhc-skip-link--hidden,
@@ -17,7 +17,7 @@
17
17
 
18
18
  .rhc-skip-link--focus,
19
19
  .rhc-skip-link:focus {
20
- @include rhc-skip-link;
20
+ @include mixin.rhc-skip-link;
21
21
 
22
22
  background-color: var(--utrecht-skip-link-focus-background-color, inherit);
23
23
  border-color: var(--utrecht-skip-link-focus-border-color, inherit);
@@ -34,7 +34,7 @@
34
34
 
35
35
  .rhc-skip-link--focus-visible,
36
36
  .rhc-skip-link:focus-visible {
37
- @include rhc-skip-link;
37
+ @include mixin.rhc-skip-link;
38
38
 
39
39
  outline-color: var(--utrecht-skip-link-focus-visible-outline-color, var(--utrecht-focus-outline-color));
40
40
  outline-offset: var(--utrecht-skip-link-focus-visible-outline-offset, var(--utrecht-focus-outline-offset));
package/toggletip/index.scss CHANGED
@@ -3,46 +3,46 @@
3
3
  * Copyright (c) 2021 Community for NL Design System
4
4
  */
5
5
 
6
- @import "./mixin";
6
+ @use "mixin";
7
7
 
8
8
  .rhc-toggletip {
9
- @include rhc-toggletip;
9
+ @include mixin.rhc-toggletip;
10
10
  }
11
11
 
12
12
  .rhc-toggletip__summary {
13
- @include rhc-toggletip__summary;
13
+ @include mixin.rhc-toggletip__summary;
14
14
  }
15
15
 
16
16
  .rhc-toggletip__button {
17
- @include rhc-toggletip__button;
17
+ @include mixin.rhc-toggletip__button;
18
18
  }
19
19
 
20
20
  .rhc-toggletip__summary .rhc-toggletip__button {
21
21
  // If button is not used standalone the summary should take precedence
22
- @include rhc-toggletip__button--no-pointer-events;
22
+ @include mixin.rhc-toggletip__button--no-pointer-events;
23
23
  }
24
24
 
25
25
  .rhc-toggletip__button:focus {
26
- @include rhc-toggletip--focus;
26
+ @include mixin.rhc-toggletip--focus;
27
27
  }
28
28
 
29
29
  .rhc-toggletip__button:hover {
30
- @include rhc-toggletip--hover;
30
+ @include mixin.rhc-toggletip--hover;
31
31
  }
32
32
 
33
33
  .rhc-toggletip__summary:focus .rhc-toggletip__button {
34
- @include rhc-toggletip--focus;
34
+ @include mixin.rhc-toggletip--focus;
35
35
  }
36
36
 
37
37
  .rhc-toggletip__summary:hover .rhc-toggletip__button {
38
- @include rhc-toggletip--hover;
38
+ @include mixin.rhc-toggletip--hover;
39
39
  }
40
40
 
41
41
  .rhc-toggletip:active .rhc-toggletip__button,
42
42
  .rhc-toggletip[open] .rhc-toggletip__button {
43
- @include rhc-toggletip--active;
43
+ @include mixin.rhc-toggletip--active;
44
44
  }
45
45
 
46
46
  .rhc-toggletip__icon {
47
- @include rhc-toggletip__icon;
47
+ @include mixin.rhc-toggletip__icon;
48
48
  }