v2 first commit
This commit is contained in:
denisdulici
279
resources/assets/sass/core/vendors/_bootstrap-datepicker.scss
vendored
Normal file
279
resources/assets/sass/core/vendors/_bootstrap-datepicker.scss
vendored
Normal file
@@ -0,0 +1,279 @@
|
||||
//
|
||||
// Bootstrap datepicker
|
||||
//
|
||||
|
||||
|
||||
.datepicker {
|
||||
border-radius: $datepicker-border-radius;
|
||||
|
||||
&-inline {
|
||||
width: 220px;
|
||||
}
|
||||
|
||||
direction: ltr;
|
||||
|
||||
&-rtl {
|
||||
direction: rtl;
|
||||
&.dropdown-menu {
|
||||
left: auto;
|
||||
}
|
||||
table tr td span {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
|
||||
&-dropdown {
|
||||
top: 0;
|
||||
left: 0;
|
||||
padding: $datepicker-dropdown-padding;
|
||||
@include box-shadow($dropdown-box-shadow);
|
||||
|
||||
&.datepicker-orient-left:before {
|
||||
left: 6px;
|
||||
}
|
||||
&.datepicker-orient-left:after {
|
||||
left: 7px;
|
||||
}
|
||||
&.datepicker-orient-right:before {
|
||||
right: 6px;
|
||||
}
|
||||
&.datepicker-orient-right:after {
|
||||
right: 7px;
|
||||
}
|
||||
&.datepicker-orient-bottom:before {
|
||||
top: -7px;
|
||||
}
|
||||
&.datepicker-orient-bottom:after {
|
||||
top: -6px;
|
||||
}
|
||||
|
||||
&.datepicker-orient-top:before {
|
||||
bottom: -7px;
|
||||
border-bottom: 0;
|
||||
border-top: 7px solid $datepicker-dropdown-border;
|
||||
}
|
||||
|
||||
&.datepicker-orient-top:after {
|
||||
bottom: -6px;
|
||||
border-bottom: 0;
|
||||
border-top: 6px solid $datepicker-dropdown-bg;
|
||||
}
|
||||
}
|
||||
|
||||
table {
|
||||
margin: 0;
|
||||
-webkit-touch-callout: none;
|
||||
user-select: none;
|
||||
|
||||
tr {
|
||||
td {
|
||||
border-radius: $datepicker-cell-border-radius;
|
||||
}
|
||||
|
||||
th {
|
||||
border-radius: $datepicker-header-cell-border-radius;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
td,
|
||||
th {
|
||||
transition: $datepicker-cell-transition;
|
||||
width: $datepicker-cell-width;
|
||||
height: $datepicker-cell-height;
|
||||
border: none;
|
||||
text-align: center;
|
||||
font-size: $font-size-sm;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Inline display inside a table presents some problems with
|
||||
// border and background colors.
|
||||
.table-striped & table tr {
|
||||
td,
|
||||
th {
|
||||
background-color: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
table tr td {
|
||||
&.old,
|
||||
&.new {
|
||||
color: $datepicker-disabled-old-new-color;
|
||||
}
|
||||
|
||||
&.day:hover,
|
||||
&.focused {
|
||||
background: $datepicker-cell-hover-background;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
&.disabled,
|
||||
&.disabled:hover {
|
||||
background: none;
|
||||
color: $datepicker-disabled-cell-color;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
&.highlighted {
|
||||
border-radius: 0;
|
||||
|
||||
&.focused {
|
||||
background: $datepicker-highlighted-bg
|
||||
}
|
||||
|
||||
&.disabled,
|
||||
&.disabled:active {
|
||||
background: $datepicker-highlighted-bg;
|
||||
color: $gray-400;
|
||||
}
|
||||
}
|
||||
|
||||
&.today {
|
||||
background: lighten($datepicker-active-background, 45%);
|
||||
&.focused {
|
||||
background: lighten($gray-400, 58%);
|
||||
}
|
||||
|
||||
&.disabled,
|
||||
&.disabled:active {
|
||||
background: lighten($gray-400, 58%);
|
||||
color: $btn-link-disabled-color;
|
||||
}
|
||||
}
|
||||
|
||||
// Range selection
|
||||
&.range {
|
||||
background: $datepicker-range-background;
|
||||
color: $datepicker-range-color;
|
||||
border-radius: 0;
|
||||
|
||||
&.focused {
|
||||
background: darken($datepicker-range-cell-focused-background, 3%);
|
||||
}
|
||||
|
||||
&.disabled,
|
||||
&.disabled:active,
|
||||
&.day.disabled:hover {
|
||||
background: darken($datepicker-active-background, 10%);
|
||||
color: lighten($datepicker-active-background, 10%);
|
||||
}
|
||||
}
|
||||
|
||||
&.range.highlighted {
|
||||
&.focused {
|
||||
background: darken($datepicker-range-highlighted-bg, 10%);
|
||||
}
|
||||
|
||||
&.disabled,
|
||||
&.disabled:active {
|
||||
background: $datepicker-range-highlighted-bg;
|
||||
color: $datepicker-disabled-cell-color;
|
||||
}
|
||||
}
|
||||
|
||||
&.range.today {
|
||||
&.disabled,
|
||||
&.disabled:active {
|
||||
background: $blue;
|
||||
color: $white;
|
||||
}
|
||||
}
|
||||
|
||||
&.day.range-start {
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
|
||||
&.day.range-end {
|
||||
border-top-left-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
|
||||
&.day.range-start.range-end {
|
||||
border-radius: $datepicker-cell-border-radius;
|
||||
}
|
||||
|
||||
&.selected,
|
||||
&.selected.highlighted,
|
||||
&.selected:hover,
|
||||
&.selected.highlighted:hover,
|
||||
&.day.range:hover {
|
||||
background: $datepicker-active-background;
|
||||
color: $datepicker-active-color;
|
||||
}
|
||||
|
||||
&.active,
|
||||
&.active.highlighted,
|
||||
&.active:hover,
|
||||
&.active.highlighted:hover {
|
||||
background: $datepicker-active-background;
|
||||
color: $datepicker-active-color;
|
||||
box-shadow: $datepicker-active-box-shadow;
|
||||
}
|
||||
|
||||
span {
|
||||
display: block;
|
||||
width: 23%;
|
||||
height: 54px;
|
||||
line-height: 54px;
|
||||
float: left;
|
||||
margin: 1%;
|
||||
cursor: pointer;
|
||||
border-radius: 4px;
|
||||
|
||||
&:hover,
|
||||
&.focused {
|
||||
background: $gray-200;
|
||||
}
|
||||
|
||||
&.disabled,
|
||||
&.disabled:hover {
|
||||
background: none;
|
||||
color: $datepicker-disabled-cell-color;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
&.active,
|
||||
&.active:hover,
|
||||
&.active.disabled,
|
||||
&.active.disabled:hover {
|
||||
text-shadow: 0 -1px 0 rgba(0, 0, 0, .25);
|
||||
}
|
||||
|
||||
&.old,
|
||||
&.new {
|
||||
color: $btn-link-disabled-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.datepicker-switch {
|
||||
width: 145px;
|
||||
}
|
||||
|
||||
.datepicker-switch,
|
||||
.prev,
|
||||
.next,
|
||||
tfoot tr th {
|
||||
cursor: pointer;
|
||||
&:hover {
|
||||
background: $gray-200;
|
||||
}
|
||||
}
|
||||
|
||||
.prev,
|
||||
.next {
|
||||
&.disabled {
|
||||
visibility: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
// Basic styling for calendar-week cells
|
||||
.cw {
|
||||
font-size: 10px;
|
||||
width: 12px;
|
||||
padding: 0 2px 0 5px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
67
resources/assets/sass/core/vendors/_bootstrap-tagsinput.scss
vendored
Normal file
67
resources/assets/sass/core/vendors/_bootstrap-tagsinput.scss
vendored
Normal file
@@ -0,0 +1,67 @@
|
||||
//
|
||||
// Bootstrap tags input
|
||||
//
|
||||
|
||||
|
||||
.bootstrap-tagsinput {
|
||||
background-color: $input-bg;
|
||||
border: $tags-input-border-width solid $tags-input-border-color;
|
||||
display: inline-block;
|
||||
padding: .25rem;
|
||||
color: $tags-input-color;
|
||||
vertical-align: middle;
|
||||
border-radius: $input-border-radius;
|
||||
max-width: 100%;
|
||||
cursor: text;
|
||||
|
||||
input {
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
outline: none;
|
||||
background-color: transparent;
|
||||
padding: 0 6px;
|
||||
margin: 0;
|
||||
width: auto;
|
||||
max-width: inherit;
|
||||
|
||||
&::placeholder {
|
||||
color: $input-placeholder-color;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
&:focus {
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
.badge {
|
||||
position: relative;
|
||||
padding: .625rem .625rem .5rem;
|
||||
margin: .125rem;
|
||||
border-radius: $input-border-radius;
|
||||
background: $tag-bg;
|
||||
color: $tag-color;
|
||||
line-height: 1.5;
|
||||
@include box-shadow($tag-box-shadow);
|
||||
@include transition($transition-base);
|
||||
|
||||
&:hover {
|
||||
padding-right: 1.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
[data-role="remove"] {
|
||||
margin-left: 10px;
|
||||
cursor: pointer;
|
||||
color: $tag-close-color;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translate(0, -50%);
|
||||
|
||||
&:after {
|
||||
content: "×";
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
22
resources/assets/sass/core/vendors/_chartjs.scss
vendored
Normal file
22
resources/assets/sass/core/vendors/_chartjs.scss
vendored
Normal file
@@ -0,0 +1,22 @@
|
||||
//
|
||||
// Chart.js
|
||||
//
|
||||
|
||||
|
||||
#chartjs-tooltip {
|
||||
opacity: 1;
|
||||
position: absolute;
|
||||
background: rgba(0, 0, 0, .7);
|
||||
color: white;
|
||||
border-radius: 3px;
|
||||
transition: all .1s ease;
|
||||
pointer-events: none;
|
||||
transform: translate(-50%, 0);
|
||||
}
|
||||
|
||||
.chartjs-tooltip-key {
|
||||
display: inline-block;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
74
resources/assets/sass/core/vendors/_dropzone.scss
vendored
Normal file
74
resources/assets/sass/core/vendors/_dropzone.scss
vendored
Normal file
@@ -0,0 +1,74 @@
|
||||
//
|
||||
// Dropzone
|
||||
//
|
||||
|
||||
.dropzone {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.dz-message {
|
||||
padding: 5rem 1rem;
|
||||
background-color: $input-bg;
|
||||
border: $input-border-width dashed $input-border-color;
|
||||
border-radius: $border-radius;
|
||||
text-align: center;
|
||||
color: $text-muted;
|
||||
transition: $transition-base;
|
||||
order: -1;
|
||||
cursor: pointer;
|
||||
z-index: 999;
|
||||
|
||||
&:hover {
|
||||
border-color: $text-muted;
|
||||
color: $body-color;
|
||||
}
|
||||
}
|
||||
|
||||
.dz-drag-hover .dz-message {
|
||||
border-color: theme-color("primary");
|
||||
color: theme-color("primary");
|
||||
}
|
||||
|
||||
.dropzone-multiple .dz-message {
|
||||
padding-top: 2rem;
|
||||
padding-bottom: 2rem;
|
||||
}
|
||||
|
||||
.dropzone-single.dz-max-files-reached .dz-message {
|
||||
background-color: fade-out($black, .1);
|
||||
color: white;
|
||||
opacity: 0;
|
||||
|
||||
&:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.dz-preview-single {
|
||||
position: absolute;
|
||||
top: 0; right: 0; bottom: 0; left: 0;
|
||||
border-radius: $border-radius;
|
||||
}
|
||||
|
||||
.dz-preview-cover {
|
||||
position: absolute;
|
||||
top: 0; right: 0; bottom: 0; left: 0;
|
||||
border-radius: $border-radius;
|
||||
}
|
||||
|
||||
.dz-preview-img {
|
||||
object-fit: cover;
|
||||
width: 100%; height: 100%;
|
||||
border-radius: $border-radius;
|
||||
}
|
||||
|
||||
.dz-preview-multiple .list-group-item:last-child {
|
||||
padding-bottom: 0;
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
[data-dz-size] strong {
|
||||
font-weight: $font-weight-normal;
|
||||
}
|
||||
26
resources/assets/sass/core/vendors/_element-checkbox.scss
vendored
Normal file
26
resources/assets/sass/core/vendors/_element-checkbox.scss
vendored
Normal file
@@ -0,0 +1,26 @@
|
||||
.el-checkbox {
|
||||
.el-checkbox__input.is-checked .el-checkbox__inner,
|
||||
.el-checkbox__input.is-indeterminate .el-checkbox__inner {
|
||||
background-color: theme-color('primary');
|
||||
border-color: theme-color('primary');
|
||||
}
|
||||
|
||||
.el-checkbox__input .el-checkbox__inner {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
font-size: 16px;
|
||||
border-radius: 3px;
|
||||
|
||||
&::before {
|
||||
top: 6px;
|
||||
border-color: $custom-control-indicator-checked-border-color;
|
||||
}
|
||||
&::after {
|
||||
height: 9px;
|
||||
left: 5px;
|
||||
}
|
||||
&:hover {
|
||||
border-color: theme-color('primary');
|
||||
}
|
||||
}
|
||||
}
|
||||
64
resources/assets/sass/core/vendors/_element-tables.scss
vendored
Normal file
64
resources/assets/sass/core/vendors/_element-tables.scss
vendored
Normal file
@@ -0,0 +1,64 @@
|
||||
|
||||
|
||||
.el-table .el-table__header-wrapper {
|
||||
thead th {
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
.cell {
|
||||
min-height: 40px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
.sort-caret {
|
||||
border: 4px solid transparent;
|
||||
}
|
||||
|
||||
.sort-caret.ascending {
|
||||
top: 7px;
|
||||
}
|
||||
.ascending .sort-caret.ascending {
|
||||
border-bottom-color: theme-color("default");
|
||||
}
|
||||
|
||||
.sort-caret.descending {
|
||||
bottom: 9px;
|
||||
}
|
||||
|
||||
.descending .sort-caret.descending {
|
||||
border-top-color: theme-color("default");
|
||||
}
|
||||
}
|
||||
|
||||
div.el-table {
|
||||
background: transparent;
|
||||
|
||||
tbody td,
|
||||
thead th {
|
||||
padding: $table-cell-padding;
|
||||
}
|
||||
|
||||
.el-table-column--selection .cell {
|
||||
min-width: 100px;
|
||||
overflow: visible;
|
||||
text-overflow: initial;
|
||||
.el-checkbox {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.el-table__row {
|
||||
background: transparent;
|
||||
&:hover {
|
||||
background: transparent;
|
||||
}
|
||||
}
|
||||
&.el-table--enable-row-hover .el-table__body tr:hover>td {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.el-table__row .cell,
|
||||
.el-table__header .cell{
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
72
resources/assets/sass/core/vendors/_flatpickr.scss
vendored
Normal file
72
resources/assets/sass/core/vendors/_flatpickr.scss
vendored
Normal file
@@ -0,0 +1,72 @@
|
||||
%active-day {
|
||||
background: $datepicker-active-background;
|
||||
color: $datepicker-active-color;
|
||||
box-shadow: $datepicker-active-box-shadow;
|
||||
border: none;
|
||||
}
|
||||
.flatpickr-calendar {
|
||||
@include box-shadow($dropdown-box-shadow);
|
||||
padding: $datepicker-dropdown-padding;
|
||||
width: 347px;
|
||||
color: $gray-700;
|
||||
|
||||
.flatpickr-weekday {
|
||||
text-align: center;
|
||||
font-size: $font-size-sm;
|
||||
color: $gray-700;
|
||||
font-weight: normal;
|
||||
}
|
||||
.flatpickr-day {
|
||||
border: none;
|
||||
}
|
||||
.flatpickr-day:hover {
|
||||
@extend %active-day;
|
||||
}
|
||||
.flatpickr-day.selected {
|
||||
@extend %active-day;
|
||||
&:hover {
|
||||
@extend %active-day;
|
||||
}
|
||||
}
|
||||
|
||||
.flatpickr-day.today {
|
||||
border: 1px solid $datepicker-active-background;
|
||||
&:hover {
|
||||
background: $datepicker-active-background;
|
||||
color: $datepicker-active-color;
|
||||
}
|
||||
}
|
||||
.flatpickr-day.inRange {
|
||||
background: $datepicker-active-background !important;
|
||||
color: $datepicker-active-color;
|
||||
box-shadow: -5px 0 0 $datepicker-active-background, 5px 0 0 $datepicker-active-background;
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
.flatpickr-day.startRange, .flatpickr-day.endRange {
|
||||
background: $datepicker-active-background;
|
||||
}
|
||||
|
||||
.flatpickr-day.selected.startRange + .endRange:not(:nth-child(7n+1)),
|
||||
.flatpickr-day.startRange.startRange + .endRange:not(:nth-child(7n+1)),
|
||||
.flatpickr-day.endRange.startRange + .endRange:not(:nth-child(7n+1)) {
|
||||
box-shadow: -10px 0 0 $datepicker-active-background;
|
||||
}
|
||||
|
||||
.flatpickr-months .flatpickr-prev-month:hover svg,
|
||||
.flatpickr-months .flatpickr-next-month:hover svg{
|
||||
fill: $datepicker-active-background;
|
||||
}
|
||||
|
||||
.flatpickr-current-month span.cur-month,
|
||||
.flatpickr-current-month input.cur-year{
|
||||
padding: 0 10px;
|
||||
color: $gray-700;
|
||||
font-size: $font-size-sm;
|
||||
font-weight: 500;
|
||||
&:hover {
|
||||
background: $gray-200;
|
||||
border-radius: $datepicker-header-cell-border-radius;
|
||||
}
|
||||
}
|
||||
}
|
||||
256
resources/assets/sass/core/vendors/_fullcalendar.scss
vendored
Normal file
256
resources/assets/sass/core/vendors/_fullcalendar.scss
vendored
Normal file
@@ -0,0 +1,256 @@
|
||||
//
|
||||
// Full Calendar
|
||||
//
|
||||
|
||||
@import "../../custom/mixins";
|
||||
@import "../../custom/variables";
|
||||
|
||||
.fc-header-toolbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.fc-scroller {
|
||||
height: auto !important;
|
||||
}
|
||||
|
||||
.fc {
|
||||
th {
|
||||
padding: $table-head-spacer-y $table-head-spacer-x;
|
||||
font-size: $font-size-xs;
|
||||
font-weight: $table-head-font-weight;
|
||||
color: $table-head-color;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
|
||||
|
||||
div.fc-row {
|
||||
margin-right: 0;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
button {
|
||||
.fc-icon {
|
||||
top: -5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fc-unthemed {
|
||||
td.fc-today {
|
||||
background-color: transparent;
|
||||
|
||||
span {
|
||||
color: $orange;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fc-event {
|
||||
padding: 0;
|
||||
font-size: $font-size-xs;
|
||||
border-radius: $border-radius-sm;
|
||||
border: 0;
|
||||
|
||||
.fc-title {
|
||||
padding: .4rem .5rem;
|
||||
display: block;
|
||||
color: $white;
|
||||
@include text-truncate();
|
||||
font-weight: $font-weight-bold;
|
||||
}
|
||||
|
||||
.fc-time {
|
||||
float: left;
|
||||
background: rgba($black,0.2);
|
||||
padding: 2px 6px;
|
||||
margin: 0 0 0 -1px;
|
||||
}
|
||||
}
|
||||
|
||||
.fc-view {
|
||||
&, & > table {
|
||||
border: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
& > table {
|
||||
& > tbody {
|
||||
& > tr {
|
||||
.ui-widget-content {
|
||||
border-top: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fc-body {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.fc-icon {
|
||||
font-family: $icon-font-family;
|
||||
font-size: $font-size-base;
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
border-radius: 50%;
|
||||
line-height: 35px;
|
||||
|
||||
&:hover {
|
||||
color: theme-color("primary");
|
||||
}
|
||||
}
|
||||
|
||||
.fc-button {
|
||||
border: 0;
|
||||
background: transparent;
|
||||
box-shadow: none;
|
||||
|
||||
&:focus,
|
||||
&:active {
|
||||
outline: 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Main Calendar
|
||||
|
||||
.calendar {
|
||||
z-index: 0;
|
||||
td, th {
|
||||
border-color: lighten($table-border-color,2%);
|
||||
}
|
||||
|
||||
.fc-toolbar {
|
||||
height: 250px;
|
||||
background-color: $white;
|
||||
border-radius: $border-radius $border-radius 0 0;
|
||||
position: relative;
|
||||
margin-bottom: -2px;
|
||||
z-index: 2;
|
||||
@include media-breakpoint-down(xs) {
|
||||
height: 135px;
|
||||
}
|
||||
}
|
||||
|
||||
.fc-day-number {
|
||||
padding: .5rem 1rem;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
@include media-breakpoint-up(sm) {
|
||||
font-size: $font-size-sm;
|
||||
font-weight: $font-weight-bold;
|
||||
color: lighten($body-color,10%);
|
||||
}
|
||||
}
|
||||
.fc-day-header {
|
||||
text-align: left;
|
||||
}
|
||||
.fc-day-grid-event {
|
||||
margin: 1px 9px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Main Calendar Seasonal headers
|
||||
|
||||
[data-calendar-month] {
|
||||
background-size: contain;
|
||||
@include transition(background-image 300ms);
|
||||
}
|
||||
|
||||
[data-calendar-month="0"] {
|
||||
background-image: url('/img/calendar/january.jpg');
|
||||
}
|
||||
[data-calendar-month="1"] {
|
||||
background-image: url('/img/calendar/february.jpg');
|
||||
}
|
||||
[data-calendar-month="2"] {
|
||||
background-image: url('/img/calendar/march.jpg');
|
||||
}
|
||||
[data-calendar-month="3"] {
|
||||
background-image: url('/img/calendar/april.jpg');
|
||||
}
|
||||
[data-calendar-month="4"] {
|
||||
background-image: url('/img/calendar/may.jpg');
|
||||
}
|
||||
[data-calendar-month="5"] {
|
||||
background-image: url('/img/calendar/june.jpg');
|
||||
}
|
||||
[data-calendar-month="6"] {
|
||||
background-image: url('/img/calendar/july.jpg');
|
||||
}
|
||||
[data-calendar-month="7"] {
|
||||
background-image: url('/img/calendar/august.jpg');
|
||||
}
|
||||
[data-calendar-month="8"] {
|
||||
background-image: url('/img/calendar/september.jpg');
|
||||
}
|
||||
[data-calendar-month="9"] {
|
||||
background-image: url('/img/calendar/october.jpg');
|
||||
}
|
||||
[data-calendar-month="10"] {
|
||||
background-image: url('/img/calendar/november.jpg');
|
||||
}
|
||||
[data-calendar-month="11"] {
|
||||
background-image: url('/img/calendar/december.jpg');
|
||||
}
|
||||
|
||||
|
||||
// Calendar used inside a card
|
||||
|
||||
.card-calendar {
|
||||
.card-header {
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
table {
|
||||
background: transparent;
|
||||
tr {
|
||||
& > td {
|
||||
&:first-child {
|
||||
border-left-width: 0;
|
||||
}
|
||||
&:last-child {
|
||||
border-right-width: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Widget
|
||||
|
||||
.widget-calendar {
|
||||
position: relative;
|
||||
z-index: 0;
|
||||
|
||||
td, th {
|
||||
border-color: transparent;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.fc-toolbar {
|
||||
margin-top: 1.25rem;
|
||||
|
||||
h2 {
|
||||
font-size: $font-size-base;
|
||||
}
|
||||
}
|
||||
|
||||
.fc-day-number {
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.fc {
|
||||
table {
|
||||
font-size: $font-size-sm;
|
||||
}
|
||||
th {
|
||||
padding: .75rem .5rem;
|
||||
font-size: $font-size-xs;
|
||||
}
|
||||
}
|
||||
}
|
||||
25
resources/assets/sass/core/vendors/_headroom.scss
vendored
Normal file
25
resources/assets/sass/core/vendors/_headroom.scss
vendored
Normal file
@@ -0,0 +1,25 @@
|
||||
//
|
||||
// Headroom
|
||||
//
|
||||
|
||||
|
||||
.headroom {
|
||||
will-change: transform;
|
||||
background-color: inherit;
|
||||
@include transition($transition-base);
|
||||
}
|
||||
.headroom--pinned {
|
||||
@extend .position-fixed;
|
||||
transform: translateY(0%);
|
||||
}
|
||||
.headroom--unpinned {
|
||||
@extend .position-fixed;
|
||||
transform: translateY(-100%);
|
||||
}
|
||||
|
||||
.headroom--not-top {
|
||||
padding-top: .5rem;
|
||||
padding-bottom: .5rem;
|
||||
background-color: theme-color("default") !important;
|
||||
box-shadow: 0 1px 10px rgba(130, 130, 134, 0.1);
|
||||
}
|
||||
157
resources/assets/sass/core/vendors/_lavalamp.scss
vendored
Normal file
157
resources/assets/sass/core/vendors/_lavalamp.scss
vendored
Normal file
@@ -0,0 +1,157 @@
|
||||
//
|
||||
// Lavalamp
|
||||
//
|
||||
|
||||
|
||||
/*!
|
||||
* Lavalamp
|
||||
* http://lavalamp.magicmediamuse.com/
|
||||
*/
|
||||
|
||||
.lavalamp {
|
||||
position: relative;
|
||||
}
|
||||
.lavalamp-item {
|
||||
z-index: 5;
|
||||
position: relative;
|
||||
}
|
||||
.lavalamp-object {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
/* Custom easing transitions */
|
||||
|
||||
.lavalamp .lavalamp-object {
|
||||
transition-property:transform, width, height;
|
||||
}
|
||||
.lavalamp .lavalamp-object.ease {
|
||||
transition-timing-function: ease;
|
||||
}
|
||||
.lavalamp .lavalamp-object.ease-in {
|
||||
transition-timing-function: ease-in;
|
||||
}
|
||||
.lavalamp .lavalamp-object.ease-out {
|
||||
transition-timing-function: ease-out;
|
||||
}
|
||||
.lavalamp .lavalamp-object.ease-in-out {
|
||||
transition-timing-function: ease-in-out;
|
||||
}
|
||||
.lavalamp .lavalamp-object.linear {
|
||||
transition-timing-function: linear;
|
||||
}
|
||||
.lavalamp .lavalamp-object.easeInQuad {
|
||||
transition-timing-function: cubic-bezier(0.550, 0.085, 0.680, 0.530);
|
||||
}
|
||||
.lavalamp .lavalamp-object.easeInCubic {
|
||||
transition-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
|
||||
}
|
||||
.lavalamp .lavalamp-object.easeInQuart {
|
||||
transition-timing-function: cubic-bezier(0.895, 0.030, 0.685, 0.220);
|
||||
}
|
||||
.lavalamp .lavalamp-object.easeInQuint {
|
||||
transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
|
||||
}
|
||||
.lavalamp .lavalamp-object.easeInSine {
|
||||
transition-timing-function: cubic-bezier(0.470, 0.000, 0.745, 0.715);
|
||||
}
|
||||
.lavalamp .lavalamp-object.easeInExpo {
|
||||
transition-timing-function: cubic-bezier(0.950, 0.050, 0.795, 0.035);
|
||||
}
|
||||
.lavalamp .lavalamp-object.easeInCirc {
|
||||
transition-timing-function: cubic-bezier(0.600, 0.040, 0.980, 0.335);
|
||||
}
|
||||
.lavalamp .lavalamp-object.easeInBack {
|
||||
transition-timing-function: cubic-bezier(0.600, -0.280, 0.735, 0.045);
|
||||
}
|
||||
.lavalamp .lavalamp-object.easeOutQuad {
|
||||
transition-timing-function: cubic-bezier(0.250, 0.460, 0.450, 0.940);
|
||||
}
|
||||
.lavalamp .lavalamp-object.easeOutCubic {
|
||||
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
|
||||
}
|
||||
.lavalamp .lavalamp-object.easeOutQuart {
|
||||
-webkit-transition-timing-function: cubic-bezier(0.165, 0.840, 0.440, 1.000);
|
||||
-moz-transition-timing-function: cubic-bezier(0.165, 0.840, 0.440, 1.000);
|
||||
-o-transition-timing-function: cubic-bezier(0.165, 0.840, 0.440, 1.000);
|
||||
transition-timing-function: cubic-bezier(0.165, 0.840, 0.440, 1.000);
|
||||
}
|
||||
.lavalamp .lavalamp-object.easeOutQuint {
|
||||
-webkit-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000);
|
||||
-moz-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000);
|
||||
-o-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000);
|
||||
transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000);
|
||||
}
|
||||
.lavalamp .lavalamp-object.easeOutSine {
|
||||
-webkit-transition-timing-function: cubic-bezier(0.390, 0.575, 0.565, 1.000);
|
||||
-moz-transition-timing-function: cubic-bezier(0.390, 0.575, 0.565, 1.000);
|
||||
-o-transition-timing-function: cubic-bezier(0.390, 0.575, 0.565, 1.000);
|
||||
transition-timing-function: cubic-bezier(0.390, 0.575, 0.565, 1.000);
|
||||
}
|
||||
.lavalamp .lavalamp-object.easeOutExpo {
|
||||
-webkit-transition-timing-function: cubic-bezier(0.190, 1.000, 0.220, 1.000);
|
||||
-moz-transition-timing-function: cubic-bezier(0.190, 1.000, 0.220, 1.000);
|
||||
-o-transition-timing-function: cubic-bezier(0.190, 1.000, 0.220, 1.000);
|
||||
transition-timing-function: cubic-bezier(0.190, 1.000, 0.220, 1.000);
|
||||
}
|
||||
.lavalamp .lavalamp-object.easeOutCirc {
|
||||
-webkit-transition-timing-function: cubic-bezier(0.075, 0.820, 0.165, 1.000);
|
||||
-moz-transition-timing-function: cubic-bezier(0.075, 0.820, 0.165, 1.000);
|
||||
-o-transition-timing-function: cubic-bezier(0.075, 0.820, 0.165, 1.000);
|
||||
transition-timing-function: cubic-bezier(0.075, 0.820, 0.165, 1.000);
|
||||
}
|
||||
.lavalamp .lavalamp-object.easeOutBack {
|
||||
-webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.275);
|
||||
-moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.275);
|
||||
-o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.275);
|
||||
transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.275);
|
||||
}
|
||||
.lavalamp .lavalamp-object.easeInOutQuad {
|
||||
-webkit-transition-timing-function: cubic-bezier(0.455, 0.030, 0.515, 0.955);
|
||||
-moz-transition-timing-function: cubic-bezier(0.455, 0.030, 0.515, 0.955);
|
||||
-o-transition-timing-function: cubic-bezier(0.455, 0.030, 0.515, 0.955);
|
||||
transition-timing-function: cubic-bezier(0.455, 0.030, 0.515, 0.955);
|
||||
}
|
||||
.lavalamp .lavalamp-object.easeInOutCubic {
|
||||
-webkit-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
|
||||
-moz-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
|
||||
-o-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
|
||||
transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
|
||||
}
|
||||
.lavalamp .lavalamp-object.easeInOutQuart {
|
||||
-webkit-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
|
||||
-moz-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
|
||||
-o-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
|
||||
transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
|
||||
}
|
||||
.lavalamp .lavalamp-object.easeInOutQuint {
|
||||
-webkit-transition-timing-function: cubic-bezier(0.860, 0.000, 0.070, 1.000);
|
||||
-moz-transition-timing-function: cubic-bezier(0.860, 0.000, 0.070, 1.000);
|
||||
-o-transition-timing-function: cubic-bezier(0.860, 0.000, 0.070, 1.000);
|
||||
transition-timing-function: cubic-bezier(0.860, 0.000, 0.070, 1.000);
|
||||
}
|
||||
.lavalamp .lavalamp-object.easeInOutSine {
|
||||
-webkit-transition-timing-function: cubic-bezier(0.445, 0.050, 0.550, 0.950);
|
||||
-moz-transition-timing-function: cubic-bezier(0.445, 0.050, 0.550, 0.950);
|
||||
-o-transition-timing-function: cubic-bezier(0.445, 0.050, 0.550, 0.950);
|
||||
transition-timing-function: cubic-bezier(0.445, 0.050, 0.550, 0.950);
|
||||
}
|
||||
.lavalamp .lavalamp-object.easeInOutExpo {
|
||||
-webkit-transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000);
|
||||
-moz-transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000);
|
||||
-o-transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000);
|
||||
transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000);
|
||||
}
|
||||
.lavalamp .lavalamp-object.easeInOutCirc {
|
||||
-webkit-transition-timing-function: cubic-bezier(0.785, 0.135, 0.150, 0.860);
|
||||
-moz-transition-timing-function: cubic-bezier(0.785, 0.135, 0.150, 0.860);
|
||||
-o-transition-timing-function: cubic-bezier(0.785, 0.135, 0.150, 0.860);
|
||||
transition-timing-function: cubic-bezier(0.785, 0.135, 0.150, 0.860);
|
||||
}
|
||||
.lavalamp .lavalamp-object.easeInOutBack {
|
||||
-webkit-transition-timing-function: cubic-bezier(0.680, -0.550, 0.265, 1.550);
|
||||
-moz-transition-timing-function: cubic-bezier(0.680, -0.550, 0.265, 1.550);
|
||||
-o-transition-timing-function: cubic-bezier(0.680, -0.550, 0.265, 1.550);
|
||||
transition-timing-function: cubic-bezier(0.680, -0.550, 0.265, 1.550);
|
||||
}
|
||||
413
resources/assets/sass/core/vendors/_nouislider.scss
vendored
Normal file
413
resources/assets/sass/core/vendors/_nouislider.scss
vendored
Normal file
@@ -0,0 +1,413 @@
|
||||
//
|
||||
// NoUi Slider
|
||||
//
|
||||
|
||||
|
||||
// Original styles
|
||||
|
||||
.noUi-target,
|
||||
.noUi-target * {
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
||||
-webkit-user-select: none;
|
||||
touch-action: none;
|
||||
user-select: none;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.noUi-target {
|
||||
position: relative;
|
||||
direction: ltr;
|
||||
}
|
||||
|
||||
.noUi-base,
|
||||
.noUi-connects {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
|
||||
// Wrapper for all connect elements
|
||||
|
||||
.noUi-connects {
|
||||
overflow: hidden;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.noUi-connect,
|
||||
.noUi-origin {
|
||||
will-change: transform;
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
transform-origin: 0 0;
|
||||
}
|
||||
|
||||
|
||||
html:not([dir="rtl"]) .noUi-horizontal .noUi-origin {
|
||||
left: auto;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.noUi-vertical .noUi-origin {
|
||||
width: 0;
|
||||
}
|
||||
|
||||
.noUi-horizontal .noUi-origin {
|
||||
height: 0;
|
||||
}
|
||||
|
||||
.noUi-handle {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.noUi-state-tap .noUi-connect,
|
||||
.noUi-state-tap .noUi-origin {
|
||||
transition: transform .3s;
|
||||
}
|
||||
|
||||
.noUi-state-drag * {
|
||||
cursor: inherit !important;
|
||||
}
|
||||
|
||||
.noUi-horizontal {
|
||||
height: $noui-target-thickness;
|
||||
}
|
||||
|
||||
.noUi-horizontal .noUi-handle {
|
||||
width: 34px;
|
||||
height: 28px;
|
||||
left: -17px;
|
||||
top: -6px;
|
||||
}
|
||||
|
||||
.noUi-vertical {
|
||||
width: $noui-target-thickness;
|
||||
}
|
||||
|
||||
.noUi-vertical .noUi-handle {
|
||||
width: 28px;
|
||||
height: 34px;
|
||||
left: -6px;
|
||||
top: -17px;
|
||||
}
|
||||
|
||||
html:not([dir="rtl"]) .noUi-horizontal .noUi-handle {
|
||||
right: -17px;
|
||||
left: auto;
|
||||
}
|
||||
|
||||
.noUi-connects {
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.noUi-connect {
|
||||
background: $noui-slider-connect-bg;
|
||||
}
|
||||
|
||||
.noUi-draggable {
|
||||
cursor: ew-resize;
|
||||
}
|
||||
|
||||
.noUi-vertical .noUi-draggable {
|
||||
cursor: ns-resize;
|
||||
}
|
||||
|
||||
.noUi-handle {
|
||||
border: 1px solid #D9D9D9;
|
||||
border-radius: 3px;
|
||||
background: #FFF;
|
||||
cursor: default;
|
||||
box-shadow: inset 0 0 1px #FFF, inset 0 1px 7px #EBEBEB, 0 3px 6px -3px #BBB;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.noUi-active {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
|
||||
/* Disabled state;
|
||||
*/
|
||||
|
||||
[disabled] .noUi-connect {
|
||||
background: #B8B8B8;
|
||||
}
|
||||
|
||||
[disabled].noUi-target,
|
||||
[disabled].noUi-handle,
|
||||
[disabled] .noUi-handle {
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
|
||||
/* Base;
|
||||
*
|
||||
*/
|
||||
|
||||
.noUi-pips,
|
||||
.noUi-pips * {
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.noUi-pips {
|
||||
position: absolute;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
|
||||
/* Values;
|
||||
*
|
||||
*/
|
||||
|
||||
.noUi-value {
|
||||
position: absolute;
|
||||
white-space: nowrap;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.noUi-value-sub {
|
||||
color: #ccc;
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
|
||||
/* Markings;
|
||||
*
|
||||
*/
|
||||
|
||||
.noUi-marker {
|
||||
position: absolute;
|
||||
background: #CCC;
|
||||
}
|
||||
|
||||
.noUi-marker-sub {
|
||||
background: #AAA;
|
||||
}
|
||||
|
||||
.noUi-marker-large {
|
||||
background: #AAA;
|
||||
}
|
||||
|
||||
|
||||
/* Horizontal layout;
|
||||
*
|
||||
*/
|
||||
|
||||
.noUi-pips-horizontal {
|
||||
padding: 10px 0;
|
||||
height: 80px;
|
||||
top: 100%;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.noUi-value-horizontal {
|
||||
transform: translate(-50%, 50%);
|
||||
}
|
||||
|
||||
.noUi-rtl .noUi-value-horizontal {
|
||||
transform: translate(50%, 50%);
|
||||
}
|
||||
|
||||
.noUi-marker-horizontal.noUi-marker {
|
||||
margin-left: -1px;
|
||||
width: 2px;
|
||||
height: 5px;
|
||||
}
|
||||
|
||||
.noUi-marker-horizontal.noUi-marker-sub {
|
||||
height: 10px;
|
||||
}
|
||||
|
||||
.noUi-marker-horizontal.noUi-marker-large {
|
||||
height: 15px;
|
||||
}
|
||||
|
||||
|
||||
/* Vertical layout;
|
||||
*
|
||||
*/
|
||||
|
||||
.noUi-pips-vertical {
|
||||
padding: 0 10px;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
left: 100%;
|
||||
}
|
||||
|
||||
.noUi-value-vertical {
|
||||
-webkit-transform: translate(0, -50%);
|
||||
transform: translate(0, -50%, 0);
|
||||
padding-left: 25px;
|
||||
}
|
||||
|
||||
.noUi-rtl .noUi-value-vertical {
|
||||
-webkit-transform: translate(0, 50%);
|
||||
transform: translate(0, 50%);
|
||||
}
|
||||
|
||||
.noUi-marker-vertical.noUi-marker {
|
||||
width: 5px;
|
||||
height: 2px;
|
||||
margin-top: -1px;
|
||||
}
|
||||
|
||||
.noUi-marker-vertical.noUi-marker-sub {
|
||||
width: 10px;
|
||||
}
|
||||
|
||||
.noUi-marker-vertical.noUi-marker-large {
|
||||
width: 15px;
|
||||
}
|
||||
|
||||
.noUi-tooltip {
|
||||
display: block;
|
||||
position: absolute;
|
||||
border: 1px solid #D9D9D9;
|
||||
border-radius: 3px;
|
||||
background: #fff;
|
||||
color: #000;
|
||||
padding: 5px;
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.noUi-horizontal .noUi-tooltip {
|
||||
-webkit-transform: translate(-50%, 0);
|
||||
transform: translate(-50%, 0);
|
||||
left: 50%;
|
||||
bottom: 120%;
|
||||
}
|
||||
|
||||
.noUi-vertical .noUi-tooltip {
|
||||
-webkit-transform: translate(0, -50%);
|
||||
transform: translate(0, -50%);
|
||||
top: 50%;
|
||||
right: 120%;
|
||||
}
|
||||
|
||||
|
||||
// Custom styles
|
||||
|
||||
.noUi-target {
|
||||
background: $noui-target-bg;
|
||||
border-radius: $noui-target-border-radius;
|
||||
border: 0;
|
||||
box-shadow: $noui-target-box-shadow;
|
||||
margin: 15px 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.noUi-horizontal {
|
||||
height: $noui-target-thickness;
|
||||
}
|
||||
|
||||
html:not([dir="rtl"]) .noUi-horizontal .noUi-handle {
|
||||
right: -10px;
|
||||
}
|
||||
|
||||
.noUi-vertical {
|
||||
width: $noui-target-thickness;
|
||||
}
|
||||
|
||||
.noUi-connect {
|
||||
background: theme-color("primary");
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.noUi-handle {
|
||||
|
||||
}
|
||||
|
||||
.noUi-horizontal .noUi-handle,
|
||||
.noUi-vertical .noUi-handle {
|
||||
top: -$noui-target-thickness;
|
||||
width: $noui-handle-width;
|
||||
height: $noui-handle-width;
|
||||
border-radius: 100%;
|
||||
box-shadow: none;
|
||||
cursor: pointer;
|
||||
background-color: $noui-handle-bg;
|
||||
border: $noui-handle-border;
|
||||
transition: box-shadow .15s, transform .15s;
|
||||
}
|
||||
|
||||
.noUi-horizontal .noUi-handle.noUi-active,
|
||||
.noUi-vertical .noUi-handle.noUi-active {
|
||||
box-shadow: 0px 0px 0px 2px rgba($noui-handle-bg, 1);
|
||||
}
|
||||
|
||||
.input-slider--cyan .noUi-connect {
|
||||
background: $cyan;
|
||||
}
|
||||
|
||||
|
||||
/* Disabled state */
|
||||
|
||||
[disabled] .noUi-connect,
|
||||
[disabled].noUi-connect {
|
||||
background: $noui-slider-connect-disabled-bg;
|
||||
}
|
||||
|
||||
[disabled] .noUi-handle,
|
||||
[disabled].noUi-origin {
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
/* Range slider value labels */
|
||||
|
||||
.range-slider-value {
|
||||
font-size: $font-size-xs;
|
||||
font-weight: 500;
|
||||
background-color: rgba($dark, .7);
|
||||
color: color-yiq($dark);
|
||||
border-radius: 10px;
|
||||
padding: .4em .8em .3em .85em;
|
||||
}
|
||||
|
||||
.range-slider-wrapper .upper-info {
|
||||
font-weight: 400;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.input-slider-value-output {
|
||||
background: #333;
|
||||
color: #fff;
|
||||
padding: 4px 8px;
|
||||
position: relative;
|
||||
top: 12px;
|
||||
font-size: 11px;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.input-slider-value-output:after {
|
||||
bottom: 100%;
|
||||
left: 10px;
|
||||
border: solid transparent;
|
||||
content: " ";
|
||||
height: 0;
|
||||
width: 0;
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
border-color: rgba(136, 183, 213, 0);
|
||||
border-bottom-color: #333;
|
||||
border-width: 4px;
|
||||
margin-left: -4px;
|
||||
}
|
||||
|
||||
.input-slider-value-output.left:after {
|
||||
left: 10px;
|
||||
right: auto;
|
||||
}
|
||||
|
||||
.input-slider-value-output.right:after {
|
||||
right: 10px;
|
||||
left: auto;
|
||||
}
|
||||
280
resources/assets/sass/core/vendors/_quill.scss
vendored
Normal file
280
resources/assets/sass/core/vendors/_quill.scss
vendored
Normal file
@@ -0,0 +1,280 @@
|
||||
//
|
||||
// Quill
|
||||
//
|
||||
|
||||
.ql-container {
|
||||
font-family: $font-family-base;
|
||||
}
|
||||
|
||||
.ql-toolbar {
|
||||
position: relative;
|
||||
padding: $input-padding-y $input-padding-x;
|
||||
background-color: $input-bg;
|
||||
border: $input-border-width solid $input-border-color;
|
||||
border-radius: $input-border-radius $input-border-radius 0 0;
|
||||
color: $input-color;
|
||||
}
|
||||
|
||||
.ql-toolbar + .ql-container {
|
||||
margin-top: -$border-width;
|
||||
}
|
||||
|
||||
.ql-toolbar + .ql-container .ql-editor {
|
||||
border-top-left-radius: 0;
|
||||
border-top-right-radius: 0;
|
||||
}
|
||||
|
||||
.ql-editor {
|
||||
min-height: $line-height-base * $font-size-base * 4;
|
||||
display: block;
|
||||
width: 100%;
|
||||
padding: $input-padding-y $input-padding-x;
|
||||
font-size: $font-size-base;
|
||||
line-height: $input-line-height;
|
||||
color: $input-color;
|
||||
background-color: $input-bg;
|
||||
background-clip: padding-box;
|
||||
border: $input-border-width solid $input-border-color;
|
||||
|
||||
// Note: This has no effect on <select>s in some browsers, due to the limited stylability of `<select>`s in CSS.
|
||||
@if $enable-rounded {
|
||||
// Manually use the if/else instead of the mixin to account for iOS override
|
||||
border-radius: $input-border-radius;
|
||||
} @else {
|
||||
// Otherwise undo the iOS default
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
@include box-shadow($input-box-shadow);
|
||||
@include transition($input-transition);
|
||||
|
||||
// Unstyle the caret on `<select>`s in IE10+.
|
||||
&::-ms-expand {
|
||||
background-color: transparent;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
// Customize the `:focus` state to imitate native WebKit styles.
|
||||
@include form-control-focus();
|
||||
|
||||
&:focus {
|
||||
border-color: $input-border-color;
|
||||
}
|
||||
}
|
||||
|
||||
.ql-hidden {
|
||||
position: absolute;
|
||||
transform: scale(0);
|
||||
}
|
||||
|
||||
|
||||
// Placeholder
|
||||
|
||||
.ql-editor.ql-blank::before {
|
||||
top: $input-padding-y; left: $input-padding-x;
|
||||
font-style: normal;
|
||||
color: $input-placeholder-color;
|
||||
}
|
||||
|
||||
.ql-editor:focus::before {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
// Toolbar
|
||||
|
||||
.ql-formats {
|
||||
padding-left: .5rem;
|
||||
padding-right: .5rem;
|
||||
|
||||
&:first-child {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
padding-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.ql-toolbar button {
|
||||
padding: 0 .25rem;
|
||||
background: none; border: none;
|
||||
color: $body-color;
|
||||
cursor: pointer;
|
||||
transition: $transition-base;
|
||||
|
||||
&:hover {
|
||||
color: $primary;
|
||||
}
|
||||
|
||||
&:first-child {
|
||||
margin-left: -.25rem;
|
||||
}
|
||||
}
|
||||
|
||||
.ql-toolbar .ql-active {
|
||||
color: $primary;
|
||||
}
|
||||
|
||||
.ql-toolbar button svg {
|
||||
height: $font-size-lg; width: $font-size-lg;
|
||||
}
|
||||
|
||||
.ql-toolbar .ql-stroke {
|
||||
stroke: currentColor;
|
||||
stroke-width: 2;
|
||||
stroke-linecap: round;
|
||||
stroke-linejoin: round;
|
||||
fill: none;
|
||||
}
|
||||
|
||||
.ql-toolbar .ql-thin {
|
||||
stroke-width: 1;
|
||||
}
|
||||
|
||||
.ql-toolbar .ql-fill {
|
||||
fill: currentColor;
|
||||
}
|
||||
|
||||
.ql-toolbar input.ql-image {
|
||||
position: absolute;
|
||||
transform: scale(0);
|
||||
}
|
||||
|
||||
|
||||
// Tooltip
|
||||
|
||||
.ql-tooltip {
|
||||
position: absolute;
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
width: 18.5rem;
|
||||
background-color: $popover-bg;
|
||||
border: $popover-border-width solid $popover-border-color;
|
||||
border-radius: $popover-border-radius;
|
||||
padding: $input-padding-y $input-padding-x;
|
||||
margin-top: .6rem; // arrow width
|
||||
box-shadow: $popover-box-shadow;
|
||||
|
||||
// Arrow
|
||||
|
||||
&:before, &:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 50%; bottom: 100%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
&:before {
|
||||
border-bottom: .6rem solid $popover-border-color;
|
||||
border-left: .6rem solid transparent;
|
||||
border-right: .6rem solid transparent;
|
||||
}
|
||||
|
||||
&:after {
|
||||
border-bottom: .5rem solid $popover-bg;
|
||||
border-left: .5rem solid transparent;
|
||||
border-right: .5rem solid transparent;
|
||||
}
|
||||
}
|
||||
|
||||
.ql-container .ql-tooltip:hover {
|
||||
display: flex !important;
|
||||
}
|
||||
|
||||
.ql-tooltip .ql-preview {
|
||||
width: 100%;
|
||||
@include button-size($btn-padding-y-sm, $btn-padding-x-sm, $font-size-sm, $btn-line-height-sm, $btn-border-radius-sm);
|
||||
@include transition($btn-transition);
|
||||
}
|
||||
|
||||
.ql-tooltip.ql-editing .ql-preview {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.ql-tooltip input {
|
||||
display: none;
|
||||
width: 100%;
|
||||
padding-top: calc(#{$input-padding-y-sm} + #{$input-border-width});
|
||||
padding-bottom: calc(#{$input-padding-y-sm} + #{$input-border-width});
|
||||
background-color: transparent;
|
||||
font-size: $font-size-sm;
|
||||
line-height: $input-line-height-sm;
|
||||
border: none;
|
||||
color: $input-color;
|
||||
|
||||
&:focus {
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
|
||||
.ql-tooltip.ql-editing input {
|
||||
display: block;
|
||||
}
|
||||
|
||||
|
||||
.ql-tooltip .ql-action,
|
||||
.ql-tooltip .ql-remove {
|
||||
margin-left: .25rem;
|
||||
}
|
||||
|
||||
.ql-tooltip .ql-action::before,
|
||||
.ql-tooltip .ql-remove::before {
|
||||
display: inline-block;
|
||||
font-weight: $btn-font-weight;
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
vertical-align: middle;
|
||||
user-select: none;
|
||||
border: $btn-border-width solid transparent;
|
||||
cursor: pointer;
|
||||
@include button-size($btn-padding-y-sm, $btn-padding-x-sm, $font-size-sm, $btn-line-height-sm, $btn-border-radius-sm);
|
||||
@include transition($btn-transition);
|
||||
|
||||
// Share hover and focus styles
|
||||
@include hover-focus {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
&:focus,
|
||||
&.focus {
|
||||
outline: 0;
|
||||
box-shadow: $btn-focus-box-shadow;
|
||||
}
|
||||
}
|
||||
|
||||
.ql-tooltip .ql-action::before,
|
||||
.ql-tooltip.ql-editing .ql-action::before {
|
||||
@include button-variant($primary, $primary);
|
||||
}
|
||||
|
||||
.ql-tooltip .ql-action::before {
|
||||
content: 'Edit';
|
||||
}
|
||||
|
||||
.ql-tooltip.ql-editing .ql-action::before {
|
||||
content: 'Save';
|
||||
}
|
||||
|
||||
.ql-tooltip .ql-remove::before {
|
||||
@include button-variant($white, $white);
|
||||
content: 'Remove';
|
||||
border-color: $gray-300;
|
||||
}
|
||||
|
||||
.ql-tooltip.ql-editing .ql-remove::before {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
// Formatting
|
||||
|
||||
.ql-editor blockquote {
|
||||
margin-bottom: $spacer;
|
||||
font-size: $blockquote-font-size;
|
||||
}
|
||||
|
||||
.ql-editor img {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
949
resources/assets/sass/core/vendors/_scrollbar.scss
vendored
Normal file
949
resources/assets/sass/core/vendors/_scrollbar.scss
vendored
Normal file
@@ -0,0 +1,949 @@
|
||||
//
|
||||
// Jquery scrollbar
|
||||
// default styles
|
||||
//
|
||||
|
||||
.scroll-wrapper {
|
||||
overflow: hidden !important;
|
||||
padding: 0 !important;
|
||||
position: relative;
|
||||
}
|
||||
.scroll-wrapper > .scroll-content {
|
||||
border: none !important;
|
||||
box-sizing: content-box !important;
|
||||
height: auto;
|
||||
left: 0;
|
||||
margin: 0;
|
||||
max-height: none;
|
||||
max-width: none !important;
|
||||
overflow: scroll !important;
|
||||
padding: 0;
|
||||
position: relative !important;
|
||||
top: 0;
|
||||
width: auto !important;
|
||||
}
|
||||
.scroll-wrapper > .scroll-content::-webkit-scrollbar {
|
||||
height: 0;
|
||||
width: 0;
|
||||
}
|
||||
.scroll-wrapper.scroll--rtl {
|
||||
direction: rtl;
|
||||
}
|
||||
|
||||
.scroll-element {
|
||||
box-sizing: content-box;
|
||||
display: none;
|
||||
}
|
||||
.scroll-element div {
|
||||
box-sizing: content-box;
|
||||
}
|
||||
.scroll-element .scroll-bar,
|
||||
.scroll-element .scroll-arrow {
|
||||
cursor: default;
|
||||
}
|
||||
.scroll-element.scroll-x.scroll-scrollx_visible, .scroll-element.scroll-y.scroll-scrolly_visible {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.scroll-textarea {
|
||||
border: 1px solid #cccccc;
|
||||
border-top-color: #999999;
|
||||
}
|
||||
.scroll-textarea > .scroll-content {
|
||||
overflow: hidden !important;
|
||||
}
|
||||
.scroll-textarea > .scroll-content > textarea {
|
||||
border: none !important;
|
||||
box-sizing: border-box;
|
||||
height: 100% !important;
|
||||
margin: 0;
|
||||
max-height: none !important;
|
||||
max-width: none !important;
|
||||
overflow: scroll !important;
|
||||
outline: none;
|
||||
padding: 2px;
|
||||
position: relative !important;
|
||||
top: 0;
|
||||
width: 100% !important;
|
||||
}
|
||||
.scroll-textarea > .scroll-content > textarea::-webkit-scrollbar {
|
||||
height: 0;
|
||||
width: 0;
|
||||
}
|
||||
|
||||
/*************** SIMPLE INNER SCROLLBAR ***************/
|
||||
.scrollbar-inner > .scroll-element,
|
||||
.scrollbar-inner > .scroll-element div {
|
||||
border: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.scrollbar-inner > .scroll-element div {
|
||||
display: block;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.scrollbar-inner > .scroll-element.scroll-x {
|
||||
bottom: 2px;
|
||||
height: 8px;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.scrollbar-inner > .scroll-element.scroll-y {
|
||||
height: 100%;
|
||||
right: 2px;
|
||||
top: 0;
|
||||
width: 8px;
|
||||
}
|
||||
|
||||
.scrollbar-inner > .scroll-element .scroll-element_outer {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.scrollbar-inner > .scroll-element .scroll-element_outer,
|
||||
.scrollbar-inner > .scroll-element .scroll-element_track,
|
||||
.scrollbar-inner > .scroll-element .scroll-bar {
|
||||
-webkit-border-radius: 8px;
|
||||
-moz-border-radius: 8px;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.scrollbar-inner > .scroll-element .scroll-element_track,
|
||||
.scrollbar-inner > .scroll-element .scroll-bar {
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
|
||||
filter: alpha(opacity=40);
|
||||
opacity: 0.4;
|
||||
}
|
||||
|
||||
.scrollbar-inner > .scroll-element .scroll-element_track {
|
||||
background-color: #e0e0e0;
|
||||
}
|
||||
|
||||
.scrollbar-inner > .scroll-element .scroll-bar {
|
||||
background-color: #c2c2c2;
|
||||
}
|
||||
|
||||
.scrollbar-inner > .scroll-element:hover .scroll-bar {
|
||||
background-color: #919191;
|
||||
}
|
||||
|
||||
.scrollbar-inner > .scroll-element.scroll-draggable .scroll-bar {
|
||||
background-color: #919191;
|
||||
}
|
||||
|
||||
/* update scrollbar offset if both scrolls are visible */
|
||||
.scrollbar-inner > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track {
|
||||
left: -12px;
|
||||
}
|
||||
|
||||
.scrollbar-inner > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track {
|
||||
top: -12px;
|
||||
}
|
||||
|
||||
.scrollbar-inner > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size {
|
||||
left: -12px;
|
||||
}
|
||||
|
||||
.scrollbar-inner > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size {
|
||||
top: -12px;
|
||||
}
|
||||
|
||||
/*************** SIMPLE OUTER SCROLLBAR ***************/
|
||||
.scrollbar-outer > .scroll-element,
|
||||
.scrollbar-outer > .scroll-element div {
|
||||
border: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.scrollbar-outer > .scroll-element {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.scrollbar-outer > .scroll-element div {
|
||||
display: block;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.scrollbar-outer > .scroll-element.scroll-x {
|
||||
bottom: 0;
|
||||
height: 12px;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.scrollbar-outer > .scroll-element.scroll-y {
|
||||
height: 100%;
|
||||
right: 0;
|
||||
top: 0;
|
||||
width: 12px;
|
||||
}
|
||||
|
||||
.scrollbar-outer > .scroll-element.scroll-x .scroll-element_outer {
|
||||
height: 8px;
|
||||
top: 2px;
|
||||
}
|
||||
|
||||
.scrollbar-outer > .scroll-element.scroll-y .scroll-element_outer {
|
||||
left: 2px;
|
||||
width: 8px;
|
||||
}
|
||||
|
||||
.scrollbar-outer > .scroll-element .scroll-element_outer {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.scrollbar-outer > .scroll-element .scroll-element_track {
|
||||
background-color: #eeeeee;
|
||||
}
|
||||
|
||||
.scrollbar-outer > .scroll-element .scroll-element_outer,
|
||||
.scrollbar-outer > .scroll-element .scroll-element_track,
|
||||
.scrollbar-outer > .scroll-element .scroll-bar {
|
||||
-webkit-border-radius: 8px;
|
||||
-moz-border-radius: 8px;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.scrollbar-outer > .scroll-element .scroll-bar {
|
||||
background-color: #d9d9d9;
|
||||
}
|
||||
|
||||
.scrollbar-outer > .scroll-element .scroll-bar:hover {
|
||||
background-color: #c2c2c2;
|
||||
}
|
||||
|
||||
.scrollbar-outer > .scroll-element.scroll-draggable .scroll-bar {
|
||||
background-color: #919191;
|
||||
}
|
||||
|
||||
/* scrollbar height/width & offset from container borders */
|
||||
.scrollbar-outer > .scroll-content.scroll-scrolly_visible {
|
||||
left: -12px;
|
||||
margin-left: 12px;
|
||||
}
|
||||
|
||||
.scrollbar-outer > .scroll-content.scroll-scrollx_visible {
|
||||
top: -12px;
|
||||
margin-top: 12px;
|
||||
}
|
||||
|
||||
.scrollbar-outer > .scroll-element.scroll-x .scroll-bar {
|
||||
min-width: 10px;
|
||||
}
|
||||
|
||||
.scrollbar-outer > .scroll-element.scroll-y .scroll-bar {
|
||||
min-height: 10px;
|
||||
}
|
||||
|
||||
/* update scrollbar offset if both scrolls are visible */
|
||||
.scrollbar-outer > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track {
|
||||
left: -14px;
|
||||
}
|
||||
|
||||
.scrollbar-outer > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track {
|
||||
top: -14px;
|
||||
}
|
||||
|
||||
.scrollbar-outer > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size {
|
||||
left: -14px;
|
||||
}
|
||||
|
||||
.scrollbar-outer > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size {
|
||||
top: -14px;
|
||||
}
|
||||
|
||||
/*************** SCROLLBAR MAC OS X ***************/
|
||||
.scrollbar-macosx > .scroll-element,
|
||||
.scrollbar-macosx > .scroll-element div {
|
||||
background: none;
|
||||
border: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.scrollbar-macosx > .scroll-element div {
|
||||
display: block;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.scrollbar-macosx > .scroll-element .scroll-element_track {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.scrollbar-macosx > .scroll-element .scroll-bar {
|
||||
background-color: #6C6E71;
|
||||
display: block;
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
|
||||
filter: alpha(opacity=0);
|
||||
opacity: 0;
|
||||
-webkit-border-radius: 7px;
|
||||
-moz-border-radius: 7px;
|
||||
border-radius: 7px;
|
||||
-webkit-transition: opacity 0.2s linear;
|
||||
-moz-transition: opacity 0.2s linear;
|
||||
-o-transition: opacity 0.2s linear;
|
||||
-ms-transition: opacity 0.2s linear;
|
||||
transition: opacity 0.2s linear;
|
||||
}
|
||||
|
||||
.scrollbar-macosx:hover > .scroll-element .scroll-bar,
|
||||
.scrollbar-macosx > .scroll-element.scroll-draggable .scroll-bar {
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
|
||||
filter: alpha(opacity=70);
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
.scrollbar-macosx > .scroll-element.scroll-x {
|
||||
bottom: 0px;
|
||||
height: 0px;
|
||||
left: 0;
|
||||
min-width: 100%;
|
||||
overflow: visible;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.scrollbar-macosx > .scroll-element.scroll-y {
|
||||
height: 100%;
|
||||
min-height: 100%;
|
||||
right: 0px;
|
||||
top: 0;
|
||||
width: 0px;
|
||||
}
|
||||
|
||||
/* scrollbar height/width & offset from container borders */
|
||||
.scrollbar-macosx > .scroll-element.scroll-x .scroll-bar {
|
||||
height: 7px;
|
||||
min-width: 10px;
|
||||
top: -9px;
|
||||
}
|
||||
|
||||
.scrollbar-macosx > .scroll-element.scroll-y .scroll-bar {
|
||||
left: -9px;
|
||||
min-height: 10px;
|
||||
width: 7px;
|
||||
}
|
||||
|
||||
.scrollbar-macosx > .scroll-element.scroll-x .scroll-element_outer {
|
||||
left: 2px;
|
||||
}
|
||||
|
||||
.scrollbar-macosx > .scroll-element.scroll-x .scroll-element_size {
|
||||
left: -4px;
|
||||
}
|
||||
|
||||
.scrollbar-macosx > .scroll-element.scroll-y .scroll-element_outer {
|
||||
top: 2px;
|
||||
}
|
||||
|
||||
.scrollbar-macosx > .scroll-element.scroll-y .scroll-element_size {
|
||||
top: -4px;
|
||||
}
|
||||
|
||||
/* update scrollbar offset if both scrolls are visible */
|
||||
.scrollbar-macosx > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size {
|
||||
left: -11px;
|
||||
}
|
||||
|
||||
.scrollbar-macosx > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size {
|
||||
top: -11px;
|
||||
}
|
||||
|
||||
/*************** SCROLLBAR LIGHT ***************/
|
||||
.scrollbar-light > .scroll-element,
|
||||
.scrollbar-light > .scroll-element div {
|
||||
border: none;
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.scrollbar-light > .scroll-element {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.scrollbar-light > .scroll-element div {
|
||||
display: block;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.scrollbar-light > .scroll-element .scroll-element_outer {
|
||||
-webkit-border-radius: 10px;
|
||||
-moz-border-radius: 10px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.scrollbar-light > .scroll-element .scroll-element_size {
|
||||
background: #dbdbdb;
|
||||
background: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2RiZGJkYiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlOGU4ZTgiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+");
|
||||
background: -moz-linear-gradient(left, #dbdbdb 0%, #e8e8e8 100%);
|
||||
background: -webkit-gradient(linear, left top, right top, color-stop(0%, #dbdbdb), color-stop(100%, #e8e8e8));
|
||||
background: -webkit-linear-gradient(left, #dbdbdb 0%, #e8e8e8 100%);
|
||||
background: -o-linear-gradient(left, #dbdbdb 0%, #e8e8e8 100%);
|
||||
background: -ms-linear-gradient(left, #dbdbdb 0%, #e8e8e8 100%);
|
||||
background: linear-gradient(to right, #dbdbdb 0%, #e8e8e8 100%);
|
||||
-webkit-border-radius: 10px;
|
||||
-moz-border-radius: 10px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.scrollbar-light > .scroll-element.scroll-x {
|
||||
bottom: 0;
|
||||
height: 17px;
|
||||
left: 0;
|
||||
min-width: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.scrollbar-light > .scroll-element.scroll-y {
|
||||
height: 100%;
|
||||
min-height: 100%;
|
||||
right: 0;
|
||||
top: 0;
|
||||
width: 17px;
|
||||
}
|
||||
|
||||
.scrollbar-light > .scroll-element .scroll-bar {
|
||||
background: #fefefe;
|
||||
background: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZlZmVmZSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmNWY1ZjUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+");
|
||||
background: -moz-linear-gradient(left, #fefefe 0%, #f5f5f5 100%);
|
||||
background: -webkit-gradient(linear, left top, right top, color-stop(0%, #fefefe), color-stop(100%, #f5f5f5));
|
||||
background: -webkit-linear-gradient(left, #fefefe 0%, #f5f5f5 100%);
|
||||
background: -o-linear-gradient(left, #fefefe 0%, #f5f5f5 100%);
|
||||
background: -ms-linear-gradient(left, #fefefe 0%, #f5f5f5 100%);
|
||||
background: linear-gradient(to right, #fefefe 0%, #f5f5f5 100%);
|
||||
border: 1px solid #dbdbdb;
|
||||
-webkit-border-radius: 10px;
|
||||
-moz-border-radius: 10px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
/* scrollbar height/width & offset from container borders */
|
||||
.scrollbar-light > .scroll-content.scroll-scrolly_visible {
|
||||
left: -17px;
|
||||
margin-left: 17px;
|
||||
}
|
||||
|
||||
.scrollbar-light > .scroll-content.scroll-scrollx_visible {
|
||||
top: -17px;
|
||||
margin-top: 17px;
|
||||
}
|
||||
|
||||
.scrollbar-light > .scroll-element.scroll-x .scroll-bar {
|
||||
height: 10px;
|
||||
min-width: 10px;
|
||||
top: 0px;
|
||||
}
|
||||
|
||||
.scrollbar-light > .scroll-element.scroll-y .scroll-bar {
|
||||
left: 0px;
|
||||
min-height: 10px;
|
||||
width: 10px;
|
||||
}
|
||||
|
||||
.scrollbar-light > .scroll-element.scroll-x .scroll-element_outer {
|
||||
height: 12px;
|
||||
left: 2px;
|
||||
top: 2px;
|
||||
}
|
||||
|
||||
.scrollbar-light > .scroll-element.scroll-x .scroll-element_size {
|
||||
left: -4px;
|
||||
}
|
||||
|
||||
.scrollbar-light > .scroll-element.scroll-y .scroll-element_outer {
|
||||
left: 2px;
|
||||
top: 2px;
|
||||
width: 12px;
|
||||
}
|
||||
|
||||
.scrollbar-light > .scroll-element.scroll-y .scroll-element_size {
|
||||
top: -4px;
|
||||
}
|
||||
|
||||
/* update scrollbar offset if both scrolls are visible */
|
||||
.scrollbar-light > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size {
|
||||
left: -19px;
|
||||
}
|
||||
|
||||
.scrollbar-light > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size {
|
||||
top: -19px;
|
||||
}
|
||||
|
||||
.scrollbar-light > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track {
|
||||
left: -19px;
|
||||
}
|
||||
|
||||
.scrollbar-light > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track {
|
||||
top: -19px;
|
||||
}
|
||||
|
||||
/*************** SCROLLBAR RAIL ***************/
|
||||
.scrollbar-rail > .scroll-element,
|
||||
.scrollbar-rail > .scroll-element div {
|
||||
border: none;
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.scrollbar-rail > .scroll-element {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.scrollbar-rail > .scroll-element div {
|
||||
display: block;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.scrollbar-rail > .scroll-element .scroll-element_size {
|
||||
background-color: #999;
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
.scrollbar-rail > .scroll-element .scroll-element_outer:hover .scroll-element_size {
|
||||
background-color: #666;
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
|
||||
.scrollbar-rail > .scroll-element.scroll-x {
|
||||
bottom: 0;
|
||||
height: 12px;
|
||||
left: 0;
|
||||
min-width: 100%;
|
||||
padding: 3px 0 2px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.scrollbar-rail > .scroll-element.scroll-y {
|
||||
height: 100%;
|
||||
min-height: 100%;
|
||||
padding: 0 2px 0 3px;
|
||||
right: 0;
|
||||
top: 0;
|
||||
width: 12px;
|
||||
}
|
||||
|
||||
.scrollbar-rail > .scroll-element .scroll-bar {
|
||||
background-color: #d0b9a0;
|
||||
-webkit-border-radius: 2px;
|
||||
-moz-border-radius: 2px;
|
||||
border-radius: 2px;
|
||||
box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
|
||||
.scrollbar-rail > .scroll-element .scroll-element_outer:hover .scroll-bar {
|
||||
box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.6);
|
||||
}
|
||||
|
||||
/* scrollbar height/width & offset from container borders */
|
||||
.scrollbar-rail > .scroll-content.scroll-scrolly_visible {
|
||||
left: -17px;
|
||||
margin-left: 17px;
|
||||
}
|
||||
|
||||
.scrollbar-rail > .scroll-content.scroll-scrollx_visible {
|
||||
margin-top: 17px;
|
||||
top: -17px;
|
||||
}
|
||||
|
||||
.scrollbar-rail > .scroll-element.scroll-x .scroll-bar {
|
||||
height: 10px;
|
||||
min-width: 10px;
|
||||
top: 1px;
|
||||
}
|
||||
|
||||
.scrollbar-rail > .scroll-element.scroll-y .scroll-bar {
|
||||
left: 1px;
|
||||
min-height: 10px;
|
||||
width: 10px;
|
||||
}
|
||||
|
||||
.scrollbar-rail > .scroll-element.scroll-x .scroll-element_outer {
|
||||
height: 15px;
|
||||
left: 5px;
|
||||
}
|
||||
|
||||
.scrollbar-rail > .scroll-element.scroll-x .scroll-element_size {
|
||||
height: 2px;
|
||||
left: -10px;
|
||||
top: 5px;
|
||||
}
|
||||
|
||||
.scrollbar-rail > .scroll-element.scroll-y .scroll-element_outer {
|
||||
top: 5px;
|
||||
width: 15px;
|
||||
}
|
||||
|
||||
.scrollbar-rail > .scroll-element.scroll-y .scroll-element_size {
|
||||
left: 5px;
|
||||
top: -10px;
|
||||
width: 2px;
|
||||
}
|
||||
|
||||
/* update scrollbar offset if both scrolls are visible */
|
||||
.scrollbar-rail > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size {
|
||||
left: -25px;
|
||||
}
|
||||
|
||||
.scrollbar-rail > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size {
|
||||
top: -25px;
|
||||
}
|
||||
|
||||
.scrollbar-rail > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track {
|
||||
left: -25px;
|
||||
}
|
||||
|
||||
.scrollbar-rail > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track {
|
||||
top: -25px;
|
||||
}
|
||||
|
||||
/*************** SCROLLBAR DYNAMIC ***************/
|
||||
.scrollbar-dynamic > .scroll-element,
|
||||
.scrollbar-dynamic > .scroll-element div {
|
||||
background: none;
|
||||
border: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.scrollbar-dynamic > .scroll-element div {
|
||||
display: block;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.scrollbar-dynamic > .scroll-element.scroll-x {
|
||||
bottom: 2px;
|
||||
height: 7px;
|
||||
left: 0;
|
||||
min-width: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.scrollbar-dynamic > .scroll-element.scroll-y {
|
||||
height: 100%;
|
||||
min-height: 100%;
|
||||
right: 2px;
|
||||
top: 0;
|
||||
width: 7px;
|
||||
}
|
||||
|
||||
.scrollbar-dynamic > .scroll-element .scroll-element_outer {
|
||||
opacity: 0.3;
|
||||
-webkit-border-radius: 12px;
|
||||
-moz-border-radius: 12px;
|
||||
border-radius: 12px;
|
||||
}
|
||||
|
||||
.scrollbar-dynamic > .scroll-element .scroll-element_size {
|
||||
background-color: #cccccc;
|
||||
opacity: 0;
|
||||
-webkit-border-radius: 12px;
|
||||
-moz-border-radius: 12px;
|
||||
border-radius: 12px;
|
||||
-webkit-transition: opacity 0.2s;
|
||||
-moz-transition: opacity 0.2s;
|
||||
-o-transition: opacity 0.2s;
|
||||
-ms-transition: opacity 0.2s;
|
||||
transition: opacity 0.2s;
|
||||
}
|
||||
|
||||
.scrollbar-dynamic > .scroll-element .scroll-bar {
|
||||
background-color: #6c6e71;
|
||||
-webkit-border-radius: 7px;
|
||||
-moz-border-radius: 7px;
|
||||
border-radius: 7px;
|
||||
}
|
||||
|
||||
/* scrollbar height/width & offset from container borders */
|
||||
.scrollbar-dynamic > .scroll-element.scroll-x .scroll-bar {
|
||||
bottom: 0;
|
||||
height: 7px;
|
||||
min-width: 24px;
|
||||
top: auto;
|
||||
}
|
||||
|
||||
.scrollbar-dynamic > .scroll-element.scroll-y .scroll-bar {
|
||||
left: auto;
|
||||
min-height: 24px;
|
||||
right: 0;
|
||||
width: 7px;
|
||||
}
|
||||
|
||||
.scrollbar-dynamic > .scroll-element.scroll-x .scroll-element_outer {
|
||||
bottom: 0;
|
||||
top: auto;
|
||||
left: 2px;
|
||||
-webkit-transition: height 0.2s;
|
||||
-moz-transition: height 0.2s;
|
||||
-o-transition: height 0.2s;
|
||||
-ms-transition: height 0.2s;
|
||||
transition: height 0.2s;
|
||||
}
|
||||
|
||||
.scrollbar-dynamic > .scroll-element.scroll-y .scroll-element_outer {
|
||||
left: auto;
|
||||
right: 0;
|
||||
top: 2px;
|
||||
-webkit-transition: width 0.2s;
|
||||
-moz-transition: width 0.2s;
|
||||
-o-transition: width 0.2s;
|
||||
-ms-transition: width 0.2s;
|
||||
transition: width 0.2s;
|
||||
}
|
||||
|
||||
.scrollbar-dynamic > .scroll-element.scroll-x .scroll-element_size {
|
||||
left: -4px;
|
||||
}
|
||||
|
||||
.scrollbar-dynamic > .scroll-element.scroll-y .scroll-element_size {
|
||||
top: -4px;
|
||||
}
|
||||
|
||||
/* update scrollbar offset if both scrolls are visible */
|
||||
.scrollbar-dynamic > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size {
|
||||
left: -11px;
|
||||
}
|
||||
|
||||
.scrollbar-dynamic > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size {
|
||||
top: -11px;
|
||||
}
|
||||
|
||||
/* hover & drag */
|
||||
.scrollbar-dynamic > .scroll-element:hover .scroll-element_outer,
|
||||
.scrollbar-dynamic > .scroll-element.scroll-draggable .scroll-element_outer {
|
||||
overflow: hidden;
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
|
||||
filter: alpha(opacity=70);
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
.scrollbar-dynamic > .scroll-element:hover .scroll-element_outer .scroll-element_size,
|
||||
.scrollbar-dynamic > .scroll-element.scroll-draggable .scroll-element_outer .scroll-element_size {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.scrollbar-dynamic > .scroll-element:hover .scroll-element_outer .scroll-bar,
|
||||
.scrollbar-dynamic > .scroll-element.scroll-draggable .scroll-element_outer .scroll-bar {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
-webkit-border-radius: 12px;
|
||||
-moz-border-radius: 12px;
|
||||
border-radius: 12px;
|
||||
}
|
||||
|
||||
.scrollbar-dynamic > .scroll-element.scroll-x:hover .scroll-element_outer,
|
||||
.scrollbar-dynamic > .scroll-element.scroll-x.scroll-draggable .scroll-element_outer {
|
||||
height: 20px;
|
||||
min-height: 7px;
|
||||
}
|
||||
|
||||
.scrollbar-dynamic > .scroll-element.scroll-y:hover .scroll-element_outer,
|
||||
.scrollbar-dynamic > .scroll-element.scroll-y.scroll-draggable .scroll-element_outer {
|
||||
min-width: 7px;
|
||||
width: 20px;
|
||||
}
|
||||
|
||||
/*************** SCROLLBAR GOOGLE CHROME ***************/
|
||||
.scrollbar-chrome > .scroll-element,
|
||||
.scrollbar-chrome > .scroll-element div {
|
||||
border: none;
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.scrollbar-chrome > .scroll-element {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.scrollbar-chrome > .scroll-element div {
|
||||
display: block;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.scrollbar-chrome > .scroll-element .scroll-element_track {
|
||||
background: #f1f1f1;
|
||||
border: 1px solid #dbdbdb;
|
||||
}
|
||||
|
||||
.scrollbar-chrome > .scroll-element.scroll-x {
|
||||
bottom: 0;
|
||||
height: 16px;
|
||||
left: 0;
|
||||
min-width: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.scrollbar-chrome > .scroll-element.scroll-y {
|
||||
height: 100%;
|
||||
min-height: 100%;
|
||||
right: 0;
|
||||
top: 0;
|
||||
width: 16px;
|
||||
}
|
||||
|
||||
.scrollbar-chrome > .scroll-element .scroll-bar {
|
||||
background-color: #d9d9d9;
|
||||
border: 1px solid #bdbdbd;
|
||||
cursor: default;
|
||||
-webkit-border-radius: 2px;
|
||||
-moz-border-radius: 2px;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.scrollbar-chrome > .scroll-element .scroll-bar:hover {
|
||||
background-color: #c2c2c2;
|
||||
border-color: #a9a9a9;
|
||||
}
|
||||
|
||||
.scrollbar-chrome > .scroll-element.scroll-draggable .scroll-bar {
|
||||
background-color: #919191;
|
||||
border-color: #7e7e7e;
|
||||
}
|
||||
|
||||
/* scrollbar height/width & offset from container borders */
|
||||
.scrollbar-chrome > .scroll-content.scroll-scrolly_visible {
|
||||
left: -16px;
|
||||
margin-left: 16px;
|
||||
}
|
||||
|
||||
.scrollbar-chrome > .scroll-content.scroll-scrollx_visible {
|
||||
top: -16px;
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
.scrollbar-chrome > .scroll-element.scroll-x .scroll-bar {
|
||||
height: 8px;
|
||||
min-width: 10px;
|
||||
top: 3px;
|
||||
}
|
||||
|
||||
.scrollbar-chrome > .scroll-element.scroll-y .scroll-bar {
|
||||
left: 3px;
|
||||
min-height: 10px;
|
||||
width: 8px;
|
||||
}
|
||||
|
||||
.scrollbar-chrome > .scroll-element.scroll-x .scroll-element_outer {
|
||||
border-left: 1px solid #dbdbdb;
|
||||
}
|
||||
|
||||
.scrollbar-chrome > .scroll-element.scroll-x .scroll-element_track {
|
||||
height: 14px;
|
||||
left: -3px;
|
||||
}
|
||||
|
||||
.scrollbar-chrome > .scroll-element.scroll-x .scroll-element_size {
|
||||
height: 14px;
|
||||
left: -4px;
|
||||
}
|
||||
|
||||
.scrollbar-chrome > .scroll-element.scroll-y .scroll-element_outer {
|
||||
border-top: 1px solid #dbdbdb;
|
||||
}
|
||||
|
||||
.scrollbar-chrome > .scroll-element.scroll-y .scroll-element_track {
|
||||
top: -3px;
|
||||
width: 14px;
|
||||
}
|
||||
|
||||
.scrollbar-chrome > .scroll-element.scroll-y .scroll-element_size {
|
||||
top: -4px;
|
||||
width: 14px;
|
||||
}
|
||||
|
||||
/* update scrollbar offset if both scrolls are visible */
|
||||
.scrollbar-chrome > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size {
|
||||
left: -19px;
|
||||
}
|
||||
|
||||
.scrollbar-chrome > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size {
|
||||
top: -19px;
|
||||
}
|
||||
|
||||
.scrollbar-chrome > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track {
|
||||
left: -19px;
|
||||
}
|
||||
|
||||
.scrollbar-chrome > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track {
|
||||
top: -19px;
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Custom styles
|
||||
//
|
||||
|
||||
.scrollbar-inner {
|
||||
height: 100%;
|
||||
|
||||
&:not(:hover) .scroll-element {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.scroll-element {
|
||||
transition: opacity 300ms;
|
||||
margin-right: 2px;
|
||||
|
||||
.scroll-bar,
|
||||
.scroll-element_track {
|
||||
transition: background-color 300ms;
|
||||
}
|
||||
|
||||
.scroll-element_track {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
width: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
.scroll-element.scroll-y {
|
||||
width: 3px;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.scroll-element.scroll-x {
|
||||
height: 3px;
|
||||
bottom: 0;
|
||||
}
|
||||
}
|
||||
70
resources/assets/sass/core/vendors/_select.scss
vendored
Normal file
70
resources/assets/sass/core/vendors/_select.scss
vendored
Normal file
@@ -0,0 +1,70 @@
|
||||
|
||||
.form-group .el-select {
|
||||
width: 100%;
|
||||
}
|
||||
.el-select {
|
||||
|
||||
.el-input .el-input__inner {
|
||||
font-size: $input-btn-font-size;
|
||||
width: 100%;
|
||||
height: $input-height;
|
||||
@include transition($transition-ease-in-out);
|
||||
|
||||
&:focus{
|
||||
border-color: darken(theme-color("primary"), 10%) !important;
|
||||
border: $input-border-width solid darken(theme-color("primary"), 12%);
|
||||
}
|
||||
|
||||
&::placeholder {
|
||||
color: $input-placeholder-color;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
&:disabled {
|
||||
background-color: $input-disabled-bg;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.el-input.is-focus {
|
||||
.el-input__inner {
|
||||
border-color: darken(theme-color("primary"), 10%) !important;
|
||||
border: $input-border-width solid darken(theme-color("primary"), 12%);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.el-select-dropdown.el-popper,
|
||||
.el-select-dropdown.el-popper.is-multiple {
|
||||
|
||||
.el-select-dropdown__item.selected {
|
||||
color: theme-color('primary');
|
||||
}
|
||||
}
|
||||
|
||||
.el-select .el-select__tags {
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.el-select .el-select__tags .el-tag {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: .625rem .625rem .5rem;
|
||||
height: 25px;
|
||||
margin: .125rem;
|
||||
border-radius: $input-border-radius;
|
||||
background: $tag-bg;
|
||||
color: $tag-color;
|
||||
line-height: 1.5;
|
||||
cursor: pointer;
|
||||
@include box-shadow($tag-box-shadow);
|
||||
@include transition($transition-base);
|
||||
|
||||
.el-tag__close.el-icon-close {
|
||||
background-color: transparent;
|
||||
color: white;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
22
resources/assets/sass/core/vendors/_sweet-alert-2.scss
vendored
Normal file
22
resources/assets/sass/core/vendors/_sweet-alert-2.scss
vendored
Normal file
@@ -0,0 +1,22 @@
|
||||
//
|
||||
// Sweet alert 2
|
||||
// Sweet alert 2 plugin overrides
|
||||
//
|
||||
|
||||
|
||||
.swal2-popup {
|
||||
|
||||
padding: $swal2-padding;
|
||||
|
||||
#swal2-title {
|
||||
font-size: $swal2-title-font-size;
|
||||
}
|
||||
|
||||
#swal2-content {
|
||||
font-size: $swal2-content-font-size;
|
||||
}
|
||||
|
||||
#swal2-image {
|
||||
max-width: 200px;
|
||||
}
|
||||
}
|
||||
32
resources/assets/sass/core/vendors/_tags.scss
vendored
Normal file
32
resources/assets/sass/core/vendors/_tags.scss
vendored
Normal file
@@ -0,0 +1,32 @@
|
||||
.el-tag.el-tag--primary{
|
||||
display: inline-flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: .625rem .625rem .5rem;
|
||||
height: 33px;
|
||||
margin: .125rem;
|
||||
border-radius: $input-border-radius;
|
||||
background: $tag-bg;
|
||||
color: $tag-color;
|
||||
line-height: 1.5;
|
||||
cursor: pointer;
|
||||
font-weight: 600;
|
||||
@include box-shadow($tag-box-shadow);
|
||||
@include transition($transition-base);
|
||||
|
||||
.el-tag__close.el-icon-close {
|
||||
background-color: transparent;
|
||||
color: white;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.tags-input__wrapper {
|
||||
display: flex;
|
||||
|
||||
input.form-control {
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
16
resources/assets/sass/core/vendors/_vectormap.scss
vendored
Normal file
16
resources/assets/sass/core/vendors/_vectormap.scss
vendored
Normal file
@@ -0,0 +1,16 @@
|
||||
//
|
||||
// Vector Map
|
||||
//
|
||||
|
||||
|
||||
.vector-map {
|
||||
position: relative;
|
||||
height: 600px;
|
||||
}
|
||||
|
||||
|
||||
// Size variations
|
||||
|
||||
.vector-map-sm {
|
||||
height: 180px;
|
||||
}
|
||||
Reference in New Issue
Block a user