Chatwoot/app/javascript/widget/assets/scss/_variables.scss

91 lines
1.9 KiB
SCSS
Raw Normal View History

// Font sizes
$font-size-nano: 0.8rem;
$font-size-micro: 0.8rem;
$font-size-mini: 1rem;
$font-size-small: 1.2rem;
$font-size-default: 1.4rem;
$font-size-medium: 1.6rem;
$font-size-large: 2rem;
$font-size-big: 2.4rem;
$font-size-bigger: 3.2rem;
$font-size-mega: 4rem;
$font-size-giga: 5.6rem;
// spaces
$zero: 0;
$space-micro: 0.2rem;
$space-smaller: 0.4rem;
$space-small: 0.8rem;
$space-one: 1rem;
$space-slab: 1.2rem;
$space-normal: 1.6rem;
$space-two: 2rem;
$space-medium: 2.4rem;
$space-large: 3.2rem;
$space-larger: 4.8rem;
$space-big: 6.4rem;
$space-jumbo: 8rem;
$space-mega: 10rem;
// font-weight
$font-weight-feather: 100;
$font-weight-light: 300;
$font-weight-normal: 400;
$font-weight-medium: 500;
$font-weight-bold: 600;
$font-weight-black: 700;
//Navbar
$nav-bar-width: 23rem;
$header-height: 5.6rem;
// Woot Logo
$woot-logo-width: 20rem;
$woot-logo-height: 8rem;
$woot-logo-padding: $space-large $space-large $space-large $space-large;
// Colors
$color-woot: #1f93ff;
$color-primary: $color-woot;
$color-gray: #6e6f73;
$color-light-gray: #999a9b;
$color-border: #e0e6ed;
$color-border-transparent: rgba(224, 230, 237, 0.5);
$color-border-light: #f0f4f5;
$color-background: #ecf3f9;
$color-background-light: #fafafa;
$color-white: #fff;
$color-body: #3c4858;
$color-heading: #1f2d3d;
$color-modal-header: #f1f1f1;
// Thumbnail
$thumbnail-radius: 4rem;
// chat-header
$conv-header-height: 4rem;
// login
// Inbox List
$inbox-thumb-size: 4.8rem;
// Spinner
$spinkit-spinner-color: $color-white !default;
$spinkit-spinner-margin: 0 0 0 1.6rem !default;
$spinkit-size: 1.6rem !default;
// Snackbar default
$woot-snackbar-bg: #323232;
$woot-snackbar-button: #ffeb3b;
$swift-ease-out-duration: .4s !default;
$swift-ease-out-timing-function: cubic-bezier(.25, .8, .25, 1) !default;
$swift-ease-out: all $swift-ease-out-duration $swift-ease-out-timing-function !default;
$border-radius: 3px;
$line-height: 1;
$footer-height: 11.2rem;
$header-expanded-height: $space-medium * 10;