Skip to content
Snippets Groups Projects
Commit 08fdcbb0 authored by Jan-Hendrik Willms's avatar Jan-Hendrik Willms
Browse files

revert some changes to rules and files so plugins don't break (unfortunately,... 

revert some changes to rules and files so plugins don't break (unfortunately, the php compiler does not support the use of sass modules), fixes #4989

Closes #4989

Merge request !3744
parent b9834da7
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
Showing
with 134 additions and 158 deletions
.stylelintrc.json
+ 3
− 1
View file @ 08fdcbb0
......@@ -53,7 +53,9 @@
"scss/at-mixin-pattern": null,
"scss/dollar-variable-empty-line-before": null,
"scss/dollar-variable-pattern": null,
"scss/double-slash-comment-empty-line-before": null
"scss/double-slash-comment-empty-line-before": null,
"scss/function-unquote-no-unquoted-strings-inside": null,
"scss/no-global-function-names": null
},
"ignoreFiles": [
"resource/assets/stylesheets/jquery-ui.structure.css",
......
resources/assets/stylesheets/mixins/colors.scss
+ 75
− 77
View file @ 08fdcbb0
@use "sass:color";
// if you like, change this (your brand color)
$base-color: #28497c; // #28497c
......@@ -8,28 +6,28 @@ $base-color: #28497c; // #28497c
// $base-gray: #3c454e; // #3c454e
// calculated base gray
$base-gray: hsl(
color.hue($base-color),
color.saturation(#3c454e),
color.lightness(#3c454e)
hue($base-color),
saturation(#3c454e),
lightness(#3c454e)
);
$brand-color-dark: $base-color;
$brand-color-darker: hsl(
color.hue($base-color),
(color.saturation($base-color) + 5.4%),
(color.lightness($base-color) - 4%)
hue($base-color),
(saturation($base-color) + 5.4%),
(lightness($base-color) - 4%)
); // #1f3f70;
$brand-color-light: hsl(
color.hue($base-color),
(color.saturation($base-color) - 6%),
(color.lightness($base-color) + 6.5%)
hue($base-color),
(saturation($base-color) - 6%),
(lightness($base-color) + 6.5%)
); // #36598f;
$brand-color-lighter: hsl(
(color.hue($base-color) + 2.5),
(color.saturation($base-color) - 25.5%),
(color.lightness($base-color) + 31%)
(hue($base-color) + 2.5),
(saturation($base-color) - 25.5%),
(lightness($base-color) + 31%)
); // #899ab9;
/* This code calculates another activity color in case you dont wanna stick with red
......@@ -44,29 +42,29 @@ $white: #fff;
// Default studip base color
$origin-base-color: #28497c; // #28497c
$base-color-80: color.mix($base-color, #fff, 80%); // #536d96
$base-color-60: color.mix($base-color, #fff, 60%); // #7e92b0
$base-color-40: color.mix($base-color, #fff, 40%); // #a9b6cb
$base-color-20: color.mix($base-color, #fff, 20%); // #d4dbe5
$base-color-80: mix($base-color, #fff, 80%); // #536d96
$base-color-60: mix($base-color, #fff, 60%); // #7e92b0
$base-color-40: mix($base-color, #fff, 40%); // #a9b6cb
$base-color-20: mix($base-color, #fff, 20%); // #d4dbe5
$content-color: $brand-color-lighter;
$content-color-80: color.mix($content-color, #fff, 80%); // #a1aec7
$content-color-60: color.mix($content-color, #fff, 60%); // #b8c2d5
$content-color-40: color.mix($content-color, #fff, 40%); // #d0d7e3
$content-color-20: color.mix($content-color, #fff, 20%); // #e7ebf1
$content-color-10: color.mix($content-color, #fff, 10%); // #e7ebf1
$content-color-80: mix($content-color, #fff, 80%); // #a1aec7
$content-color-60: mix($content-color, #fff, 60%); // #b8c2d5
$content-color-40: mix($content-color, #fff, 40%); // #d0d7e3
$content-color-20: mix($content-color, #fff, 20%); // #e7ebf1
$content-color-10: mix($content-color, #fff, 10%); // #e7ebf1
$dark-gray-color: $base-gray;
$dark-gray-color-80: color.mix($dark-gray-color, #fff, 80%); // #636a71
$dark-gray-color-75: color.mix($dark-gray-color, #fff, 75%); // #6c737a
$dark-gray-color-60: color.mix($dark-gray-color, #fff, 60%); // #898f94
$dark-gray-color-45: color.mix($dark-gray-color, #fff, 45%); // #a7abaf
$dark-gray-color-40: color.mix($dark-gray-color, #fff, 40%); // #b1b5b8
$dark-gray-color-30: color.mix($dark-gray-color, #fff, 30%); // #c4c7c9
$dark-gray-color-20: color.mix($dark-gray-color, #fff, 20%); // #d8dadc
$dark-gray-color-15: color.mix($dark-gray-color, #fff, 15%); // #e1e3e4
$dark-gray-color-10: color.mix($dark-gray-color, #fff, 10%); // #ebeced
$dark-gray-color-5: color.mix($dark-gray-color, #fff, 5%); // #f5f5f6
$dark-gray-color-80: mix($dark-gray-color, #fff, 80%); // #636a71
$dark-gray-color-75: mix($dark-gray-color, #fff, 75%); // #6c737a
$dark-gray-color-60: mix($dark-gray-color, #fff, 60%); // #898f94
$dark-gray-color-45: mix($dark-gray-color, #fff, 45%); // #a7abaf
$dark-gray-color-40: mix($dark-gray-color, #fff, 40%); // #b1b5b8
$dark-gray-color-30: mix($dark-gray-color, #fff, 30%); // #c4c7c9
$dark-gray-color-20: mix($dark-gray-color, #fff, 20%); // #d8dadc
$dark-gray-color-15: mix($dark-gray-color, #fff, 15%); // #e1e3e4
$dark-gray-color-10: mix($dark-gray-color, #fff, 10%); // #ebeced
$dark-gray-color-5: mix($dark-gray-color, #fff, 5%); // #f5f5f6
$light-gray-color: $dark-gray-color-75;
$light-gray-color-80: $dark-gray-color-60;
......@@ -77,58 +75,58 @@ $light-gray-color-20: $dark-gray-color-15;
// colors. a lot of.
$yellow: #ffbd33;
$yellow-80: color.mix($yellow, #fff, 80%); // #ffca5c
$yellow-60: color.mix($yellow, #fff, 60%); // #ffd785
$yellow-40: color.mix($yellow, #fff, 40%); // #ffe4ad
$yellow-20: color.mix($yellow, #fff, 20%); // #fff2d6
$yellow-80: mix($yellow, #fff, 80%); // #ffca5c
$yellow-60: mix($yellow, #fff, 60%); // #ffd785
$yellow-40: mix($yellow, #fff, 40%); // #ffe4ad
$yellow-20: mix($yellow, #fff, 20%); // #fff2d6
$orange: #f26e00;
$orange-80: color.mix($orange, #fff, 80%); // #f58b33
$orange-60: color.mix($orange, #fff, 60%); // #f7a866
$orange-40: color.mix($orange, #fff, 40%); // #fac599
$orange-20: color.mix($orange, #fff, 20%); // #fce2cc
$orange-80: mix($orange, #fff, 80%); // #f58b33
$orange-60: mix($orange, #fff, 60%); // #f7a866
$orange-40: mix($orange, #fff, 40%); // #fac599
$orange-20: mix($orange, #fff, 20%); // #fce2cc
$red: #d60000;
$red-80: color.mix($red, #fff, 80%); // #de3333
$red-60: color.mix($red, #fff, 60%); // #e76666
$red-40: color.mix($red, #fff, 40%); // #ef9999
$red-20: color.mix($red, #fff, 20%); // #f7cccc
$red-80: mix($red, #fff, 80%); // #de3333
$red-60: mix($red, #fff, 60%); // #e76666
$red-40: mix($red, #fff, 40%); // #ef9999
$red-20: mix($red, #fff, 20%); // #f7cccc
$violet: #b02e7c;
$violet-80: color.mix($violet, #fff, 80%); // #c05896
$violet-60: color.mix($violet, #fff, 60%); // #d082b0
$violet-40: color.mix($violet, #fff, 40%); // #dfabcb
$violet-20: color.mix($violet, #fff, 20%); // #efd5e5
$violet-80: mix($violet, #fff, 80%); // #c05896
$violet-60: mix($violet, #fff, 60%); // #d082b0
$violet-40: mix($violet, #fff, 40%); // #dfabcb
$violet-20: mix($violet, #fff, 20%); // #efd5e5
$dark-violet: #682c8b;
$dark-violet-80: color.mix($dark-violet, #fff, 80%); // #8656a2
$dark-violet-60: color.mix($dark-violet, #fff, 60%); // #a480b9
$dark-violet-40: color.mix($dark-violet, #fff, 40%); // #c2aad0
$dark-violet-20: color.mix($dark-violet, #fff, 20%); // #e0d4e7
$dark-violet-80: mix($dark-violet, #fff, 80%); // #8656a2
$dark-violet-60: mix($dark-violet, #fff, 60%); // #a480b9
$dark-violet-40: mix($dark-violet, #fff, 40%); // #c2aad0
$dark-violet-20: mix($dark-violet, #fff, 20%); // #e0d4e7
$green: #6ead10;
$green-80: color.mix($green, #fff, 80%); // #8bbd40
$green-60: color.mix($green, #fff, 60%); // #a8ce70
$green-40: color.mix($green, #fff, 40%); // #c5dea0
$green-20: color.mix($green, #fff, 20%); // #e2efcf
$green-80: mix($green, #fff, 80%); // #8bbd40
$green-60: mix($green, #fff, 60%); // #a8ce70
$green-40: mix($green, #fff, 40%); // #c5dea0
$green-20: mix($green, #fff, 20%); // #e2efcf
$dark-green: #008512;
$dark-green-80: color.mix($dark-green, #fff, 80%); // #339d41
$dark-green-60: color.mix($dark-green, #fff, 60%); // #66b570
$dark-green-40: color.mix($dark-green, #fff, 40%); // #99cea0
$dark-green-20: color.mix($dark-green, #fff, 20%); // #cce6cf
$dark-green-80: mix($dark-green, #fff, 80%); // #339d41
$dark-green-60: mix($dark-green, #fff, 60%); // #66b570
$dark-green-40: mix($dark-green, #fff, 40%); // #99cea0
$dark-green-20: mix($dark-green, #fff, 20%); // #cce6cf
$petrol: #0E817B; // old #129c94;
$petrol-80: color.mix($petrol, #fff, 80%); // #41afaa
$petrol-60: color.mix($petrol, #fff, 60%); // #70c3bf
$petrol-40: color.mix($petrol, #fff, 40%); // #a0d7d4
$petrol-20: color.mix($petrol, #fff, 20%); // #cfebe9
$petrol-80: mix($petrol, #fff, 80%); // #41afaa
$petrol-60: mix($petrol, #fff, 60%); // #70c3bf
$petrol-40: mix($petrol, #fff, 40%); // #a0d7d4
$petrol-20: mix($petrol, #fff, 20%); // #cfebe9
$brown: #a85d45;
$brown-80: color.mix($brown, #fff, 80%); // #b97d6a
$brown-60: color.mix($brown, #fff, 60%); // #ca9eaf
$brown-40: color.mix($brown, #fff, 40%); // #dcbeb4
$brown-20: color.mix($brown, #fff, 20%); // #edded9
$brown-80: mix($brown, #fff, 80%); // #b97d6a
$brown-60: mix($brown, #fff, 60%); // #ca9eaf
$brown-40: mix($brown, #fff, 40%); // #dcbeb4
$brown-20: mix($brown, #fff, 20%); // #edded9
// contrast colors
$contrast-content-white: text-contrast($content-color, #ffffff, #000000);
......@@ -143,10 +141,10 @@ $table-footer-color: $dark-gray-color-15;
$active-color: $red;
$activity-color: $yellow;
$activity-color-80: color.mix($activity-color, #fff, 80%); // #ffca5c
$activity-color-60: color.mix($activity-color, #fff, 60%); // #ffd785
$activity-color-40: color.mix($activity-color, #fff, 40%); // #ffe4ad
$activity-color-20: color.mix($activity-color, #fff, 20%); // #fff2d6
$activity-color-80: mix($activity-color, #fff, 80%); // #ffca5c
$activity-color-60: mix($activity-color, #fff, 60%); // #ffd785
$activity-color-40: mix($activity-color, #fff, 40%); // #ffe4ad
$activity-color-20: mix($activity-color, #fff, 20%); // #fff2d6
// Group colors (for my courses grouping)
$group-color-0: $dark-violet;
......@@ -316,12 +314,12 @@ $color--shadow: $color--gray-4;
$color--focus: $color--gray-4;
$color--warning: $color--red-1;
$color--warning-alternative: color.mix($color--warning, $color--white, 20%);
$color--warning-alternative: mix($color--warning, $color--white, 20%);
$color--attention: $color--yellow-1;
$color--attention-alternative: color.mix($color--attention, $color--white, 20%);
$color--attention-alternative: mix($color--attention, $color--white, 20%);
$color--good: $color--green-1;
$color--good-alternative: color.mix($color--good, $color--white, 20%);
$color--good-alternative: mix($color--good, $color--white, 20%);
$color--info: $color--blue-2;
$color--info-alternative: color.mix($color--info, $color--white, 20%);
$color--info-alternative: mix($color--info, $color--white, 20%);
$color-image-placeholder-background: $color--gray-6;
resources/assets/stylesheets/mixins/misc.scss
+ 2
− 4
View file @ 08fdcbb0
@use "sass:color";
// Clearfix
// --------
// For clearing floats like a boss h5bp.com/q
......@@ -29,12 +27,12 @@
// https://codepen.io/kennyglenn/pen/kxqWjP
@function text-contrast($color, $dark, $light, $threshold: 51) {
@return if(color.lightness($color) < $threshold, $light, $dark)
@return if(lightness($color) < $threshold, $light, $dark)
}
@mixin vertical-three-colors($startColor: #00b3ee, $midColor: #7a43b6, $colorStop: 50%, $endColor: #c3325f) {
background-color: color.mix($midColor, $endColor, 80%);
background-color: mix($midColor, $endColor, 80%);
background-image: linear-gradient($startColor, $midColor $colorStop, $endColor);
background-repeat: no-repeat;
}
resources/assets/stylesheets/mixins/studip.scss
+ 4
− 8
View file @ 08fdcbb0
@use "sass:color";
@use "sass:math";
@use "sass:string";
/**
* studip-mixins.less
*
......@@ -49,8 +45,8 @@
}
@function icon-path($icon, $role: clickable) {
$icon: string.unquote($icon);
$role: string.unquote($role);
$icon: unquote($icon);
$role: unquote($role);
$color: 'blue';
@if $role == info {
......@@ -71,7 +67,7 @@
}
@function icon-size($size) {
@if math.is-unitless($size) {
@if unitless($size) {
@warn "Assuming icon size to be in pixels";
$size: $size * 1px;
}
......@@ -184,7 +180,7 @@
background-position: calc(50% - 100px) calc(50% + 40px);
@if $background-color {
background-color: color.mix($background-color, rgba(255, 255, 255, 0), 70%);
background-color: mix($background-color, rgba(255, 255, 255, 0), 70%);
}
text-align: center;
......
resources/assets/stylesheets/scss/blubber.scss
+ 1
− 3
View file @ 08fdcbb0
@use "sass:color";
.blubber_panel {
display: flex;
align-items: stretch;
......@@ -166,7 +164,7 @@
.empty_blubber_background {
@include empty-placeholder-image('blubber');
background-color: color.mix($dark-gray-color-5, rgba(255, 255, 255, 0), 70%);
background-color: mix($dark-gray-color-5, rgba(255, 255, 255, 0), 70%);
> :first-child {
position: relative;
......
resources/assets/stylesheets/scss/calendar.scss
+ 18
− 20
View file @ 08fdcbb0
@use "sass:color";
.fc-body {
.fc-event {
......@@ -13,10 +11,10 @@
&.course-color-0 {
border-color: $group-color-0;
background-color: color.adjust($group-color-0, $lightness: 45%);
background-color: lighten($group-color-0, 45%);
&:hover {
background-color: color.adjust($group-color-0, $lightness: 50%);
background-color: lighten($group-color-0, 50%);
}
.fc-time {
......@@ -26,10 +24,10 @@
&.course-color-1 {
border-color: $group-color-1;
background-color: color.adjust($group-color-1, $lightness: 45%);
background-color: lighten($group-color-1, 45%);
&:hover {
background-color: color.adjust($group-color-1, $lightness: 50%);
background-color: lighten($group-color-1, 50%);
}
.fc-time {
......@@ -39,10 +37,10 @@
&.course-color-2 {
border-color: $group-color-2;
background-color: color.adjust($group-color-2, $lightness: 45%);;
background-color: lighten($group-color-2, 45%);;
&:hover {
background-color: color.adjust($group-color-2, $lightness: 50%);;
background-color: lighten($group-color-2, 50%);;
}
.fc-time {
......@@ -52,10 +50,10 @@
&.course-color-3 {
border-color: $group-color-3;
background-color: color.adjust($group-color-3, $lightness: 45%);;
background-color: lighten($group-color-3, 45%);;
&:hover {
background-color: color.adjust($group-color-3, $lightness: 50%);;
background-color: lighten($group-color-3, 50%);;
}
.fc-time {
......@@ -65,10 +63,10 @@
&.course-color-4 {
border-color: $group-color-4;
background-color: color.adjust($group-color-4, $lightness: 45%);;
background-color: lighten($group-color-4, 45%);;
&:hover {
background-color: color.adjust($group-color-4, $lightness: 50%);;
background-color: lighten($group-color-4, 50%);;
}
.fc-time {
......@@ -78,10 +76,10 @@
&.course-color-5 {
border-color: $group-color-5;
background-color: color.adjust($group-color-5, $lightness: 45%);;
background-color: lighten($group-color-5, 45%);;
&:hover {
background-color: color.adjust($group-color-5, $lightness: 50%);;
background-color: lighten($group-color-5, 50%);;
}
.fc-time {
......@@ -91,10 +89,10 @@
&.course-color-6 {
border-color: $group-color-6;
background-color: color.adjust($group-color-6, $lightness: 45%);;
background-color: lighten($group-color-6, 45%);;
&:hover {
background-color: color.adjust($group-color-6, $lightness: 50%);;
background-color: lighten($group-color-6, 50%);;
}
.fc-time {
......@@ -104,10 +102,10 @@
&.course-color-7 {
border-color: $group-color-7;
background-color: color.adjust($group-color-7, $lightness: 45%);;
background-color: lighten($group-color-7, 45%);;
&:hover {
background-color: color.adjust($group-color-7, $lightness: 50%);;
background-color: lighten($group-color-7, 50%);;
}
.fc-time {
......@@ -117,10 +115,10 @@
&.course-color-8 {
border-color: $group-color-8;
background-color: color.adjust($group-color-8, $lightness: 45%);;
background-color: lighten($group-color-8, 45%);;
&:hover {
background-color: color.adjust($group-color-8, $lightness: 50%);;
background-color: lighten($group-color-8, 50%);;
}
.fc-time {
......
resources/assets/stylesheets/scss/courseware/structural-element.scss
+ 16
− 17
View file @ 08fdcbb0
@use '../../mixins' as *;
@use "sass:map";
@import './variables';
#course-courseware-index,
......@@ -81,53 +80,53 @@
.cw-structural-element-color {
color: var(--white);
&.black {
background-color: map.get($tile-colors, 'black');
background-color: map-get($tile-colors, 'black');
}
&.charcoal {
background-color: map.get($tile-colors, 'charcoal');
background-color: map-get($tile-colors, 'charcoal');
}
&.royal-purple {
background-color: map.get($tile-colors, 'royal-purple');
background-color: map-get($tile-colors, 'royal-purple');
}
&.iguana-green {
background-color: map.get($tile-colors, 'iguana-green');
background-color: map-get($tile-colors, 'iguana-green');
}
&.queen-blue {
background-color: map.get($tile-colors, 'queen-blue');
background-color: map-get($tile-colors, 'queen-blue');
}
&.verdigris {
background-color: map.get($tile-colors, 'verdigris');
background-color: map-get($tile-colors, 'verdigris');
}
&.mulberry {
background-color: map.get($tile-colors, 'mulberry');
background-color: map-get($tile-colors, 'mulberry');
}
&.pumpkin {
background-color: map.get($tile-colors, 'pumpkin');
background-color: map-get($tile-colors, 'pumpkin');
}
&.sunglow {
background-color: map.get($tile-colors, 'sunglow');
background-color: map-get($tile-colors, 'sunglow');
}
&.apple-green {
background-color: map.get($tile-colors, 'apple-green');
background-color: map-get($tile-colors, 'apple-green');
}
&.studip-blue {
background-color: map.get($tile-colors, 'studip-blue');
background-color: map-get($tile-colors, 'studip-blue');
}
&.studip-lightblue {
background-color: map.get($tile-colors, 'studip-lightblue');
background-color: map-get($tile-colors, 'studip-lightblue');
}
&.studip-red {
background-color: map.get($tile-colors, 'studip-red');
background-color: map-get($tile-colors, 'studip-red');
}
&.studip-green {
background-color: map.get($tile-colors, 'studip-green');
background-color: map-get($tile-colors, 'studip-green');
}
&.studip-yellow {
background-color: map.get($tile-colors, 'studip-yellow');
background-color: map-get($tile-colors, 'studip-yellow');
}
&.studip-gray {
background-color: map.get($tile-colors, 'studip-gray');
background-color: map-get($tile-colors, 'studip-gray');
}
}
......
resources/assets/stylesheets/scss/globalsearch.scss
+ 2
− 4
View file @ 08fdcbb0
@use "sass:color";
#quicksearch_item {
align-self: flex-start;
}
......@@ -122,7 +120,7 @@
#globalsearch-input {
background-color: var(--white);
color: var(--color--font-primary);
&::placeholder {
color: var(--color--font-primary);
}
......@@ -352,7 +350,7 @@ html:not(.size-large) {
right: -1px;
bottom: -1px;
left: -1px;
background: color.mix($base-color, rgba(255,0,0,0), 50%);
background: mix($base-color, rgba(255,0,0,0), 50%);
z-index: 5;
pointer-events: none;
}
......
resources/assets/stylesheets/scss/header.scss
+ 1
− 3
View file @ 08fdcbb0
@use "sass:math";
#main-header {
grid-column: 1 / 3;
grid-row: 1 / 2;
......@@ -163,7 +161,7 @@
justify-content: space-between;
background-color: var(--color--main-navigation-background);
color: var(--color--font-primary);
min-height: math.ceil($font-size-navigation2 * 2.25); // 16px * 2.25 = 36px
min-height: ceil($font-size-navigation2 * 2.25); // 16px * 2.25 = 36px
border-bottom: 1px solid var(--color--main-navigation-border);
padding-left: $page-margin;
padding-right: $page-margin;
......
resources/assets/stylesheets/scss/plus.scss
+ 2
− 4
View file @ 08fdcbb0
@use "sass:color";
.plus {
.element_header {
display: inline-block;
......@@ -47,8 +45,8 @@
width: 250px;
text-align: center;
background-color: $content-color-20;
border-top: 1px solid color.mix($brand-color-lighter, $white, 80%);
border-bottom: 1px solid color.mix($brand-color-lighter, $white, 80%);
border-top: 1px solid mix($brand-color-lighter, $white, 80%);
border-bottom: 1px solid mix($brand-color-lighter, $white, 80%);
}
.descriptionbox {
......
resources/assets/stylesheets/scss/table_of_contents.scss
+ 1
− 3
View file @ 08fdcbb0
@use "sass:color";
$base-gray-color-5: color.mix($base-gray, #fff, 5%);
$base-gray-color-5: mix($base-gray, #fff, 5%);
ul.numberedchapters {
counter-reset: section;
......
resources/assets/stylesheets/scss/tables.scss
+ 1
− 3
View file @ 08fdcbb0
@use "sass:color";
/* --- Tabellen ------------------------------------------------------------- */
// normale Tabellenheader
......@@ -338,7 +336,7 @@ tr.sortable {
}
td:first-child[colspan], .divider > th, .divider > td {
background-color: color.adjust($brand-color-lighter, $lightness: 20%);
background-color: lighten($brand-color-lighter, 20%);
border-bottom: 1px solid var(--color--table-border);
border-top: 1px solid var(--color--table-border);
color: var(--black);
......
resources/assets/stylesheets/scss/tree.scss
+ 1
− 3
View file @ 08fdcbb0
@use "sass:color";
$tree-outline: 1px solid var(--light-gray-color-40);
.studip-tree {
......@@ -36,7 +34,7 @@ $tree-outline: 1px solid var(--light-gray-color-40);
.studip-tree-navigation {
background-color: var(--white);
border: 1px solid var(--content-color-40);
box-shadow: 2px 2px color.mix($base-gray, $white, 20%);
box-shadow: 2px 2px mix($base-gray, $white, 20%);
right: -20px;
padding: 10px;
position: absolute;
......
resources/assets/stylesheets/scss/variables.scss
+ 7
− 8
View file @ 08fdcbb0
@use "sass:math";
@import "../mixins/misc";
@import '../mixins/colors';
......@@ -8,17 +7,17 @@ $text-color: #000;
$font-family-base: "Lato", sans-serif;
$font-size-base: 14px;
$font-size-large: math.ceil($font-size-base * 1.25); // 18px
$font-size-small: math.ceil($font-size-base * 0.85); // 12px
$font-size-large: ceil($font-size-base * 1.25); // 18px
$font-size-small: ceil($font-size-base * 0.85); // 12px
$font-size-h1: math.floor($font-size-base * 1.6); // 22px
$font-size-h2: math.ceil($font-size-base * 1.4); // 20px
$font-size-h3: math.ceil($font-size-base * 1.1); // 16px
$font-size-h1: floor($font-size-base * 1.6); // 22px
$font-size-h2: ceil($font-size-base * 1.4); // 20px
$font-size-h3: ceil($font-size-base * 1.1); // 16px
$font-size-h4: $font-size-base;
$font-size-h5: $font-size-base;
$font-size-h6: $font-size-base;
$font-size-navigation2: math.ceil($font-size-base * 1.1); // 16px
$font-size-navigation2: ceil($font-size-base * 1.1); // 16px
$font-size-widget-header: $font-size-large;
$font-size-caption: $font-size-h1;
......@@ -26,7 +25,7 @@ $font-size-caption: $font-size-h1;
// Unit-less `line-height` for use in components like buttons.
$line-height-base: 1.428571429; // 20/14
// Computed "line-height" (`font-size` * `line-height`) for use with `margin`, `padding`, etc.
$line-height-computed: math.floor($font-size-base * $line-height-base); // ~20px
$line-height-computed: floor($font-size-base * $line-height-base); // ~20px
// By default, this inherits from the `<body>`.
$headings-font-family: inherit;
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment