83 lines
2.5 KiB
Sass
83 lines
2.5 KiB
Sass
/* You can add global styles to this file, and also import other style files */
|
|
@use 'sass:map'
|
|
@use '@angular/material' as mat
|
|
@tailwind base
|
|
@tailwind components
|
|
@tailwind utilities
|
|
|
|
@include mat.core()
|
|
|
|
html,
|
|
body
|
|
height: 100%
|
|
overscroll-behavior-y: contain
|
|
a
|
|
color: rgb(0, 0, 238)
|
|
text-decoration: underline
|
|
|
|
|
|
$my-primary: mat.define-palette(mat.$indigo-palette, 500)
|
|
$my-accent: mat.define-palette(mat.$amber-palette, A200, A100, A400)
|
|
/* The "warn" palette is optional and defaults to red if not specified.*/
|
|
$my-warn: mat.define-palette(mat.$red-palette)
|
|
$my-disabled: mat.define-palette(mat.$grey-palette, 500)
|
|
|
|
.square-button
|
|
min-width: 150px
|
|
max-width: 150px
|
|
min-height: 150px
|
|
max-height: 150px
|
|
cursor: pointer
|
|
margin: 20px
|
|
h3
|
|
text-align: center
|
|
padding: 0.5rem
|
|
span
|
|
text-align: center
|
|
|
|
.center
|
|
text-align: center
|
|
|
|
.warn
|
|
background-color: red
|
|
|
|
.square-button.primary
|
|
/* Read the 500 hue from the primary color palete.*/
|
|
color: mat.get-color-from-palette($my-primary, '200-contrast')
|
|
background: mat.get-color-from-palette($my-primary, 200)
|
|
|
|
.square-button.strong-primary
|
|
/* Read the 500 hue from the primary color palete.*/
|
|
color: mat.get-color-from-palette($my-primary, '700-contrast')
|
|
background: mat.get-color-from-palette($my-primary, 700)
|
|
|
|
.square-button.accent
|
|
/* Read the 500 hue from the primary color palete.*/
|
|
color: mat.get-color-from-palette($my-accent, '200-contrast')
|
|
background: mat.get-color-from-palette($my-accent, 200)
|
|
|
|
.square-button.strong-accent
|
|
/* Read the 500 hue from the primary color palete.*/
|
|
color: mat.get-color-from-palette($my-accent, '700-contrast')
|
|
background: mat.get-color-from-palette($my-accent, 700)
|
|
|
|
.square-button.warn
|
|
/* Read the 500 hue from the primary color palete.*/
|
|
color: mat.get-color-from-palette($my-warn, '700-contrast')
|
|
background: mat.get-color-from-palette($my-warn, 700)
|
|
|
|
.square-button.strong-warn
|
|
/* Read the 500 hue from the primary color palete.*/
|
|
color: mat.get-color-from-palette($my-warn, '700-contrast')
|
|
background: mat.get-color-from-palette($my-warn, 700)
|
|
|
|
.square-button.disabled
|
|
/* Read the 500 hue from the primary color palete.*/
|
|
color: mat.get-color-from-palette($my-disabled, '500-contrast')
|
|
background: mat.get-color-from-palette($my-disabled, 500)
|
|
|
|
.square-button.strong-disabled
|
|
/* Read the 500 hue from the primary color palete.*/
|
|
color: mat.get-color-from-palette($my-disabled, '800-contrast')
|
|
background: mat.get-color-from-palette($my-disabled, 800)
|