Files
redline.com.pl/themes/at_movic/_dev/css/partials/_commons.scss
2024-11-11 18:46:54 +01:00

452 lines
8.8 KiB
SCSS

.rtl {
* {
direction: rtl !important;
}
main {
text-align: right !important;
}
}
body {
direction: ltr;
font-family: $font-family-base;
font-size: 13px;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
color: #666;
line-height: 1.55;
//overflow-x: hidden;
}
ul {
list-style: none;
padding: 0;
margin: 0;
}
a{
&:hover {
color: $link-hover-color;
text-decoration: none;
}
&:focus{
outline: none;
text-decoration: none;
}
}
p {
}
.dropdown-item:focus,
.dropdown-item:hover {
background: none;
}
.color,
.custom-checkbox input[type="checkbox"] + span.color {
display: inline-block;
//border: 1px solid rgba(0,0,0,0.2);
cursor: pointer;
background-size: contain;
@include size(16px, 16px);
@include box-shadow(0 0 3px 0 rgba(0, 0, 0, 0.15));
position: relative;
border: 0;
/* &:before {
content: "";
top: 0;
left: 0;
right: 0;
bottom: 0;
position: absolute;
background-image: radial-gradient(circle, #ffffff, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0));
} */
&.active,
&:hover {
border: 2px solid $gray-darker;
}
}
.facet-label {
&.active,
&:hover {
.custom-checkbox span.color {
border: 2px solid $gray-darker;
}
}
}
.h1,
.h2,
.h3 {
text-transform: uppercase;
color: #000;
}
.h4 {
font-weight: $headings-font-weight;
color: #000;
}
.btn-primary,
.btn-secondary {
text-transform: uppercase;
font-weight: normal;
padding: 10px 15px;
font-size: 12px;
letter-spacing: 1px;
line-height: 18px;
@include border-radius(0);
@include box-shadow(none);
.material-icons {
margin-right: $small-space;
}
}
.btn-tertiary {
@extend .btn-secondary;
text-transform: uppercase;
color: $gray;
padding: 8px;
margin: 4px 0;
font-weight: 400;
font-size: $base-font-size;
@include box-shadow(none);
.material-icons {
font-size: 14px;
vertical-align: -2px;
}
}
label ,.label {
color: $gray-darker;
@include rtl-text-align-right();
font-size: $base-font-size;
}
small.label, small.value {
font-size: $font-size-sm;
}
.form-control-label {
padding-top: 10px;
}
.form-control {
background: #fff;
color: $gray;
border: none;
padding: 8px 16px;
}
textarea.form-control {
height: 145px;
}
input.form-control{
border: 1px solid #e5e5e5;
box-shadow: none;
height: 40px;
}
.input-group {
&.focus {
outline: $main-border;
}
.form-control:focus {
outline: none;
}
.input-group-btn > .btn {
border: 0;
color: #ffffff;
font-size: 11px;
font-weight: normal;
padding: 9px 15px;
text-transform: uppercase;
height: 40px;
@include rtl-margin-left(0px);
@include box-shadow(none);
&:hover,
&:focus,
&:active{
background: $theme-color-default;
color: #fff;
}
}
}
.form-control-select {
height: 42px;
-moz-appearance: none;
-webkit-appearance: none;
background: $gray-light url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAQAAAD9CzEMAAAAPklEQVR4Ae3TwREAEBQD0V/6do4SXPZg7EsBhsQ8IEmSMOsiuEfg3gL3oXC7wK0bd1G4o8X9F4yIkyQfSrIByQBjp7QuND8AAAAASUVORK5CYII=");
background-repeat: no-repeat;
background-attachment: scroll;
background-position: right center;
background-position-x: 99%;
background-size: 20px 20px;
@include rtl-padding-right(32px);
&::-ms-expand {
display: none;
}
}
.form-control-valign {
//padding-top: 8px;
}
.form-control-comment {
font-size: $base-font-size;
padding-top: 8px;
color: $gray-dark;
display: inline-block;
}
.form-control-submit {
&.disabled {
background: $brand-info;
color: white;
}
}
.form-group {
&.has-error {
input,
select {
outline: 3px solid $brand-danger;
}
.help-block {
color: $brand-danger;
}
}
}
.group-span-filestyle {
label {
margin: 0;
}
.btn-default {
background: $theme-color-default;
color: white;
text-transform: uppercase;
font-size: $base-font-size;
padding: 8px 16px;
@include rounded-corners(0px);
}
}
.bootstrap-touchspin {
input {
&:focus {
outline: none;
}
&.form-control {
border: $input-btn-border-width solid $input-border-color;
}
}
.btn-touchspin {
@extend .btn-default;
border: $input-btn-border-width solid $input-border-color;
height: 21px;
&:hover {
background-color: $gray-light;
color: #000;
}
}
.input-group-btn-vertical {
color: $gray-darker;
.bootstrap-touchspin-up {
@include rounded-corners(0px);
}
.bootstrap-touchspin-down {
@include rounded-corners(0px);
}
.touchspin-up {
&:after {
content: "\E5CE";
}
}
.touchspin-down {
&:after {
content: "\E5CF";
}
}
i {
top: 1px;
left: 3px;
font-size: 15px;
}
}
}
.custom-radio {
display: inline-block;
position: relative;
vertical-align: middle;
cursor: pointer;
border: #ccc 1px solid;
background: $white;
@include size(16px,16px);
@include rounded-corners(50%);
@include rtl-margin-right(10px);
input[type="radio"] {
cursor: pointer;
@include opacity(0);
}
input[type="radio"]:checked + span {
display: block;
background-color: $theme-color-default;
position: absolute;
left: 2px;
top: 2px;
@include size(10px,10px);
@include rounded-corners(50%);
}
}
.custom-checkbox {
position: relative;
input[type="checkbox"],
input[type="radio"] {
margin-top: 0px;
cursor: pointer;
position: absolute;
top: 0px;
@include opacity(0);
@include rtl-left(0);
width: 16px;
height: 16px;
z-index: 1;
+ span {
@include rtl-margin-right(10px);
display: inline-block;
vertical-align: -3px;
cursor: pointer;
border: 1px #666 solid;
@include size(16px,16px);
.checkbox-checked {
display: none;
font-size: 14px;
}
}
&:checked + span {
.checkbox-checked {
display: block;
}
}
}
input[type="radio"] + span{
@include rounded-corners(50%);
}
label {
@include rtl-text-align-left();
}
}
.text-muted {
font-size: $base-font-size;
}
.done {
color: $brand-success;
display: inline-block;
padding: 0 13px;
@include rtl-margin-right(25px);
}
.thumb-mask {
> .mask {
position: relative;
overflow: hidden;
border: $gray-light 1px solid;
margin: $small-space 0;
@include size(55px,55px);
img {
@include size(55px,55px);
}
}
}
.definition-list {
dl {
&:after {
content: "";
display: block;
clear: both;
}
dt {
font-weight: normal;
}
dd,
dt {
background: $gray-light;
padding: 10px;
margin: 5px 0.5%;
width: 48%;
@include rtl-float-left();
&:nth-of-type(even) {
background: $gray-lighter;
}
}
}
}
.help-block {
margin-top: $small-space;
}
.btn.disabled,
.btn.disabled:hover {
background: $gray;
}
.alert-warning {
.material-icons {
color: $warning;
font-size: 32px;
@include rtl-margin-right($small-space);
padding-top: $extra-small-space;
}
.alert-text {
font-size: 15px;
padding-top: $small-space;
}
.alert-link {
border-width: 2px;
@include rtl-margin-left($small-space);
padding: $extra-small-space $medium-space;
font-weight: 400;
font-size: $font-size-sm;
color: $btn-tertiary-color;
@include rounded-corners(2px);
}
ul li:last-child .alert-link {
color: white;
}
.warning-buttons {
margin-top: $extra-small-space;
}
}
.btn-warning {
@include transition(all .4s ease-in-out);
}
.btn-tertiary-outline {
color: $btn-tertiary-color;
background-image: none;
background-color: transparent;
border-color: $btn-tertiary-color;
border: 0.15rem solid $btn-tertiary-color;
@include transition(all .4s ease-in-out);
&:hover {
border-color: $btn-tertiary-hover;
color: $btn-tertiary-hover;
}
}
.alert {
font-size: $font-size-sm;
}
/* Add new grid */
.col-sp{
@if $enable-flex {
flex-basis: 0;
flex-grow: 1;
max-width: 100%;
}
}
@media (max-width: 480px) {
.hidden-sp {
display: none !important;
}
.col-sp-1 {@include make-col(1);}
.col-sp-2 {@include make-col(2);}
.col-sp-3 {@include make-col(3);}
.col-sp-4 {@include make-col(4);}
.col-sp-5 {@include make-col(5);}
.col-sp-6 {@include make-col(6);}
.col-sp-7 {@include make-col(7);}
.col-sp-8 {@include make-col(8);}
.col-sp-9 {@include make-col(9);}
.col-sp-10 {@include make-col(10);}
.col-sp-11 {@include make-col(11);}
.col-sp-12 {@include make-col(12);}
.col-sp-2-4 {@include make-col(2.4);}
.col-sp-4-8 {@include make-col(4.8);}
.col-sp-7-2 {@include make-col(7.2);}
.col-sp-9-6 {@include make-col(9.6);}
}
/*** Responsive part ***/
@include media-breakpoint-down(md) {
.form-control-label,
.control-label,label, .label {
@include rtl-text-align-left();
}
}