@muraldevkit/ui-toolkit 4.39.1 → 4.40.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.
- package/dist/components/breadcrumb/MrlBreadcrumbItem/MrlBreadcrumbItem.d.ts +44 -0
- package/dist/components/breadcrumb/MrlBreadcrumbItem/index.d.ts +1 -0
- package/dist/components/breadcrumb/MrlBreadcrumbSeparator/MrlBreadcrumbSeparator.d.ts +7 -0
- package/dist/components/breadcrumb/MrlBreadcrumbSeparator/index.d.ts +1 -0
- package/dist/components/breadcrumb/MrlBreadcrumbs/MrlBreadcrumbs.d.ts +29 -0
- package/dist/components/breadcrumb/MrlBreadcrumbs/index.d.ts +1 -0
- package/dist/components/breadcrumb/index.d.ts +3 -0
- package/dist/components/index.d.ts +1 -0
- package/dist/components/svg/config.d.ts +1 -1
- package/dist/index.js +1 -1
- package/dist/styles/MrlBreadcrumbItem/module.scss +41 -0
- package/dist/styles/MrlBreadcrumbs/module.scss +7 -0
- package/dist/styles.css +2 -0
- package/package.json +1 -1
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
@use '@muraldevkit/ds-foundation/src/styles/_mixins' as *;
|
|
2
|
+
.MrlBreadcrumbItem {
|
|
3
|
+
align-items: center;
|
|
4
|
+
color: var(--mrl-color-text);
|
|
5
|
+
display: inline-flex;
|
|
6
|
+
font-size: var(--mrl-font-size-02);
|
|
7
|
+
font-weight: var(--mrl-font-weight-02);
|
|
8
|
+
line-height: var(--mrl-line-height-06);
|
|
9
|
+
min-height: var(--mrl-spacing-05);
|
|
10
|
+
&:hover {
|
|
11
|
+
color: var(--mrl-color-text-hover);
|
|
12
|
+
}
|
|
13
|
+
&--selected {
|
|
14
|
+
color: var(--mrl-color-text-selected);
|
|
15
|
+
font-weight: var(--mrl-font-weight-04);
|
|
16
|
+
}
|
|
17
|
+
a {
|
|
18
|
+
@include mrl-focus;
|
|
19
|
+
color: var(--mrl-color-text);
|
|
20
|
+
padding-right: var(--mrl-spacing-01);
|
|
21
|
+
text-decoration: none;
|
|
22
|
+
&:focus-visible::after {
|
|
23
|
+
border-radius: var(--mrl-radii-03);
|
|
24
|
+
}
|
|
25
|
+
&:hover {
|
|
26
|
+
color: var(--mrl-color-text-hover);
|
|
27
|
+
}
|
|
28
|
+
&--active {
|
|
29
|
+
color: var(--mrl-color-text-selected);
|
|
30
|
+
font-weight: var(--mrl-font-weight-04);
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
&--icon,
|
|
34
|
+
&--separator {
|
|
35
|
+
align-items: center;
|
|
36
|
+
color: var(--mrl-color-text);
|
|
37
|
+
height: 0.75rem;
|
|
38
|
+
margin: 0 var(--mrl-spacing-01);
|
|
39
|
+
width: 0.75rem;
|
|
40
|
+
}
|
|
41
|
+
}
|
package/dist/styles.css
CHANGED
|
@@ -95,3 +95,5 @@
|
|
|
95
95
|
.MrlToolbarButtonIcon--Oetsi{margin-right:var(--mrl-spacing-03)}
|
|
96
96
|
.mrl-u-focus-wrapper--f4yRC{position:relative}.MrlFilterItem--qYLqp{align-items:center;background-color:var(--mrl-color-background-decorative);border-radius:var(--mrl-border-radius-rounded);color:rgba(var(--mrl-gray-100), 1);display:flex;font-family:var(--mrl-body-font);font-size:var(--mrl-font-size-02);font-weight:var(--mrl-font-weight-04);gap:var(--mrl-spacing-02);height:var(--mrl-spacing-08);justify-content:center;line-height:var(--mrl-line-height-06);min-width:3.5rem;outline-color:rgba(0,0,0,0);padding:var(--mrl-spacing-03) var(--mrl-spacing-04);text-align:center;transition:outline-color var(--mrl-duration-04) var(--mrl-timing-m2),background-color var(--mrl-duration-04) var(--mrl-timing-m2),color var(--mrl-duration-04) var(--mrl-timing-m2)}.MrlFilterItem--qYLqp .MrlBadge{border-radius:var(--mrl-border-radius-rounded);color:rgba(var(--mrl-gray-100), 1);font-size:.625rem;font-weight:var(--mrl-font-weight-04);height:var(--mrl-spacing-05);line-height:var(--mrl-line-height-02);padding:var(--mrl-spacing-01) var(--mrl-spacing-02);transition:outline-color var(--mrl-duration-04) var(--mrl-timing-m2),background-color var(--mrl-duration-04) var(--mrl-timing-m2),color var(--mrl-duration-04) var(--mrl-timing-m2)}.MrlFilterItem--qYLqp:focus-within{outline:var(--mrl-line-width-focus) solid var(--mrl-color-focus);outline-offset:var(--mrl-space-offset-focus)}.MrlFilterItem--qYLqp:hover{background-color:var(--mrl-color-background-highlight-emph-active);cursor:pointer}.MrlFilterItem--qYLqp[aria-checked=true]{background-color:var(--mrl-color-background-inverse);color:var(--mrl-color-text-inverse-selected)}.MrlFilterItem--qYLqp[aria-checked=true] .MrlBadge{background-color:var(--mrl-color-background);color:rgba(var(--mrl-gray-100), 1)}.MrlFilterItem-has-count--sHcsy{padding-right:var(--mrl-spacing-03)}
|
|
97
97
|
.MrlFilter--f_g2l{display:flex;gap:var(--mrl-spacing-02);margin:var(--mrl-spacing-05) 0}
|
|
98
|
+
.mrl-u-focus-wrapper--XoJ1A{position:relative}.MrlBreadcrumbItem--Yocns{align-items:center;color:var(--mrl-color-text);display:inline-flex;font-size:var(--mrl-font-size-02);font-weight:var(--mrl-font-weight-02);line-height:var(--mrl-line-height-06);min-height:var(--mrl-spacing-05)}.MrlBreadcrumbItem--Yocns:hover{color:var(--mrl-color-text-hover)}.MrlBreadcrumbItem--selected--qSXAB{color:var(--mrl-color-text-selected);font-weight:var(--mrl-font-weight-04)}.MrlBreadcrumbItem--Yocns a{position:relative;color:var(--mrl-color-text);padding-right:var(--mrl-spacing-01);text-decoration:none}.MrlBreadcrumbItem--Yocns a:focus-visible{outline:none}.MrlBreadcrumbItem--Yocns a:focus-visible::after{animation-duration:var(--mrl-duration-03);animation-fill-mode:forwards;animation-iteration-count:1;animation-name:border-animation--FcROj;animation-timing-function:var(--mrl-timing-m2);border:var(--mrl-line-width-focus) solid rgba(0,0,0,0);border-radius:calc(var(--mrl-border-radius-functional) + var(--mrl-line-width-focus) + var(--mrl-space-offset-focus));bottom:calc((var(--mrl-space-offset-focus) + var(--mrl-line-width-focus) + 0px)*-1);content:"";display:block;left:calc((var(--mrl-space-offset-focus) + var(--mrl-line-width-focus) + 0px)*-1);position:absolute;right:calc((var(--mrl-space-offset-focus) + var(--mrl-line-width-focus) + 0px)*-1);top:calc((var(--mrl-space-offset-focus) + var(--mrl-line-width-focus) + 0px)*-1);z-index:1}@keyframes border-animation--FcROj{0%{border-color:rgba(0,0,0,0)}100%{border-color:var(--mrl-color-focus)}}@keyframes border-animation-inverse--OTg0y{0%{border-color:rgba(0,0,0,0)}100%{border-color:var(--mrl-color-focus-inverse)}}.MrlBreadcrumbItem--Yocns a:focus-visible::after{border-radius:var(--mrl-radii-03)}.MrlBreadcrumbItem--Yocns a:hover{color:var(--mrl-color-text-hover)}.MrlBreadcrumbItem--Yocns a--active{color:var(--mrl-color-text-selected);font-weight:var(--mrl-font-weight-04)}.MrlBreadcrumbItem--icon--gXFtv,.MrlBreadcrumbItem--separator--TqMuV{align-items:center;color:var(--mrl-color-text);height:.75rem;margin:0 var(--mrl-spacing-01);width:.75rem}
|
|
99
|
+
.MrlBreadcrumbs--list--ap5b9{align-items:center;display:flex;justify-items:flex-start}
|