| //// |
| /// @group components/group |
| //// |
| |
| |
| @mixin os-group-color($col) { |
| |
| $bgcol: mix($col, $v-app-background-color, 70); |
| $txcol: valo-font-color($bgcol); |
| $bgcol-dim: mix($col, $v-app-background-color, 30); |
| $txcol-dim: valo-font-color($bgcol-dim); |
| |
| background-color: $bgcol-dim; |
| color: $txcol-dim; |
| border-radius: $v-border-radius; |
| @include box-shadow(2px 1px 7px rgba(0,0,0,0.35)); |
| .v-textfield.v-disabled { |
| color: $txcol-dim; |
| } |
| &.os-focus { |
| background-color: $bgcol; |
| color: $txcol; |
| .v-textfield.v-disabled { |
| color: $txcol; |
| } |
| } |
| } |
| |
| /// Color backdrop for "layout" areas. Only used in POS/Cash register so far. |
| @mixin os-context-group { |
| &.os-group { |
| &.os-color-1 { @include os-group-color($os-color-1); } |
| &.os-color-2 { @include os-group-color($os-color-2); } |
| &.os-color-3 { @include os-group-color($os-color-3); } |
| &.os-color-4 { @include os-group-color($os-color-4); } |
| &.os-color-5 { @include os-group-color($os-color-5); } |
| &.os-color-6 { @include os-group-color($os-color-6); } |
| &.os-color-7 { @include os-group-color($os-color-7); } |
| &.os-color-8 { @include os-group-color($os-color-8); } |
| &.os-color-9 { @include os-group-color($os-color-9); } |
| &.os-color-10 { @include os-group-color($os-color-10); } |
| &.os-color-11 { @include os-group-color($os-color-11); } |
| &.os-color-12 { @include os-group-color($os-color-12); } |
| &.os-color-13 { @include os-group-color($os-color-13); } |
| &.os-color-14 { @include os-group-color($os-color-14); } |
| } |
| &.os-no-underline { |
| .v-textfield.v-disabled { |
| border: transparent; |
| } |
| } |
| } |