mirror of
https://github.com/Tria-plc/emaui.git
synced 2026-08-27 15:30:57 +00:00
205 lines
4.7 KiB
CSS
205 lines
4.7 KiB
CSS
.m_cbb4ea7e {
|
|
--stepper-icon-size-xs: 34px;
|
|
--stepper-icon-size-sm: 36px;
|
|
--stepper-icon-size-md: 42px;
|
|
--stepper-icon-size-lg: 48px;
|
|
--stepper-icon-size-xl: 52px;
|
|
|
|
--stepper-icon-size: var(--stepper-icon-size-md);
|
|
--stepper-color: var(--mantine-primary-color-filled);
|
|
--stepper-content-padding: var(--mantine-spacing-md);
|
|
--stepper-spacing: var(--mantine-spacing-md);
|
|
--stepper-radius: 1000px;
|
|
--stepper-fz: var(--mantine-font-size-md);
|
|
--stepper-outline-thickness: 2px;
|
|
}
|
|
|
|
[data-mantine-color-scheme='light'] .m_cbb4ea7e {
|
|
--stepper-outline-color: var(--mantine-color-gray-2);
|
|
}
|
|
|
|
[data-mantine-color-scheme='dark'] .m_cbb4ea7e {
|
|
--stepper-outline-color: var(--mantine-color-dark-5);
|
|
}
|
|
|
|
.m_aaf89d0b {
|
|
display: flex;
|
|
flex-wrap: nowrap;
|
|
align-items: center;
|
|
}
|
|
|
|
.m_aaf89d0b:where([data-wrap]) {
|
|
flex-wrap: wrap;
|
|
gap: var(--mantine-spacing-md) 0;
|
|
}
|
|
|
|
.m_aaf89d0b:where([data-orientation='vertical']) {
|
|
flex-direction: column;
|
|
}
|
|
|
|
.m_aaf89d0b:where([data-orientation='vertical']):where([data-icon-position='left']) {
|
|
align-items: flex-start;
|
|
}
|
|
|
|
.m_aaf89d0b:where([data-orientation='vertical']):where([data-icon-position='right']) {
|
|
align-items: flex-end;
|
|
}
|
|
|
|
.m_aaf89d0b:where([data-orientation='horizontal']) {
|
|
flex-direction: row;
|
|
}
|
|
|
|
.m_2a371ac9 {
|
|
transition: background-color 150ms ease;
|
|
flex: 1;
|
|
height: var(--stepper-outline-thickness);
|
|
margin-inline: var(--mantine-spacing-md);
|
|
background-color: var(--stepper-outline-color);
|
|
}
|
|
|
|
.m_2a371ac9:where([data-active]) {
|
|
background-color: var(--stepper-color);
|
|
}
|
|
|
|
.m_78da155d {
|
|
padding-top: var(--stepper-content-padding);
|
|
}
|
|
|
|
.m_cbb57068 {
|
|
--step-color: var(--stepper-color);
|
|
|
|
display: flex;
|
|
cursor: default;
|
|
}
|
|
|
|
.m_cbb57068:where([data-allow-click]) {
|
|
cursor: pointer;
|
|
}
|
|
|
|
.m_cbb57068:where([data-icon-position='left']) {
|
|
flex-direction: row;
|
|
}
|
|
|
|
.m_cbb57068:where([data-icon-position='right']) {
|
|
flex-direction: row-reverse;
|
|
}
|
|
|
|
.m_f56b1e2c {
|
|
align-items: center;
|
|
}
|
|
|
|
.m_833edb7e {
|
|
--separator-spacing: calc(var(--mantine-spacing-xs) / 2);
|
|
|
|
justify-content: flex-start;
|
|
min-height: calc(var(--stepper-icon-size) + var(--mantine-spacing-xl) + var(--separator-spacing));
|
|
margin-top: var(--separator-spacing);
|
|
overflow: hidden;
|
|
}
|
|
|
|
.m_833edb7e:where(:first-of-type) {
|
|
margin-top: 0;
|
|
}
|
|
|
|
.m_833edb7e:where(:last-of-type) {
|
|
min-height: auto;
|
|
}
|
|
|
|
.m_833edb7e:where(:last-of-type) .m_6496b3f3 {
|
|
display: none;
|
|
}
|
|
|
|
.m_818e70b {
|
|
position: relative;
|
|
}
|
|
|
|
.m_6496b3f3 {
|
|
top: calc(var(--stepper-icon-size) + var(--separator-spacing));
|
|
inset-inline-start: calc(var(--stepper-icon-size) / 2);
|
|
height: 100vh;
|
|
position: absolute;
|
|
border-inline-start: var(--stepper-outline-thickness) solid var(--stepper-outline-color);
|
|
}
|
|
|
|
.m_6496b3f3:where([data-active]) {
|
|
border-color: var(--stepper-color);
|
|
}
|
|
|
|
.m_1959ad01 {
|
|
height: var(--stepper-icon-size);
|
|
width: var(--stepper-icon-size);
|
|
min-height: var(--stepper-icon-size);
|
|
min-width: var(--stepper-icon-size);
|
|
border-radius: var(--stepper-radius);
|
|
font-size: var(--stepper-fz);
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
position: relative;
|
|
font-weight: bold;
|
|
transition:
|
|
background-color 150ms ease,
|
|
border-color 150ms ease;
|
|
border: var(--stepper-outline-thickness) solid var(--stepper-outline-color);
|
|
background-color: var(--stepper-outline-color);
|
|
}
|
|
|
|
:where([data-mantine-color-scheme='light']) .m_1959ad01 {
|
|
color: var(--mantine-color-gray-7);
|
|
}
|
|
|
|
:where([data-mantine-color-scheme='dark']) .m_1959ad01 {
|
|
color: var(--mantine-color-dark-1);
|
|
}
|
|
|
|
.m_1959ad01:where([data-progress]) {
|
|
border-color: var(--step-color);
|
|
}
|
|
|
|
.m_1959ad01:where([data-completed]) {
|
|
color: var(--stepper-icon-color, var(--mantine-color-white));
|
|
background-color: var(--step-color);
|
|
border-color: var(--step-color);
|
|
}
|
|
|
|
.m_a79331dc {
|
|
position: absolute;
|
|
inset: 0;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
color: var(--stepper-icon-color, var(--mantine-color-white));
|
|
}
|
|
|
|
.m_1956aa2a {
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.m_1956aa2a:where([data-icon-position='left']) {
|
|
margin-inline-start: var(--mantine-spacing-sm);
|
|
}
|
|
|
|
.m_1956aa2a:where([data-icon-position='right']) {
|
|
text-align: right;
|
|
margin-inline-end: var(--mantine-spacing-sm);
|
|
}
|
|
|
|
:where([dir="rtl"]) .m_1956aa2a:where([data-icon-position='right']) {
|
|
text-align: left;
|
|
}
|
|
|
|
.m_12051f6c {
|
|
font-weight: 500;
|
|
font-size: var(--stepper-fz);
|
|
line-height: 1;
|
|
}
|
|
|
|
.m_164eea74 {
|
|
margin-top: calc(var(--stepper-spacing) / 3);
|
|
margin-bottom: calc(var(--stepper-spacing) / 3);
|
|
font-size: calc(var(--stepper-fz) - calc(0.125rem * var(--mantine-scale)));
|
|
line-height: 1;
|
|
color: var(--mantine-color-dimmed);
|
|
}
|