195 lines
3.9 KiB
SCSS
195 lines
3.9 KiB
SCSS
.wizard {
|
|
|
|
.content {
|
|
@extend .margin-0;
|
|
min-height: 245px;
|
|
overflow-y: auto;
|
|
border-radius: 0;
|
|
|
|
.body {
|
|
padding: 15px;
|
|
|
|
label.error{
|
|
@extend .margin-0;
|
|
font-size: 12px;
|
|
color: $color-danger;
|
|
}
|
|
|
|
input[type="checkbox"]{
|
|
display: none;
|
|
}
|
|
}
|
|
}
|
|
|
|
.actions {
|
|
position: relative;
|
|
@extend .displayblock;
|
|
@extend .align-right;
|
|
width: 100%;
|
|
margin-top: 10px !important;
|
|
|
|
ul{
|
|
@extend .inlineblock;
|
|
> li{
|
|
float: left;
|
|
margin: 0 !important;
|
|
}
|
|
}
|
|
|
|
a {
|
|
color: $col-white;
|
|
@extend .displayblock;
|
|
text-decoration: none;
|
|
@extend .m-l-5;
|
|
|
|
&:hover, &:active {
|
|
color: $col-white;
|
|
@extend .displayblock;
|
|
text-decoration: none;
|
|
}
|
|
}
|
|
|
|
.disabled a {
|
|
background: $grey-200;
|
|
color: #aaa;
|
|
|
|
&:hover, &:active {
|
|
background: $grey-200;
|
|
color: #aaa;
|
|
}
|
|
}
|
|
}
|
|
|
|
.steps {
|
|
|
|
position: relative;
|
|
@extend .displayblock;
|
|
width: 100%;
|
|
margin-bottom: 2px;
|
|
|
|
a {
|
|
@extend .displayblock;
|
|
width: auto;
|
|
margin: 0 2px 0 0;
|
|
padding: 10px;
|
|
text-decoration: none;
|
|
border-radius: 0;
|
|
|
|
&:hover, &:active {
|
|
@extend .displayblock;
|
|
width: auto;
|
|
margin: 0 2px 0 0;
|
|
padding: 10px;
|
|
text-decoration: none;
|
|
border-radius: 0;
|
|
}
|
|
}
|
|
|
|
.number{
|
|
font-size: 15px;
|
|
}
|
|
|
|
.disabled a {
|
|
background: $grey-200;
|
|
color: $grey-400;
|
|
cursor: default;
|
|
|
|
&:hover, &:active {
|
|
background: $grey-200;
|
|
color: $grey-400;
|
|
cursor: default;
|
|
}
|
|
}
|
|
|
|
.current a {
|
|
color: $col-white;
|
|
cursor: default;
|
|
|
|
&:hover, &:active {
|
|
color: $col-white;
|
|
cursor: default;
|
|
}
|
|
}
|
|
|
|
.done a {
|
|
color: $col-white;
|
|
opacity: 0.7;
|
|
|
|
&:hover, &:active {
|
|
color: $col-white;
|
|
opacity: 0.7;
|
|
}
|
|
}
|
|
|
|
> ul > li {
|
|
width: 25%;
|
|
float: left;
|
|
&:last-child{
|
|
a{
|
|
margin: 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
&.vertical {
|
|
> .steps {
|
|
float: left;
|
|
width: 30%;
|
|
@extend .p-r-5;
|
|
|
|
> ul > li {
|
|
float: none;
|
|
width: 100%;
|
|
|
|
a{
|
|
margin: 0 0 2px 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
> .content {
|
|
float: left;
|
|
width: 70%;
|
|
margin: 0;
|
|
}
|
|
|
|
> .actions {
|
|
float: right;
|
|
width: 100%;
|
|
margin: 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
.wizard_validation{
|
|
.wizard .steps>ul>li{
|
|
width: auto !important;
|
|
}
|
|
}
|
|
|
|
@include max-screen($break-small - 1px){
|
|
.wizard {
|
|
> .steps{
|
|
> ul > li{
|
|
width: 100%;
|
|
margin-bottom: 2px;
|
|
}
|
|
a{
|
|
margin: 0;
|
|
}
|
|
}
|
|
&.wizard.vertical{
|
|
>.content, >.steps{
|
|
width: 100%;
|
|
padding: 0;
|
|
|
|
}
|
|
}
|
|
}
|
|
.wizard_validation .wizard .steps>ul>li{
|
|
width: 100% !important;
|
|
}
|
|
}
|