mirror of
https://code.equilibrium.co.ao/ITO/doneit-web.git
synced 2026-04-18 20:47:54 +00:00
Added background color to css classes
This commit is contained in:
Eudes Inácio
+125
-102
@@ -1,7 +1,6 @@
|
||||
|
||||
// Custom Theming for Angular Material
|
||||
// For more information: https://material.angular.io/guide/theming
|
||||
@import '~@angular/material/theming';
|
||||
@import "~@angular/material/theming";
|
||||
// Plus imports for other components in your app.
|
||||
|
||||
// Include the common styles for Angular Material. We include this here so that you only
|
||||
@@ -20,13 +19,15 @@ $app-warn: mat-palette($mat-red);
|
||||
|
||||
// Create the theme object. A theme consists of configurations for individual
|
||||
// theming systems such as "color" or "typography".
|
||||
$app-theme: mat-light-theme((
|
||||
color: (
|
||||
primary: $app-primary,
|
||||
accent: $app-accent,
|
||||
warn: $app-warn,
|
||||
$app-theme: mat-light-theme(
|
||||
(
|
||||
color: (
|
||||
primary: $app-primary,
|
||||
accent: $app-accent,
|
||||
warn: $app-warn,
|
||||
),
|
||||
)
|
||||
));
|
||||
);
|
||||
|
||||
// Include theme styles for core and each component used in your app.
|
||||
// Alternatively, you can import and @include the theme mixins for each component
|
||||
@@ -79,7 +80,7 @@ $app-theme: mat-light-theme((
|
||||
--ion-color-warning-tint: #ffca22;
|
||||
|
||||
/** danger **/
|
||||
--ion-color-red:#d30a0a;
|
||||
--ion-color-red: #d30a0a;
|
||||
--ion-color-danger: #eb445a;
|
||||
--ion-color-danger-rgb: 235, 68, 90;
|
||||
--ion-color-danger-contrast: #ffffff;
|
||||
@@ -122,65 +123,65 @@ $app-theme: mat-light-theme((
|
||||
|
||||
body {
|
||||
--ion-color-primary: #428cff;
|
||||
--ion-color-primary-rgb: 66,140,255;
|
||||
--ion-color-primary-rgb: 66, 140, 255;
|
||||
--ion-color-primary-contrast: #ffffff;
|
||||
--ion-color-primary-contrast-rgb: 255,255,255;
|
||||
--ion-color-primary-contrast-rgb: 255, 255, 255;
|
||||
--ion-color-primary-shade: #3a7be0;
|
||||
--ion-color-primary-tint: #5598ff;
|
||||
|
||||
--ion-color-secondary: #50c8ff;
|
||||
--ion-color-secondary-rgb: 80,200,255;
|
||||
--ion-color-secondary-rgb: 80, 200, 255;
|
||||
--ion-color-secondary-contrast: #ffffff;
|
||||
--ion-color-secondary-contrast-rgb: 255,255,255;
|
||||
--ion-color-secondary-contrast-rgb: 255, 255, 255;
|
||||
--ion-color-secondary-shade: #46b0e0;
|
||||
--ion-color-secondary-tint: #62ceff;
|
||||
|
||||
--ion-color-tertiary: #6a64ff;
|
||||
--ion-color-tertiary-rgb: 106,100,255;
|
||||
--ion-color-tertiary-rgb: 106, 100, 255;
|
||||
--ion-color-tertiary-contrast: #ffffff;
|
||||
--ion-color-tertiary-contrast-rgb: 255,255,255;
|
||||
--ion-color-tertiary-contrast-rgb: 255, 255, 255;
|
||||
--ion-color-tertiary-shade: #5d58e0;
|
||||
--ion-color-tertiary-tint: #7974ff;
|
||||
|
||||
--ion-color-success: #2fdf75;
|
||||
--ion-color-success-rgb: 47,223,117;
|
||||
--ion-color-success-rgb: 47, 223, 117;
|
||||
--ion-color-success-contrast: #000000;
|
||||
--ion-color-success-contrast-rgb: 0,0,0;
|
||||
--ion-color-success-contrast-rgb: 0, 0, 0;
|
||||
--ion-color-success-shade: #29c467;
|
||||
--ion-color-success-tint: #44e283;
|
||||
|
||||
--ion-color-warning: #ffd534;
|
||||
--ion-color-warning-rgb: 255,213,52;
|
||||
--ion-color-warning-rgb: 255, 213, 52;
|
||||
--ion-color-warning-contrast: #000000;
|
||||
--ion-color-warning-contrast-rgb: 0,0,0;
|
||||
--ion-color-warning-contrast-rgb: 0, 0, 0;
|
||||
--ion-color-warning-shade: #e0bb2e;
|
||||
--ion-color-warning-tint: #ffd948;
|
||||
|
||||
--ion-color-danger: #ff4961;
|
||||
--ion-color-danger-rgb: 255,73,97;
|
||||
--ion-color-danger-rgb: 255, 73, 97;
|
||||
--ion-color-danger-contrast: #ffffff;
|
||||
--ion-color-danger-contrast-rgb: 255,255,255;
|
||||
--ion-color-danger-contrast-rgb: 255, 255, 255;
|
||||
--ion-color-danger-shade: #e04055;
|
||||
--ion-color-danger-tint: #ff5b71;
|
||||
|
||||
--ion-color-dark: #f4f5f8;
|
||||
--ion-color-dark-rgb: 244,245,248;
|
||||
--ion-color-dark-rgb: 244, 245, 248;
|
||||
--ion-color-dark-contrast: #000000;
|
||||
--ion-color-dark-contrast-rgb: 0,0,0;
|
||||
--ion-color-dark-contrast-rgb: 0, 0, 0;
|
||||
--ion-color-dark-shade: #d7d8da;
|
||||
--ion-color-dark-tint: #f5f6f9;
|
||||
|
||||
--ion-color-medium: #989aa2;
|
||||
--ion-color-medium-rgb: 152,154,162;
|
||||
--ion-color-medium-rgb: 152, 154, 162;
|
||||
--ion-color-medium-contrast: #000000;
|
||||
--ion-color-medium-contrast-rgb: 0,0,0;
|
||||
--ion-color-medium-contrast-rgb: 0, 0, 0;
|
||||
--ion-color-medium-shade: #86888f;
|
||||
--ion-color-medium-tint: #a2a4ab;
|
||||
|
||||
--ion-color-light: #222428;
|
||||
--ion-color-light-rgb: 34,36,40;
|
||||
--ion-color-light-rgb: 34, 36, 40;
|
||||
--ion-color-light-contrast: #ffffff;
|
||||
--ion-color-light-contrast-rgb: 255,255,255;
|
||||
--ion-color-light-contrast-rgb: 255, 255, 255;
|
||||
--ion-color-light-shade: #1e2023;
|
||||
--ion-color-light-tint: #383a3e;
|
||||
|
||||
@@ -194,10 +195,10 @@ $app-theme: mat-light-theme((
|
||||
|
||||
.ios body {
|
||||
--ion-background-color: #000000;
|
||||
--ion-background-color-rgb: 0,0,0;
|
||||
--ion-background-color-rgb: 0, 0, 0;
|
||||
|
||||
--ion-text-color: #ffffff;
|
||||
--ion-text-color-rgb: 255,255,255;
|
||||
--ion-text-color-rgb: 255, 255, 255;
|
||||
|
||||
--ion-color-step-50: #0d0d0d;
|
||||
--ion-color-step-100: #1a1a1a;
|
||||
@@ -228,7 +229,6 @@ $app-theme: mat-light-theme((
|
||||
--ion-color-expediente: #dae3f3;
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
* Material Design Dark Theme
|
||||
* -------------------------------------------
|
||||
@@ -236,10 +236,10 @@ $app-theme: mat-light-theme((
|
||||
|
||||
.md body {
|
||||
--ion-background-color: #121212;
|
||||
--ion-background-color-rgb: 18,18,18;
|
||||
--ion-background-color-rgb: 18, 18, 18;
|
||||
|
||||
--ion-text-color: #ffffff;
|
||||
--ion-text-color-rgb: 255,255,255;
|
||||
--ion-text-color-rgb: 255, 255, 255;
|
||||
|
||||
--ion-border-color: #222222;
|
||||
|
||||
@@ -270,14 +270,14 @@ $app-theme: mat-light-theme((
|
||||
--ion-tab-bar-background: #1f1f1f;
|
||||
|
||||
--ion-card-background: #1e1e1e;
|
||||
/* My colors */
|
||||
/* My colors */
|
||||
--ion-color-expediente: #dae3f3;
|
||||
}
|
||||
}
|
||||
.center{
|
||||
.center {
|
||||
text-align: center;
|
||||
}
|
||||
.wrapper{
|
||||
.wrapper {
|
||||
padding: 150px 20px 0 20px;
|
||||
overflow: auto;
|
||||
}
|
||||
@@ -287,29 +287,35 @@ $app-theme: mat-light-theme((
|
||||
padding: 25px;
|
||||
} */
|
||||
//MODALS
|
||||
.add-note-modal, .emend-message-modal{
|
||||
.add-note-modal,
|
||||
.emend-message-modal {
|
||||
--height: 50%;
|
||||
--border-radius: 10px;
|
||||
padding: 25px;
|
||||
background: rgba(51, 51, 51, 0.3);
|
||||
}
|
||||
.add-note-modal-no-height{
|
||||
.add-note-modal-no-height {
|
||||
--border-radius: 10px;
|
||||
padding: 25px;
|
||||
background: rgba(51, 51, 51, 0.3);
|
||||
}
|
||||
.discart-expedient-modal{
|
||||
.discart-expedient-modal {
|
||||
--height: 50%;
|
||||
--border-radius: 10px;
|
||||
padding: 25px;
|
||||
background: rgba(51, 51, 51, 0.3);
|
||||
}
|
||||
.modal, .newchat, .new-group, .contacts, .group-messages, .custom-modal{
|
||||
.modal,
|
||||
.newchat,
|
||||
.new-group,
|
||||
.contacts,
|
||||
.group-messages,
|
||||
.custom-modal {
|
||||
padding-top: 65px;
|
||||
--border-radius: 25px 25px 0 0;
|
||||
--border-width:0px;
|
||||
--border-width: 0px;
|
||||
}
|
||||
.capitalizeText{
|
||||
.capitalizeText {
|
||||
text-transform: capitalize;
|
||||
}
|
||||
//POPOVER
|
||||
@@ -320,21 +326,21 @@ $app-theme: mat-light-theme((
|
||||
right: 0 !important;
|
||||
top: unset !important;
|
||||
}
|
||||
.messages-options .popover-content{
|
||||
.messages-options .popover-content {
|
||||
width: 100% !important;
|
||||
left: 0 !important;
|
||||
bottom: 0 !important;
|
||||
right: 0 !important;
|
||||
top: unset !important;
|
||||
}
|
||||
.events-options .popover-content{
|
||||
.events-options .popover-content {
|
||||
width: 100% !important;
|
||||
left: 0 !important;
|
||||
bottom: 0 !important;
|
||||
right: 0 !important;
|
||||
top: unset !important;
|
||||
}
|
||||
.exp-options .popover-content{
|
||||
.exp-options .popover-content {
|
||||
width: 100% !important;
|
||||
left: 0 !important;
|
||||
bottom: 0 !important;
|
||||
@@ -350,14 +356,14 @@ $app-theme: mat-light-theme((
|
||||
max-height: 260px;
|
||||
min-height: 260px;
|
||||
} */
|
||||
.chat-options-popover .popover-content{
|
||||
.chat-options-popover .popover-content {
|
||||
width: 100% !important;
|
||||
left: 0 !important;
|
||||
bottom: 0 !important;
|
||||
right: 0 !important;
|
||||
top: unset !important;
|
||||
}
|
||||
.group-duration .popover-content{
|
||||
.group-duration .popover-content {
|
||||
width: 100% !important;
|
||||
left: 0 !important;
|
||||
bottom: 0 !important;
|
||||
@@ -368,11 +374,11 @@ $app-theme: mat-light-theme((
|
||||
/* .event-actions-popover ion-list{
|
||||
} */
|
||||
|
||||
.item-hover:hover{
|
||||
.item-hover:hover {
|
||||
background-color: #e6f6ff75 !important;
|
||||
}
|
||||
|
||||
.box-hover:hover{
|
||||
.box-hover:hover {
|
||||
background-color: #e6f6ff75 !important;
|
||||
border: 1px solid #42b9fe !important;
|
||||
}
|
||||
@@ -387,25 +393,29 @@ $app-theme: mat-light-theme((
|
||||
margin-bottom: 10px;
|
||||
overflow: auto;
|
||||
}
|
||||
.content-pr-Oficial, .content-PR-Oficial{
|
||||
.content-pr-Oficial,
|
||||
.content-PR-Oficial {
|
||||
width: 340px;
|
||||
border-radius: 5px;
|
||||
border-right: 5px solid #99e47b;
|
||||
overflow: auto;
|
||||
}
|
||||
.content-pr-Pessoal, .content-PR-Pessoal{
|
||||
.content-pr-Pessoal,
|
||||
.content-PR-Pessoal {
|
||||
width: 340px;
|
||||
border-radius: 5px;
|
||||
border-right: 5px solid #958bfc;
|
||||
overflow: auto;
|
||||
}
|
||||
.content-mdgpr-Oficial, .content-MDGPR-Oficial{
|
||||
.content-mdgpr-Oficial,
|
||||
.content-MDGPR-Oficial {
|
||||
width: 340px;
|
||||
border-radius: 5px;
|
||||
border-right: 5px solid #ffb703;
|
||||
overflow: auto;
|
||||
}
|
||||
.content-mdgpr-Pessoal, .content-MDGPR-Pessoal{
|
||||
.content-mdgpr-Pessoal,
|
||||
.content-MDGPR-Pessoal {
|
||||
width: 340px;
|
||||
border-radius: 5px;
|
||||
border-right: 5px solid #f05d5e;
|
||||
@@ -432,11 +442,11 @@ $app-theme: mat-light-theme((
|
||||
border-right: 5px solid #8b0ae0;
|
||||
}
|
||||
|
||||
.approve-event-time{
|
||||
.approve-event-time {
|
||||
width: 33px;
|
||||
float: left;
|
||||
}
|
||||
.approve-event-time p{
|
||||
.approve-event-time p {
|
||||
font-family: Roboto;
|
||||
font-size: 13px;
|
||||
font-weight: normal;
|
||||
@@ -448,11 +458,11 @@ $app-theme: mat-light-theme((
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.approve-event-detail{
|
||||
.approve-event-detail {
|
||||
float: left;
|
||||
margin-left: 10px;
|
||||
}
|
||||
.approve-event-detail p{
|
||||
.approve-event-detail p {
|
||||
width: 250px;
|
||||
font-family: Roboto;
|
||||
font-size: 13px;
|
||||
@@ -465,7 +475,7 @@ $app-theme: mat-light-theme((
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.approve-event-detail h3{
|
||||
.approve-event-detail h3 {
|
||||
width: 250px;
|
||||
font-family: Roboto;
|
||||
font-size: 15px;
|
||||
@@ -478,119 +488,118 @@ $app-theme: mat-light-theme((
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.nav-icon{
|
||||
.nav-icon {
|
||||
font-size: 40px;
|
||||
}
|
||||
.btn-div{
|
||||
.btn-div {
|
||||
width: 390px;
|
||||
margin: 10px;
|
||||
overflow: auto;
|
||||
}
|
||||
.footer-toolbar{
|
||||
.footer-toolbar {
|
||||
width: 400px;
|
||||
margin: 10px auto;
|
||||
overflow: auto;
|
||||
--background: #fff;
|
||||
}
|
||||
|
||||
.btn-ok-no-width{
|
||||
.btn-ok-no-width {
|
||||
height: 45px !important;
|
||||
margin: 0 auto;
|
||||
padding:0 !important;
|
||||
padding: 0 !important;
|
||||
border-radius: 22.5px;
|
||||
background-color: #42b9fe;
|
||||
color: #ffffff !important;
|
||||
}
|
||||
.btn-ok{
|
||||
.btn-ok {
|
||||
width: 170px !important;
|
||||
height: 45px !important;
|
||||
margin: 0 auto !important;
|
||||
padding:0 !important;
|
||||
padding: 0 !important;
|
||||
border-radius: 22.5px;
|
||||
background-color: #42b9fe;
|
||||
color: #ffffff !important;
|
||||
}
|
||||
.btn-delete{
|
||||
.btn-delete {
|
||||
display: block;
|
||||
width: 170px !important;
|
||||
height: 45px !important;
|
||||
margin: 0 auto !important;
|
||||
padding:0 !important;
|
||||
padding: 0 !important;
|
||||
border-radius: 22.5px;
|
||||
background-color: #ffe0e0;
|
||||
color: #d30a0a !important;
|
||||
}
|
||||
.btn-cancel{
|
||||
.btn-cancel {
|
||||
display: block;
|
||||
width: 170px !important;
|
||||
height: 45px !important;
|
||||
padding:0 !important;
|
||||
padding: 0 !important;
|
||||
border-radius: 22.5px;
|
||||
background-color: #e0e9ee;
|
||||
background-color: #e0e9ee;
|
||||
color: #061b52 !important;
|
||||
margin: 0 auto !important;
|
||||
}
|
||||
|
||||
.btn-cancel:hover, .btn-delete:hover{
|
||||
.btn-cancel:hover,
|
||||
.btn-delete:hover {
|
||||
background-color: #42b9fe;
|
||||
color: #ffffff !important;
|
||||
}
|
||||
|
||||
.btn-ok-medium{
|
||||
.btn-ok-medium {
|
||||
width: 130px !important;
|
||||
height: 45px !important;
|
||||
margin: 0 auto !important;
|
||||
padding:0 !important;
|
||||
padding: 0 !important;
|
||||
border-radius: 22.5px;
|
||||
background-color: #42b9fe;
|
||||
color: #ffffff !important;
|
||||
}
|
||||
.btn-delete-medium{
|
||||
.btn-delete-medium {
|
||||
display: block;
|
||||
width: 130px !important;
|
||||
height: 45px !important;
|
||||
margin: 0 auto !important;
|
||||
padding:0 !important;
|
||||
padding: 0 !important;
|
||||
border-radius: 22.5px;
|
||||
background-color: #ffe0e0;
|
||||
color: #d30a0a !important;
|
||||
}
|
||||
.btn-cancel-medium{
|
||||
.btn-cancel-medium {
|
||||
display: block;
|
||||
width: 130px !important;
|
||||
height: 45px !important;
|
||||
padding:0 !important;
|
||||
padding: 0 !important;
|
||||
border-radius: 22.5px;
|
||||
background-color: #e0e9ee;
|
||||
background-color: #e0e9ee;
|
||||
color: #061b52 !important;
|
||||
margin: 0 auto !important;
|
||||
}
|
||||
.btn-no-color{
|
||||
.btn-no-color {
|
||||
background-color: #fff;
|
||||
}
|
||||
.bg-blue{
|
||||
--background:#0782c9;
|
||||
background:#0782c9;
|
||||
--background-color:#0782c9;
|
||||
background-color:#0782c9;
|
||||
.bg-blue {
|
||||
--background: #0782c9;
|
||||
background: #0782c9;
|
||||
--background-color: #0782c9;
|
||||
background-color: #0782c9;
|
||||
color: #ffffff;
|
||||
--color: #ffffff;
|
||||
}
|
||||
.exp-workflow{
|
||||
.exp-workflow {
|
||||
float: left;
|
||||
margin-left: 15px;
|
||||
|
||||
.label{
|
||||
.label {
|
||||
border-radius: 20px;
|
||||
background: #ffb703;
|
||||
font-size: 12px;
|
||||
float: right;
|
||||
padding: 2.5px 13.5px 2.5px 13.5px;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* .main-content{
|
||||
width: 100%;
|
||||
@@ -598,35 +607,49 @@ $app-theme: mat-light-theme((
|
||||
overflow-y: auto;
|
||||
} */
|
||||
|
||||
|
||||
|
||||
/* Importing Bootstrap SCSS file. */
|
||||
@import '~bootstrap/scss/bootstrap';
|
||||
@import "~bootstrap/scss/bootstrap";
|
||||
|
||||
html, body { height: 100%; }
|
||||
body { margin: 0; font-family: Roboto, "Helvetica Neue", sans-serif; }
|
||||
html,
|
||||
body {
|
||||
height: 100%;
|
||||
}
|
||||
body {
|
||||
margin: 0;
|
||||
font-family: Roboto, "Helvetica Neue", sans-serif;
|
||||
}
|
||||
|
||||
.ion-segment-button-no-border {
|
||||
--indicator-color: transparent !important;
|
||||
--indicator-color-checked: transparent !important;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.gov{
|
||||
--login-background: linear-gradient(180deg, #C63527 60%, #000 100%) !important;
|
||||
--button-hover: #FFB81C;
|
||||
--inicio-open-page-from-box: #C63527;
|
||||
.gov {
|
||||
--login-background: linear-gradient(180deg, #c63527 60%, #000 100%) !important;
|
||||
--button-hover: #ffb81c;
|
||||
--inicio-open-page-from-box: #c63527;
|
||||
|
||||
--header-tab-top-border: #000;
|
||||
--header-tab-text-white: rgb(0, 0, 0);
|
||||
|
||||
--color: #D9D9D9;
|
||||
--color2: #f0f0f0;
|
||||
--color3: #D9D9D9;
|
||||
--color4: #d9d9d9ee;
|
||||
--color5: #ececec;
|
||||
}
|
||||
|
||||
.default {
|
||||
--login-background: linear-gradient(180deg, #42B9FE 0%, #0782C9 100%) !important;
|
||||
--button-hover: #42B9FE;
|
||||
--inicio-open-page-from-box: #42B9FE;
|
||||
--login-background: linear-gradient(180deg, #42b9fe 0%, #0782c9 100%) !important;
|
||||
--button-hover: #42b9fe;
|
||||
--inicio-open-page-from-box: #42b9fe;
|
||||
|
||||
--header-tab-top-border: white;
|
||||
--header-tab-text-white: white;
|
||||
|
||||
--color: #0782c9;
|
||||
--color2: #45baff;
|
||||
--color3: #0782c9;
|
||||
--color4: #0782c9f0;
|
||||
--color5: #45baff;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user