/////////////////////////////////////////
|
|
// Global general styles
|
|
/////////////////////////////////////////
|
|
body{
|
|
position: relative;
|
|
min-height: 100%;
|
|
}
|
|
|
|
* {outline: none !important;}
|
|
|
|
img{
|
|
max-width: 100%;
|
|
}
|
|
|
|
a{
|
|
color: map-get($colors, primary);
|
|
transition: $transition;
|
|
&:hover, &:focus{
|
|
color: darken(map-get($colors, primary), 10%);
|
|
text-decoration-color: currentColor;
|
|
}
|
|
}
|
|
|
|
.container{ z-index: 1;}
|
|
|
|
|
|
//////////////////////////////
|
|
// Bootstrap Override
|
|
//////////////////////////////
|
|
.card{
|
|
border-color: map-get($colors, 10);
|
|
border-radius: $radius-primary;
|
|
}
|
|
.card-img-top {
|
|
border-top-right-radius: $radius-primary;
|
|
border-top-left-radius: $radius-primary;
|
|
}
|
|
.card-block{ padding: $el-padding-5; }
|
|
.card-header, .card-footer{
|
|
font-family: $font-1;
|
|
background-color: map-get($colors, 11);
|
|
padding: $el-padding-4 $el-padding-5;
|
|
}
|
|
.card-header{ border-bottom-color: map-get($colors, 10); }
|
|
.card-footer{ border-top-color: map-get($colors, 10); }
|
|
.card-header:first-child{ border-radius: $radius-primary $radius-primary 0 0; }
|
|
.card-footer:last-child{ border-radius: 0 0 $radius-primary $radius-primary; }
|
|
.list-group-item{
|
|
padding: $el-padding-2 $el-padding-4;
|
|
border-color: map-get($colors, 10);
|
|
}
|
|
.card>.list-group:first-child .list-group-item:first-child { border-radius: $radius-primary $radius-primary 0 0;}
|
|
|
|
@each $index, $color in $colors{
|
|
.card-outline-#{$index}{
|
|
border-color: map-get($colors, $index);
|
|
}
|
|
}
|
|
|
|
|
|
//////////////////////////////
|
|
// Masonry Grid
|
|
//////////////////////////////
|
|
.card-columns {
|
|
column-gap: map-get($spacers, 3);
|
|
@include mq($until: desktop) {
|
|
column-count: 1;
|
|
}
|
|
@include mq($from: desktop) {
|
|
column-count: 2;
|
|
}
|
|
@include mq($from: wide) {
|
|
column-count: 3;
|
|
}
|
|
}
|
|
|
|
|
|
//////////////////////////////
|
|
// Badge
|
|
//////////////////////////////
|
|
.badge{
|
|
font-family: $font-1;
|
|
&:not(.badge-pill){ border-radius: $radius-primary; }
|
|
}
|
|
|
|
|
|
//////////////////////////////////////
|
|
//Button [Bootstrap 4 effect fixed]
|
|
//////////////////////////////////////
|
|
.btn{
|
|
&[class*='btn-']:focus{
|
|
box-shadow: none;
|
|
}
|
|
}
|
|
|
|
|
|
///////////////////////////
|
|
// Pagination
|
|
///////////////////////////
|
|
@mixin pagination($color){
|
|
.page-item{
|
|
.page-link{
|
|
color: map-get($colors, $color);
|
|
}
|
|
&.active .page-link{
|
|
background-color: map-get($colors, $color);
|
|
border-color: transparent;
|
|
color: white;
|
|
}
|
|
}
|
|
}
|
|
.pagination{
|
|
@include pagination('primary');
|
|
}
|
|
.pagination-warning{
|
|
@include pagination('warning');
|
|
}
|