// Commonly used web colors $black: #000000; // Black $white: #ffffff; // White $success-green: #79bd9a; // Padua $error-red: #df405a; // Cerise $warning-red: #ff5050; // Sunset Orange $gold-star: #ca8f04; // Dark Goldenrod // Values from the classic Mastodon UI $classic-base-color: #282c37; // Midnight Express $classic-primary-color: #9baec8; // Echo Blue $classic-secondary-color: #d9e1e8; // Pattens Blue $classic-highlight-color: #2b90d9; // Summer Sky // Variables for defaults in UI $base-shadow-color: $black !default; $base-overlay-background: $black !default; $base-border-color: $white !default; $simple-background-color: $white !default; $primary-text-color: $white !default; $valid-value-color: $success-green !default; $error-value-color: $error-red !default; // Tell UI to use selected colors $ui-base-color: $classic-base-color !default; // Darkest $ui-base-lighter-color: lighten($ui-base-color, 26%) !default; // Lighter darkest $ui-primary-color: $classic-primary-color !default; // Lighter $ui-secondary-color: $classic-secondary-color !default; // Lightest $ui-highlight-color: $classic-highlight-color !default; // Vibrant // Avatar border radius // If you use this to mandate circular avatars for everybody, your // users will probably hate you. It's gonna be a user setting. $ui-avatar-border-size: 8%; // * * * * * * * // // Glitch shit // ----------- $glitch-animation-speed: 1; // Multiplier for glitch CSS // animations and transitions. A // value of 0 disables animations; // the default value provides slow // animations that last .9s and // fast ones that last .3s. $glitch-aside-color: // This is used for the background darken($white, 8%); // of aside content in eg preview // cards. Counterpoint to // $glitch-texture-color for use // with white backgrounds. $glitch-darker-color: // This is used for things which darken($ui-base-color, 7%); // need a darker color than the // "darkest" base color and matches // the default UI color. // Counterpoint to // $glitch-lighter-color for use // with dark elements. $glitch-disabled-opacity: .35; // For disabled buttons $glitch-texture-color: // This is used for shit that is lighten($ui-base-color, 8%); // purely presentational and // conveys no real information, // like the borders at the bottom // of statuses. It's also used as // the background for direct toots. $glitch-lighter-color: // This is used for hovered lighten($ui-primary-color, 7%); // buttons and the like where we // need something lighter than // $ui-primary-color but darker // than $ui-secondary-color.