@import "../mixins/misc"; @import '../mixins/colors'; // Typography $text-color: var(--color--font-primary); $font-family-base: "Lato", sans-serif; $font-size-base: 14px; $font-size-large: ceil($font-size-base * 1.25); // 18px $font-size-small: ceil($font-size-base * 0.85); // 12px $font-size-tiny: ceil($font-size-base * 0.7); // 10px $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: ceil($font-size-base * 1.1); // 16px $font-size-widget-header: $font-size-large; $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: floor($font-size-base * $line-height-base); // ~20px // By default, this inherits from the ``. $headings-font-family: inherit; $headings-font-weight: 700; $headings-line-height: 1.1; $headings-color: #000; // Design specific $bar-bottom-container-height: 40px; $header-height: 80px; // Icons sizes: $icon-size-default: 20px; $icon-size-inline: 16px; $icon-size-button: $icon-size-inline; // Avatar sizes: $avatar-small: 25px; $avatar-medium: 100px; $avatar-normal: 250px; $sidebar-border-width: 1px; $drag_and_drop_z_index: 1000; $drag_and_drop_border: 1px solid $base-color; $transition-duration: .3s; $transition-duration-slow: .5s; $transition-duration-superslow: 1s; // Border radius: $border-radius: 4px; $border-radius-avatar-menu: 7px; $border-radius-search: 7px; // Layout $page-margin: 15px; $sidebar-padding: 12px; $sidebar-width: 270px; $content-width: 400px; $content-margin: 12px; $max-content-width: 4 * $sidebar-width + $page-margin; $footer-height: 32px; $site-width: ($page-margin * 2 + $sidebar-width + $sidebar-padding * 2 + $sidebar-border-width * 2 + $content-width + $content-margin * 2); $page-width: ($sidebar-width + $sidebar-padding * 2 + $sidebar-border-width * 2 + $content-width + $content-margin * 2); $grid-gap: 0; // Buttons $button-icons: ( accept: accept, add: add, arr_left: arr_1left, arr_right: arr_1right, cancel: decline, date: date, delete: trash, edit: edit, move-down: arr_1down, move-up: arr_1up, play: play, refresh: refresh, search: search, sidebar-toggle: sidebar3, trash: trash, upload: upload, has-notice: file-text, has-no-notice: file, );