b01d032d0d
* Enhancement: Updates sidebar to a new design (#2733) * feat: Changes primary navbar to new design (#2598) * feat: updates design for secondary navbar (#2612) * Changes primary nvbar to new design * Updates design for contexual sidebar * Fixes issues with JSON * Remove duplication of notificatons in Navigation * Fixes broken tests * Fixes broken tests * Update app/javascript/dashboard/components/layout/AvailabilityStatus.vue * Update app/javascript/dashboard/components/layout/AvailabilityStatus.vue * Update app/javascript/dashboard/components/layout/SidebarItem.vue Co-authored-by: Sivin Varghese <64252451+iamsivin@users.noreply.github.com> * Update app/javascript/dashboard/components/layout/SidebarItem.vue Co-authored-by: Sivin Varghese <64252451+iamsivin@users.noreply.github.com> * Update app/javascript/dashboard/modules/sidebar/components/Secondary.vue Co-authored-by: Sivin Varghese <64252451+iamsivin@users.noreply.github.com> Co-authored-by: Sivin Varghese <64252451+iamsivin@users.noreply.github.com> * Chore: Update design changes to features * Fixes menu transitions and refactors code * Refactors sidebar routeing logic * lint error fixes * Fixes dropdown menu styles * Fixes secondary new item links * Fixes lint scss issues * fixes linter issues * Fixes broken test cases * Update AvailabilityStatus.spec.js * Review feedbacks * Fixes add modal for label * Add tooltip for primary menu item * Tooltip for notifications * Adds tooltip for primary menu items * Review fixes * Review fixes * Fix merge issues * fixes logo size for login pages * fixes Merge breaks with styles Co-authored-by: Sivin Varghese <64252451+iamsivin@users.noreply.github.com> Co-authored-by: Pranav Raj S <pranav@chatwoot.com>
101 lines
2.1 KiB
SCSS
101 lines
2.1 KiB
SCSS
// Font sizes
|
|
$font-size-nano: 0.8rem;
|
|
$font-size-micro: 1.0rem;
|
|
$font-size-mini: 1.2rem;
|
|
$font-size-small: 1.4rem;
|
|
$font-size-default: 1.6rem;
|
|
$font-size-medium: 1.8rem;
|
|
$font-size-large: 2.2rem;
|
|
$font-size-big: 2.4rem;
|
|
$font-size-bigger: 3.0rem;
|
|
$font-size-mega: 3.4rem;
|
|
$font-size-giga: 4.0rem;
|
|
|
|
// 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: 2.0rem;
|
|
$space-medium: 2.4rem;
|
|
$space-large: 3.2rem;
|
|
$space-larger: 4.8rem;
|
|
$space-jumbo: 6.4rem;
|
|
$space-mega: 10.0rem;
|
|
|
|
// 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-padding: $space-large $space-two;
|
|
|
|
// Colors
|
|
$color-woot: #1f93ff;
|
|
$color-gray: #6e6f73;
|
|
$color-light-gray: #999a9b;
|
|
|
|
$color-border: var(--s-75);
|
|
$color-border-light: var(--s-50);
|
|
$color-border-dark: var(--s-100);
|
|
|
|
$color-background: var(--s-50);
|
|
$color-background-light: var(--s-25);
|
|
|
|
$color-white: #fff;
|
|
$color-body: #3c4858;
|
|
$color-heading: #1f2d3d;
|
|
$color-extra-light-blue: #f5f7f9;
|
|
|
|
$primary-color: $color-woot;
|
|
$secondary-color: #5d7592;
|
|
$success-color: #44ce4b;
|
|
$warning-color: #ffc532;
|
|
$alert-color: #ff382d;
|
|
|
|
$masked-bg: rgba(0, 0, 0, .4);
|
|
|
|
// Color-palettes
|
|
|
|
$color-primary-light: #c7e3ff;
|
|
$color-primary-dark: darken($color-woot, 20%);
|
|
|
|
// Thumbnail
|
|
$thumbnail-radius: 4rem;
|
|
|
|
// chat-header
|
|
$conv-header-height: 4rem;
|
|
|
|
// 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-function: cubic-bezier(0.37, 0, 0.63, 1) !default;
|
|
$swift-ease-out: all $swift-ease-out-duration $swift-ease-out-function !default;
|
|
|
|
// Ionicons
|
|
$ionicons-font-path: '~ionicons/fonts';
|
|
|
|
// Transitions
|
|
$transition-ease-in: all 0.250s ease-in;
|