// colors $blue_l: #a2d2f4; $blue: #2090ea; $grey_l: #f3f3f3; $grey_l2: #d9d9d9; // ~ Equivalent to darken($grey_l, 10%), unreliably compiles $grey_l3: darken($grey_l, 20%); $grey_l4: darken($grey_l, 40%); $grey: #616161; $grey_d: #454545; $green: #47D647; $red: #EF8989; @font-face { font-family: 'Roboto-Light'; src: url('/fonts/Roboto-Light.ttf') format('truetype'); } @font-face { font-family: 'Roboto'; src: url('/fonts/Roboto-Regular.ttf') format('truetype'); } @font-face { font-family: 'Roboto'; src: url('/fonts/Roboto-Italic.ttf') format('truetype'); font-style: italic; } @font-face { font-family: 'Roboto'; src: url('/fonts/Roboto-Bold.ttf') format('truetype'); font-weight: bold; } $roboto: Roboto, 'Helvetica Neue', Arial, Helvetica, sans-serif; $roboto-light: Roboto-Light, 'Helvetica Neue', Arial, Helvetica, sans-serif; $header-height: 64px; $button-height: 24px; $header-color: $blue; $search-height: 36px; $unread-badge-size: 21px; $loading-height: 16px; $big-avatar-min-width: 900px; $border-radius: 5px; $error-icon-size: 24px; $font-size: 14px; $font-size-small: (13/14) + em; $material_red: #EF5350; $material_pink: #EC407A; $material_purple: #AB47BC; $material_deep_purple: #7E57C2; $material_indigo: #5C6BC0; $material_blue: #2196F3; $material_light_blue: #03A9F4; $material_cyan: #00BCD4; $material_teal: #009688; $material_green: #4CAF50; $material_light_green: #7CB342; $material_orange: #FF9800; $material_deep_orange: #FF5722; $material_amber: #FFB300; $material_blue_grey: #607D8B; $dark_material_red: #D32F2F; $dark_material_pink: #C2185B; $dark_material_purple: #7B1FA2; $dark_material_deep_purple: #512DA8; $dark_material_indigo: #303F9F; $dark_material_blue: #1976D2; $dark_material_light_blue: #0288D1; $dark_material_cyan: #0097A7; $dark_material_teal: #00796B; $dark_material_green: #388E3C; $dark_material_light_green: #689F38; $dark_material_orange: #F57C00; $dark_material_deep_orange: #E64A19; $dark_material_amber: #FFA000; $dark_material_blue_grey: #455A64;