Summary Files Commits Branches @commit @diff @stats
path: root / src
diff options
context:
space:
mode:
13 files changed, 48 insertions, 26 deletions
-rw-r--r--src/_breadcrumbs.scss2
-rw-r--r--src/_calendars.scss2
-rw-r--r--src/_comparison-sliders.scss2
-rw-r--r--src/_menus.scss2
-rw-r--r--src/_mixins.scss4
-rw-r--r--src/_modals.scss6
-rw-r--r--src/_off-canvas.scss2
-rw-r--r--src/_parallax.scss9
-rw-r--r--src/_popovers.scss7
-rw-r--r--src/_sliders.scss6
-rw-r--r--src/_tables.scss18
-rw-r--r--src/_tooltips.scss2
-rw-r--r--src/_variables.scss12
diff --git a/src/_breadcrumbs.scss b/src/_breadcrumbs.scss
index 876eae8..f2c9185 100644
--- a/src/_breadcrumbs.scss
+++ b/src/_breadcrumbs.scss
@@ -22,7 +22,7 @@
&::before {
color: $gray-color-light;
content: "/";
- padding-right: $unit-1;
+ padding-right: $unit-2;
}
}
}
diff --git a/src/_calendars.scss b/src/_calendars.scss
index 891f84d..e94bb39 100644
--- a/src/_calendars.scss
+++ b/src/_calendars.scss
@@ -190,9 +190,7 @@
}
.calendar-event {
- background: $secondary-color;
border-radius: $border-radius;
- color: $primary-color;
font-size: $font-size-sm;
display: block;
margin: $unit-h auto;
diff --git a/src/_comparison-sliders.scss b/src/_comparison-sliders.scss
index a219863..252e96f 100644
--- a/src/_comparison-sliders.scss
+++ b/src/_comparison-sliders.scss
@@ -17,7 +17,7 @@
img {
height: 100%;
- object-fit: none;
+ object-fit: cover;
object-position: left center;
position: absolute;
width: 100%;
diff --git a/src/_menus.scss b/src/_menus.scss
index bec6afc..957eea9 100644
--- a/src/_menus.scss
+++ b/src/_menus.scss
@@ -5,7 +5,7 @@
border-radius: $border-radius;
list-style: none;
margin: 0;
- min-width: $control-min-width;
+ min-width: $control-width-xs;
padding: $unit-2;
transform: translateY($layout-spacing-sm);
z-index: $zindex-1;
diff --git a/src/_mixins.scss b/src/_mixins.scss
index 2402dc8..a565c3d 100644
--- a/src/_mixins.scss
+++ b/src/_mixins.scss
@@ -10,6 +10,10 @@
@mixin bg-color-variant($name: ".bg-primary", $color: $primary-color) {
#{$name} {
background: $color;
+
+ @if (lightness($color) < 60) {
+ color: $light-color;
+ }
}
}
diff --git a/src/_modals.scss b/src/_modals.scss
index 2f81ed7..9a29eb6 100644
--- a/src/_modals.scss
+++ b/src/_modals.scss
@@ -31,7 +31,7 @@
.modal-container {
animation: slide-down .2s ease 1;
- max-width: 640px;
+ max-width: $control-width-md;
width: 100%;
z-index: $zindex-0;
}
@@ -39,7 +39,7 @@
&.modal-sm {
.modal-container {
- max-width: 320px;
+ max-width: $control-width-sm;
padding: 0 $unit-2;
}
}
@@ -51,7 +51,7 @@
.modal-container {
box-shadow: none;
- max-width: 960px;
+ max-width: $control-width-lg;
}
}
}
diff --git a/src/_off-canvas.scss b/src/_off-canvas.scss
index 009f9f0..061dc26 100644
--- a/src/_off-canvas.scss
+++ b/src/_off-canvas.scss
@@ -1,5 +1,5 @@
// Off canvas menus
-$off-canvas-breakpoint: 960px !default;
+$off-canvas-breakpoint: $size-lg !default;
.off-canvas {
display: flex;
diff --git a/src/_parallax.scss b/src/_parallax.scss
index da101bf..cb5e932 100644
--- a/src/_parallax.scss
+++ b/src/_parallax.scss
@@ -4,6 +4,7 @@ $parallax-offset: 4.5px !default;
$parallax-offset-z: 50px !default;
$parallax-perspective: 1000px !default;
$parallax-scale: .95 !default;
+$parallax-fade-color: rgba(255, 255, 255, .35) !default;
// Mixin: Parallax direction
@mixin parallax-dir() {
@@ -64,7 +65,7 @@ $parallax-scale: .95 !default;
transform: perspective($parallax-perspective) rotateX($parallax-deg) rotateY(-$parallax-deg);
&::before {
- background: linear-gradient(135deg, rgba(255, 255, 255, .35) 0%, transparent 50%);
+ background: linear-gradient(135deg, $parallax-fade-color 0%, transparent 50%);
}
.parallax-front {
@@ -82,7 +83,7 @@ $parallax-scale: .95 !default;
transform: perspective($parallax-perspective) rotateX($parallax-deg) rotateY($parallax-deg);
&::before {
- background: linear-gradient(-135deg, rgba(255, 255, 255, .35) 0%, transparent 50%);
+ background: linear-gradient(-135deg, $parallax-fade-color 0%, transparent 50%);
}
.parallax-front {
@@ -100,7 +101,7 @@ $parallax-scale: .95 !default;
transform: perspective($parallax-perspective) rotateX(-$parallax-deg) rotateY(-$parallax-deg);
&::before {
- background: linear-gradient(45deg, rgba(255, 255, 255, .35) 0%, transparent 50%);
+ background: linear-gradient(45deg, $parallax-fade-color 0%, transparent 50%);
}
.parallax-front {
@@ -118,7 +119,7 @@ $parallax-scale: .95 !default;
transform: perspective($parallax-perspective) rotateX(-$parallax-deg) rotateY($parallax-deg);
&::before {
- background: linear-gradient(-45deg, rgba(255, 255, 255, .35) 0%, transparent 50%);
+ background: linear-gradient(-45deg, $parallax-fade-color 0%, transparent 50%);
}
.parallax-front {
diff --git a/src/_popovers.scss b/src/_popovers.scss
index 6a9a2e5..78c86aa 100644
--- a/src/_popovers.scss
+++ b/src/_popovers.scss
@@ -4,19 +4,18 @@
position: relative;
.popover-container {
- content: attr(data-tooltip);
- opacity: 0;
left: 50%;
+ opacity: 0;
padding: $layout-spacing;
position: absolute;
top: 0;
transform: translate(-50%, -50%) scale(0);
transition: transform .2s ease;
- width: $control-max-width;
+ width: $control-width-sm;
z-index: $zindex-4;
}
- :focus + .popover-container,
+ *:focus + .popover-container,
&:hover .popover-container,
.popover-container:hover {
display: block;
diff --git a/src/_sliders.scss b/src/_sliders.scss
index da80a83..01576b9 100644
--- a/src/_sliders.scss
+++ b/src/_sliders.scss
@@ -12,6 +12,12 @@
outline: none;
}
+ &.tooltip:not([data-tooltip]) {
+ &::after {
+ content: attr(value);
+ }
+ }
+
// Slider Thumb
&::-webkit-slider-thumb {
-webkit-appearance: none;
diff --git a/src/_tables.scss b/src/_tables.scss
index 63a163a..074301f 100644
--- a/src/_tables.scss
+++ b/src/_tables.scss
@@ -13,27 +13,35 @@
}
}
- &.table-hover {
+ &,
+ &.table-striped {
tbody {
tr {
- &:hover {
+ &.active {
background: $bg-color-dark;
}
}
}
}
- &,
- &.table-striped {
+ &.table-hover {
tbody {
tr {
- &.active {
+ &:hover {
background: $bg-color-dark;
}
}
}
}
+ // Tables with horizontal scrollbar
+ &.table-scroll {
+ display: block;
+ overflow-x: auto;
+ padding-bottom: .75rem;
+ white-space: nowrap;
+ }
+
td,
th {
border-bottom: $border-width solid $border-color;
diff --git a/src/_tooltips.scss b/src/_tooltips.scss
index 938afc2..061f9d3 100644
--- a/src/_tooltips.scss
+++ b/src/_tooltips.scss
@@ -10,7 +10,7 @@
display: block;
font-size: $font-size-sm;
left: 50%;
- max-width: $control-max-width;
+ max-width: $control-width-sm;
opacity: 0;
overflow: hidden;
padding: $unit-1 $unit-2;
diff --git a/src/_variables.scss b/src/_variables.scss
index f7fa86a..0690f19 100644
--- a/src/_variables.scss
+++ b/src/_variables.scss
@@ -1,5 +1,5 @@
// Core variables
-$version: "0.4.5";
+$version: "0.4.6";
// Core colors
$primary-color: #5755d9 !default;
@@ -86,8 +86,12 @@ $control-padding-y: ($control-size - $line-height) / 2 - $border-width !default;
$control-padding-y-sm: ($control-size-sm - $line-height) / 2 - $border-width !default;
$control-padding-y-lg: ($control-size-lg - $line-height) / 2 - $border-width !default;
$control-icon-size: .8rem !default;
-$control-min-width: 180px !default;
-$control-max-width: 320px !default;
+
+$control-width-xs: 180px !default;
+$control-width-sm: 320px !default;
+$control-width-md: 640px !default;
+$control-width-lg: 960px !default;
+$control-width-xl: 1280px !default;
// Responsive breakpoints
$size-xs: 480px !default;
@@ -97,6 +101,8 @@ $size-lg: 960px !default;
$size-xl: 1280px !default;
$size-2x: 1440px !default;
+$responsive-breakpoint: $size-xs !default;
+
// Z-index
$zindex-0: 1 !default;
$zindex-1: 100 !default;
generated by cgit v1.3.1-23-gd82d (git 2.54.0) at 2026-11-12 08:08:13 +0000