Marmelator/common-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix rgba variables

Browse Source
This commit is contained in:
Dan Percic 2021-09-21 17:17:41 +03:00
parent dde0d7e7a5
commit a16d1db3ab
4 changed files with 9 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/assets/styles/_common-functions.scss Normal file
View File

@ -0,0 +1,3 @@
@function hexToRgb($color) {
@return #{red($color) + ', ' + green($color) + ', ' + blue($color)};
}

2
src/assets/styles/_common-variables.scss
View File

@ -2,8 +2,10 @@
:root { :root {
--iqser-primary: lightblue; --iqser-primary: lightblue;
--iqser-primary-rgb: 220, 230, 234;
--iqser-primary-2: orange; --iqser-primary-2: orange;
--iqser-accent: blue; --iqser-accent: blue;
--iqser-accent-rgb: 123, 234, 111;
--iqser-disabled: #9398a0; --iqser-disabled: #9398a0;
--iqser-not-disabled-table-item: #f9fafb; --iqser-not-disabled-table-item: #f9fafb;
--iqser-btn-bg-hover: #e2e4e9; --iqser-btn-bg-hover: #e2e4e9;

6
src/assets/styles/common-buttons.scss
View File

@ -62,8 +62,7 @@ iqser-circle-button {
transition: background-color 0.2s; transition: background-color 0.2s;
&.overlay { &.overlay {
// TODO background: rgba(var(--iqser-primary-rgb), 0.1);
background: rgba(var(--iqser-primary), 0.1);
} }
&:not(.overlay):hover { &:not(.overlay):hover {
@ -101,8 +100,7 @@ iqser-circle-button,
iqser-icon-button { iqser-icon-button {
&[aria-expanded='true'] { &[aria-expanded='true'] {
button { button {
// TODO background: rgba(var(--iqser-primary-rgb), 0.1);
background: rgba(var(--iqser-primary), 0.1);
&.primary { &.primary {
background: var(--iqser-primary-2); background: var(--iqser-primary-2);

6
src/assets/styles/common-inputs.scss
View File

@ -116,8 +116,7 @@ form .iqser-input-group:not(first-of-type) {
} }
&.ng-invalid.ng-touched { &.ng-invalid.ng-touched {
// TODO border-color: rgba(var(--iqser-primary-rgb), 0.3);
border-color: rgba(var(--iqser-primary, 0.3));
&:focus { &:focus {
border-color: var(--iqser-primary); border-color: var(--iqser-primary);
@ -127,8 +126,7 @@ form .iqser-input-group:not(first-of-type) {
&:disabled, &:disabled,
&.mat-select-disabled { &.mat-select-disabled {
background-color: var(--iqser-filter-bg); background-color: var(--iqser-filter-bg);
// TODO color: rgba(var(--iqser-accent-rgb), 0.3);
color: rgba(var(--iqser-accent, 0.3));
} }
} }