change colors to old version
This commit is contained in:
parent
9d00a32d4f
commit
5cb88250c5
@ -75,6 +75,7 @@
|
||||
font-size: 16px;
|
||||
line-height: 19px;
|
||||
letter-spacing: -0.5px;
|
||||
color: var(--text-color);
|
||||
}
|
||||
|
||||
.price,
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
<img src="/assets/logo-light-theme.png" alt="Логотип">
|
||||
<img src="/assets/logo.svg" alt="Логотип">
|
||||
<h3>Горячая линия</h3>
|
||||
<a class="phone-number" href="tel:88003334130">8 (800) 333-41-30</a>
|
||||
<app-social-media-buttons></app-social-media-buttons>
|
||||
|
||||
@ -8,7 +8,7 @@
|
||||
<div *ngIf="showDropdown" class="backdrop" (click)="closeMenu()"></div>
|
||||
<div class="menu">
|
||||
<button mat-button (click)="toggleMenu()">
|
||||
<span class="material-icons" style="color: white !important">
|
||||
<span class="material-icons" style="color: var(--text-color) !important">
|
||||
more_horiz
|
||||
</span>
|
||||
</button>
|
||||
@ -16,7 +16,7 @@
|
||||
<div class="menu__dropdown" *ngIf="showDropdown">
|
||||
<ul>
|
||||
<menu-item [handler]="handler(aboutApp)">
|
||||
<span class="material-icons icon" style="color: var(--main-color)">
|
||||
<span class="material-icons icon" style="color: var(--main-color_2)">
|
||||
info
|
||||
</span>
|
||||
<span class="item_title">О приложении</span>
|
||||
@ -34,8 +34,8 @@
|
||||
Установить приложение
|
||||
</span>
|
||||
</menu-item>
|
||||
<menu-item *ngIf="!messagingService.checkRequestPermission()" [handler]="handler(messagingService.requestPermission)">
|
||||
<span class="material-icons" style="color: var(--main-color)">
|
||||
<menu-item *ngIf="!notified()" [handler]="handler(notify)">
|
||||
<span class="material-icons" style="color: var(--main-color_2)">
|
||||
notifications
|
||||
</span>
|
||||
<span class="item_title">
|
||||
@ -44,7 +44,7 @@
|
||||
</menu-item>
|
||||
</ng-container>
|
||||
<menu-item [handler]="handler(logout)">
|
||||
<span class="material-icons" style="color: var(--main-color)">
|
||||
<span class="material-icons" style="color: var(--main-color_2)">
|
||||
logout
|
||||
</span>
|
||||
<span class="item_title">Выйти</span>
|
||||
|
||||
@ -15,7 +15,7 @@
|
||||
box-sizing: border-box;
|
||||
padding: 12px 16px;
|
||||
width: 100%;
|
||||
background: var(--button-color);
|
||||
background: var(--main-color_2);
|
||||
color: var(--button-text-color);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@ -52,12 +52,13 @@
|
||||
.menu__dropdown {
|
||||
z-index: 110;
|
||||
position: absolute;
|
||||
background-color: white;
|
||||
background-color: var(--background-color_1);
|
||||
width: 250px;
|
||||
height: fit-content;
|
||||
right: 20px;
|
||||
border-radius: 6px;
|
||||
box-shadow: 0px 2px 5px -3px black;
|
||||
overflow: hidden;
|
||||
|
||||
.item_title {
|
||||
color: var(--text-color);
|
||||
|
||||
@ -10,10 +10,10 @@ import { AuthService } from 'src/app/services/auth.service';
|
||||
@Component({
|
||||
selector: 'app-navbar[title]',
|
||||
templateUrl: './navbar.component.html',
|
||||
styleUrls: ['./navbar.component.scss']
|
||||
styleUrls: ['./navbar.component.scss'],
|
||||
})
|
||||
export class NavbarComponent implements OnInit {
|
||||
@Input() title: string = 'Название не задано'
|
||||
@Input() title: string = 'Название не задано';
|
||||
@Input() backEvent?: () => void;
|
||||
|
||||
showDropdown: boolean = false;
|
||||
@ -24,14 +24,14 @@ export class NavbarComponent implements OnInit {
|
||||
private appleWalletService: AppleWalletService,
|
||||
private cookiesService: CookiesService,
|
||||
private _bottomSheet: MatBottomSheet,
|
||||
private authService: AuthService,
|
||||
private authService: AuthService
|
||||
) {}
|
||||
|
||||
handler(cb: () => void): (e: any) => void {
|
||||
return (e: any) => {
|
||||
cb();
|
||||
this.closeMenu();
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
aboutApp() {}
|
||||
@ -50,7 +50,7 @@ export class NavbarComponent implements OnInit {
|
||||
|
||||
closeMenu = () => {
|
||||
this.showDropdown = false;
|
||||
}
|
||||
};
|
||||
|
||||
back() {
|
||||
if (this.backEvent) {
|
||||
@ -60,11 +60,11 @@ export class NavbarComponent implements OnInit {
|
||||
|
||||
addToWallet = () => {
|
||||
this.appleWalletService.addCardToWallet();
|
||||
}
|
||||
};
|
||||
|
||||
deleteToken = (): void => {
|
||||
this.cookiesService.logout();
|
||||
}
|
||||
};
|
||||
|
||||
logout = () => {
|
||||
const bottomSheet = this._bottomSheet.open(ExitComponent);
|
||||
@ -75,8 +75,15 @@ export class NavbarComponent implements OnInit {
|
||||
}
|
||||
},
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
installApp = () => { }
|
||||
}
|
||||
installApp = () => {};
|
||||
|
||||
notified = () => {
|
||||
return this.messagingService.checkRequestPermission();
|
||||
};
|
||||
|
||||
notify = () => {
|
||||
this.messagingService.requestPermission();
|
||||
};
|
||||
}
|
||||
|
||||
@ -7,7 +7,7 @@
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
border-radius: 100%;
|
||||
background: var(--button-color);
|
||||
background: var(--main-color_2);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
@ -36,6 +36,8 @@
|
||||
margin: 10px;
|
||||
padding: 5px;
|
||||
width: fit-content;
|
||||
background-color: var(--text-color);
|
||||
border-radius: 6px;
|
||||
// background-image: linear-gradient(
|
||||
// #008251 33%,
|
||||
// transparent 0px,
|
||||
|
||||
@ -153,8 +153,8 @@
|
||||
will-change: transform;
|
||||
}
|
||||
.box:focus-within {
|
||||
box-shadow: 0 0 6px 1px rgba(rgb(127, 32, 97), 0.2),
|
||||
0 0 0 2px rgba(rgb(127, 32, 97), 0.6);
|
||||
box-shadow: 0 0 6px 1px rgba(rgb(0, 92, 80), 0.2),
|
||||
0 0 0 2px rgba(rgb(0, 92, 80), 0.6);
|
||||
}
|
||||
.box::before,
|
||||
.box::after {
|
||||
|
||||
@ -3,64 +3,31 @@
|
||||
@include mat.core();
|
||||
|
||||
$primary: (
|
||||
50 : #f0e4ec,
|
||||
100 : #d9bcd0,
|
||||
200 : #bf90b0,
|
||||
300 : #a56390,
|
||||
400 : #924179,
|
||||
500 : #7f2061,
|
||||
600 : #771c59,
|
||||
700 : #6c184f,
|
||||
800 : #621345,
|
||||
900 : #4f0b33,
|
||||
A100 : #ff85c7,
|
||||
A200 : #ff52b0,
|
||||
A400 : #ff1f99,
|
||||
A700 : #ff068d,
|
||||
contrast: (
|
||||
50 : #000000,
|
||||
100 : #000000,
|
||||
200 : #000000,
|
||||
300 : #ffffff,
|
||||
400 : #ffffff,
|
||||
500 : #ffffff,
|
||||
600 : #ffffff,
|
||||
700 : #ffffff,
|
||||
800 : #ffffff,
|
||||
900 : #ffffff,
|
||||
A100 : #000000,
|
||||
A200 : #000000,
|
||||
A400 : #ffffff,
|
||||
A700 : #ffffff,
|
||||
)
|
||||
);
|
||||
|
||||
$accent: (
|
||||
50 : #ffffff,
|
||||
100 : #ffffff,
|
||||
200 : #ffffff,
|
||||
300 : #ffffff,
|
||||
400 : #ffffff,
|
||||
500 : #ffffff,
|
||||
600 : #ffffff,
|
||||
700 : #ffffff,
|
||||
800 : #ffffff,
|
||||
900 : #ffffff,
|
||||
A100 : #ffffff,
|
||||
A200 : #ffffff,
|
||||
A400 : #ffffff,
|
||||
A700 : #ffffff,
|
||||
50 : #e5f5e9,
|
||||
100 : #bfe7c8,
|
||||
200 : #94d7a4,
|
||||
300 : #69c780,
|
||||
400 : #48bb64,
|
||||
500 : #28af49,
|
||||
600 : #24a842,
|
||||
700 : #1e9f39,
|
||||
800 : #189631,
|
||||
900 : #0f8621,
|
||||
A100 : #b8ffc0,
|
||||
A200 : #85ff94,
|
||||
A400 : #52ff67,
|
||||
A700 : #38ff51,
|
||||
contrast: (
|
||||
50 : #000000,
|
||||
100 : #000000,
|
||||
200 : #000000,
|
||||
300 : #000000,
|
||||
400 : #000000,
|
||||
500 : #000000,
|
||||
600 : #000000,
|
||||
700 : #000000,
|
||||
800 : #000000,
|
||||
900 : #000000,
|
||||
500 : #ffffff,
|
||||
600 : #ffffff,
|
||||
700 : #ffffff,
|
||||
800 : #ffffff,
|
||||
900 : #ffffff,
|
||||
A100 : #000000,
|
||||
A200 : #000000,
|
||||
A400 : #000000,
|
||||
@ -68,6 +35,40 @@ $accent: (
|
||||
)
|
||||
);
|
||||
|
||||
$accent: (
|
||||
50 : #e5e4e4,
|
||||
100 : #bdbcbc,
|
||||
200 : #918f90,
|
||||
300 : #656263,
|
||||
400 : #444141,
|
||||
500 : #231f20,
|
||||
600 : #1f1b1c,
|
||||
700 : #1a1718,
|
||||
800 : #151213,
|
||||
900 : #0c0a0b,
|
||||
A100 : #ff52ff,
|
||||
A200 : #ff1fff,
|
||||
A400 : #eb00eb,
|
||||
A700 : #d200d2,
|
||||
contrast: (
|
||||
50 : #000000,
|
||||
100 : #000000,
|
||||
200 : #000000,
|
||||
300 : #ffffff,
|
||||
400 : #ffffff,
|
||||
500 : #ffffff,
|
||||
600 : #ffffff,
|
||||
700 : #ffffff,
|
||||
800 : #ffffff,
|
||||
900 : #ffffff,
|
||||
A100 : #000000,
|
||||
A200 : #ffffff,
|
||||
A400 : #ffffff,
|
||||
A700 : #ffffff,
|
||||
)
|
||||
);
|
||||
|
||||
|
||||
$primary-palette: mat.define-palette($primary);
|
||||
$accent-palette: mat.define-palette($accent);
|
||||
|
||||
@ -111,23 +112,51 @@ body {
|
||||
}
|
||||
|
||||
:root {
|
||||
--main-color: #7F2061;
|
||||
--main-color: #28AF49;
|
||||
--main-color_2: #005C50;
|
||||
--main-border-radius: 35px;
|
||||
--background-color: #ffffff;
|
||||
--background-color: #231F20;
|
||||
--background-color_1: #000000;
|
||||
|
||||
--text-color: #222222;
|
||||
--text-color_1: #666666;
|
||||
--text-color: #ffffff;
|
||||
--text-color_1: #8d8d8d;
|
||||
|
||||
--button-color: #7F2061;
|
||||
--button-color_disabled: #4a0d37;
|
||||
--button-color: #28AF49 ;
|
||||
--button-color_disabled: rgb(40, 175, 73, 0.9);
|
||||
|
||||
--button-text-color: #ffffff;
|
||||
--button-text-color_disabled: #cccccc;
|
||||
|
||||
--main-color_hover: rgba(127, 32, 97, 0.3);
|
||||
--main-color_hover: rgba(40, 175, 73, 0.6);
|
||||
}
|
||||
|
||||
.mdc-text-field--outlined:not(.mdc-text-field--disabled, .mdc-text-field--invalid, .mat-focused) .mdc-notched-outline__leading,
|
||||
.mdc-text-field--outlined:not(.mdc-text-field--disabled, .mdc-text-field--invalid, .mat-focused) .mdc-notched-outline__notch,
|
||||
.mdc-text-field--outlined:not(.mdc-text-field--disabled, .mdc-text-field--invalid, .mat-focused) .mdc-notched-outline__trailing {
|
||||
border-color: var(--main-color_hover) !important;
|
||||
}
|
||||
|
||||
.mat-mdc-outlined-button:not(:disabled) {
|
||||
border-color: var(--text-color) !important;
|
||||
|
||||
.mdc-button__label {
|
||||
color: var(--text-color);
|
||||
}
|
||||
}
|
||||
|
||||
.mdc-text-field:not(.mdc-text-field--disabled, .mdc-text-field--invalid) .mdc-floating-label {
|
||||
color: var(--main-color_hover);
|
||||
}
|
||||
|
||||
.mdc-text-field span {
|
||||
color: inherit !important;
|
||||
}
|
||||
|
||||
.mdc-text-field:not(.mdc-text-field--disabled) .mdc-text-field__input {
|
||||
color: var(--text-color);
|
||||
}
|
||||
|
||||
.mdc-button__label span {
|
||||
color: var(--button-text-color) !important;
|
||||
}
|
||||
|
||||
@ -143,6 +172,10 @@ body {
|
||||
font-family: Montserrat;
|
||||
}
|
||||
|
||||
p, span, h1, h2, h3, h4, h5, h6 {
|
||||
color: var(--text-color);
|
||||
}
|
||||
|
||||
.mat-h2,
|
||||
.mat-headline-6,
|
||||
.mat-typography .mat-h2,
|
||||
@ -151,6 +184,12 @@ body {
|
||||
font-family: Montserrat, sans-serif;
|
||||
}
|
||||
|
||||
|
||||
.mat-bottom-sheet-container {
|
||||
background: var(--background-color_1);
|
||||
color: var(--text-color);
|
||||
}
|
||||
|
||||
hr {
|
||||
width: 100%;
|
||||
border-top: 1px solid #BDBDBD;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user