Skip to main contentAzure DevOps
infsoft-dev
/
WPE Libraries
/
Repos
/
Commits
/
Sign in to your account
Sign in
WPE Libraries
Overview
ReposFilesCommitsBranchesTagsPull requests
Pipelines
add variables for colors
Browse Files
f145db66
Michael Schmitz
committed Mar 13, 2024
main
succeeded
Files
Details
3 changed files
WPE.App.Shared.BaseComponents
Pages/ActionElement/DropDown
DropDownBasic.razor.css
wwwroot
colors.css
+
WPE.App.Shared.BaseComponents.csproj
DropDownBasic.razor.css
/WPE.App.Shared.BaseComponents/Pages/ActionElement/DropDown/DropDownBasic.razor.css-6+6
/WPE.App.Shared.BaseComponents/Pages/ActionElement/DropDown/DropDownBasic.razor.css
View
Add comment 4 }
Add comment 5
Add comment 6 .opened .dropdown {
Add comment 7 Minus   border-bottom: 2px solid var(--color-black-Black-100, #000);
Add comment 7 Plus   border-bottom: 2px solid var(--color-black);
Add comment 8 }
Add comment 9
Add comment 10 .dropdown-container.opened {
Add comment 15 width: 100%;
Add comment 16 max-width: 400px;
Add comment 17 border-radius: 2px;
Add comment 18 Minus   border: 1px solid var(--color-grey-primary-4-grey-mid-808080100, #808080);
Add comment 18 Plus   border: 1px solid var(--color-grey-primary-mid);
Add comment 19 }
Add comment 20
Add comment 21 .dropdown {
Add comment 35 }
Add comment 36
Add comment 37 .label {
Add comment 38 Minus   color: var(--color-grey-primary-4-grey-mid-808080100, #808080);
Add comment 38 Plus   color: var(--color-grey-primary-mid);
Add comment 39 font-size: 10px;
Add comment 40 font-style: normal;
Add comment 41 font-weight: 400;
Add comment 43 }
Add comment 44
Add comment 45 .value {
Add comment 46 Minus   color: var(--primaryWcag, #005929);
Add comment 46 Plus   color: var(--color-brand-primary-wcag);
Add comment 47 font-size: 14px;
Add comment 48 font-style: normal;
Add comment 49 font-weight: 400;
Add comment 89 }
Add comment 90
Add comment 91 .item:hover {
Add comment 92 Minus   background: var(--color-grey-secondary-26-grey-tone-f-7-f-7-f-7100, #F7F7F7);
Add comment 92 Plus   background: var(--color-grey-secondary-26);
Add comment 93 }
Add comment 94
Add comment 95 .item:active {
Add comment 96 Minus   background: var(--color-blue-active-BLUE-ACTIVE-10, rgba(0, 102, 204, 0.10));
Add comment 96 Plus   background: var(--color-blue-active-10);
Add comment 97 }
colors.css
/WPE.App.Shared.BaseComponents/wwwroot/colors.css+126
/WPE.App.Shared.BaseComponents/wwwroot/colors.css
View
Add comment 1 Plus  :root {
Add comment 2 Plus   /* Black */
Add comment 3 Plus   --color-black-rgb: 0,0,0;
Add comment 4 Plus   --color-black-04: rgba(var(--color-black-rgb), 0.04);
Add comment 5 Plus   --color-black-05: rgba(var(--color-black-rgb), 0.05);
Add comment 6 Plus   --color-black-10: rgba(var(--color-black-rgb), 0.10);
Add comment 7 Plus   --color-black-15: rgba(var(--color-black-rgb), 0.15);
Add comment 8 Plus   --color-black-20: rgba(var(--color-black-rgb), 0.20);
Add comment 9 Plus   --color-black-25: rgba(var(--color-black-rgb), 0.25);
Add comment 10 Plus   --color-black-35: rgba(var(--color-black-rgb), 0.35);
Add comment 11 Plus   --color-black-50: rgba(var(--color-black-rgb), 0.50);
Add comment 12 Plus   --color-black-60: rgba(var(--color-black-rgb), 0.60);
Add comment 13 Plus   --color-black-75: rgba(var(--color-black-rgb), 0.75);
Add comment 14 Plus   --color-black: rgba(var(--color-black-rgb), 1);
Add comment 15 Plus   /* White */
Add comment 16 Plus   --color-white-rgb: 255,255,255;
Add comment 17 Plus   --color-white-05: rgba(var(--color-white-rgb), 0.05);
Add comment 18 Plus   --color-white-10: rgba(var(--color-white-rgb), 0.10);
Add comment 19 Plus   --color-white-15: rgba(var(--color-white-rgb), 0.15);
Add comment 20 Plus   --color-white-20: rgba(var(--color-white-rgb), 0.20);
Add comment 21 Plus   --color-white-25: rgba(var(--color-white-rgb), 0.25);
Add comment 22 Plus   --color-white-35: rgba(var(--color-white-rgb), 0.35);
Add comment 23 Plus   --color-white-50: rgba(var(--color-white-rgb), 0.50);
Add comment 24 Plus   --color-white-75: rgba(var(--color-white-rgb), 0.75);
Add comment 25 Plus   --color-white-85: rgba(var(--color-white-rgb), 0.85);
Add comment 26 Plus   --color-white-95: rgba(var(--color-white-rgb), 0.95);
Add comment 27 Plus   --color-white: rgba(var(--color-white-rgb), 1);
Add comment 28 Plus   /* Grey Primary */
Add comment 29 Plus   --color-grey-primary-lighter: rgba(204, 204, 204, 1);
Add comment 30 Plus   --color-grey-primary-light: rgba(154, 154, 154, 1);
Add comment 31 Plus   --color-grey-primary-mid: rgba(128, 128, 128, 1);
Add comment 32 Plus   --color-grey-primary-dark: rgba(102, 102, 102, 1);
Add comment 33 Plus   --color-grey-primary-darker-rgb: 51, 51, 51;
Add comment 34 Plus   --color-grey-primary-darker-85: rgba(var(--color-grey-primary-darker-rgb), 0.85);
Add comment 35 Plus   --color-grey-primary-darker: rgba(var(--color-grey-primary-darker-rgb), 1);
Add comment 36 Plus   /* Grey Secondary */
Add comment 37 Plus   --color-grey-secondary-24: rgba(252, 252, 252, 1);
Add comment 38 Plus   --color-grey-secondary-25: rgba(249, 249, 249, 1);
Add comment 39 Plus   --color-grey-secondary-26: rgba(247, 247, 247, 1);
Add comment 40 Plus   --color-grey-secondary-27: rgba(245, 245, 245, 1);
Add comment 41 Plus   --color-grey-secondary-28: rgba(242, 242, 242, 1);
Add comment 42 Plus   --color-grey-secondary-29: rgba(238, 238, 238, 1);
Add comment 43 Plus   --color-grey-secondary-30: rgba(230, 230, 230, 1);
Add comment 44 Plus   --color-grey-secondary-31: rgba(221, 221, 221, 1);
Add comment 45 Plus   --color-grey-secondary-32: rgba(178, 178, 178, 1);
Add comment 46 Plus   --color-grey-secondary-33: rgba(149, 149, 149, 1);
Add comment 47 Plus   --color-grey-secondary-34: rgba(109, 109, 109, 1);
Add comment 48 Plus   --color-grey-secondary-35-rgb: 68, 68, 68;
Add comment 49 Plus   --color-grey-secondary-35: rgba(var(--color-grey-secondary-35), 1);
Add comment 50 Plus   --color-grey-secondary-35-70: rgba(var(--color-grey-secondary-35), 0.70);
Add comment 51 Plus   --color-grey-secondary-36: rgba(23, 23, 23, 1);
Add comment 52 Plus   /* Signal colors */
Add comment 53 Plus   --color-signal-red-rgb: 224, 0, 0;
Add comment 54 Plus   --color-signal-red-03: rgba(var(--color-signal-red-rgb), 0.03);
Add comment 55 Plus   --color-signal-red-10: rgba(var(--color-signal-red-rgb), 0.10);
Add comment 56 Plus   --color-signal-red-15: rgba(var(--color-signal-red-rgb), 0.15);
Add comment 57 Plus   --color-signal-red-20: rgba(var(--color-signal-red-rgb), 0.20);
Add comment 58 Plus   --color-signal-red-25: rgba(var(--color-signal-red-rgb), 0.25);
Add comment 59 Plus   --color-signal-red-50: rgba(var(--color-signal-red-rgb), 0.50);
Add comment 60 Plus   --color-signal-red: rgba(var(--color-signal-red-rgb), 1);
Add comment 61 Plus   --color-signal-green-rgb: 0, 138, 28;
Add comment 62 Plus   --color-signal-green-05: rgba(var(--color-signal-green-rgb), 0.05);
Add comment 63 Plus   --color-signal-green-10: rgba(var(--color-signal-green-rgb), 0.10);
Add comment 64 Plus   --color-signal-green-15: rgba(var(--color-signal-green-rgb), 0.15);
Add comment 65 Plus   --color-signal-green-25: rgba(var(--color-signal-green-rgb), 0.25);
Add comment 66 Plus   --color-signal-green-35: rgba(var(--color-signal-green-rgb), 0.35);
Add comment 67 Plus   --color-signal-green-50: rgba(var(--color-signal-green-rgb), 0.50);
Add comment 68 Plus   --color-signal-green: rgba(var(--color-signal-green-rgb), 1);
Add comment 69 Plus   --color-signal-yellow-rgb: 255, 162, 0;
Add comment 70 Plus   --color-signal-yellow-10: rgba(var(--color-signal-yellow-rgb), 0.10);
Add comment 71 Plus   --color-signal-yellow: rgba(var(--color-signal-yellow-rgb), 1);
Add comment 72 Plus   /* Active */
Add comment 73 Plus   --color-blue-active-rgb: 0, 102, 204;
Add comment 74 Plus   --color-blue-active-10: rgba(var(--color-blue-active-rgb), 0.10);
Add comment 75 Plus   --color-blue-active-20: rgba(var(--color-blue-active-rgb), 0.20);
Add comment 76 Plus   --color-blue-active-35: rgba(var(--color-blue-active-rgb), 0.35);
Add comment 77 Plus   --color-blue-active: rgba(var(--color-blue-active-rgb), 1);
Add comment 78 Plus   --color-blue-active-dark: rgba(0, 52, 104, 1);
Add comment 79 Plus   /* Colors */
Add comment 80 Plus   --color-yellow: rgba(255, 207, 35, 1);
Add comment 81 Plus   --color-orange-rgb: 255, 131, 40;
Add comment 82 Plus   --color-orange-25: rgba(var(--color-orange-rgb), 0.25);
Add comment 83 Plus   --color-orange: rgba(var(--color-orange-rgb), 1);
Add comment 84 Plus   --color-orange-popup-light: rgba(255, 218, 168, 1);
Add comment 85 Plus   --color-orange-popup: rgba(243, 141, 0, 1);
Add comment 86 Plus   --color-red-rgb: 236, 9, 24;
Add comment 87 Plus   --color-red-15: rgba(var(--color-red-rgb), 0.15);
Add comment 88 Plus   --color-red: rgba(var(--color-red-rgb), 1);
Add comment 89 Plus   --color-purple: rgba(171, 67, 223, 1);
Add comment 90 Plus   --color-blue-light: rgba(175, 186, 218, 1);
Add comment 91 Plus   --color-blue-lighter: rgba(223, 230, 251, 1);
Add comment 92 Plus   --color-blue-dark: rgba(3, 27, 98, 1);
Add comment 93 Plus   --color-turquoise: rgba(6, 197, 174, 1);
Add comment 94 Plus   --color-green-rgb: 0, 161, 45;
Add comment 95 Plus   --color-green-10: rgba(var(--color-green-rgb), 0.10);
Add comment 96 Plus   --color-green-15: rgba(var(--color-green-rgb), 0.15);
Add comment 97 Plus   --color-green-50: rgba(var(--color-green-rgb), 0.50);
Add comment 98 Plus   --color-green: rgba(var(--color-green-rgb), 1);
Add comment 99 Plus   --color-infsoft: rgba(227, 6, 19, 1);
Add comment 100 Plus   /* Brand */
Add comment 101 Plus   --color-brand-primary-03: rgba(var(--color-brand-primary-rgb), 0.03);
Add comment 102 Plus   --color-brand-primary-05: rgba(var(--color-brand-primary-rgb), 0.05);
Add comment 103 Plus   --color-brand-primary-15: rgba(var(--color-brand-primary-rgb), 0.15);
Add comment 104 Plus   --color-brand-primary-25: rgba(var(--color-brand-primary-rgb), 0.25);
Add comment 105 Plus   --color-brand-primary-35: rgba(var(--color-brand-primary-rgb), 0.35);
Add comment 106 Plus   --color-brand-primary-50: rgba(var(--color-brand-primary-rgb), 0.50);
Add comment 107 Plus   --color-brand-primary-75: rgba(var(--color-brand-primary-rgb), 0.75);
Add comment 108 Plus   --color-brand-primary: rgba(var(--color-brand-primary-rgb), 1);
Add comment 109 Plus   --color-brand-primary-on-dark-75: rgba(var(--color-brand-primary-on-dark-rgb), 0.75);
Add comment 110 Plus   --color-brand-primary-on-dark: rgba(var(--color-brand-primary-on-dark-rgb), 1);
Add comment 111 Plus   --color-brand-primary-wcag-05: rgba(var(--color-brand-primary-wcag-rgb), 0.05);
Add comment 112 Plus   --color-brand-primary-wcag-25: rgba(var(--color-brand-primary-wcag-rgb), 0.25);
Add comment 113 Plus   --color-brand-primary-wcag-65: rgba(var(--color-brand-primary-wcag-rgb), 0.65);
Add comment 114 Plus   --color-brand-primary-wcag-85: rgba(var(--color-brand-primary-wcag-rgb), 0.85);
Add comment 115 Plus   --color-brand-primary-wcag: rgba(var(--color-brand-primary-wcag-rgb), 1);
Add comment 116 Plus   --color-brand-background-1-80: rgba(var(--color-brand-background-1-rgb), 0.80);
Add comment 117 Plus   --color-brand-background-1: rgba(var(--color-brand-background-1-rgb), 1);
Add comment 118 Plus   --color-brand-background-2: rgba(var(--color-brand-background-2-rgb), 1);
Add comment 119 Plus   /* Brand base colors, overriden per tenant */
Add comment 120 Plus   --color-brand-primary-rgb: 57, 160, 25;
Add comment 121 Plus   --color-brand-primary-on-dark-rgb: 176, 217, 163;
Add comment 122 Plus   --color-brand-primary-wcag-rgb: 0, 89, 41;
Add comment 123 Plus   --color-brand-background-1-rgb: 0, 55, 29;
Add comment 124 Plus   --color-brand-background-2-rgb: 21, 65, 0;
Add comment 125 Plus  }
Add comment 126 Plus  
WPE.App.Shared.BaseComponents.csproj
/WPE.App.Shared.BaseComponents/WPE.App.Shared.BaseComponents.csproj-1+1
/WPE.App.Shared.BaseComponents/WPE.App.Shared.BaseComponents.csproj
View
Add comment 15 <PackageIcon>icon.png</PackageIcon>
Add comment 16 <PackageReadmeFile>ReadMe.md</PackageReadmeFile>
Add comment 17 <PackageTags>WPE;Workplace Experience;Blazor;MAUI;infsoft</PackageTags>
Add comment 18 Minus   <Version>0.0.54</Version>
Add comment 18 Plus   <Version>0.0.55</Version>
Add comment 19 <WarningsAsErrors>RZ10012</WarningsAsErrors>
Add comment 20 </PropertyGroup>
Add comment 21