|
@ -20,21 +20,23 @@ |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/******************************* |
|
|
/******************************* |
|
|
Step |
|
|
|
|
|
|
|
|
Singular |
|
|
*******************************/ |
|
|
*******************************/ |
|
|
|
|
|
|
|
|
.ui.steps .step { |
|
|
.ui.steps .step { |
|
|
display: inline-block; |
|
|
|
|
|
position: relative; |
|
|
position: relative; |
|
|
|
|
|
display: table-cell; |
|
|
|
|
|
vertical-align: middle; |
|
|
|
|
|
|
|
|
margin: @verticalMargin @horizontalMargin; |
|
|
margin: @verticalMargin @horizontalMargin; |
|
|
padding: @verticalPadding @horizontalPadding @verticalPadding @leftPadding; |
|
|
padding: @verticalPadding @horizontalPadding @verticalPadding @leftPadding; |
|
|
vertical-align: top; |
|
|
|
|
|
background: @background; |
|
|
background: @background; |
|
|
color: @textColor; |
|
|
color: @textColor; |
|
|
box-shadow: @boxShadow; |
|
|
box-shadow: @boxShadow; |
|
|
border-radius: @borderRadius; |
|
|
border-radius: @borderRadius; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.ui.steps .step:after { |
|
|
.ui.steps .step:after { |
|
|
position: absolute; |
|
|
position: absolute; |
|
|
z-index: 2; |
|
|
z-index: 2; |
|
@ -55,6 +57,41 @@ |
|
|
transition: @transition; |
|
|
transition: @transition; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
/******************************* |
|
|
|
|
|
Plural |
|
|
|
|
|
*******************************/ |
|
|
|
|
|
|
|
|
|
|
|
.ui.steps { |
|
|
|
|
|
display: table; |
|
|
|
|
|
table-layout: fixed; |
|
|
|
|
|
background: @stepsBackground; |
|
|
|
|
|
box-shadow: @stepsBoxShadow; |
|
|
|
|
|
|
|
|
|
|
|
line-height: @lineHeight; |
|
|
|
|
|
box-sizing: border-box; |
|
|
|
|
|
border-radius: @stepsBorderRadius; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.ui.steps .step:first-child { |
|
|
|
|
|
padding-left: @horizontalPadding; |
|
|
|
|
|
border-radius: @stepsBorderRadius 0em 0em @stepsBorderRadius; |
|
|
|
|
|
} |
|
|
|
|
|
.ui.steps .step:last-child { |
|
|
|
|
|
border-radius: 0em @stepsBorderRadius @stepsBorderRadius 0em; |
|
|
|
|
|
} |
|
|
|
|
|
.ui.steps .step:only-child { |
|
|
|
|
|
-webkit-border-radius: @stepsBorderRadius; |
|
|
|
|
|
-moz-border-radius: @stepsBorderRadius; |
|
|
|
|
|
border-radius: @stepsBorderRadius; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.ui.steps .step:last-child { |
|
|
|
|
|
margin-right: 0em; |
|
|
|
|
|
} |
|
|
|
|
|
.ui.steps .step:last-child:after { |
|
|
|
|
|
display: none; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/******************************* |
|
|
/******************************* |
|
|
Content |
|
|
Content |
|
@ -128,6 +165,7 @@ |
|
|
---------------*/ |
|
|
---------------*/ |
|
|
|
|
|
|
|
|
.ui.vertical.steps { |
|
|
.ui.vertical.steps { |
|
|
|
|
|
display: inline-block; |
|
|
overflow: visible; |
|
|
overflow: visible; |
|
|
} |
|
|
} |
|
|
.ui.vertical.steps .step { |
|
|
.ui.vertical.steps .step { |
|
@ -184,43 +222,6 @@ |
|
|
|
|
|
|
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
/******************************* |
|
|
|
|
|
Group |
|
|
|
|
|
*******************************/ |
|
|
|
|
|
|
|
|
|
|
|
.ui.steps { |
|
|
|
|
|
display: inline-block; |
|
|
|
|
|
font-size: 0em; |
|
|
|
|
|
|
|
|
|
|
|
background: @stepsBackground; |
|
|
|
|
|
box-shadow: @stepsBoxShadow; |
|
|
|
|
|
|
|
|
|
|
|
line-height: @lineHeight; |
|
|
|
|
|
box-sizing: border-box; |
|
|
|
|
|
border-radius: @stepsBorderRadius; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.ui.steps .step:first-child { |
|
|
|
|
|
padding-left: @horizontalPadding; |
|
|
|
|
|
border-radius: @stepsBorderRadius 0em 0em @stepsBorderRadius; |
|
|
|
|
|
} |
|
|
|
|
|
.ui.steps .step:last-child { |
|
|
|
|
|
border-radius: 0em @stepsBorderRadius @stepsBorderRadius 0em; |
|
|
|
|
|
} |
|
|
|
|
|
.ui.steps .step:only-child { |
|
|
|
|
|
-webkit-border-radius: @stepsBorderRadius; |
|
|
|
|
|
-moz-border-radius: @stepsBorderRadius; |
|
|
|
|
|
border-radius: @stepsBorderRadius; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.ui.steps .step:last-child { |
|
|
|
|
|
margin-right: 0em; |
|
|
|
|
|
} |
|
|
|
|
|
.ui.steps .step:last-child:after { |
|
|
|
|
|
display: none; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/******************************* |
|
|
/******************************* |
|
|
States |
|
|
States |
|
|
*******************************/ |
|
|
*******************************/ |
|
|