mirror of
https://gh.wpcy.net/https://github.com/elementor/hello-theme.git
synced 2026-04-24 11:45:02 +08:00
80 lines
2.4 KiB
SCSS
Executable file
80 lines
2.4 KiB
SCSS
Executable file
/**
|
|
* Loading first in the style.scss & classic-editor.scss
|
|
*/
|
|
|
|
@use "sass:color";
|
|
|
|
//Media Break-points
|
|
$screen-xs: 576px !default;
|
|
$screen-sm: 768px !default;
|
|
$screen-md: 992px !default;
|
|
$screen-xl: 1200px !default;
|
|
$screen-diff: 1px !default;
|
|
|
|
//Default Color
|
|
$gray-base: #000 !default;
|
|
$gray-darker: color.adjust($gray-base, $lightness: 13.5%) !default; // #222
|
|
$gray-dark: color.adjust($gray-base, $lightness: 20%) !default; // #333
|
|
$gray: color.adjust($gray-base, $lightness: 40%) !default; // #666
|
|
$gray-light: color.adjust($gray-base, $lightness: 80%) !default; // #ccc
|
|
$gray-lighter: color.adjust($gray-base, $lightness: 93.5%) !default; // #eee
|
|
$gray-lightest: color.adjust($gray-base, $lightness: 96.86%) !default; // #f7f7f7
|
|
|
|
//Text & Paragraph
|
|
$text-color: $gray-dark;
|
|
|
|
//Web-Safe Brand Colors
|
|
$blue: #3366FF !default; //blue
|
|
$purple: #333366 !default; //purple
|
|
$pink: #CC3366 !default; //pink
|
|
$green: #66CC99 !default; //medium-light green-cyan
|
|
$yellow: #FFCC33 !default; //medium-light yellow
|
|
$red: #CC0033 !default; //vivid crimson
|
|
|
|
//Border Radius
|
|
$border-radius: 3px !default;
|
|
|
|
//Accent color for buttons, links etc...
|
|
$primary-color: $pink !default;
|
|
$success-color: $green !default;
|
|
|
|
//Fonts
|
|
$font-family-base: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
|
|
$font-size-base: 1rem !default;
|
|
$body-color: $text-color !default;
|
|
$line-height-base: 1.5 !default;
|
|
$font-weight-base: 400 !default;
|
|
|
|
//Links
|
|
$link-color-base: $pink !default;
|
|
$link-hover-color-base: $purple !default;
|
|
|
|
//Headings
|
|
$h1-font-size: $font-size-base * 2.5 !default;
|
|
$h2-font-size: $font-size-base * 2 !default;
|
|
$h3-font-size: $font-size-base * 1.75 !default;
|
|
$h4-font-size: $font-size-base * 1.5 !default;
|
|
$h5-font-size: $font-size-base * 1.25 !default;
|
|
$h6-font-size: $font-size-base;
|
|
|
|
//Captions
|
|
$xs-font-size: $font-size-base * 0.75 !default;
|
|
$sm-font-size: $font-size-base * 0.8125 !default;
|
|
|
|
//Margin
|
|
$margin-base: 1rem !default;
|
|
$xs-margin: $margin-base * 0.5 !default;
|
|
$sm-margin: $margin-base * 0.75 !default;
|
|
$lg-margin: $margin-base * 1.5 !default;
|
|
$xl-margin: $margin-base * 2 !default;
|
|
|
|
//Padding
|
|
$padding-base: 1rem !default;
|
|
$xs-padding: $padding-base * 0.75 !default;
|
|
$sm-padding: $padding-base * 0.8125 !default;
|
|
$lg-padding: $padding-base * 1.5 !default;
|
|
|
|
//Responsive
|
|
@media (max-width: $screen-md) {
|
|
$font-size-base: .9rem !default;
|
|
}
|
