116 lines
1.8 KiB
SCSS
116 lines
1.8 KiB
SCSS
// Form placeholder styles
|
|
// --------------------------------------------------
|
|
|
|
@import '~cartoassets/src/scss/cdb-variables/colors';
|
|
@import '~cartoassets/src/scss/cdb-variables/sizes';
|
|
|
|
$color: $cThirdBackground;
|
|
$br: 2px;
|
|
|
|
.FormPlaceholder-paragraph {
|
|
position: relative;
|
|
margin-bottom: 30px;
|
|
}
|
|
|
|
.FormPlaceholder-paragraphLoader {
|
|
position: relative;
|
|
top: -18px;
|
|
width: 100%;
|
|
}
|
|
|
|
.FormPlaceholder-step {
|
|
min-width: 26px;
|
|
height: 26px;
|
|
border-radius: $br;
|
|
background: $color;
|
|
}
|
|
|
|
.FormPlaceholder-inner {
|
|
width: 90%;
|
|
}
|
|
|
|
.FormPlaceholder-title {
|
|
display: block;
|
|
position: relative;
|
|
width: 60%;
|
|
height: 8px;
|
|
background: $color;
|
|
}
|
|
|
|
.FormPlaceholder-label {
|
|
display: block;
|
|
position: relative;
|
|
width: 60%;
|
|
height: 3px;
|
|
border-radius: $br;
|
|
background: $color;
|
|
}
|
|
|
|
.FormPlaceholder-input {
|
|
display: block;
|
|
height: 33px;
|
|
border-radius: $br;
|
|
background: $color;
|
|
}
|
|
|
|
.FormPlaceholder-size--shorter {
|
|
width: 18%;
|
|
}
|
|
|
|
.FormPlaceholder-size--short {
|
|
width: 25%;
|
|
}
|
|
|
|
.FormPlaceholder-size--med {
|
|
width: 50%;
|
|
}
|
|
|
|
.FormPlaceholder-size--long {
|
|
width: 100%;
|
|
}
|
|
|
|
.FormPlaceholder-carousel {
|
|
width: 100%;
|
|
margin-top: 25px;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.FormPlaceholder-carouselItem {
|
|
display: block;
|
|
width: 88px;
|
|
min-width: 88px;
|
|
height: 56px;
|
|
margin-right: 10px;
|
|
border-radius: $br;
|
|
background: $color;
|
|
}
|
|
|
|
.FormPlaceholder-fields {
|
|
display: block;
|
|
margin-top: 15px;
|
|
}
|
|
|
|
.FormPlaceholder-fieldsItem {
|
|
align-items: center;
|
|
width: 100%;
|
|
margin-top: 10px;
|
|
}
|
|
|
|
.FormPlaceholder-widget {
|
|
margin-bottom: $halfBaseSize;
|
|
padding: 2 * $baseSize;
|
|
border: 1px solid $color;
|
|
border-radius: $br;
|
|
}
|
|
|
|
.FormPlaceholder-widgetIcon {
|
|
width: 40px;
|
|
height: 40px;
|
|
border-radius: $br;
|
|
background: $color;
|
|
}
|
|
|
|
.FormPlaceholder-widgetInner {
|
|
flex: 1;
|
|
}
|