2022-01-13 13:00:31 +00:00
|
|
|
/*!
|
2023-12-19 14:36:33 +00:00
|
|
|
* # Fomantic-UI 2.9.3 - Step
|
2023-08-17 09:47:40 +00:00
|
|
|
* https://github.com/fomantic/Fomantic-UI/
|
2022-01-13 13:00:31 +00:00
|
|
|
*
|
|
|
|
*
|
|
|
|
* Released under the MIT license
|
2023-08-17 09:47:40 +00:00
|
|
|
* https://opensource.org/licenses/MIT
|
2022-01-13 13:00:31 +00:00
|
|
|
*
|
|
|
|
*/
|
|
|
|
|
|
|
|
|
|
|
|
/*******************************
|
|
|
|
Plural
|
|
|
|
*******************************/
|
|
|
|
|
|
|
|
.ui.steps {
|
|
|
|
display: inline-flex;
|
2023-08-17 09:47:40 +00:00
|
|
|
flex-direction: row;
|
|
|
|
align-items: stretch;
|
2022-01-13 13:00:31 +00:00
|
|
|
margin: 1em 0;
|
2023-08-17 09:47:40 +00:00
|
|
|
background: "";
|
|
|
|
box-shadow: none;
|
2022-01-13 13:00:31 +00:00
|
|
|
line-height: 1.14285714em;
|
|
|
|
border-radius: 0.28571429rem;
|
|
|
|
border: 1px solid rgba(34, 36, 38, 0.15);
|
|
|
|
}
|
|
|
|
.ui.steps:not(.unstackable) {
|
2023-08-17 09:47:40 +00:00
|
|
|
flex-wrap: wrap;
|
2022-01-13 13:00:31 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
/* First Steps */
|
|
|
|
.ui.steps:first-child {
|
|
|
|
margin-top: 0;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Last Steps */
|
|
|
|
.ui.steps:last-child {
|
|
|
|
margin-bottom: 0;
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/*******************************
|
|
|
|
Singular
|
|
|
|
*******************************/
|
|
|
|
|
|
|
|
.ui.steps .step {
|
|
|
|
position: relative;
|
|
|
|
display: flex;
|
2023-08-17 09:47:40 +00:00
|
|
|
flex: 1 0 auto;
|
|
|
|
flex-flow: row wrap;
|
2022-01-13 13:00:31 +00:00
|
|
|
vertical-align: middle;
|
2023-08-17 09:47:40 +00:00
|
|
|
align-items: center;
|
|
|
|
justify-content: center;
|
2022-01-13 13:00:31 +00:00
|
|
|
margin: 0 0;
|
|
|
|
padding: 1.14285714em 2em;
|
2023-08-17 09:47:40 +00:00
|
|
|
background: #fff;
|
2022-01-13 13:00:31 +00:00
|
|
|
color: rgba(0, 0, 0, 0.87);
|
2023-08-17 09:47:40 +00:00
|
|
|
box-shadow: none;
|
2022-01-13 13:00:31 +00:00
|
|
|
border-radius: 0;
|
|
|
|
border: none;
|
|
|
|
border-right: 1px solid rgba(34, 36, 38, 0.15);
|
|
|
|
transition: background-color 0.1s ease, opacity 0.1s ease, color 0.1s ease, box-shadow 0.1s ease;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Arrow */
|
2022-06-08 10:36:39 +00:00
|
|
|
.ui.steps .step::after {
|
2022-01-13 13:00:31 +00:00
|
|
|
display: none;
|
|
|
|
position: absolute;
|
|
|
|
z-index: 2;
|
2023-08-17 09:47:40 +00:00
|
|
|
content: "";
|
2022-01-13 13:00:31 +00:00
|
|
|
top: 50%;
|
|
|
|
right: 0;
|
2023-08-17 09:47:40 +00:00
|
|
|
background-color: #fff;
|
2022-01-13 13:00:31 +00:00
|
|
|
width: 1.14285714em;
|
|
|
|
height: 1.14285714em;
|
|
|
|
border-style: solid;
|
|
|
|
border-color: rgba(34, 36, 38, 0.15);
|
|
|
|
border-width: 0 1px 1px 0;
|
|
|
|
transition: background-color 0.1s ease, opacity 0.1s ease, color 0.1s ease, box-shadow 0.1s ease;
|
2023-08-17 09:47:40 +00:00
|
|
|
transform: translateY(-50%) translateX(50%) rotate(-45deg);
|
2022-01-13 13:00:31 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
/* First Step */
|
|
|
|
.ui.steps .step:first-child {
|
|
|
|
padding-left: 2em;
|
|
|
|
border-radius: 0.28571429rem 0 0 0.28571429rem;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Last Step */
|
|
|
|
.ui.steps .step:last-child {
|
|
|
|
border-radius: 0 0.28571429rem 0.28571429rem 0;
|
|
|
|
border-right: none;
|
|
|
|
margin-right: 0;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Only Step */
|
|
|
|
.ui.steps .step:only-child {
|
|
|
|
border-radius: 0.28571429rem;
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/*******************************
|
|
|
|
Content
|
|
|
|
*******************************/
|
|
|
|
|
|
|
|
|
|
|
|
/* Title */
|
|
|
|
.ui.steps .step .title {
|
2023-08-17 09:47:40 +00:00
|
|
|
font-family: "Lato", system-ui, -apple-system, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
|
2022-01-13 13:00:31 +00:00
|
|
|
font-size: 1.14285714em;
|
|
|
|
font-weight: bold;
|
|
|
|
}
|
|
|
|
.ui.steps .step > .title {
|
|
|
|
width: 100%;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Description */
|
|
|
|
.ui.steps .step .description {
|
|
|
|
font-weight: normal;
|
|
|
|
font-size: 0.92857143em;
|
|
|
|
color: rgba(0, 0, 0, 0.87);
|
|
|
|
}
|
|
|
|
.ui.steps .step > .description {
|
|
|
|
width: 100%;
|
|
|
|
}
|
|
|
|
.ui.steps .step .title ~ .description {
|
|
|
|
margin-top: 0.25em;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Icon */
|
|
|
|
.ui.steps .step > i.icon {
|
|
|
|
line-height: 1;
|
|
|
|
font-size: 2.5em;
|
|
|
|
margin: 0 1rem 0 0;
|
|
|
|
}
|
|
|
|
.ui.steps .step > i.icon,
|
|
|
|
.ui.steps .step > i.icon ~ .content {
|
|
|
|
display: block;
|
2023-08-17 09:47:40 +00:00
|
|
|
flex: 0 1 auto;
|
|
|
|
align-self: center;
|
2022-01-13 13:00:31 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
/* Horizontal Icon */
|
|
|
|
.ui.steps:not(.vertical) .step > i.icon {
|
|
|
|
width: auto;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Link */
|
|
|
|
.ui.steps .link.step,
|
|
|
|
.ui.steps a.step {
|
|
|
|
cursor: pointer;
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/*******************************
|
|
|
|
Types
|
|
|
|
*******************************/
|
|
|
|
|
|
|
|
|
2023-08-17 09:47:40 +00:00
|
|
|
/* --------------
|
|
|
|
Ordered
|
|
|
|
--------------- */
|
2022-01-13 13:00:31 +00:00
|
|
|
.ui.ordered.steps {
|
|
|
|
counter-reset: ordered;
|
|
|
|
}
|
2022-06-08 10:36:39 +00:00
|
|
|
.ui.ordered.steps .step::before {
|
2022-01-13 13:00:31 +00:00
|
|
|
display: block;
|
|
|
|
position: static;
|
|
|
|
text-align: center;
|
|
|
|
content: counter(ordered);
|
2023-08-17 09:47:40 +00:00
|
|
|
align-self: center;
|
2022-01-13 13:00:31 +00:00
|
|
|
margin-right: 1rem;
|
|
|
|
font-size: 2.5em;
|
|
|
|
counter-increment: ordered;
|
|
|
|
font-family: inherit;
|
|
|
|
font-weight: bold;
|
|
|
|
}
|
|
|
|
.ui.ordered.steps .step > * {
|
|
|
|
display: block;
|
2023-08-17 09:47:40 +00:00
|
|
|
align-self: center;
|
2022-01-13 13:00:31 +00:00
|
|
|
}
|
|
|
|
|
2023-08-17 09:47:40 +00:00
|
|
|
/* --------------
|
|
|
|
Vertical
|
|
|
|
--------------- */
|
2022-01-13 13:00:31 +00:00
|
|
|
.ui.vertical.steps {
|
|
|
|
display: inline-flex;
|
2023-08-17 09:47:40 +00:00
|
|
|
flex-direction: column;
|
2022-01-13 13:00:31 +00:00
|
|
|
overflow: visible;
|
|
|
|
}
|
|
|
|
.ui.vertical.steps .step {
|
2023-08-17 09:47:40 +00:00
|
|
|
justify-content: flex-start;
|
2022-01-13 13:00:31 +00:00
|
|
|
border-radius: 0;
|
|
|
|
padding: 1.14285714em 2em;
|
|
|
|
border-right: none;
|
|
|
|
border-bottom: 1px solid rgba(34, 36, 38, 0.15);
|
|
|
|
}
|
|
|
|
.ui.vertical.steps .step:first-child {
|
|
|
|
padding: 1.14285714em 2em;
|
|
|
|
border-radius: 0.28571429rem 0.28571429rem 0 0;
|
|
|
|
}
|
|
|
|
.ui.vertical.steps .step:last-child {
|
|
|
|
border-bottom: none;
|
|
|
|
border-radius: 0 0 0.28571429rem 0.28571429rem;
|
|
|
|
}
|
|
|
|
.ui.vertical.steps .step:only-child {
|
|
|
|
border-radius: 0.28571429rem;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Arrow */
|
2022-06-08 10:36:39 +00:00
|
|
|
.ui.vertical.steps .step::after {
|
2022-01-13 13:00:31 +00:00
|
|
|
top: 50%;
|
|
|
|
right: 0;
|
|
|
|
border-width: 0 1px 1px 0;
|
|
|
|
display: none;
|
|
|
|
}
|
2022-06-08 10:36:39 +00:00
|
|
|
.ui.right.vertical.steps .step::after {
|
2022-01-13 13:00:31 +00:00
|
|
|
border-width: 1px 0 0 1px;
|
|
|
|
left: 0;
|
|
|
|
right: 100%;
|
2023-08-17 09:47:40 +00:00
|
|
|
transform: translateY(-50%) translateX(-50%) rotate(-45deg);
|
2022-01-13 13:00:31 +00:00
|
|
|
}
|
2022-06-08 10:36:39 +00:00
|
|
|
.ui.vertical.steps .active.step::after {
|
2022-01-13 13:00:31 +00:00
|
|
|
display: block;
|
|
|
|
}
|
2022-06-08 10:36:39 +00:00
|
|
|
.ui.vertical.steps .step:last-child::after {
|
2022-01-13 13:00:31 +00:00
|
|
|
display: none;
|
|
|
|
}
|
2022-06-08 10:36:39 +00:00
|
|
|
.ui.vertical.steps .active.step:last-child::after {
|
2022-01-13 13:00:31 +00:00
|
|
|
display: block;
|
|
|
|
}
|
|
|
|
|
2023-08-17 09:47:40 +00:00
|
|
|
/* ---------------
|
2022-01-13 13:00:31 +00:00
|
|
|
Responsive
|
2023-08-17 09:47:40 +00:00
|
|
|
---------------- */
|
2022-01-13 13:00:31 +00:00
|
|
|
|
|
|
|
/* Mobile (Default) */
|
|
|
|
@media only screen and (max-width: 767.98px) {
|
|
|
|
.ui.steps:not(.unstackable) {
|
|
|
|
display: inline-flex;
|
|
|
|
overflow: visible;
|
2023-08-17 09:47:40 +00:00
|
|
|
flex-direction: column;
|
2022-01-13 13:00:31 +00:00
|
|
|
}
|
|
|
|
.ui.steps:not(.unstackable) .step {
|
|
|
|
width: 100% !important;
|
2023-08-17 09:47:40 +00:00
|
|
|
flex-direction: column;
|
2022-01-13 13:00:31 +00:00
|
|
|
border-radius: 0;
|
|
|
|
padding: 1.14285714em 2em;
|
|
|
|
border-right: none;
|
|
|
|
border-bottom: 1px solid rgba(34, 36, 38, 0.15);
|
|
|
|
}
|
|
|
|
.ui.steps:not(.unstackable) .step:first-child {
|
|
|
|
padding: 1.14285714em 2em;
|
|
|
|
border-radius: 0.28571429rem 0.28571429rem 0 0;
|
|
|
|
}
|
|
|
|
.ui.steps:not(.unstackable) .step:last-child {
|
|
|
|
border-radius: 0 0 0.28571429rem 0.28571429rem;
|
|
|
|
border-bottom: none;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Arrow */
|
2022-06-08 10:36:39 +00:00
|
|
|
.ui.steps:not(.unstackable) .step::after {
|
2022-01-13 13:00:31 +00:00
|
|
|
top: unset;
|
|
|
|
bottom: -1.14285714em;
|
|
|
|
right: 50%;
|
2023-08-17 09:47:40 +00:00
|
|
|
transform: translateY(-50%) translateX(50%) rotate(45deg);
|
2022-01-13 13:00:31 +00:00
|
|
|
}
|
2022-06-08 10:36:39 +00:00
|
|
|
.ui.vertical.steps .active.step:last-child::after {
|
2022-01-13 13:00:31 +00:00
|
|
|
display: none;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Content */
|
|
|
|
.ui.steps:not(.unstackable) .step .content {
|
|
|
|
text-align: center;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Icon */
|
|
|
|
.ui.steps:not(.unstackable) .step > i.icon,
|
2022-06-08 10:36:39 +00:00
|
|
|
.ui.ordered.steps:not(.unstackable) .step::before {
|
2022-01-13 13:00:31 +00:00
|
|
|
margin: 0 0 1rem 0;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/*******************************
|
|
|
|
States
|
|
|
|
*******************************/
|
|
|
|
|
|
|
|
|
|
|
|
/* Link Hover */
|
|
|
|
.ui.steps .link.step:hover::after,
|
|
|
|
.ui.steps .link.step:hover,
|
|
|
|
.ui.steps a.step:hover::after,
|
|
|
|
.ui.steps a.step:hover {
|
2023-08-17 09:47:40 +00:00
|
|
|
background: #f9fafb;
|
2022-01-13 13:00:31 +00:00
|
|
|
color: rgba(0, 0, 0, 0.8);
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Link Down */
|
|
|
|
.ui.steps .link.step:active::after,
|
|
|
|
.ui.steps .link.step:active,
|
|
|
|
.ui.steps a.step:active::after,
|
|
|
|
.ui.steps a.step:active {
|
2023-08-17 09:47:40 +00:00
|
|
|
background: #f3f4f5;
|
2022-01-13 13:00:31 +00:00
|
|
|
color: rgba(0, 0, 0, 0.9);
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Active */
|
|
|
|
.ui.steps .step.active {
|
|
|
|
cursor: auto;
|
2023-08-17 09:47:40 +00:00
|
|
|
background: #f3f4f5;
|
2022-01-13 13:00:31 +00:00
|
|
|
}
|
2022-06-08 10:36:39 +00:00
|
|
|
.ui.steps .step.active::after {
|
2023-08-17 09:47:40 +00:00
|
|
|
background: #f3f4f5;
|
2022-01-13 13:00:31 +00:00
|
|
|
}
|
|
|
|
.ui.steps .step.active .title {
|
2023-08-17 09:47:40 +00:00
|
|
|
color: #4183c4;
|
2022-01-13 13:00:31 +00:00
|
|
|
}
|
2022-06-08 10:36:39 +00:00
|
|
|
.ui.ordered.steps .step.active::before,
|
2022-01-13 13:00:31 +00:00
|
|
|
.ui.steps .active.step i.icon {
|
|
|
|
color: rgba(0, 0, 0, 0.85);
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Active Arrow */
|
2022-06-08 10:36:39 +00:00
|
|
|
.ui.steps .step::after {
|
2022-01-13 13:00:31 +00:00
|
|
|
display: block;
|
|
|
|
}
|
2022-06-08 10:36:39 +00:00
|
|
|
.ui.steps .active.step::after {
|
2022-01-13 13:00:31 +00:00
|
|
|
display: block;
|
|
|
|
}
|
2022-06-08 10:36:39 +00:00
|
|
|
.ui.steps .step:last-child::after {
|
2022-01-13 13:00:31 +00:00
|
|
|
display: none;
|
|
|
|
}
|
2022-06-08 10:36:39 +00:00
|
|
|
.ui.steps .active.step:last-child::after {
|
2022-01-13 13:00:31 +00:00
|
|
|
display: none;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Active Hover */
|
|
|
|
.ui.steps .link.active.step:hover::after,
|
|
|
|
.ui.steps .link.active.step:hover,
|
|
|
|
.ui.steps a.active.step:hover::after,
|
|
|
|
.ui.steps a.active.step:hover {
|
|
|
|
cursor: pointer;
|
2023-08-17 09:47:40 +00:00
|
|
|
background: #dcddde;
|
2022-01-13 13:00:31 +00:00
|
|
|
color: rgba(0, 0, 0, 0.87);
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Completed */
|
2022-06-08 10:36:39 +00:00
|
|
|
.ui.steps .step.completed > i.icon::before,
|
|
|
|
.ui.ordered.steps .step.completed::before {
|
2023-08-17 09:47:40 +00:00
|
|
|
color: #21ba45;
|
2022-01-13 13:00:31 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
/* Disabled */
|
|
|
|
.ui.steps .disabled.step {
|
|
|
|
cursor: auto;
|
2023-08-17 09:47:40 +00:00
|
|
|
background: #fff;
|
2022-01-13 13:00:31 +00:00
|
|
|
pointer-events: none;
|
|
|
|
}
|
|
|
|
.ui.steps .disabled.step,
|
|
|
|
.ui.steps .disabled.step .title,
|
|
|
|
.ui.steps .disabled.step .description {
|
|
|
|
color: rgba(40, 40, 40, 0.3);
|
|
|
|
}
|
2022-06-08 10:36:39 +00:00
|
|
|
.ui.steps .disabled.step::after {
|
2023-08-17 09:47:40 +00:00
|
|
|
background: #fff;
|
2022-01-13 13:00:31 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/*******************************
|
|
|
|
Variations
|
|
|
|
*******************************/
|
|
|
|
|
|
|
|
|
2023-08-17 09:47:40 +00:00
|
|
|
/* --------------
|
|
|
|
Stackable
|
|
|
|
--------------- */
|
2022-01-13 13:00:31 +00:00
|
|
|
|
|
|
|
/* Tablet Or Below */
|
|
|
|
@media only screen and (max-width: 991.98px) {
|
|
|
|
.ui[class*="tablet stackable"].steps {
|
|
|
|
display: inline-flex;
|
|
|
|
overflow: visible;
|
2023-08-17 09:47:40 +00:00
|
|
|
flex-direction: column;
|
2022-01-13 13:00:31 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
/* Steps */
|
|
|
|
.ui[class*="tablet stackable"].steps .step {
|
2023-08-17 09:47:40 +00:00
|
|
|
flex-direction: column;
|
2022-01-13 13:00:31 +00:00
|
|
|
border-radius: 0;
|
|
|
|
padding: 1.14285714em 2em;
|
|
|
|
border-right: none;
|
|
|
|
border-bottom: 1px solid rgba(34, 36, 38, 0.15);
|
|
|
|
}
|
|
|
|
.ui[class*="tablet stackable"].steps .step:first-child {
|
|
|
|
padding: 1.14285714em 2em;
|
|
|
|
border-radius: 0.28571429rem 0.28571429rem 0 0;
|
|
|
|
}
|
|
|
|
.ui[class*="tablet stackable"].steps .step:last-child {
|
|
|
|
border-radius: 0 0 0.28571429rem 0.28571429rem;
|
|
|
|
border-bottom: none;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Arrow */
|
2022-06-08 10:36:39 +00:00
|
|
|
.ui[class*="tablet stackable"].steps .step::after {
|
2022-01-13 13:00:31 +00:00
|
|
|
top: unset;
|
|
|
|
bottom: -1.14285714em;
|
|
|
|
right: 50%;
|
2023-08-17 09:47:40 +00:00
|
|
|
transform: translateY(-50%) translateX(50%) rotate(45deg);
|
2022-01-13 13:00:31 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
/* Content */
|
|
|
|
.ui[class*="tablet stackable"].steps .step .content {
|
|
|
|
text-align: center;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Icon */
|
|
|
|
.ui[class*="tablet stackable"].steps .step > i.icon,
|
2022-06-08 10:36:39 +00:00
|
|
|
.ui[class*="tablet stackable"].ordered.steps .step::before {
|
2022-01-13 13:00:31 +00:00
|
|
|
margin: 0 0 1rem 0;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2023-08-17 09:47:40 +00:00
|
|
|
/* --------------
|
|
|
|
Fluid
|
|
|
|
--------------- */
|
2022-01-13 13:00:31 +00:00
|
|
|
|
|
|
|
/* Fluid */
|
|
|
|
.ui.fluid.steps {
|
|
|
|
display: flex;
|
|
|
|
width: 100%;
|
|
|
|
}
|
|
|
|
|
2023-08-17 09:47:40 +00:00
|
|
|
/* --------------
|
|
|
|
Attached
|
|
|
|
--------------- */
|
2022-01-13 13:00:31 +00:00
|
|
|
|
|
|
|
/* Top */
|
|
|
|
.ui.attached.steps {
|
|
|
|
width: calc(100% + 2px) !important;
|
|
|
|
margin: 0 -1px 0;
|
|
|
|
max-width: calc(100% + 2px);
|
|
|
|
border-radius: 0.28571429rem 0.28571429rem 0 0;
|
|
|
|
}
|
|
|
|
.ui.attached.steps .step:first-child {
|
|
|
|
border-radius: 0.28571429rem 0 0 0;
|
|
|
|
}
|
|
|
|
.ui.attached.steps .step:last-child {
|
|
|
|
border-radius: 0 0.28571429rem 0 0;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Bottom */
|
|
|
|
.ui.bottom.attached.steps {
|
|
|
|
margin: 0 -1px 0;
|
|
|
|
border-radius: 0 0 0.28571429rem 0.28571429rem;
|
|
|
|
}
|
|
|
|
.ui.bottom.attached.steps .step:first-child {
|
|
|
|
border-radius: 0 0 0 0.28571429rem;
|
|
|
|
}
|
|
|
|
.ui.bottom.attached.steps .step:last-child {
|
|
|
|
border-radius: 0 0 0.28571429rem 0;
|
|
|
|
}
|
|
|
|
|
2023-08-17 09:47:40 +00:00
|
|
|
/* -------------------
|
|
|
|
Evenly Divided
|
|
|
|
-------------------- */
|
2022-01-13 13:00:31 +00:00
|
|
|
.ui.one.steps,
|
|
|
|
.ui.two.steps,
|
|
|
|
.ui.three.steps,
|
|
|
|
.ui.four.steps,
|
|
|
|
.ui.five.steps,
|
|
|
|
.ui.six.steps,
|
|
|
|
.ui.seven.steps,
|
|
|
|
.ui.eight.steps {
|
|
|
|
width: 100%;
|
|
|
|
}
|
|
|
|
.ui.one.steps > .step,
|
|
|
|
.ui.two.steps > .step,
|
|
|
|
.ui.three.steps > .step,
|
|
|
|
.ui.four.steps > .step,
|
|
|
|
.ui.five.steps > .step,
|
|
|
|
.ui.six.steps > .step,
|
|
|
|
.ui.seven.steps > .step,
|
|
|
|
.ui.eight.steps > .step {
|
2023-08-17 09:47:40 +00:00
|
|
|
flex-wrap: nowrap;
|
2022-01-13 13:00:31 +00:00
|
|
|
}
|
|
|
|
.ui.one.steps > .step {
|
|
|
|
width: 100%;
|
|
|
|
}
|
|
|
|
.ui.two.steps > .step {
|
|
|
|
width: 50%;
|
|
|
|
}
|
|
|
|
.ui.three.steps > .step {
|
|
|
|
width: 33.333%;
|
|
|
|
}
|
|
|
|
.ui.four.steps > .step {
|
|
|
|
width: 25%;
|
|
|
|
}
|
|
|
|
.ui.five.steps > .step {
|
|
|
|
width: 20%;
|
|
|
|
}
|
|
|
|
.ui.six.steps > .step {
|
|
|
|
width: 16.666%;
|
|
|
|
}
|
|
|
|
.ui.seven.steps > .step {
|
|
|
|
width: 14.285%;
|
|
|
|
}
|
|
|
|
.ui.eight.steps > .step {
|
|
|
|
width: 12.5%;
|
|
|
|
}
|
|
|
|
|
2023-08-17 09:47:40 +00:00
|
|
|
/* -------------------
|
2022-01-13 13:00:31 +00:00
|
|
|
Sizes
|
2023-08-17 09:47:40 +00:00
|
|
|
-------------------- */
|
2022-01-13 13:00:31 +00:00
|
|
|
.ui.steps .step,
|
|
|
|
.ui.step {
|
|
|
|
font-size: 1rem;
|
|
|
|
}
|
|
|
|
.ui.mini.steps .step,
|
|
|
|
.ui.mini.step {
|
|
|
|
font-size: 0.78571429rem;
|
|
|
|
}
|
|
|
|
.ui.tiny.steps .step,
|
|
|
|
.ui.tiny.step {
|
|
|
|
font-size: 0.85714286rem;
|
|
|
|
}
|
|
|
|
.ui.small.steps .step,
|
|
|
|
.ui.small.step {
|
|
|
|
font-size: 0.92857143rem;
|
|
|
|
}
|
|
|
|
.ui.large.steps .step,
|
|
|
|
.ui.large.step {
|
|
|
|
font-size: 1.14285714rem;
|
|
|
|
}
|
|
|
|
.ui.big.steps .step,
|
|
|
|
.ui.big.step {
|
|
|
|
font-size: 1.28571429rem;
|
|
|
|
}
|
|
|
|
.ui.huge.steps .step,
|
|
|
|
.ui.huge.step {
|
|
|
|
font-size: 1.42857143rem;
|
|
|
|
}
|
|
|
|
.ui.massive.steps .step,
|
|
|
|
.ui.massive.step {
|
|
|
|
font-size: 1.71428571rem;
|
|
|
|
}
|
|
|
|
|
2023-08-17 09:47:40 +00:00
|
|
|
/* --------------
|
|
|
|
Inverted
|
|
|
|
--------------- */
|
2022-01-13 13:00:31 +00:00
|
|
|
.ui.inverted.steps {
|
2023-08-17 09:47:40 +00:00
|
|
|
border: 1px solid #555;
|
2022-01-13 13:00:31 +00:00
|
|
|
}
|
|
|
|
.ui.inverted.steps .step {
|
|
|
|
color: rgba(255, 255, 255, 0.9);
|
2023-08-17 09:47:40 +00:00
|
|
|
background: #1b1c1d;
|
|
|
|
border-color: #555;
|
2022-01-13 13:00:31 +00:00
|
|
|
}
|
2022-06-08 10:36:39 +00:00
|
|
|
.ui.inverted.steps .step::after {
|
2023-08-17 09:47:40 +00:00
|
|
|
background-color: #1b1c1d;
|
|
|
|
border-color: #555;
|
2022-01-13 13:00:31 +00:00
|
|
|
}
|
|
|
|
.ui.inverted.steps .step .description {
|
|
|
|
color: rgba(255, 255, 255, 0.9);
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Active */
|
|
|
|
.ui.inverted.steps .step.active,
|
2022-06-08 10:36:39 +00:00
|
|
|
.ui.inverted.steps .step.active::after {
|
2023-08-17 09:47:40 +00:00
|
|
|
background: #333;
|
2022-01-13 13:00:31 +00:00
|
|
|
}
|
2022-06-08 10:36:39 +00:00
|
|
|
.ui.inverted.ordered.steps .step.active::before,
|
2022-01-13 13:00:31 +00:00
|
|
|
.ui.inverted.steps .active.step i.icon {
|
|
|
|
color: #ffffff;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Disabled */
|
|
|
|
.ui.inverted.steps .disabled.step,
|
2022-06-08 10:36:39 +00:00
|
|
|
.ui.inverted.steps .disabled.step::after {
|
2023-08-17 09:47:40 +00:00
|
|
|
background: #222;
|
2022-01-13 13:00:31 +00:00
|
|
|
}
|
|
|
|
.ui.inverted.steps .disabled.step,
|
|
|
|
.ui.inverted.steps .disabled.step .title,
|
|
|
|
.ui.inverted.steps .disabled.step .description {
|
|
|
|
color: rgba(225, 225, 225, 0.3);
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Link Hover */
|
|
|
|
.ui.inverted.steps .link.step:hover::after,
|
|
|
|
.ui.inverted.steps .link.step:hover,
|
|
|
|
.ui.inverted.steps a.step:hover::after,
|
|
|
|
.ui.inverted.steps a.step:hover {
|
2023-08-17 09:47:40 +00:00
|
|
|
background: #3f3f3f;
|
2022-01-13 13:00:31 +00:00
|
|
|
color: #ffffff;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Link Down */
|
|
|
|
.ui.inverted.steps .link.step:active::after,
|
|
|
|
.ui.inverted.steps .link.step:active,
|
|
|
|
.ui.inverted.steps a.step:active::after,
|
|
|
|
.ui.inverted.steps a.step:active {
|
2023-08-17 09:47:40 +00:00
|
|
|
background: #444;
|
2022-01-13 13:00:31 +00:00
|
|
|
color: #ffffff;
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/*******************************
|
|
|
|
Theme Overrides
|
|
|
|
*******************************/
|
|
|
|
|
|
|
|
@font-face {
|
2023-08-17 09:47:40 +00:00
|
|
|
font-family: Step;
|
|
|
|
src: url("data:application/font-woff;base64,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") format("woff");
|
2022-01-13 13:00:31 +00:00
|
|
|
}
|
2022-06-08 10:36:39 +00:00
|
|
|
.ui.steps .step.completed > .icon::before,
|
|
|
|
.ui.ordered.steps .step.completed::before {
|
2023-08-17 09:47:40 +00:00
|
|
|
font-family: Step;
|
|
|
|
content: "\e800";
|
2022-01-13 13:00:31 +00:00
|
|
|
|
|
|
|
/* '' */
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/*******************************
|
|
|
|
Site Overrides
|
|
|
|
*******************************/
|
|
|
|
|