Merge pull request #2 from bombastictranz/bombastictranz-2024-02-27

Movie App updates
pull/2989/head
Romeo Rosete 3 months ago committed by GitHub
commit 4e20df3d24
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

@ -1 +1 @@
{"applicationId":"7lbb7zedobce","applicationName":"Health Vault","platform":"Angular"}
{"applicationId":"gblgxiirrjzf","applicationName":"Movie App","platform":"Angular"}

@ -1,4 +1,4 @@
# Health Vault
# Movie App
This project was generated with [App Builder Code Gen](https://www.infragistics.com/products/appbuilder).

@ -1,21 +0,0 @@
# Security Policy
## Supported Versions
Use this section to tell people about which versions of your project are
currently being supported with security updates.
| Version | Supported |
| ------- | ------------------ |
| 5.1.x | :white_check_mark: |
| 5.0.x | :x: |
| 4.0.x | :white_check_mark: |
| < 4.0 | :x: |
## Reporting a Vulnerability
Use this section to tell people how to report a vulnerability.
Tell them where to go, how often they can expect to get an update on a
reported vulnerability, what to expect if the vulnerability is accepted or
declined, etc.

@ -3,7 +3,7 @@
"version": 1,
"newProjectRoot": "projects",
"projects": {
"health-vault": {
"movie-app": {
"projectType": "application",
"schematics": {
"@schematics/angular:component": {
@ -22,7 +22,7 @@
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist/health-vault",
"outputPath": "dist/movie-app",
"index": "src/index.html",
"main": "src/main.ts",
"polyfills": "src/polyfills.ts",
@ -79,10 +79,10 @@
"builder": "@angular-devkit/build-angular:dev-server",
"configurations": {
"production": {
"buildTarget": "health-vault:build:production"
"buildTarget": "movie-app:build:production"
},
"development": {
"buildTarget": "health-vault:build:development"
"buildTarget": "movie-app:build:development"
}
},
"defaultConfiguration": "development"
@ -90,7 +90,7 @@
"extract-i18n": {
"builder": "@angular-devkit/build-angular:extract-i18n",
"options": {
"buildTarget": "health-vault:build"
"buildTarget": "movie-app:build"
}
},
"test": {

@ -3,7 +3,7 @@
"project": {
"defaultPort": 4200,
"framework": "angular",
"projectType": "igx-ts",
"projectType": "igx-ts-legacy",
"projectTemplate": "base",
"theme": "Default",
"themePath": "node_modules/igniteui-angular/styles/igniteui-angular.css",

@ -25,7 +25,7 @@ module.exports = function (config) {
suppressAll: true // removes the duplicated traces
},
coverageReporter: {
dir: require('path').join(__dirname, './coverage/health-vault'),
dir: require('path').join(__dirname, './coverage/movie-app'),
subdir: '.',
reporters: [
{ type: 'html' },

@ -1,5 +1,5 @@
{
"name": "health-vault",
"name": "movie-app",
"version": "0.0.0",
"scripts": {
"ng": "ng",
@ -11,32 +11,30 @@
},
"private": true,
"dependencies": {
"@angular/animations": "~17.0.0",
"@angular/common": "~17.0.0",
"@angular/compiler": "~17.0.0",
"@angular/core": "~17.0.0",
"@angular/forms": "~17.0.0",
"@angular/platform-browser": "~17.0.0",
"@angular/platform-browser-dynamic": "~17.0.0",
"@angular/router": "~17.0.0",
"hammerjs": "~2.0.8",
"igniteui-angular": "~17.0.0",
"igniteui-angular-charts": "~17.0.0",
"igniteui-angular-core": "~17.0.0",
"@angular/animations": "~17.2.0",
"@angular/common": "~17.2.0",
"@angular/compiler": "~17.2.0",
"@angular/core": "~17.2.0",
"@angular/forms": "~17.2.0",
"@angular/platform-browser": "~17.2.0",
"@angular/platform-browser-dynamic": "~17.2.0",
"@angular/router": "~17.2.0",
"hammerjs": "^2.0.8",
"igniteui-angular": "~17.1.0",
"minireset.css": "~0.0.7",
"rxjs": "~7.8.0",
"tslib": "~2.3.0",
"zone.js": "~0.14.0"
},
"devDependencies": {
"@angular-devkit/build-angular": "~17.0.0",
"@angular-eslint/builder": "~17.0.0",
"@angular-eslint/eslint-plugin": "~17.0.0",
"@angular-eslint/eslint-plugin-template": "~17.0.0",
"@angular-eslint/schematics": "~17.0.0",
"@angular-eslint/template-parser": "~17.0.0",
"@angular/cli": "~17.0.0",
"@angular/compiler-cli": "~17.0.0",
"@angular-devkit/build-angular": "~17.2.0",
"@angular-eslint/builder": "~17.2.0",
"@angular-eslint/eslint-plugin": "~17.2.0",
"@angular-eslint/eslint-plugin-template": "~17.2.0",
"@angular-eslint/schematics": "~17.2.0",
"@angular-eslint/template-parser": "~17.2.0",
"@angular/cli": "~17.2.0",
"@angular/compiler-cli": "~17.2.0",
"@types/jasmine": "~5.1.1",
"@typescript-eslint/eslint-plugin": "6.9.1",
"@typescript-eslint/parser": "6.9.1",
@ -48,6 +46,6 @@
"karma-coverage": "~2.2.0",
"karma-jasmine": "~5.1.0",
"karma-jasmine-html-reporter": "~2.1.0",
"typescript": "~5.2.2"
"typescript": "~5.3.2"
}
}

@ -4,22 +4,16 @@ import { RouterModule, Routes } from '@angular/router';
import { PageNotFoundComponent } from './error-routing/not-found/not-found.component';
import { UncaughtErrorComponent } from './error-routing/error/uncaught-error.component';
import { ErrorRoutingModule } from './error-routing/error-routing.module';
import { HomeComponent } from './home/home.component';
import { MedicationsComponent } from './medications/medications.component';
import { HealthIndicatorsComponent } from './health-indicators/health-indicators.component';
import { AppointmentsComponent } from './appointments/appointments.component';
import { ProfileComponent } from './profile/profile.component';
import { EmergencyComponent } from './emergency/emergency.component';
import { MoviesComponent } from './movies/movies.component';
import { MovieComplexComponent } from './movie-complex/movie-complex.component';
import { MyPurchasesComponent } from './my-purchases/my-purchases.component';
export const routes: Routes = [
{ path: '', redirectTo: 'home', pathMatch: 'full' },
{ path: '', redirectTo: 'movies', pathMatch: 'full' },
{ path: 'error', component: UncaughtErrorComponent },
{ path: 'home', component: HomeComponent, data: { text: 'Home' } },
{ path: 'medications', component: MedicationsComponent, data: { text: 'Medications' } },
{ path: 'health-indicators', component: HealthIndicatorsComponent, data: { text: 'Health Indicators' } },
{ path: 'appointments', component: AppointmentsComponent, data: { text: 'Appointments' } },
{ path: 'profile', component: ProfileComponent, data: { text: 'Profile' } },
{ path: 'emergency', component: EmergencyComponent, data: { text: 'Emergency' } },
{ path: 'movies', component: MoviesComponent, data: { text: 'Movies' } },
{ path: 'movie-complex', component: MovieComplexComponent, data: { text: 'Movie Complex' } },
{ path: 'my-purchases', component: MyPurchasesComponent, data: { text: 'My Purchases' } },
{ path: '**', component: PageNotFoundComponent } // must always be last
];

@ -1,70 +1,78 @@
<div class="row-layout main-navigation">
<igx-navbar class="navbar">
<igx-navbar-title class="navbar-content">
<div routerLink="/home" class="row-layout group">
<img src="/assets/logo2.svg" class="image" />
<p class="ig-typography__subtitle-2 text">
HEALTHCARE ASSISTANT
</p>
</div>
</igx-navbar-title>
<igx-nav-drawer [pin]="true" [pinThreshold]="1024" #navDrawer class="nav-drawer">
<ng-template igxDrawer>
<div igxDrawerItem igxRipple routerLink="/movies">
<igx-icon class="icon">
movie
</igx-icon>
<span>Movies</span>
</div>
<div igxDrawerItem igxRipple routerLink="/movie-complex">
<igx-icon class="icon">
location_on
</igx-icon>
<span>Theatres</span>
</div>
<div igxDrawerItem igxRipple routerLink="/my-purchases">
<igx-icon class="icon">
shopping_cart
</igx-icon>
<span>My Purchases</span>
</div>
<div igxDrawerItem igxRipple>
<igx-icon class="icon">
local_offer
</igx-icon>
<span>Promos</span>
</div>
<div igxDrawerItem igxRipple>
<igx-icon class="icon">
help
</igx-icon>
<span>Help &amp; Support</span>
</div>
<div igxDrawerItem igxRipple>
<igx-icon class="icon">
chat_bubble
</igx-icon>
<span>Contact Us</span>
</div>
</ng-template>
</igx-nav-drawer>
<div class="column-layout group">
<div class="row-layout header">
<div class="row-layout group_1">
<div class="row-layout group">
<igx-avatar src="/assets/Avatar13.png" shape="circle" class="avatar"></igx-avatar>
<p class="ig-typography__subtitle-2 text">
Sandy Anderson
</p>
</div>
<button igxButton="icon" igxRipple [igxToggleAction]="navDrawer" class="button">
<igx-icon>
menu
</igx-icon>
</button>
<p class="ig-typography__subtitle-1 text">
MOVIE APP
</p>
</div>
</igx-navbar>
</div>
<div class="row-layout bottom-container">
<div class="view-container">
<router-outlet></router-outlet>
</div>
<igx-nav-drawer position="right" [pinThreshold]="0" width="236px" #navDrawer class="nav-drawer">
<ng-template igxDrawer>
<div igxDrawerItem igxRipple routerLink="/home">
<igx-icon class="icon">
home
</igx-icon>
<span>Home</span>
</div>
<div igxDrawerItem igxRipple routerLink="/medications">
<igx-icon class="icon">
healing
<div class="row-layout group_2">
<button igxButton="icon" igxRipple class="button_1">
<igx-icon>
search
</igx-icon>
<span>Medications</span>
</div>
<div igxDrawerItem igxRipple routerLink="/health-indicators">
<igx-icon class="icon">
</button>
<button igxButton="icon" igxRipple class="button_1">
<igx-icon>
favorite
</igx-icon>
<span>Health Indicators</span>
</div>
<div igxDrawerItem igxRipple routerLink="/appointments">
<igx-icon class="icon">
calendar_today
</igx-icon>
<span>Appointments</span>
</div>
<div igxDrawerItem igxRipple routerLink="/profile">
<igx-icon class="icon">
account_circle
</igx-icon>
<span>Medical Profile</span>
</div>
<div igxDrawerItem igxRipple routerLink="/emergency">
<igx-icon class="icon">
error
</igx-icon>
<span>Emergency</span>
</div>
</ng-template>
</igx-nav-drawer>
</button>
<igx-avatar src="https://d3cg6cexo8t5ug.cloudfront.net/avatars/avatar8.png" shape="circle" [igxToggleAction]="dropdown" class="avatar"></igx-avatar>
<igx-drop-down #dropdown class="dropdown">
<igx-drop-down-item>
My Profile
</igx-drop-down-item>
<igx-drop-down-item>
Logout
</igx-drop-down-item>
</igx-drop-down>
</div>
</div>
<div class="view-container">
<router-outlet></router-outlet>
</div>
</div>

@ -1,97 +1,93 @@
:host {
height: 100%;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: stretch;
align-content: flex-start;
}
.row-layout {
.nav-drawer {
min-width: min-content;
min-height: 0;
flex-shrink: 0;
}
.view-container {
overflow: auto;
position: relative;
min-width: 0;
min-height: 0;
flex-grow: 1;
}
.icon {
--size: 24px;
font-size: 24px;
width: 24px;
height: 24px;
}
.text {
height: max-content;
min-width: min-content;
}
.avatar {
--igx-avatar-background: transparent;
}
.column-layout {
display: flex;
flex-direction: column;
}
.main-navigation {
border-color: #BDD2B9;
border-width: 0px 0px 1px;
border-style: solid;
.group {
justify-content: flex-start;
align-items: stretch;
align-content: flex-start;
position: relative;
min-width: 50px;
min-height: 50px;
flex-grow: 1;
flex-basis: 0;
}
.group {
.row-layout {
display: flex;
}
.header {
background-color: #361439;
justify-content: flex-start;
align-items: center;
align-content: flex-start;
gap: 8px;
overflow: hidden;
position: relative;
min-width: 50px;
padding: 12px 20px;
height: 70px;
min-height: 70px;
max-height: 70px;
flex-shrink: 0;
}
.group_1 {
justify-content: flex-start;
align-items: center;
align-content: flex-start;
gap: 16px;
position: relative;
min-width: 50px;
min-height: 50px;
flex-grow: 1;
}
.bottom-container {
.group_2 {
justify-content: flex-start;
align-items: stretch;
align-items: center;
align-content: flex-start;
gap: 24px;
position: relative;
min-width: 50px;
min-height: 50px;
flex-grow: 1;
flex-basis: 0;
}
.navbar {
--igx-navbar-background: #F0F6EF;
height: max-content;
min-width: min-content;
flex-grow: 1;
flex-basis: 0;
}
.view-container {
overflow: auto;
position: relative;
flex-grow: 1;
}
.nav-drawer {
min-width: min-content;
min-height: 0;
max-width: 236px;
flex-shrink: 0;
}
.navbar-content {
gap: 1rem;
.button {
--igx-button-foreground: hsla(var(--ig-gray-900));
margin: 0 8px 0 0;
}
.image {
object-fit: cover;
height: 32px;
min-width: 0;
min-height: 0;
max-height: 32px;
flex-shrink: 0;
.button_1 {
--igx-button-foreground: hsla(var(--ig-gray-900));
}
.text {
color: hsla(var(--ig-secondary-400));
.dropdown {
left: 0;
top: 0;
position: absolute;
height: max-content;
min-width: min-content;
}
.avatar {
--igx-avatar-background: transparent;
}
.icon {
--size: 24px;
font-size: 24px;
width: 24px;
height: 24px;
color: hsla(var(--ig-primary-700));
}
.button {
--igx-button-foreground: hsla(var(--ig-primary-900));
}

@ -3,43 +3,39 @@ import { BrowserModule, HammerModule } from '@angular/platform-browser';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { HomeComponent } from './home/home.component';
import { IgxIconModule, IgxListModule, IgxButtonModule, IgxRippleModule, IgxAvatarModule, IgxToggleModule, IgxDialogModule, IgxNavbarModule, IgxNavigationDrawerModule } from 'igniteui-angular';
import { MoviesComponent } from './movies/movies.component';
import { IgxButtonModule, IgxRippleModule, IgxTabsModule, IgxCardModule, IgxIconModule, IgxSelectModule, IgxInputGroupModule, IgxDatePickerModule, IgxListModule, IgxAvatarModule, IgxNavigationDrawerModule, IgxToggleModule, IgxDropDownModule } from 'igniteui-angular';
import { FormsModule } from '@angular/forms';
import { MedicationsComponent } from './medications/medications.component';
import { HealthIndicatorsComponent } from './health-indicators/health-indicators.component';
import { IgxCategoryChartModule } from 'igniteui-angular-charts';
import { AppointmentsComponent } from './appointments/appointments.component';
import { ProfileComponent } from './profile/profile.component';
import { EmergencyComponent } from './emergency/emergency.component';
import { MovieComplexComponent } from './movie-complex/movie-complex.component';
import { MyPurchasesComponent } from './my-purchases/my-purchases.component';
import { HttpClientModule } from '@angular/common/http';
@NgModule({
declarations: [
AppComponent,
HomeComponent,
MedicationsComponent,
HealthIndicatorsComponent,
AppointmentsComponent,
ProfileComponent,
EmergencyComponent
MoviesComponent,
MovieComplexComponent,
MyPurchasesComponent
],
imports: [
BrowserModule,
HammerModule,
AppRoutingModule,
BrowserAnimationsModule,
IgxIconModule,
IgxListModule,
IgxButtonModule,
IgxRippleModule,
FormsModule,
IgxCategoryChartModule,
IgxTabsModule,
IgxCardModule,
IgxIconModule,
IgxSelectModule,
IgxInputGroupModule,
IgxDatePickerModule,
IgxListModule,
IgxAvatarModule,
IgxToggleModule,
IgxDialogModule,
IgxNavbarModule,
FormsModule,
IgxNavigationDrawerModule,
IgxToggleModule,
IgxDropDownModule,
HttpClientModule
],
providers: [],

@ -1,290 +0,0 @@
<div class="row-layout group">
<div class="column-layout group_1">
<div class="column-layout group_2">
<div class="row-layout group_3">
<div class="row-layout group_4">
<p class="ig-typography__subtitle-2 text">
UPCOMING APPOINTMENTS
</p>
</div>
</div>
<igx-list class="list">
<igx-list-item [isHeader]="false">
<span igxListLine>
<div class="row-layout group_5">
<div class="row-layout group_6">
<img src="/assets/appt-upcoming.svg" class="image" />
<div class="column-layout group_7">
<p class="ig-typography__subtitle-2 content">
Internal Medicine
</p>
<p class="ig-typography__caption content">
Tuesday, January 24, 2023 - 2:30pm - Dr. M. Matthews
</p>
</div>
</div>
<button igxButton="icon" igxRipple class="button">
<igx-icon>
keyboard_arrow_right
</igx-icon>
</button>
</div>
</span>
</igx-list-item>
<igx-list-item [isHeader]="false">
<span igxListLine>
<div class="row-layout group_5">
<div class="row-layout group_6">
<img src="/assets/appt-upcoming.svg" class="image" />
<div class="column-layout group_7">
<p class="ig-typography__subtitle-2 content">
Dermatology
</p>
<p class="ig-typography__caption content">
Friday, February 24, 2023 - 08:45am - Dr. V. Sawyer
</p>
</div>
</div>
<button igxButton="icon" igxRipple class="button">
<igx-icon>
keyboard_arrow_right
</igx-icon>
</button>
</div>
</span>
</igx-list-item>
<igx-list-item [isHeader]="false">
<span igxListLine>
<div class="row-layout group_5">
<div class="row-layout group_6">
<img src="/assets/appt-upcoming.svg" class="image" />
<div class="column-layout group_7">
<p class="ig-typography__subtitle-2 content">
Gynaecology
</p>
<p class="ig-typography__caption content">
Monday, March 6, 2023 - 6:30pm - Dr. J. Dean
</p>
</div>
</div>
<button igxButton="icon" igxRipple class="button">
<igx-icon>
keyboard_arrow_right
</igx-icon>
</button>
</div>
</span>
</igx-list-item>
</igx-list>
</div>
<div class="column-layout group_2">
<div class="row-layout group_3">
<div class="row-layout group_4">
<p class="ig-typography__subtitle-2 text">
RECENT
</p>
</div>
</div>
<igx-list class="list">
<igx-list-item [isHeader]="false">
<span igxListLine>
<div class="row-layout group_5">
<div class="row-layout group_6">
<img src="/assets/appt-past.svg" class="image" />
<div class="column-layout group_7">
<p class="ig-typography__subtitle-2 content">
Oftalmology
</p>
<p class="ig-typography__caption content">
Thursday, January 12, 2023 - Dr. H. Chandler
</p>
</div>
</div>
<button igxButton="icon" igxRipple class="button">
<igx-icon>
keyboard_arrow_right
</igx-icon>
</button>
</div>
</span>
</igx-list-item>
<igx-list-item [isHeader]="false">
<span igxListLine>
<div class="row-layout group_5">
<div class="row-layout group_6">
<img src="/assets/appt-past.svg" class="image" />
<div class="column-layout group_7">
<p class="ig-typography__subtitle-2 content">
Traumatology
</p>
<p class="ig-typography__caption content">
Friday, December 16, 2022 - Dr. J. Dean
</p>
</div>
</div>
<button igxButton="icon" igxRipple class="button">
<igx-icon>
keyboard_arrow_right
</igx-icon>
</button>
</div>
</span>
</igx-list-item>
<igx-list-item [isHeader]="false">
<span igxListLine>
<div class="row-layout group_5">
<div class="row-layout group_6">
<img src="/assets/appt-past.svg" class="image" />
<div class="column-layout group_7">
<p class="ig-typography__subtitle-2 content">
Otorhinolaryngology
</p>
<p class="ig-typography__caption content">
Tuesday, December 13, 2022 - Dr. H. McNamara
</p>
</div>
</div>
<button igxButton="icon" igxRipple class="button">
<igx-icon>
keyboard_arrow_right
</igx-icon>
</button>
</div>
</span>
</igx-list-item>
<igx-list-item [isHeader]="false">
<span igxListLine>
<div class="row-layout group_5">
<div class="row-layout group_6">
<img src="/assets/appt-past.svg" class="image" />
<div class="column-layout group_7">
<p class="ig-typography__subtitle-2 content">
Internal Medicine
</p>
<p class="ig-typography__caption content">
Monday, November 28, 2022 - Dr. M. Matthews
</p>
</div>
</div>
<button igxButton="icon" igxRipple class="button">
<igx-icon>
keyboard_arrow_right
</igx-icon>
</button>
</div>
</span>
</igx-list-item>
</igx-list>
</div>
</div>
</div>
<div class="row-layout group_8">
<div class="column-layout group_1">
<h6 class="content">
Dermatology Appointment
</h6>
<div class="column-layout group_9">
<div class="row-layout group_10">
<igx-avatar src="/assets/Avatar4.png" shape="circle" class="avatar avatar_1"></igx-avatar>
<div class="column-layout group_11">
<p class="ig-typography__subtitle-2 text_1">
Dr. Michael Matthews
</p>
<p class="ig-typography__body-2 text_1">
Internal Medicine
</p>
</div>
</div>
<igx-list class="list">
<igx-list-item [isHeader]="false">
<span igxListThumbnail>
<igx-avatar shape="circle" class="avatar avatar_2">
<igx-icon>
calendar_today
</igx-icon>
</igx-avatar>
</span>
<span igxListLineTitle>Tuesday, January 24, 2023</span>
</igx-list-item>
<igx-list-item [isHeader]="false">
<span igxListThumbnail>
<igx-avatar shape="circle" class="avatar avatar_3">
<igx-icon>
access_time
</igx-icon>
</igx-avatar>
</span>
<span igxListLineTitle>2:30pm - 2:45pm</span>
</igx-list-item>
<igx-list-item [isHeader]="false">
<span igxListThumbnail>
<igx-avatar shape="circle" class="avatar avatar_4">
<igx-icon>
location_on
</igx-icon>
</igx-avatar>
</span>
<span igxListLineTitle>Plainsboro Clinic </span>
<span igxListLineSubTitle>1 Plainsboro Rd. Plainsboro, NJ 08536</span>
</igx-list-item>
</igx-list>
</div>
<div class="column-layout group_9">
<p class="ig-typography__subtitle-2 text_2">
REQUIREMENTS
</p>
<div class="column-layout group_12">
<p class="ig-typography__body-2 content">
- Recommended shower before appointment.
</p>
<p class="ig-typography__body-2 content">
- Wear loose comfortable clothing.
</p>
<p class="ig-typography__body-2 content">
- Avoid using makeup or nail polish before appointment.
</p>
<p class="ig-typography__body-2 content">
- Don't try any new skin care products in the days prior to your appointment.
</p>
<p class="ig-typography__body-2 content">
- Take your medications as scheduled. Your dermatologist needs to know their effects on your skin.
</p>
</div>
</div>
<div class="row-layout group_13">
<button igxButton="flat" igxRipple [igxToggleAction]="cancelApptDialog" class="button_1">
<igx-icon>
close
</igx-icon>
<span>CANCEL</span>
</button>
<button igxButton="raised" igxRipple class="button_2">
<igx-icon>
calendar_today
</igx-icon>
<span>Add to Calendar</span>
</button>
</div>
</div>
</div>
<igx-dialog [closeOnOutsideSelect]="true" [closeOnEscape]="true" #cancelApptDialog>
<igx-dialog-title>
<h5>
Appointment Cancellation
</h5>
</igx-dialog-title>
<ng-container>
<p class="text_1">
Are you sure you want to cancel your appointment?
</p>
</ng-container>
<igx-dialog-actions>
<button igxButton="flat" igxRipple [igxToggleAction]="cancelApptDialog" class="button_3">
No, go back
</button>
<button igxButton="flat" igxRipple [igxToggleAction]="cancelApptDialog" class="button_4">
Yes, cancel
</button>
</igx-dialog-actions>
</igx-dialog>

@ -1,219 +0,0 @@
:host {
height: 100%;
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
align-items: stretch;
align-content: stretch;
}
.row-layout {
display: flex;
}
.group {
background-color: rgba(256, 256, 256, 0.6);
flex-wrap: wrap;
justify-content: flex-start;
align-items: stretch;
align-content: stretch;
gap: 24px;
position: relative;
padding: 32px;
min-width: 360px;
min-height: 50px;
flex-grow: 1;
flex-basis: 0;
}
.column-layout {
display: flex;
flex-direction: column;
}
.group_1 {
justify-content: flex-start;
align-items: stretch;
align-content: flex-start;
gap: 32px;
position: relative;
min-width: 360px;
min-height: 50px;
flex-grow: 1;
flex-basis: 0;
}
.group_2 {
justify-content: flex-start;
align-items: stretch;
align-content: flex-start;
gap: 16px;
position: relative;
min-width: 360px;
min-height: 50px;
flex-shrink: 0;
}
.group_3 {
justify-content: space-between;
align-items: center;
align-content: flex-start;
gap: 8px;
position: relative;
min-width: 50px;
}
.group_4 {
justify-content: flex-start;
align-items: baseline;
align-content: flex-start;
gap: 4px;
position: relative;
min-width: 50px;
}
.group_5 {
border-color: #CDE0C9;
border-width: 0px 0px 1px;
border-style: solid;
justify-content: space-between;
align-items: center;
align-content: flex-start;
position: relative;
padding: 0 0 16px;
min-width: 50px;
min-height: 50px;
}
.group_6 {
justify-content: flex-start;
align-items: center;
align-content: flex-start;
position: relative;
min-width: 50px;
min-height: 50px;
}
.group_7 {
justify-content: center;
align-items: stretch;
align-content: flex-start;
position: relative;
padding: 0 0 0 24px;
min-width: 50px;
min-height: 50px;
}
.group_8 {
background-color: rgba(256, 256, 256, 0.6);
border-color: #CDE0C9;
border-width: 0px 0px 0px 1px;
border-style: solid;
flex-wrap: wrap;
justify-content: flex-start;
align-items: stretch;
align-content: stretch;
gap: 24px;
position: relative;
padding: 32px;
min-width: 360px;
min-height: 50px;
flex-grow: 1;
flex-basis: 0;
}
.group_9 {
justify-content: flex-start;
align-items: stretch;
align-content: flex-start;
gap: 16px;
position: relative;
min-width: 50px;
min-height: 50px;
}
.group_10 {
justify-content: flex-start;
align-items: center;
align-content: flex-start;
gap: 16px;
position: relative;
min-width: 50px;
}
.group_11 {
justify-content: center;
align-items: stretch;
align-content: flex-start;
position: relative;
min-width: 50px;
min-height: 50px;
}
.group_12 {
justify-content: flex-start;
align-items: stretch;
align-content: flex-start;
gap: 8px;
position: relative;
min-width: 50px;
}
.group_13 {
flex-wrap: wrap;
justify-content: flex-end;
align-items: stretch;
align-content: flex-start;
gap: 16px;
position: relative;
}
.text {
color: hsla(var(--ig-info-500));
margin: 0 8px 0 0;
height: max-content;
min-width: min-content;
}
.image {
object-fit: cover;
height: 28px;
min-width: 0;
min-height: 0;
max-height: 28px;
flex-shrink: 0;
}
.content {
color: hsla(var(--ig-secondary-500));
height: max-content;
min-width: min-content;
}
.avatar {
--igx-avatar-background: transparent;
}
.text_1 {
height: max-content;
min-width: min-content;
}
.text_2 {
color: hsla(var(--ig-info-500));
height: max-content;
min-width: min-content;
}
.avatar_1::part(base) {
--igx-avatar-color: hsla(var(--ig-secondary-400));
}
.avatar_2::part(base) {
--igx-avatar-color: hsla(var(--ig-info-500));
}
.avatar_3::part(base) {
--igx-avatar-color: hsla(var(--ig-info-500));
}
.avatar_4::part(base) {
--igx-avatar-color: hsla(var(--ig-info-500));
}
.list {
height: max-content;
}
.button {
--igx-button-foreground: hsla(var(--ig-primary-800));
}
.button_1 {
height: max-content;
flex-shrink: 0;
}
.button_2 {
--igx-button-background: hsla(var(--ig-primary-500));
height: max-content;
flex-shrink: 0;
}
.button_3 {
height: max-content;
}
.button_4 {
--igx-button-foreground: hsla(var(--ig-surface-500));
--igx-button-background: hsla(var(--ig-error-500));
height: max-content;
}

@ -1,29 +0,0 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { FormsModule } from '@angular/forms';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { IgxListModule, IgxButtonModule, IgxRippleModule, IgxIconModule, IgxAvatarModule, IgxToggleModule, IgxDialogModule } from 'igniteui-angular';
import { AppointmentsComponent } from './appointments.component';
describe('AppointmentsComponent', () => {
let component: AppointmentsComponent;
let fixture: ComponentFixture<AppointmentsComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ AppointmentsComponent ],
imports: [ NoopAnimationsModule, FormsModule, IgxListModule, IgxButtonModule, IgxRippleModule, IgxIconModule, IgxAvatarModule, IgxToggleModule, IgxDialogModule ]
})
.compileComponents();
});
beforeEach(() => {
fixture = TestBed.createComponent(AppointmentsComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

@ -1,8 +0,0 @@
import { Component } from '@angular/core';
@Component({
selector: 'app-appointments',
templateUrl: './appointments.component.html',
styleUrls: ['./appointments.component.scss']
})
export class AppointmentsComponent {}

@ -1,8 +0,0 @@
import { Component } from '@angular/core';
@Component({
selector: 'app-emergency',
templateUrl: './emergency.component.html',
styleUrls: ['./emergency.component.scss']
})
export class EmergencyComponent {}

@ -1,144 +0,0 @@
<div class="row-layout group">
<div class="column-layout group_1">
<p class="ig-typography__subtitle-2 text">
HEALTH INDICATORS
</p>
<div class="row-layout group_2">
<div class="column-layout group_3">
<div class="column-layout group_4">
<div class="row-layout group_5">
<img src="/assets/Scale_Color.svg" class="image" />
<div class="row-layout group_6">
<p class="ig-typography__subtitle-2 text_1">
WEIGHT
</p>
<h6 class="h6">
112
</h6>
<p class="ig-typography__subtitle-2 text_2">
lbs
</p>
</div>
</div>
<div class="column-layout group_7">
<igx-category-chart [dataSource]="patientDashboardWeight" chartType="column" [yAxisInterval]="10" [yAxisMinimumValue]="95" [yAxisMaximumValue]="125" computedPlotAreaMarginMode="series" class="category-chart"></igx-category-chart>
</div>
</div>
<div class="column-layout group_4">
<div class="row-layout group_5">
<img src="/assets/HRate_Color.svg" class="image" />
<div class="row-layout group_6">
<p class="ig-typography__subtitle-2 text_1">
HEART RATE
</p>
<h6 class="h6">
90
</h6>
<p class="ig-typography__subtitle-2 text_2">
bpm
</p>
</div>
</div>
<div class="column-layout group_7">
<igx-category-chart [dataSource]="patientDashboardHeartRate" chartType="line" [yAxisInterval]="10" [yAxisMinimumValue]="60" [yAxisMaximumValue]="90" computedPlotAreaMarginMode="series" class="category-chart_1"></igx-category-chart>
</div>
</div>
</div>
<div class="column-layout group_3">
<div class="column-layout group_8">
<div class="row-layout group_5">
<img src="/assets/BPressure_Color.svg" class="image" />
<div class="row-layout group_6">
<p class="ig-typography__subtitle-2 text_1">
BLOOD PRESSURE
</p>
<h6 class="h6">
140
</h6>
<h6 class="h6_1">
/
</h6>
<h6 class="h6">
70
</h6>
<p class="ig-typography__subtitle-2 text_2">
mmHg
</p>
</div>
</div>
<div class="column-layout group_7">
<igx-category-chart [dataSource]="patientDashboardBPSystolicDiastolic" chartType="line" [yAxisInterval]="20" [yAxisMinimumValue]="70" [yAxisMaximumValue]="160" computedPlotAreaMarginMode="series" class="category-chart_2"></igx-category-chart>
</div>
</div>
<div class="column-layout group_8">
<div class="row-layout group_5">
<img src="/assets/blood-sugar.svg" class="image" />
<div class="row-layout group_6">
<p class="ig-typography__subtitle-2 text_1">
BLOOD SUGAR
</p>
<h6 class="h6">
85
</h6>
<p class="ig-typography__subtitle-2 text_2">
mg/dL
</p>
</div>
</div>
<div class="column-layout group_7">
<igx-category-chart [dataSource]="patientDashboardGlucose" chartType="area" [yAxisInterval]="5" [yAxisMinimumValue]="80" [yAxisMaximumValue]="100" computedPlotAreaMarginMode="series" class="category-chart_1"></igx-category-chart>
</div>
</div>
</div>
<div class="column-layout group_3">
<div class="column-layout group_8">
<div class="row-layout group_5">
<img src="/assets/Cholesterol_Color.svg" class="image" />
<div class="row-layout group_6">
<p class="ig-typography__subtitle-2 text_1">
TOTAL CHOLESTEROL
</p>
<h6 class="h6">
200
</h6>
<p class="ig-typography__subtitle-2 text_2">
mg/dL
</p>
</div>
</div>
<div class="column-layout group_7">
<igx-category-chart [dataSource]="patientDashboardTotalCholesterol" chartType="area" [yAxisInterval]="20" [yAxisMinimumValue]="160" [yAxisMaximumValue]="230" computedPlotAreaMarginMode="series" class="category-chart_3"></igx-category-chart>
</div>
</div>
<div class="column-layout group_8">
<div class="row-layout group_5">
<img src="/assets/Cholesterol_Color.svg" class="image" />
<div class="row-layout group_6">
<p class="ig-typography__subtitle-2 text_1">
CHOLESTEROL HDL / LDL
</p>
<h6 class="h6">
80
</h6>
<p class="ig-typography__subtitle-2 text_2">
mg/dL
</p>
<h6 class="h6_1">
-
</h6>
<h6 class="h6">
85
</h6>
<p class="ig-typography__subtitle-2 text_2">
mg/dL
</p>
</div>
</div>
<div class="column-layout group_7">
<igx-category-chart [dataSource]="patientDashboardCholesterolHDLLDL" chartType="spline" [yAxisInterval]="20" [yAxisMinimumValue]="50" [yAxisMaximumValue]="150" computedPlotAreaMarginMode="series" class="category-chart_4"></igx-category-chart>
</div>
</div>
</div>
</div>
</div>
</div>

@ -1,191 +0,0 @@
:host {
height: 100%;
display: flex;
justify-content: flex-start;
align-items: stretch;
align-content: flex-start;
}
.row-layout {
display: flex;
}
.group {
background-color: rgba(256, 256, 256, 0.6);
flex-wrap: wrap;
justify-content: flex-start;
align-items: stretch;
align-content: stretch;
gap: 24px;
overflow: auto;
position: relative;
padding: 32px;
min-width: 360px;
min-height: 50px;
flex-grow: 1;
flex-basis: 0;
}
.column-layout {
display: flex;
flex-direction: column;
}
.group_1 {
justify-content: flex-start;
align-items: stretch;
align-content: flex-start;
gap: 16px;
position: relative;
min-width: 360px;
min-height: 50px;
flex-grow: 1;
flex-basis: 0;
}
.group_2 {
flex-wrap: wrap;
justify-content: flex-start;
align-items: stretch;
align-content: stretch;
gap: 32px;
position: relative;
min-width: 50px;
min-height: 50px;
flex-grow: 1;
flex-shrink: 0;
}
.group_3 {
justify-content: flex-start;
align-items: stretch;
align-content: flex-start;
gap: 32px;
position: relative;
min-width: 360px;
min-height: 50px;
flex-grow: 1;
flex-basis: 0;
}
.group_4 {
justify-content: flex-start;
align-items: stretch;
align-content: flex-start;
gap: 8px;
position: relative;
min-width: 50px;
min-height: 50px;
flex-grow: 1;
flex-shrink: 0;
}
.group_5 {
justify-content: flex-start;
align-items: center;
align-content: flex-start;
gap: 8px;
position: relative;
min-width: 50px;
}
.group_6 {
justify-content: flex-start;
align-items: baseline;
align-content: flex-start;
gap: 4px;
position: relative;
min-width: 50px;
}
.group_7 {
justify-content: flex-start;
align-items: stretch;
align-content: flex-start;
position: relative;
min-width: 50px;
min-height: 50px;
flex-grow: 1;
flex-shrink: 0;
}
.group_8 {
justify-content: flex-start;
align-items: stretch;
align-content: flex-start;
gap: 8px;
position: relative;
min-width: 50px;
min-height: 150px;
flex-grow: 1;
flex-shrink: 0;
}
.text {
color: hsla(var(--ig-info-500));
margin: 0 8px 0 0;
height: max-content;
min-width: min-content;
}
.image {
object-fit: cover;
height: 24px;
min-width: 0;
min-height: 0;
max-height: 24px;
flex-shrink: 0;
}
.text_1 {
color: hsla(var(--ig-secondary-300));
margin: 0 8px 0 0;
height: max-content;
min-width: min-content;
}
.h6 {
color: hsla(var(--ig-secondary-500));
height: max-content;
min-width: min-content;
}
.text_2 {
color: hsla(var(--ig-secondary-200));
height: max-content;
min-width: min-content;
}
.h6_1 {
color: hsla(var(--ig-secondary-100));
height: max-content;
min-width: min-content;
}
.category-chart {
--brushes: #70C3A1;
--outlines: #70C3A1;
--marker-brushes: #70C3A1;
--marker-outlines: #70C3A1;
min-height: 200px;
flex-grow: 1;
flex-basis: 0;
}
.category-chart_1 {
--brushes: #E7B7C8;
--outlines: #E7B7C8;
--marker-brushes: #E7B7C8;
--marker-outlines: #E7B7C8;
min-height: 200px;
flex-grow: 1;
flex-shrink: 0;
}
.category-chart_2 {
--brushes: #CDB3D4 #AE91B6;
--outlines: #CDB3D4 #AE91B6;
--marker-brushes: #CDB3D4 #AE91B6;
--marker-outlines: #CDB3D4 #AE91B6;
min-height: 200px;
flex-grow: 1;
flex-basis: 0;
}
.category-chart_3 {
--brushes: #FFBE88;
--outlines: #FFBE88;
--marker-brushes: #FFBE88;
--marker-outlines: #FFBE88;
min-height: 200px;
flex-grow: 1;
flex-shrink: 0;
}
.category-chart_4 {
--brushes: #74C2A3 #DFA8BB;
--outlines: #74C2A3 #DFA8BB;
--marker-brushes: #74C2A3 #DFA8BB;
--marker-outlines: #74C2A3 #DFA8BB;
min-height: 200px;
flex-grow: 1;
flex-shrink: 0;
}

@ -1,60 +0,0 @@
import { Component, OnDestroy, OnInit } from '@angular/core';
import { Subject, takeUntil } from 'rxjs';
import { BPSystolicDiastolicType } from '../models/patient-dashboard/bpsystolic-diastolic-type';
import { TotalCholesterolType } from '../models/patient-dashboard/total-cholesterol-type';
import { CholesterolHDLLDLType } from '../models/patient-dashboard/cholesterol-hdlldltype';
import { GlucoseType } from '../models/patient-dashboard/glucose-type';
import { HeartRateType } from '../models/patient-dashboard/heart-rate-type';
import { WeightType } from '../models/patient-dashboard/weight-type';
import { PatientDashboardService } from '../services/patient-dashboard.service';
@Component({
selector: 'app-health-indicators',
templateUrl: './health-indicators.component.html',
styleUrls: ['./health-indicators.component.scss']
})
export class HealthIndicatorsComponent implements OnInit, OnDestroy {
private destroy$: Subject<void> = new Subject<void>();
public patientDashboardWeight: WeightType[] = [];
public patientDashboardHeartRate: HeartRateType[] = [];
public patientDashboardBPSystolicDiastolic: BPSystolicDiastolicType[] = [];
public patientDashboardGlucose: GlucoseType[] = [];
public patientDashboardTotalCholesterol: TotalCholesterolType[] = [];
public patientDashboardCholesterolHDLLDL: CholesterolHDLLDLType[] = [];
constructor(
private patientDashboardService: PatientDashboardService,
) {}
ngOnInit() {
this.patientDashboardService.getWeightList().pipe(takeUntil(this.destroy$)).subscribe({
next: (data) => this.patientDashboardWeight = data,
error: (_err: any) => this.patientDashboardWeight = []
});
this.patientDashboardService.getHeartRateList().pipe(takeUntil(this.destroy$)).subscribe({
next: (data) => this.patientDashboardHeartRate = data,
error: (_err: any) => this.patientDashboardHeartRate = []
});
this.patientDashboardService.getBPSystolicDiastolicList().pipe(takeUntil(this.destroy$)).subscribe({
next: (data) => this.patientDashboardBPSystolicDiastolic = data,
error: (_err: any) => this.patientDashboardBPSystolicDiastolic = []
});
this.patientDashboardService.getGlucoseList().pipe(takeUntil(this.destroy$)).subscribe({
next: (data) => this.patientDashboardGlucose = data,
error: (_err: any) => this.patientDashboardGlucose = []
});
this.patientDashboardService.getTotalCholesterolList().pipe(takeUntil(this.destroy$)).subscribe({
next: (data) => this.patientDashboardTotalCholesterol = data,
error: (_err: any) => this.patientDashboardTotalCholesterol = []
});
this.patientDashboardService.getCholesterolHDLLDLList().pipe(takeUntil(this.destroy$)).subscribe({
next: (data) => this.patientDashboardCholesterolHDLLDL = data,
error: (_err: any) => this.patientDashboardCholesterolHDLLDL = []
});
}
ngOnDestroy() {
this.destroy$.next();
this.destroy$.complete();
}
}

@ -1,280 +0,0 @@
<div class="column-layout group">
<div class="row-layout group_1">
<div routerLink="/health-indicators" class="column-layout group_2">
<img src="/assets/HRate-White.svg" class="image" />
<p class="ig-typography__subtitle-2 content">
HEART RATE
</p>
<div class="row-layout group_3">
<div class="row-layout group_4">
<h4 class="content">
82
</h4>
<h6 class="content">
bpm
</h6>
</div>
<p class="ig-typography__subtitle-2 content">
+1.12%
</p>
</div>
</div>
<div routerLink="/health-indicators" class="column-layout group_5">
<img src="/assets/BPressure-White.svg" class="image_1" />
<p class="ig-typography__subtitle-2 content">
BLOOD PRESSURE
</p>
<div class="row-layout group_3">
<div class="row-layout group_4">
<h4 class="content">
140
</h4>
<h4 class="content">
/
</h4>
<h4 class="content">
70
</h4>
<h6 class="content">
mmHg
</h6>
</div>
<p class="ig-typography__subtitle-2 content">
+1.12%
</p>
</div>
</div>
<div routerLink="/health-indicators" class="column-layout group_6">
<img src="/assets/Cholesterol-White.svg" class="image_1" />
<p class="ig-typography__subtitle-2 content">
CHOLESTEROL
</p>
<div class="row-layout group_3">
<div class="row-layout group_4">
<h4 class="content">
200
</h4>
<h6 class="content">
mg/dL
</h6>
</div>
<p class="ig-typography__subtitle-2 content">
+1.12%
</p>
</div>
</div>
<div routerLink="/health-indicators" class="column-layout group_7">
<img src="/assets/Scale-White.svg" class="image_2" />
<p class="ig-typography__subtitle-2 content">
WEIGHT
</p>
<div class="row-layout group_3">
<div class="row-layout group_4">
<h4 class="content">
112
</h4>
<h6 class="content">
lbs
</h6>
</div>
<p class="ig-typography__subtitle-2 content">
+1.12%
</p>
</div>
</div>
</div>
<div class="row-layout group_8">
<div class="column-layout group_9">
<div class="row-layout group_10">
<div class="row-layout group_4">
<p class="ig-typography__subtitle-2 text">
CURRENT MEDICATIONS
</p>
</div>
<div routerLink="/medications" class="row-layout group_11">
<a target="_blank" class="ig-typography__body-2 hyperlink">
View all
</a>
<igx-icon class="icon">
arrow_forward
</igx-icon>
</div>
</div>
<igx-list class="list">
<igx-list-item [isHeader]="false" routerLink="/medications">
<span igxListLine>
<div class="row-layout group_12">
<div class="row-layout group_13">
<img src="/assets/Med2.svg" class="image_3" />
<div class="column-layout group_14">
<p class="ig-typography__subtitle-2 text_1">
Calcium 500mg
</p>
<p class="ig-typography__caption text_1">
1 tablet(s), 1 time(s), daily, with meal
</p>
</div>
</div>
<button igxButton="icon" igxRipple routerLink="/medications" class="button">
<igx-icon>
keyboard_arrow_right
</igx-icon>
</button>
</div>
</span>
</igx-list-item>
<igx-list-item [isHeader]="false" routerLink="/medications">
<span igxListLine>
<div class="row-layout group_12">
<div class="row-layout group_13">
<img src="/assets/Med2.svg" class="image_3" />
<div class="column-layout group_14">
<p class="ig-typography__subtitle-2 text_1">
Hydrolyzed Collagen
</p>
<p class="ig-typography__caption text_1">
2 scoop(s), 1 time(s), daily
</p>
</div>
</div>
<button igxButton="icon" igxRipple routerLink="/medications" class="button">
<igx-icon>
keyboard_arrow_right
</igx-icon>
</button>
</div>
</span>
</igx-list-item>
<igx-list-item [isHeader]="false" routerLink="/medications">
<span igxListLine>
<div class="row-layout group_12">
<div class="row-layout group_13">
<img src="/assets/Med2.svg" class="image_3" />
<div class="column-layout group_14">
<p class="ig-typography__subtitle-2 text_1">
Vitamin B19 1000mg
</p>
<p class="ig-typography__caption text_1">
1 pill, 2 time(s), weekly, in the morning
</p>
</div>
</div>
<button igxButton="icon" igxRipple routerLink="/medications" class="button">
<igx-icon>
keyboard_arrow_right
</igx-icon>
</button>
</div>
</span>
</igx-list-item>
<igx-list-item [isHeader]="false" routerLink="/medications">
<span igxListLine>
<div class="row-layout group_12">
<div class="row-layout group_13">
<img src="/assets/Med2.svg" class="image_3" />
<div class="column-layout group_14">
<p class="ig-typography__subtitle-2 text_1">
Vitamin D 100.000 IU
</p>
<p class="ig-typography__caption text_1">
1 capsule, 1 time(s), trimonthly, with main meal
</p>
</div>
</div>
<button igxButton="icon" igxRipple routerLink="/medications" class="button">
<igx-icon>
keyboard_arrow_right
</igx-icon>
</button>
</div>
</span>
</igx-list-item>
</igx-list>
</div>
<div class="column-layout group_9">
<div class="row-layout group_10">
<div class="row-layout group_4">
<p class="ig-typography__subtitle-2 text">
UPCOMING APPOINTMENTS
</p>
</div>
<div routerLink="/appointments" class="row-layout group_11">
<a target="_blank" class="ig-typography__body-2 hyperlink">
View all
</a>
<igx-icon class="icon">
arrow_forward
</igx-icon>
</div>
</div>
<igx-list class="list">
<igx-list-item [isHeader]="false" routerLink="/appointments">
<span igxListLine>
<div class="row-layout group_12">
<div class="row-layout group_13">
<img src="/assets/appt-upcoming.svg" class="image_4" />
<div class="column-layout group_14">
<p class="ig-typography__subtitle-2 text_1">
Internal Medicine
</p>
<p class="ig-typography__caption text_1">
Tuesday, January 24, 2023 - 2:30pm - Dr. M. Matthews
</p>
</div>
</div>
<button igxButton="icon" igxRipple routerLink="/appointments" class="button">
<igx-icon>
keyboard_arrow_right
</igx-icon>
</button>
</div>
</span>
</igx-list-item>
<igx-list-item [isHeader]="false" routerLink="/appointments">
<span igxListLine>
<div class="row-layout group_12">
<div class="row-layout group_13">
<img src="/assets/appt-upcoming.svg" class="image_4" />
<div class="column-layout group_14">
<p class="ig-typography__subtitle-2 text_1">
Dermatology
</p>
<p class="ig-typography__caption text_1">
Friday, February 24, 2023 - 08:45am - Dr. V. Sawyer
</p>
</div>
</div>
<button igxButton="icon" igxRipple routerLink="/appointments" class="button">
<igx-icon>
keyboard_arrow_right
</igx-icon>
</button>
</div>
</span>
</igx-list-item>
<igx-list-item [isHeader]="false" routerLink="/appointments">
<span igxListLine>
<div class="row-layout group_12">
<div class="row-layout group_13">
<img src="/assets/appt-upcoming.svg" class="image_4" />
<div class="column-layout group_14">
<p class="ig-typography__subtitle-2 text_1">
Gynaecology
</p>
<p class="ig-typography__caption text_1">
Monday, March 6, 2023 - 6:30pm - Dr. J. Dean
</p>
</div>
</div>
<button igxButton="icon" igxRipple routerLink="/appointments" class="button">
<igx-icon>
keyboard_arrow_right
</igx-icon>
</button>
</div>
</span>
</igx-list-item>
</igx-list>
</div>
</div>
</div>

@ -1,264 +0,0 @@
:host {
height: 100%;
display: flex;
justify-content: flex-start;
align-items: stretch;
align-content: flex-start;
}
.column-layout {
display: flex;
flex-direction: column;
}
.group {
background-color: rgba(256, 256, 256, 0.6);
justify-content: flex-start;
align-items: stretch;
align-content: flex-start;
gap: 40px;
overflow: auto;
position: relative;
padding: 32px;
min-width: 50px;
min-height: 50px;
flex-grow: 1;
flex-basis: 0;
}
.row-layout {
display: flex;
}
.group_1 {
flex-wrap: wrap;
justify-content: flex-start;
align-items: stretch;
align-content: flex-start;
gap: 20px;
position: relative;
min-width: 50px;
min-height: 50px;
flex-shrink: 0;
}
.group_2 {
background-color: #DFA8BB;
background-image: url("/assets/kpi-hrate.svg");
background-size: cover;
background-repeat: no-repeat;
border-radius: 13px;
justify-content: center;
align-items: stretch;
align-content: flex-start;
gap: 4px;
position: relative;
padding: 20px;
min-width: 280px;
flex-grow: 1;
flex-basis: 0;
}
.group_3 {
justify-content: space-between;
align-items: baseline;
align-content: flex-start;
position: relative;
}
.group_4 {
justify-content: flex-start;
align-items: baseline;
align-content: flex-start;
gap: 4px;
position: relative;
min-width: 50px;
}
.group_5 {
background-color: #C8AFCF;
background-image: url("/assets/kpi-bp.svg");
background-size: cover;
background-repeat: no-repeat;
border-radius: 13px;
justify-content: center;
align-items: stretch;
align-content: flex-start;
gap: 4px;
position: relative;
padding: 20px;
min-width: 280px;
flex-grow: 1;
flex-basis: 0;
}
.group_6 {
background-color: #FFBE88;
background-image: url("/assets/kpi-cholesterol.svg");
background-size: cover;
background-repeat: no-repeat;
border-radius: 13px;
justify-content: center;
align-items: stretch;
align-content: flex-start;
gap: 4px;
position: relative;
padding: 20px;
min-width: 280px;
flex-grow: 1;
flex-basis: 0;
}
.group_7 {
background-color: #70C3A1;
background-image: url("/assets/kpi-weight.svg");
background-size: cover;
background-repeat: no-repeat;
border-radius: 13px;
justify-content: center;
align-items: stretch;
align-content: flex-start;
gap: 4px;
position: relative;
padding: 20px;
min-width: 280px;
flex-grow: 1;
flex-basis: 0;
}
.group_8 {
flex-wrap: wrap;
justify-content: flex-start;
align-items: stretch;
align-content: stretch;
gap: 40px;
position: relative;
min-width: 50px;
min-height: 50px;
}
.group_9 {
justify-content: flex-start;
align-items: stretch;
align-content: flex-start;
gap: 16px;
position: relative;
min-width: 360px;
min-height: 50px;
flex-grow: 1;
flex-basis: 0;
}
.group_10 {
justify-content: space-between;
align-items: center;
align-content: flex-start;
gap: 8px;
position: relative;
min-width: 50px;
}
.group_11 {
justify-content: flex-start;
align-items: stretch;
align-content: flex-start;
gap: 8px;
position: relative;
min-width: 50px;
}
.group_12 {
border-color: #CDE0C9;
border-width: 0px 0px 1px;
border-style: solid;
justify-content: space-between;
align-items: center;
align-content: flex-start;
position: relative;
padding: 0 0 16px;
min-width: 50px;
min-height: 50px;
}
.group_13 {
justify-content: flex-start;
align-items: center;
align-content: flex-start;
position: relative;
min-width: 50px;
min-height: 50px;
}
.group_14 {
justify-content: center;
align-items: stretch;
align-content: flex-start;
position: relative;
padding: 0 0 0 24px;
min-width: 50px;
min-height: 50px;
}
.image {
object-fit: cover;
width: 28px;
height: 24px;
min-width: 0;
min-height: 0;
max-width: 28px;
max-height: 24px;
flex-shrink: 0;
}
.content {
color: white;
height: max-content;
min-width: min-content;
}
.image_1 {
object-fit: cover;
width: 24px;
height: 28px;
min-width: 0;
min-height: 0;
max-width: 24px;
max-height: 28px;
flex-shrink: 0;
}
.image_2 {
object-fit: cover;
width: 24px;
height: 24px;
min-width: 0;
min-height: 0;
max-width: 24px;
max-height: 24px;
flex-shrink: 0;
}
.text {
color: hsla(var(--ig-info-500));
margin: 0 8px 0 0;
height: max-content;
min-width: min-content;
}
.hyperlink {
color: hsla(var(--ig-primary-900));
height: max-content;
min-width: min-content;
flex-shrink: 0;
}
.icon {
--size: 18px;
font-size: 18px;
width: 18px;
height: 18px;
color: hsla(var(--ig-primary-800));
}
.image_3 {
object-fit: cover;
height: 26px;
min-width: 0;
min-height: 0;
max-height: 26px;
flex-shrink: 0;
}
.text_1 {
color: hsla(var(--ig-secondary-500));
height: max-content;
min-width: min-content;
}
.image_4 {
object-fit: cover;
height: 28px;
min-width: 0;
min-height: 0;
max-height: 28px;
flex-shrink: 0;
}
.list {
height: max-content;
}
.button {
--igx-button-foreground: hsla(var(--ig-primary-800));
}

@ -1,29 +0,0 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { FormsModule } from '@angular/forms';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { IgxIconModule, IgxListModule, IgxButtonModule, IgxRippleModule } from 'igniteui-angular';
import { HomeComponent } from './home.component';
describe('HomeComponent', () => {
let component: HomeComponent;
let fixture: ComponentFixture<HomeComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ HomeComponent ],
imports: [ NoopAnimationsModule, FormsModule, IgxIconModule, IgxListModule, IgxButtonModule, IgxRippleModule ]
})
.compileComponents();
});
beforeEach(() => {
fixture = TestBed.createComponent(HomeComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

@ -1,8 +0,0 @@
import { Component } from '@angular/core';
@Component({
selector: 'app-home',
templateUrl: './home.component.html',
styleUrls: ['./home.component.scss']
})
export class HomeComponent {}

@ -1,260 +0,0 @@
<div class="row-layout group">
<div class="column-layout group_1">
<div class="column-layout group_2">
<div class="row-layout group_3">
<div class="row-layout group_4">
<p class="ig-typography__subtitle-2 text">
CURRENT MEDICATIONS
</p>
</div>
</div>
<igx-list class="list">
<igx-list-item [isHeader]="false">
<span igxListLine>
<div class="row-layout group_5">
<div class="row-layout group_6">
<img src="/assets/Med2.svg" class="image" />
<div class="column-layout group_7">
<p class="ig-typography__subtitle-2 content">
Calcium 500mg
</p>
<p class="ig-typography__caption content">
1 tablet(s), 1 time(s), daily, with meal
</p>
</div>
</div>
<button igxButton="icon" igxRipple class="button">
<igx-icon>
keyboard_arrow_right
</igx-icon>
</button>
</div>
</span>
</igx-list-item>
<igx-list-item [isHeader]="false">
<span igxListLine>
<div class="row-layout group_5">
<div class="row-layout group_6">
<img src="/assets/Med2.svg" class="image" />
<div class="column-layout group_7">
<p class="ig-typography__subtitle-2 content">
Hydrolyzed Collagen
</p>
<p class="ig-typography__caption content">
2 scoop(s), 1 time(s), daily
</p>
</div>
</div>
<button igxButton="icon" igxRipple class="button">
<igx-icon>
keyboard_arrow_right
</igx-icon>
</button>
</div>
</span>
</igx-list-item>
<igx-list-item [isHeader]="false">
<span igxListLine>
<div class="row-layout group_5">
<div class="row-layout group_6">
<img src="/assets/Med2.svg" class="image" />
<div class="column-layout group_7">
<p class="ig-typography__subtitle-2 content">
Vitamin B19 1000mg
</p>
<p class="ig-typography__caption content">
1 pill, 2 time(s), weekly, in the morning
</p>
</div>
</div>
<button igxButton="icon" igxRipple class="button">
<igx-icon>
keyboard_arrow_right
</igx-icon>
</button>
</div>
</span>
</igx-list-item>
<igx-list-item [isHeader]="false">
<span igxListLine>
<div class="row-layout group_5">
<div class="row-layout group_6">
<img src="/assets/Med2.svg" class="image" />
<div class="column-layout group_7">
<p class="ig-typography__subtitle-2 content">
Vitamin D 100.000 IU
</p>
<p class="ig-typography__caption content">
1 capsule, 1 time(s), trimonthly, with main meal
</p>
</div>
</div>
<button igxButton="icon" igxRipple class="button">
<igx-icon>
keyboard_arrow_right
</igx-icon>
</button>
</div>
</span>
</igx-list-item>
</igx-list>
</div>
<div class="column-layout group_2">
<div class="row-layout group_3">
<div class="row-layout group_4">
<p class="ig-typography__subtitle-2 text">
EXPIRED PRESCRIPTIONS
</p>
</div>
</div>
<igx-list class="list">
<igx-list-item [isHeader]="false">
<span igxListLine>
<div class="row-layout group_5">
<div class="row-layout group_6">
<img src="/assets/meds-expired.svg" class="image" />
<div class="column-layout group_7">
<p class="ig-typography__subtitle-2 content">
Hypersol B Nasal Spray
</p>
<p class="ig-typography__caption content">
1 spray, 3 time(s) / day, each nostril, for 7 days
</p>
</div>
</div>
<button igxButton="icon" igxRipple class="button">
<igx-icon>
keyboard_arrow_right
</igx-icon>
</button>
</div>
</span>
</igx-list-item>
<igx-list-item [isHeader]="false">
<span igxListLine>
<div class="row-layout group_5">
<div class="row-layout group_6">
<img src="/assets/meds-expired.svg" class="image" />
<div class="column-layout group_7">
<p class="ig-typography__subtitle-2 content">
Prednisone 20mg
</p>
<p class="ig-typography__caption content">
1 tablet, 2 time(s) / day, with food, for 7 days
</p>
</div>
</div>
<button igxButton="icon" igxRipple class="button">
<igx-icon>
keyboard_arrow_right
</igx-icon>
</button>
</div>
</span>
</igx-list-item>
</igx-list>
</div>
</div>
</div>
<div class="row-layout group_8">
<div class="column-layout group_9">
<h6 class="content">
Calcium 500mg
</h6>
<div class="row-layout group_10">
<div class="column-layout group_11">
<p class="ig-typography__overline text_1">
DOSAGE
</p>
<div class="row-layout group_10">
<div class="row-layout group_12">
<p class="ig-typography__subtitle-2 text_1">
1
</p>
</div>
<div class="row-layout group_12">
<p class="ig-typography__subtitle-2 text_1">
tablet
</p>
</div>
</div>
</div>
<div class="column-layout group_11">
<p class="ig-typography__overline text_1">
FREQUENCY
</p>
<div class="row-layout group_10">
<div class="row-layout group_12">
<p class="ig-typography__subtitle-2 text_1">
1 time(s)
</p>
</div>
<div class="row-layout group_12">
<p class="ig-typography__subtitle-2 text_1">
daily
</p>
</div>
</div>
</div>
</div>
<div class="column-layout group_13">
<p class="ig-typography__subtitle-2 text_2">
INDICATIONS
</p>
<p class="ig-typography__body-2 content">
Take by mouth with breakfast.
</p>
<p class="ig-typography__body-2 content">
Gador Calcium 500 mg Tablets are Calcium supplements formulated to help support bone strength. Sourced from high quality ingredients, these gluten free Nature Made Calcium 500 mg contain no color added and no artificial flavors. This gluten free Calcium supplement is perfect for adults who are low in Calcium or want an additional dietary supplement with their diet. Adults, take one of these Calcium tablet bone supplements 1 to 2 times daily with water and a meal.
</p>
<a target="_blank" class="ig-typography__body-2 hyperlink">
+ View more information
</a>
</div>
<div class="column-layout group_13">
<p class="ig-typography__subtitle-2 text_2">
PRESCRIPTION INFO
</p>
<div class="column-layout group_14">
<div class="row-layout group_15">
<p class="ig-typography__subtitle-2 text_3">
Refills Left:
</p>
<p class="ig-typography__body-2 content">
4
</p>
</div>
<div class="row-layout group_15">
<p class="ig-typography__subtitle-2 text_3">
Last Refill:
</p>
<p class="ig-typography__body-2 content">
1/10/2023
</p>
</div>
<div class="row-layout group_15">
<p class="ig-typography__subtitle-2 text_3">
Prescribed by:
</p>
<p class="ig-typography__body-2 content">
Dr. Robert Stevens
</p>
</div>
</div>
</div>
<div class="row-layout group_16">
<button igxButton="flat" igxRipple class="button_1">
<igx-icon>
alarm_add
</igx-icon>
<span>Set reminder</span>
</button>
<button igxButton="raised" igxRipple class="button_2">
<igx-icon>
replay
</igx-icon>
<span>REQUEST REFILL</span>
</button>
</div>
</div>
</div>

@ -1,29 +0,0 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { FormsModule } from '@angular/forms';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { IgxListModule, IgxButtonModule, IgxRippleModule, IgxIconModule } from 'igniteui-angular';
import { MedicationsComponent } from './medications.component';
describe('MedicationsComponent', () => {
let component: MedicationsComponent;
let fixture: ComponentFixture<MedicationsComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ MedicationsComponent ],
imports: [ NoopAnimationsModule, FormsModule, IgxListModule, IgxButtonModule, IgxRippleModule, IgxIconModule ]
})
.compileComponents();
});
beforeEach(() => {
fixture = TestBed.createComponent(MedicationsComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

@ -1,8 +0,0 @@
import { Component } from '@angular/core';
@Component({
selector: 'app-medications',
templateUrl: './medications.component.html',
styleUrls: ['./medications.component.scss']
})
export class MedicationsComponent {}

@ -0,0 +1,3 @@
export interface MovieListType {
Name: string;
}

@ -0,0 +1,6 @@
export interface MyPurchasesType {
Name: string;
Theatre: string;
Purchased: string;
MoviePoster: string;
}

@ -0,0 +1,6 @@
export interface NowPlayingType {
Name: string;
Genre: string;
Description: string;
MoviePoster: string;
}

@ -0,0 +1,3 @@
export interface ShowtimesType {
Showtimes: string;
}

@ -0,0 +1,6 @@
export interface TheatresNearYouType {
Initials: string;
Theatre: string;
Address: string;
Avatarcolor: string;
}

@ -0,0 +1,3 @@
export interface TheatresType {
Theatres: string;
}

@ -1,5 +0,0 @@
export interface BPSystolicDiastolicType {
Month: string;
Systolic: number;
Diastolic: number;
}

@ -1,5 +0,0 @@
export interface CholesterolHDLLDLType {
Month: string;
HDL: number;
LDL: number;
}

@ -1,4 +0,0 @@
export interface GlucoseType {
Month: string;
Glucose: number;
}

@ -1,4 +0,0 @@
export interface HeartRateType {
Month: string;
HeartRate: number;
}

@ -1,4 +0,0 @@
export interface TotalCholesterolType {
Month: string;
Cholesterol: number;
}

@ -1,4 +0,0 @@
export interface WeightType {
Month: string;
Weight: number;
}

@ -1,9 +1,9 @@
<div class="column-layout demo-content">
<img src="/assets/start-building.svg" class="image" />
<h5 class="h5">
<img src="/assets/start-building-dark.svg" class="image" />
<h6 class="h6">
Start building!
</h5>
<p class="text">
</h6>
<p class="ig-typography__body-2 text">
Remove the "demo-content" container, and add your own content.
</p>
</div>

@ -10,8 +10,7 @@
flex-direction: column;
}
.demo-content {
background-color: transparent;
border-color: hsla(var(--ig-gray-400));
border-color: hsla(var(--ig-secondary-400));
border-width: 2px;
border-style: dashed;
justify-content: center;
@ -30,20 +29,18 @@
margin: 0 0 24px;
min-width: 0;
min-height: 0;
max-width: 280px;
flex-shrink: 0;
}
.h5 {
color: hsla(var(--ig-info-500));
.h6 {
color: hsla(var(--ig-primary-400));
margin: 0 0 16px;
height: max-content;
min-width: min-content;
}
.text {
text-align: center;
color: hsla(var(--ig-gray-700));
margin: 0 0 24px;
color: hsla(var(--ig-gray-500));
height: max-content;
min-width: min-content;
max-width: 320px;
max-width: 280px;
}

@ -1,18 +1,18 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { EmergencyComponent } from './emergency.component';
import { MovieComplexComponent } from './movie-complex.component';
describe('EmergencyComponent', () => {
let component: EmergencyComponent;
let fixture: ComponentFixture<EmergencyComponent>;
describe('MovieComplexComponent', () => {
let component: MovieComplexComponent;
let fixture: ComponentFixture<MovieComplexComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [EmergencyComponent]
declarations: [MovieComplexComponent]
})
.compileComponents();
fixture = TestBed.createComponent(EmergencyComponent);
fixture = TestBed.createComponent(MovieComplexComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});

@ -0,0 +1,8 @@
import { Component } from '@angular/core';
@Component({
selector: 'app-movie-complex',
templateUrl: './movie-complex.component.html',
styleUrls: ['./movie-complex.component.scss']
})
export class MovieComplexComponent {}

@ -0,0 +1,157 @@
<div class="column-layout group">
<h5 class="content">
Movie Premieres
</h5>
<div class="row-layout group_1">
<div class="column-layout group_2">
<div class="column-layout group_3">
<h5 class="h5_1">
MoviePlex Metropolis
</h5>
<button igxButton="raised" igxRipple class="button">
SHOW SCHEDULE
</button>
</div>
</div>
</div>
<igx-tabs [disableAnimation]="true" class="tabs">
<igx-tab-item [selected]="true" class="tab-item">
<igx-tab-header>
<span igxTabHeaderLabel>Now Playing</span>
</igx-tab-header>
<igx-tab-content class="row-layout tab-item-content">
<igx-card *ngFor="let item of movieAppDataNowPlaying" class="card">
<igx-card-media height="180px" class="media-content">
<img [src]="item.MoviePoster" class="image" />
</igx-card-media>
<igx-card-header>
<h3 igxCardHeaderTitle>
{{ item.Name }}
</h3>
<h5 igxCardHeaderSubtitle>
{{ item.Genre }}
</h5>
</igx-card-header>
<igx-card-content class="body-content">
<p class="content">
{{ item.Description }}
</p>
</igx-card-content>
<igx-card-actions class="actions-content">
<ng-container igxStart>
<button igxButton="flat" igxRipple class="button_1">
More
</button>
</ng-container>
<ng-container igxEnd>
<button igxButton="icon" igxRipple class="button_2">
<igx-icon>
favorite
</igx-icon>
</button>
<button igxButton="icon" igxRipple class="button_2">
<igx-icon>
bookmark
</igx-icon>
</button>
<button igxButton="icon" igxRipple class="button_2">
<igx-icon>
share
</igx-icon>
</button>
</ng-container>
</igx-card-actions>
</igx-card>
</igx-tab-content>
</igx-tab-item>
<igx-tab-item [disabled]="true" class="tab-item">
<igx-tab-header>
<span igxTabHeaderLabel>Opening This Week</span>
</igx-tab-header>
<igx-tab-content class="row-layout tab-item-content_1">
<div class="row-layout demo-content">
<img src="/assets/start-building-dark.svg" class="image_1" />
<p class="ig-typography__body-2 text">
Remove the "demo-content" container, and add your own content.
</p>
</div>
</igx-tab-content>
</igx-tab-item>
<igx-tab-item [disabled]="true" class="tab-item">
<igx-tab-header>
<span igxTabHeaderLabel>Coming Soon</span>
</igx-tab-header>
<igx-tab-content class="row-layout tab-item-content_1">
<div class="row-layout demo-content">
<img src="/assets/start-building-dark.svg" class="image_1" />
<p class="ig-typography__body-2 text">
Remove the "demo-content" container, and add your own content.
</p>
</div>
</igx-tab-content>
</igx-tab-item>
</igx-tabs>
</div>
<div class="column-layout group_4">
<div class="column-layout buy-tickets">
<p class="ig-typography__subtitle-2 title">
BUY TICKETS
</p>
<igx-select type="box" placeholder="Select Movie Title" [(ngModel)]="value" class="select">
<igx-prefix>
<igx-icon class="icon">
movie
</igx-icon>
</igx-prefix>
<igx-select-item value="1" *ngFor="let item of movieAppDataMovieList">
{{ item.Name }}
</igx-select-item>
<label igxLabel>Pick a Movie</label>
</igx-select>
<igx-select type="box" placeholder="Select a Movie Complex" [(ngModel)]="value" class="select">
<igx-prefix>
<igx-icon class="icon">
location_on
</igx-icon>
</igx-prefix>
<igx-select-item value="1" *ngFor="let item of movieAppDataTheatres">
{{ item.Theatres }}
</igx-select-item>
<label igxLabel>Theatres</label>
</igx-select>
<igx-date-picker type="box" mode="dialog" class="date-picker">
<label igxLabel>Date</label>
</igx-date-picker>
<igx-select type="box" [(ngModel)]="value" class="select_1">
<igx-prefix>
<igx-icon class="icon">
access_time
</igx-icon>
</igx-prefix>
<igx-select-item value="1" *ngFor="let item of movieAppDataShowtimes">
{{ item.Showtimes }}
</igx-select-item>
<label igxLabel>Show Time</label>
</igx-select>
<button igxButton="raised" igxRipple class="button">
GET TICKETS NOW
</button>
</div>
<div class="column-layout theatres-near-you">
<p class="ig-typography__subtitle-2 text_1">
THEATRES NEAR YOU
</p>
<igx-list class="list">
<igx-list-item [isHeader]="false" *ngFor="let item of movieAppDataTheatresNearYou">
<span igxListThumbnail>
<igx-avatar [initials]="item.Initials" shape="circle" class="avatar"></igx-avatar>
</span>
<span igxListLineTitle>{{ item.Theatre }}</span>
<span igxListLineSubTitle>{{ item.Address }}</span>
</igx-list-item>
</igx-list>
<button igxButton="raised" igxRipple class="button_3">
Change Location
</button>
</div>
</div>

@ -6,233 +6,240 @@
align-items: stretch;
align-content: stretch;
}
.row-layout {
.column-layout {
display: flex;
flex-direction: column;
}
.group {
background-color: rgba(256, 256, 256, 0.6);
flex-wrap: wrap;
background-color: #110613;
justify-content: flex-start;
align-items: stretch;
align-content: stretch;
align-content: flex-start;
gap: 24px;
overflow: auto;
position: relative;
padding: 32px;
min-width: 360px;
min-width: 512px;
min-height: 50px;
flex-grow: 1;
flex-grow: 4;
flex-basis: 0;
}
.column-layout {
.row-layout {
display: flex;
flex-direction: column;
}
.group_1 {
background-image: url("https://images.unsplash.com/photo-1612036782180-6f0b6cd846fe?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1400&q=80");
background-size: cover;
background-repeat: no-repeat;
justify-content: flex-start;
align-items: stretch;
align-content: flex-start;
gap: 32px;
position: relative;
min-width: 360px;
min-height: 50px;
flex-grow: 1;
flex-basis: 0;
min-width: 50px;
min-height: 320px;
max-height: 320px;
}
.group_2 {
justify-content: flex-start;
align-items: stretch;
background-color: rgb(25, 9, 27, 0.3);
justify-content: center;
align-items: center;
align-content: flex-start;
gap: 16px;
position: relative;
min-width: 360px;
min-height: 50px;
flex-shrink: 0;
flex-grow: 1;
flex-basis: 0;
}
.group_3 {
justify-content: space-between;
align-items: center;
align-content: flex-start;
gap: 8px;
position: relative;
min-width: 50px;
}
.group_4 {
justify-content: flex-start;
align-items: baseline;
align-content: flex-start;
gap: 4px;
position: relative;
min-width: 50px;
}
.group_5 {
border-color: #CDE0C9;
border-width: 0px 0px 1px;
border-style: solid;
justify-content: space-between;
align-items: center;
align-items: stretch;
align-content: flex-start;
position: relative;
padding: 0 0 16px;
min-width: 50px;
min-height: 50px;
}
.group_6 {
justify-content: flex-start;
align-items: center;
align-content: flex-start;
position: relative;
min-width: 50px;
min-height: 50px;
.tabs {
min-width: auto;
flex-grow: 1;
flex-shrink: 0;
}
.group_7 {
justify-content: center;
align-items: stretch;
align-content: flex-start;
position: relative;
padding: 0 0 0 24px;
min-width: 50px;
min-height: 50px;
.tab-item {
min-width: 100%;
}
.group_8 {
background-color: rgba(256, 256, 256, 0.6);
border-color: #CDE0C9;
border-width: 0px 0px 0px 1px;
border-style: solid;
flex-wrap: wrap;
justify-content: flex-start;
align-items: stretch;
align-content: stretch;
gap: 24px;
position: relative;
padding: 32px;
min-width: 360px;
min-height: 50px;
.card {
height: max-content;
min-width: 320px;
flex-grow: 1;
flex-basis: 0;
}
.group_9 {
justify-content: flex-start;
align-items: stretch;
align-content: flex-start;
.demo-content {
border-color: hsla(var(--ig-secondary-200));
border-width: 2px;
border-style: dashed;
flex-wrap: wrap;
justify-content: center;
align-items: center;
align-content: center;
gap: 32px;
position: relative;
width: 657px;
min-width: 360px;
min-height: 50px;
max-width: 657px;
}
.group_10 {
justify-content: flex-start;
align-items: stretch;
align-content: flex-start;
gap: 8px;
position: relative;
min-width: 50px;
padding: 48px;
min-width: auto;
min-height: 50px;
flex-grow: 1;
flex-basis: 0;
}
.group_11 {
.group_4 {
background-color: #110613;
justify-content: flex-start;
align-items: stretch;
align-content: flex-start;
gap: 4px;
position: relative;
min-width: 50px;
min-height: 50px;
}
.group_12 {
background-color: #F0F6EF;
justify-content: center;
align-items: center;
align-content: flex-start;
overflow: auto;
position: relative;
padding: 0 8px;
min-width: 50px;
padding: 32px;
min-width: 400px;
min-height: 50px;
flex-grow: 1;
flex-basis: 0;
}
.group_13 {
.buy-tickets {
background-color: #19091B;
border-color: #361439;
border-width: 4px 0px 0px;
border-style: solid;
justify-content: flex-start;
align-items: stretch;
align-content: flex-start;
gap: 16px;
position: relative;
min-width: 50px;
min-height: 50px;
margin: 0.0px 0.0px 32px;
padding: 24px;
flex-shrink: 0;
}
.group_14 {
.theatres-near-you {
background-color: #19091B;
border-color: #361439;
border-width: 4px 0px 0px;
border-style: solid;
justify-content: flex-start;
align-items: stretch;
align-content: flex-start;
position: relative;
min-width: 50px;
min-height: 50px;
}
.group_15 {
justify-content: flex-start;
align-items: baseline;
align-content: flex-start;
gap: 8px;
position: relative;
min-width: 50px;
gap: 24px;
margin: 0.0px;
padding: 24.0px 0.0px;
flex-shrink: 0;
}
.group_16 {
justify-content: flex-end;
align-items: stretch;
align-content: flex-start;
gap: 16px;
position: relative;
min-width: 50px;
.content {
height: max-content;
min-width: min-content;
}
.text {
color: hsla(var(--ig-info-500));
margin: 0 8px 0 0;
.h5_1 {
text-align: center;
margin: 0 0 16px;
height: max-content;
min-width: min-content;
}
.image {
height: 100%;
min-height: 100%;
max-height: 100%;
}
.image_1 {
object-fit: cover;
height: 26px;
min-width: 0;
min-height: 0;
max-height: 26px;
max-width: 160px;
flex-shrink: 0;
}
.content {
color: hsla(var(--ig-secondary-500));
.text {
text-align: center;
color: hsla(var(--ig-gray-500));
height: max-content;
min-width: min-content;
max-width: 320px;
}
.title {
margin: 0.0px 0.0px 16px;
padding: 0.0px;
width: max-content;
height: max-content;
}
.icon {
--size: 24px;
font-size: 24px;
width: 24px;
height: 24px;
}
.text_1 {
color: hsla(var(--ig-secondary-400));
margin: 0 0 0 24px;
height: max-content;
min-width: min-content;
}
.text_2 {
color: hsla(var(--ig-info-500));
.avatar {
--igx-avatar-background: hsla(var(--ig-success-500));
}
.tab-item-content {
flex-wrap: wrap;
justify-content: flex-start;
align-items: stretch;
align-content: flex-start;
gap: 24px;
overflow: auto;
padding: 24px 0 0;
height: 100%;
min-width: 100%;
min-height: 50px;
max-height: 100%;
}
.media-content {
min-height: 180px;
max-height: 180px;
}
.body-content {
min-width: 50px;
min-height: 50px;
}
.actions-content {
min-width: 50px;
min-height: 40px;
}
.tab-item-content_1 {
justify-content: flex-start;
align-items: stretch;
align-content: flex-start;
padding: 24px 0 0;
height: 100%;
min-width: 100%;
min-height: 50px;
max-height: 100%;
}
.button {
--igx-button-foreground: white;
--igx-button-background: hsla(var(--ig-primary-500));
height: max-content;
}
.button_1 {
--igx-button-foreground: hsla(var(--ig-primary-400));
height: max-content;
min-width: min-content;
}
.hyperlink {
color: hsla(var(--ig-primary-900));
.button_2 {
--igx-button-foreground: hsla(var(--ig-primary-400));
}
.select {
height: max-content;
min-width: min-content;
}
.text_3 {
color: hsla(var(--ig-secondary-400));
.date-picker {
height: max-content;
min-width: 120px;
}
.list {
.select_1 {
margin: 0 0 16px;
height: max-content;
min-width: min-content;
}
.button {
--igx-button-foreground: hsla(var(--ig-primary-800));
}
.button_1 {
.button_3 {
--igx-button-foreground: white;
--igx-button-background: hsla(var(--ig-primary-500));
margin: 0 24px;
height: max-content;
flex-shrink: 0;
}
.button_2 {
--igx-button-background: hsla(var(--ig-primary-500));
.list {
height: max-content;
flex-shrink: 0;
}

@ -0,0 +1,30 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { FormsModule } from '@angular/forms';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { HttpClientTestingModule } from '@angular/common/http/testing';
import { IgxButtonModule, IgxRippleModule, IgxTabsModule, IgxCardModule, IgxIconModule, IgxSelectModule, IgxInputGroupModule, IgxDatePickerModule, IgxListModule, IgxAvatarModule } from 'igniteui-angular';
import { MoviesComponent } from './movies.component';
describe('MoviesComponent', () => {
let component: MoviesComponent;
let fixture: ComponentFixture<MoviesComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ MoviesComponent ],
imports: [ NoopAnimationsModule, FormsModule, HttpClientTestingModule, IgxButtonModule, IgxRippleModule, IgxTabsModule, IgxCardModule, IgxIconModule, IgxSelectModule, IgxInputGroupModule, IgxDatePickerModule, IgxListModule, IgxAvatarModule ]
})
.compileComponents();
});
beforeEach(() => {
fixture = TestBed.createComponent(MoviesComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

@ -0,0 +1,55 @@
import { Component, OnDestroy, OnInit } from '@angular/core';
import { Subject, takeUntil } from 'rxjs';
import { TheatresNearYouType } from '../models/movie-app-data/theatres-near-you-type';
import { MovieListType } from '../models/movie-app-data/movie-list-type';
import { ShowtimesType } from '../models/movie-app-data/showtimes-type';
import { TheatresType } from '../models/movie-app-data/theatres-type';
import { NowPlayingType } from '../models/movie-app-data/now-playing-type';
import { MovieAppDataService } from '../services/movie-app-data.service';
@Component({
selector: 'app-movies',
templateUrl: './movies.component.html',
styleUrls: ['./movies.component.scss']
})
export class MoviesComponent implements OnInit, OnDestroy {
private destroy$: Subject<void> = new Subject<void>();
public movieAppDataNowPlaying: NowPlayingType[] = [];
public value: string = '1';
public movieAppDataMovieList: MovieListType[] = [];
public movieAppDataTheatres: TheatresType[] = [];
public movieAppDataShowtimes: ShowtimesType[] = [];
public movieAppDataTheatresNearYou: TheatresNearYouType[] = [];
constructor(
private movieAppDataService: MovieAppDataService,
) {}
ngOnInit() {
this.movieAppDataService.getNowPlayingList().pipe(takeUntil(this.destroy$)).subscribe({
next: (data) => this.movieAppDataNowPlaying = data,
error: (_err: any) => this.movieAppDataNowPlaying = []
});
this.movieAppDataService.getMovieListList().pipe(takeUntil(this.destroy$)).subscribe({
next: (data) => this.movieAppDataMovieList = data,
error: (_err: any) => this.movieAppDataMovieList = []
});
this.movieAppDataService.getTheatresList().pipe(takeUntil(this.destroy$)).subscribe({
next: (data) => this.movieAppDataTheatres = data,
error: (_err: any) => this.movieAppDataTheatres = []
});
this.movieAppDataService.getShowtimesList().pipe(takeUntil(this.destroy$)).subscribe({
next: (data) => this.movieAppDataShowtimes = data,
error: (_err: any) => this.movieAppDataShowtimes = []
});
this.movieAppDataService.getTheatresNearYouList().pipe(takeUntil(this.destroy$)).subscribe({
next: (data) => this.movieAppDataTheatresNearYou = data,
error: (_err: any) => this.movieAppDataTheatresNearYou = []
});
}
ngOnDestroy() {
this.destroy$.next();
this.destroy$.complete();
}
}

@ -0,0 +1,40 @@
<div class="column-layout group">
<h4 class="h4">
My Purchases
</h4>
<igx-list class="list">
<igx-list-item [isHeader]="false" *ngFor="let item of movieAppDataMyPurchases">
<span igxListLine>
<div class="row-layout group_1">
<img [src]="item.MoviePoster" class="image" />
<div class="row-layout group_2">
<div class="row-layout group_3">
<div class="column-layout group_4">
<h6 class="h6">
{{ item.Name }}
</h6>
<a target="_blank" class="ig-typography__body-2 hyperlink">
{{ item.Theatre }}
</a>
</div>
<div class="column-layout group_5">
<p class="ig-typography__body-2 text">
Purchased
</p>
<p class="ig-typography__body-2 text_1">
{{ item.Purchased }}
</p>
</div>
</div>
<button igxButton="raised" igxRipple class="button">
<igx-icon>
cloud_download
</igx-icon>
<span>Get Tickets</span>
</button>
</div>
</div>
</span>
</igx-list-item>
</igx-list>
</div>

@ -0,0 +1,111 @@
:host {
height: 100%;
display: flex;
justify-content: flex-start;
align-items: stretch;
align-content: flex-start;
}
.column-layout {
display: flex;
flex-direction: column;
}
.group {
background-color: #110613;
justify-content: flex-start;
align-items: stretch;
align-content: flex-start;
overflow: auto;
position: relative;
padding: 32px;
min-height: 50px;
flex-grow: 1;
flex-basis: 0;
}
.row-layout {
display: flex;
}
.group_1 {
justify-content: flex-start;
align-items: center;
align-content: flex-start;
gap: 32px;
position: relative;
padding: 8px 0;
}
.group_2 {
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
align-content: space-between;
gap: 16px;
position: relative;
min-width: 320px;
min-height: auto;
flex-grow: 1;
flex-basis: 0;
}
.group_3 {
flex-wrap: wrap;
justify-content: space-between;
align-items: stretch;
align-content: flex-start;
gap: 16px;
position: relative;
min-width: 50px;
min-height: 50px;
}
.group_4 {
justify-content: flex-start;
align-items: flex-start;
align-content: flex-start;
gap: 6px;
position: relative;
min-width: 300px;
}
.group_5 {
justify-content: flex-start;
align-items: flex-start;
align-content: flex-start;
gap: 6px;
position: relative;
padding: 4px 0 0;
min-width: 140px;
}
.h4 {
margin: 0 0 24px;
height: max-content;
min-width: min-content;
}
.image {
object-fit: cover;
width: 135px;
height: 180px;
min-width: 0;
min-height: 0;
max-width: 135px;
max-height: 180px;
flex-shrink: 0;
}
.h6 {
height: max-content;
max-width: 300px;
}
.hyperlink {
color: hsla(var(--ig-primary-400));
height: max-content;
}
.text {
color: hsla(var(--ig-gray-500));
height: max-content;
}
.text_1 {
height: max-content;
min-width: auto;
}
.list {
height: max-content;
}
.button {
height: max-content;
flex-shrink: 0;
}

@ -3,23 +3,23 @@ import { FormsModule } from '@angular/forms';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { HttpClientTestingModule } from '@angular/common/http/testing';
import { IgxCategoryChartModule } from 'igniteui-angular-charts';
import { HealthIndicatorsComponent } from './health-indicators.component';
import { IgxListModule, IgxButtonModule, IgxRippleModule, IgxIconModule } from 'igniteui-angular';
import { MyPurchasesComponent } from './my-purchases.component';
describe('HealthIndicatorsComponent', () => {
let component: HealthIndicatorsComponent;
let fixture: ComponentFixture<HealthIndicatorsComponent>;
describe('MyPurchasesComponent', () => {
let component: MyPurchasesComponent;
let fixture: ComponentFixture<MyPurchasesComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ HealthIndicatorsComponent ],
imports: [ NoopAnimationsModule, FormsModule, HttpClientTestingModule, IgxCategoryChartModule ]
declarations: [ MyPurchasesComponent ],
imports: [ NoopAnimationsModule, FormsModule, HttpClientTestingModule, IgxListModule, IgxButtonModule, IgxRippleModule, IgxIconModule ]
})
.compileComponents();
});
beforeEach(() => {
fixture = TestBed.createComponent(HealthIndicatorsComponent);
fixture = TestBed.createComponent(MyPurchasesComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});

@ -0,0 +1,30 @@
import { Component, OnDestroy, OnInit } from '@angular/core';
import { Subject, takeUntil } from 'rxjs';
import { MyPurchasesType } from '../models/movie-app-data/my-purchases-type';
import { MovieAppDataService } from '../services/movie-app-data.service';
@Component({
selector: 'app-my-purchases',
templateUrl: './my-purchases.component.html',
styleUrls: ['./my-purchases.component.scss']
})
export class MyPurchasesComponent implements OnInit, OnDestroy {
private destroy$: Subject<void> = new Subject<void>();
public movieAppDataMyPurchases: MyPurchasesType[] = [];
constructor(
private movieAppDataService: MovieAppDataService,
) {}
ngOnInit() {
this.movieAppDataService.getMyPurchasesList().pipe(takeUntil(this.destroy$)).subscribe({
next: (data) => this.movieAppDataMyPurchases = data,
error: (_err: any) => this.movieAppDataMyPurchases = []
});
}
ngOnDestroy() {
this.destroy$.next();
this.destroy$.complete();
}
}

@ -1,9 +0,0 @@
<div class="column-layout demo-content">
<img src="/assets/start-building.svg" class="image" />
<h5 class="h5">
Start building!
</h5>
<p class="text">
Remove the "demo-content" container, and add your own content.
</p>
</div>

@ -1,49 +0,0 @@
:host {
height: 100%;
display: flex;
justify-content: flex-start;
align-items: stretch;
align-content: flex-start;
}
.column-layout {
display: flex;
flex-direction: column;
}
.demo-content {
background-color: transparent;
border-color: hsla(var(--ig-gray-400));
border-width: 2px;
border-style: dashed;
justify-content: center;
align-items: center;
align-content: flex-start;
left: 50%;
transform: translate(-50%, -50%);
top: 50%;
position: absolute;
padding: 64px;
min-width: 50px;
min-height: 50px;
}
.image {
object-fit: cover;
margin: 0 0 24px;
min-width: 0;
min-height: 0;
max-width: 280px;
flex-shrink: 0;
}
.h5 {
color: hsla(var(--ig-info-500));
margin: 0 0 16px;
height: max-content;
min-width: min-content;
}
.text {
text-align: center;
color: hsla(var(--ig-gray-700));
margin: 0 0 24px;
height: max-content;
min-width: min-content;
max-width: 320px;
}

@ -1,23 +0,0 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ProfileComponent } from './profile.component';
describe('ProfileComponent', () => {
let component: ProfileComponent;
let fixture: ComponentFixture<ProfileComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ProfileComponent]
})
.compileComponents();
fixture = TestBed.createComponent(ProfileComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

@ -1,8 +0,0 @@
import { Component } from '@angular/core';
@Component({
selector: 'app-profile',
templateUrl: './profile.component.html',
styleUrls: ['./profile.component.scss']
})
export class ProfileComponent {}

@ -1,15 +1,15 @@
import { HttpClientTestingModule } from '@angular/common/http/testing';
import { TestBed } from '@angular/core/testing';
import { PatientDashboardService } from './patient-dashboard.service';
import { MovieAppDataService } from './movie-app-data.service';
describe('PatientDashboardService', () => {
let service: PatientDashboardService;
describe('MovieAppDataService', () => {
let service: MovieAppDataService;
beforeEach(() => {
TestBed.configureTestingModule({
imports: [HttpClientTestingModule]
});
service = TestBed.inject(PatientDashboardService);
service = TestBed.inject(MovieAppDataService);
});
it('should be created', () => {

@ -0,0 +1,42 @@
import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs';
import { MovieListType } from '../models/movie-app-data/movie-list-type';
import { MyPurchasesType } from '../models/movie-app-data/my-purchases-type';
import { NowPlayingType } from '../models/movie-app-data/now-playing-type';
import { ShowtimesType } from '../models/movie-app-data/showtimes-type';
import { TheatresNearYouType } from '../models/movie-app-data/theatres-near-you-type';
import { TheatresType } from '../models/movie-app-data/theatres-type';
@Injectable({
providedIn: 'root'
})
export class MovieAppDataService {
constructor(
private http: HttpClient
) { }
public getNowPlayingList(): Observable<NowPlayingType[]> {
return this.http.get<NowPlayingType[]>("https://excel2json.io/api/share/15755be7-cee3-4b74-4382-08da496bf5f2");
}
public getMovieListList(): Observable<MovieListType[]> {
return this.http.get<MovieListType[]>("https://excel2json.io/api/share/99cd7568-0b49-4c09-4387-08da496bf5f2");
}
public getTheatresList(): Observable<TheatresType[]> {
return this.http.get<TheatresType[]>("https://excel2json.io/api/share/5435e256-3846-4895-4385-08da496bf5f2");
}
public getShowtimesList(): Observable<ShowtimesType[]> {
return this.http.get<ShowtimesType[]>("https://excel2json.io/api/share/f179620a-3bb6-49cd-4384-08da496bf5f2");
}
public getTheatresNearYouList(): Observable<TheatresNearYouType[]> {
return this.http.get<TheatresNearYouType[]>("https://excel2json.io/api/share/49f543dc-9c4e-43e8-4386-08da496bf5f2");
}
public getMyPurchasesList(): Observable<MyPurchasesType[]> {
return this.http.get<MyPurchasesType[]>("https://excel2json.io/api/share/3f89384c-e58f-429a-4388-08da496bf5f2");
}
}

@ -1,42 +0,0 @@
import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs';
import { BPSystolicDiastolicType } from '../models/patient-dashboard/bpsystolic-diastolic-type';
import { CholesterolHDLLDLType } from '../models/patient-dashboard/cholesterol-hdlldltype';
import { GlucoseType } from '../models/patient-dashboard/glucose-type';
import { HeartRateType } from '../models/patient-dashboard/heart-rate-type';
import { TotalCholesterolType } from '../models/patient-dashboard/total-cholesterol-type';
import { WeightType } from '../models/patient-dashboard/weight-type';
@Injectable({
providedIn: 'root'
})
export class PatientDashboardService {
constructor(
private http: HttpClient
) { }
public getWeightList(): Observable<WeightType[]> {
return this.http.get<WeightType[]>("https://excel2json.io/api/share/b8fb8833-7e2c-4a84-e611-08daf8ae6744");
}
public getHeartRateList(): Observable<HeartRateType[]> {
return this.http.get<HeartRateType[]>("https://excel2json.io/api/share/43cfd6ae-a6db-42b5-e610-08daf8ae6744");
}
public getBPSystolicDiastolicList(): Observable<BPSystolicDiastolicType[]> {
return this.http.get<BPSystolicDiastolicType[]>("https://excel2json.io/api/share/16761321-7913-4d05-e616-08daf8ae6744");
}
public getGlucoseList(): Observable<GlucoseType[]> {
return this.http.get<GlucoseType[]>("https://excel2json.io/api/share/e1b52986-0c42-4ee1-e617-08daf8ae6744");
}
public getTotalCholesterolList(): Observable<TotalCholesterolType[]> {
return this.http.get<TotalCholesterolType[]>("https://excel2json.io/api/share/2f36bf07-125a-4301-e612-08daf8ae6744");
}
public getCholesterolHDLLDLList(): Observable<CholesterolHDLLDLType[]> {
return this.http.get<CholesterolHDLLDLType[]>("https://excel2json.io/api/share/a1863711-3edb-42ae-e613-08daf8ae6744");
}
}

Binary file not shown.

Binary file not shown.

@ -1,4 +0,0 @@
<svg width="37" height="43" viewBox="0 0 37 43" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M12.7897 17.422C13.4517 17.1185 14.1715 16.9614 14.8998 16.9614C15.6281 16.9614 16.3478 17.1185 17.0099 17.422C17.5662 17.677 18.0707 18.0303 18.4998 18.464C18.9288 18.0303 19.4334 17.677 19.9897 17.422C20.6517 17.1185 21.3715 16.9614 22.0998 16.9614C22.8281 16.9614 23.5478 17.1185 24.2099 17.422C24.8514 17.7161 25.4242 18.1409 25.8916 18.6689C26.4051 19.179 26.8145 19.7844 27.0968 20.4514C27.3876 21.1388 27.5375 21.8776 27.5375 22.624C27.5375 23.3704 27.3876 24.1092 27.0968 24.7966C26.8075 25.4802 26.3846 26.0992 25.853 26.6171L24.9752 27.495L19.7395 33.0298C19.4562 33.3293 19.0621 33.499 18.6498 33.499L18.6463 33.4991C18.6243 33.4992 18.5182 33.4999 18.4115 33.4892C18.2556 33.4737 18.05 33.4324 17.829 33.3219C17.6336 33.2242 17.4982 33.1073 17.4354 33.0507C17.3808 33.0016 17.3256 32.9462 17.2966 32.9171L17.2891 32.9097C17.2847 32.9052 17.2802 32.9008 17.2758 32.8963C17.2705 32.8908 17.2653 32.8853 17.2601 32.8798L12.0244 27.345L11.1391 26.4597C11.133 26.4536 11.127 26.4475 11.121 26.4413C11.1155 26.4356 11.11 26.4298 11.1046 26.424C10.1213 25.3733 9.57422 23.9881 9.57422 22.549C9.57422 21.1202 10.1136 19.7444 11.0838 18.6964C11.5556 18.1556 12.1371 17.7211 12.7897 17.422ZM13.3408 20.6727C13.326 20.6901 13.3107 20.7071 13.295 20.724C12.8319 21.2188 12.5742 21.8713 12.5742 22.549C12.5742 23.2194 12.8263 23.865 13.28 24.3579L14.1604 25.2384C14.1703 25.2482 14.1799 25.2581 14.1895 25.2682L18.5707 29.8998L22.8101 25.4182C22.8196 25.4081 22.8293 25.3982 22.8391 25.3884L23.7391 24.4884L23.7554 24.4723C24.0028 24.2323 24.1996 23.945 24.3339 23.6275C24.4683 23.31 24.5375 22.9688 24.5375 22.624C24.5375 22.2793 24.4683 21.938 24.3339 21.6205C24.1996 21.303 24.0028 21.0158 23.7554 20.7757C23.7233 20.7446 23.6926 20.712 23.6634 20.6782C23.4696 20.4533 23.2297 20.2728 22.9598 20.1491C22.69 20.0255 22.3966 19.9614 22.0998 19.9614C21.8029 19.9614 21.5096 20.0255 21.2397 20.1491C20.9699 20.2728 20.7299 20.4533 20.5361 20.6782C20.5119 20.7063 20.4867 20.7335 20.4604 20.7597L19.7104 21.5097L19.7063 21.5139C19.6838 21.5366 19.5938 21.6279 19.4978 21.7047C19.4024 21.781 19.0442 22.0615 18.4998 22.0615C17.9553 22.0615 17.5972 21.781 17.5018 21.7047C17.4058 21.6279 17.3157 21.5366 17.2933 21.5139L17.2891 21.5097L16.5391 20.7597C16.5129 20.7335 16.4876 20.7063 16.4634 20.6782C16.2696 20.4533 16.0297 20.2728 15.7598 20.1491C15.49 20.0255 15.1966 19.9614 14.8998 19.9614C14.6029 19.9614 14.3096 20.0255 14.0397 20.1491C13.7721 20.2718 13.5338 20.4504 13.3408 20.6727Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M14 0.5C13.1716 0.5 12.5 1.17157 12.5 2C12.5 2.82843 13.1716 3.5 14 3.5H17V6.56161C7.7607 7.32384 0.5 15.064 0.5 24.5C0.5 34.4411 8.55887 42.5 18.5 42.5C28.4411 42.5 36.5 34.4411 36.5 24.5C36.5 15.064 29.2393 7.32384 20 6.56161V3.5H23C23.8284 3.5 24.5 2.82843 24.5 2C24.5 1.17157 23.8284 0.5 23 0.5H14ZM18.5 9.5C10.2157 9.5 3.5 16.2157 3.5 24.5C3.5 32.7843 10.2157 39.5 18.5 39.5C26.7843 39.5 33.5 32.7843 33.5 24.5C33.5 16.2157 26.7843 9.5 18.5 9.5Z" fill="white"/>
</svg>

Before

Width:  |  Height:  |  Size: 3.1 KiB

@ -1,4 +0,0 @@
<svg width="37" height="43" viewBox="0 0 37 43" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M12.7897 17.422C13.4517 17.1185 14.1715 16.9614 14.8998 16.9614C15.6281 16.9614 16.3478 17.1185 17.0099 17.422C17.5662 17.677 18.0707 18.0303 18.4998 18.464C18.9288 18.0303 19.4334 17.677 19.9897 17.422C20.6517 17.1185 21.3715 16.9614 22.0998 16.9614C22.8281 16.9614 23.5478 17.1185 24.2099 17.422C24.8514 17.7161 25.4242 18.1409 25.8916 18.6689C26.4051 19.179 26.8145 19.7844 27.0968 20.4514C27.3876 21.1388 27.5375 21.8776 27.5375 22.624C27.5375 23.3704 27.3876 24.1092 27.0968 24.7966C26.8075 25.4802 26.3846 26.0992 25.853 26.6171L24.9752 27.495L19.7395 33.0298C19.4562 33.3293 19.0621 33.499 18.6498 33.499L18.6463 33.4991C18.6243 33.4992 18.5182 33.4999 18.4115 33.4892C18.2556 33.4737 18.05 33.4324 17.829 33.3219C17.6336 33.2242 17.4982 33.1073 17.4354 33.0507C17.3808 33.0016 17.3256 32.9462 17.2966 32.9171L17.2891 32.9097C17.2847 32.9052 17.2802 32.9008 17.2758 32.8963C17.2705 32.8908 17.2653 32.8853 17.2601 32.8798L12.0244 27.345L11.1391 26.4597C11.133 26.4536 11.127 26.4475 11.121 26.4413C11.1155 26.4356 11.11 26.4298 11.1046 26.424C10.1213 25.3733 9.57422 23.9881 9.57422 22.549C9.57422 21.1202 10.1136 19.7444 11.0838 18.6964C11.5556 18.1556 12.1371 17.7211 12.7897 17.422ZM13.3408 20.6727C13.326 20.6901 13.3107 20.7071 13.295 20.724C12.8319 21.2188 12.5742 21.8713 12.5742 22.549C12.5742 23.2194 12.8263 23.865 13.28 24.3579L14.1604 25.2384C14.1703 25.2482 14.1799 25.2581 14.1895 25.2682L18.5707 29.8998L22.8101 25.4182C22.8196 25.4081 22.8293 25.3982 22.8391 25.3884L23.7391 24.4884L23.7554 24.4723C24.0028 24.2323 24.1996 23.945 24.3339 23.6275C24.4683 23.31 24.5375 22.9688 24.5375 22.624C24.5375 22.2793 24.4683 21.938 24.3339 21.6205C24.1996 21.303 24.0028 21.0158 23.7554 20.7757C23.7233 20.7446 23.6926 20.712 23.6634 20.6782C23.4696 20.4533 23.2297 20.2728 22.9598 20.1491C22.69 20.0255 22.3966 19.9614 22.0998 19.9614C21.8029 19.9614 21.5096 20.0255 21.2397 20.1491C20.9699 20.2728 20.7299 20.4533 20.5361 20.6782C20.5119 20.7063 20.4867 20.7335 20.4604 20.7597L19.7104 21.5097L19.7063 21.5139C19.6838 21.5366 19.5938 21.6279 19.4978 21.7047C19.4024 21.781 19.0442 22.0615 18.4998 22.0615C17.9553 22.0615 17.5972 21.781 17.5018 21.7047C17.4058 21.6279 17.3157 21.5366 17.2933 21.5139L17.2891 21.5097L16.5391 20.7597C16.5129 20.7335 16.4876 20.7063 16.4634 20.6782C16.2696 20.4533 16.0297 20.2728 15.7598 20.1491C15.49 20.0255 15.1966 19.9614 14.8998 19.9614C14.6029 19.9614 14.3096 20.0255 14.0397 20.1491C13.7721 20.2718 13.5338 20.4504 13.3408 20.6727Z" fill="#CDB3D4"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M14 0.5C13.1716 0.5 12.5 1.17157 12.5 2C12.5 2.82843 13.1716 3.5 14 3.5H17V6.56161C7.7607 7.32384 0.5 15.064 0.5 24.5C0.5 34.4411 8.55887 42.5 18.5 42.5C28.4411 42.5 36.5 34.4411 36.5 24.5C36.5 15.064 29.2393 7.32384 20 6.56161V3.5H23C23.8284 3.5 24.5 2.82843 24.5 2C24.5 1.17157 23.8284 0.5 23 0.5H14ZM18.5 9.5C10.2157 9.5 3.5 16.2157 3.5 24.5C3.5 32.7843 10.2157 39.5 18.5 39.5C26.7843 39.5 33.5 32.7843 33.5 24.5C33.5 16.2157 26.7843 9.5 18.5 9.5Z" fill="#CDB3D4"/>
</svg>

Before

Width:  |  Height:  |  Size: 3.1 KiB

@ -1,3 +0,0 @@
<svg width="31" height="37" viewBox="0 0 31 37" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M26.474 10.7146L17.174 0.724583C16.74 0.262083 16.12 0 15.5 0C14.88 0 14.26 0.262083 13.826 0.709167L4.54151 10.6837C1.61201 13.5975 0 17.4671 0 21.5833C0 25.6996 1.61201 29.5692 4.54151 32.4829C7.47101 35.3967 11.3615 37 15.5 37C19.6385 37 23.529 35.3967 26.4585 32.4829C29.388 29.5692 31 25.6996 31 21.5833C31 17.4671 29.388 13.5975 26.474 10.7146V10.7146ZM24.2575 30.3092C21.917 32.6371 18.8015 33.9321 15.5 33.9321C12.1985 33.9321 9.08302 32.6525 6.72702 30.3092C4.38652 27.9812 3.1 24.8825 3.1 21.5987C3.1 18.315 4.3865 15.2162 6.758 12.8575L15.5 3.43792L24.2575 12.8729C26.598 15.2008 27.9 18.2996 27.9 21.5833C27.9 24.8671 26.6135 27.9658 24.2575 30.2937V30.3092ZM15.314 27.7654C13.6555 27.7654 12.1055 27.1179 10.9275 25.9617C9.7495 24.79 9.11401 23.2483 9.11401 21.5987C9.11401 20.7508 8.41651 20.0571 7.56401 20.0571C6.71151 20.0571 6.01401 20.7508 6.01401 21.5987C6.01401 24.0654 6.975 26.3933 8.742 28.1354C10.4935 29.8775 12.834 30.8487 15.314 30.8487C16.1665 30.8487 16.864 30.155 16.864 29.3071C16.864 28.4592 16.1665 27.7654 15.314 27.7654V27.7654Z" fill="white"/>
</svg>

Before

Width:  |  Height:  |  Size: 1.2 KiB

@ -1,3 +0,0 @@
<svg width="31" height="37" viewBox="0 0 31 37" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M26.474 10.7146L17.174 0.724583C16.74 0.262083 16.12 0 15.5 0C14.88 0 14.26 0.262083 13.826 0.709167L4.54151 10.6837C1.61201 13.5975 0 17.4671 0 21.5833C0 25.6996 1.61201 29.5692 4.54151 32.4829C7.47101 35.3967 11.3615 37 15.5 37C19.6385 37 23.529 35.3967 26.4585 32.4829C29.388 29.5692 31 25.6996 31 21.5833C31 17.4671 29.388 13.5975 26.474 10.7146ZM24.2575 30.3092C21.917 32.6371 18.8015 33.9321 15.5 33.9321C12.1985 33.9321 9.08302 32.6525 6.72702 30.3092C4.38652 27.9812 3.1 24.8825 3.1 21.5987C3.1 18.315 4.3865 15.2162 6.758 12.8575L15.5 3.43792L24.2575 12.8729C26.598 15.2008 27.9 18.2996 27.9 21.5833C27.9 24.8671 26.6135 27.9658 24.2575 30.2937V30.3092ZM15.314 27.7654C13.6555 27.7654 12.1055 27.1179 10.9275 25.9617C9.7495 24.79 9.11401 23.2483 9.11401 21.5987C9.11401 20.7508 8.41651 20.0571 7.56401 20.0571C6.71151 20.0571 6.01401 20.7508 6.01401 21.5987C6.01401 24.0654 6.975 26.3933 8.742 28.1354C10.4935 29.8775 12.834 30.8487 15.314 30.8487C16.1665 30.8487 16.864 30.155 16.864 29.3071C16.864 28.4592 16.1665 27.7654 15.314 27.7654Z" fill="#FFBE88"/>
</svg>

Before

Width:  |  Height:  |  Size: 1.2 KiB

@ -1,4 +0,0 @@
<svg width="43" height="38" viewBox="0 0 43 38" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M7.54209 1.41414C8.94178 0.811061 10.4498 0.5 11.9739 0.5C13.498 0.5 15.0061 0.811061 16.4057 1.41414C17.8054 2.01722 19.0673 2.89963 20.1141 4.00734L20.1231 4.01689L21.3489 5.33703L22.5747 4.01693L22.5916 3.99901C23.6532 2.89277 24.9275 2.01255 26.3379 1.41126C27.7483 0.809962 29.2657 0.500003 30.7989 0.500003C32.3321 0.500003 33.8495 0.809962 35.2599 1.41126C36.6666 2.01098 37.938 2.88818 38.9979 3.99038C41.1991 6.2162 42.448 9.21131 42.4799 12.3419C42.5119 15.4765 41.3213 18.5002 39.1607 20.7714C39.1521 20.7805 39.1434 20.7894 39.1346 20.7983L36.743 23.1898L22.9515 37.4311C22.8755 37.5096 22.7911 37.5795 22.6999 37.6397C22.3435 37.8748 21.9259 38.0002 21.4989 38.0002C21.0719 38.0002 20.6543 37.8748 20.2979 37.6397C20.2067 37.5795 20.1224 37.5096 20.0464 37.4311L6.25471 23.1897L3.86325 20.7983C3.8533 20.7883 3.84348 20.7782 3.83381 20.768C1.69286 18.5029 0.5 15.5044 0.5 12.3876C0.5 9.2709 1.69283 6.27238 3.83371 4.00734M11.9739 3.5C10.8581 3.5 9.75396 3.72774 8.72918 4.16928C7.70441 4.61082 6.78054 5.25687 6.01412 6.06787C4.39964 7.77595 3.5 10.0373 3.5 12.3876C3.5 14.7312 4.39437 16.9861 6.0001 18.6925L8.38457 21.0769L8.40145 21.0941L21.4989 34.6187L34.5964 21.0941L34.6133 21.0769L36.9995 18.6907C38.6144 16.9862 39.504 14.7208 39.4801 12.3725C39.456 10.0182 38.5157 7.76584 36.8584 6.09341L36.8416 6.0762C36.06 5.26171 35.1218 4.61364 34.0834 4.17093C33.045 3.72821 31.9278 3.5 30.7989 3.5C29.6701 3.5 28.5529 3.72821 27.5144 4.17093C26.4796 4.6121 25.5443 5.25721 24.7643 6.06773L22.8231 8.15828C22.7416 8.24605 22.6499 8.32374 22.5499 8.3897C22.1935 8.62482 21.7759 8.75015 21.3489 8.75015C20.9219 8.75015 20.5043 8.62482 20.1479 8.3897C20.0479 8.32374 19.9562 8.24605 19.8747 8.15828L17.9294 6.0633C17.1638 5.25444 16.2415 4.60999 15.2186 4.16928C14.1939 3.72774 13.0898 3.5 11.9739 3.5ZM7.54209 1.41414C6.14244 2.0172 4.8805 2.89968 3.83371 4.00734Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M24.2686 11.0457C24.8226 10.988 25.363 11.2421 25.672 11.7056L28.2267 15.5376H31.9239C32.7523 15.5376 33.4239 16.2092 33.4239 17.0376C33.4239 17.866 32.7523 18.5376 31.9239 18.5376H27.4239C26.9224 18.5376 26.454 18.287 26.1758 17.8697L24.7576 15.7423L22.8166 20.5947C22.5973 21.1431 22.0764 21.5118 21.4863 21.5363C20.8961 21.5609 20.3464 21.2368 20.0823 20.7084L18.013 16.5699L16.4846 18.0983C16.2033 18.3796 15.8217 18.5376 15.4239 18.5376H10.9239C10.0955 18.5376 9.42391 17.866 9.42391 17.0376C9.42391 16.2092 10.0955 15.5376 10.9239 15.5376H14.8026L17.3633 12.9769C17.7042 12.636 18.1882 12.4797 18.6642 12.557C19.1401 12.6342 19.5499 12.9355 19.7656 13.3668L21.2717 16.3792L23.0312 11.9805C23.2381 11.4633 23.7145 11.1034 24.2686 11.0457Z" fill="white"/>
</svg>

Before

Width:  |  Height:  |  Size: 2.8 KiB

@ -1,4 +0,0 @@
<svg width="43" height="38" viewBox="0 0 43 38" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M7.54209 1.41414C8.94178 0.811061 10.4498 0.5 11.9739 0.5C13.498 0.5 15.0061 0.811061 16.4057 1.41414C17.8054 2.01722 19.0673 2.89963 20.1141 4.00734L20.1231 4.01689L21.3489 5.33703L22.5747 4.01693L22.5916 3.99901C23.6532 2.89277 24.9275 2.01255 26.3379 1.41126C27.7483 0.809962 29.2657 0.500003 30.7989 0.500003C32.3321 0.500003 33.8495 0.809962 35.2599 1.41126C36.6666 2.01098 37.938 2.88818 38.9979 3.99038C41.1991 6.2162 42.448 9.21131 42.4799 12.3419C42.5119 15.4765 41.3213 18.5002 39.1607 20.7714C39.1521 20.7805 39.1434 20.7894 39.1346 20.7983L36.743 23.1898L22.9515 37.4311C22.8755 37.5096 22.7911 37.5795 22.6999 37.6397C22.3435 37.8748 21.9259 38.0002 21.4989 38.0002C21.0719 38.0002 20.6543 37.8748 20.2979 37.6397C20.2067 37.5795 20.1224 37.5096 20.0464 37.4311L6.25471 23.1897L3.86325 20.7983C3.8533 20.7883 3.84348 20.7782 3.83381 20.768C1.69286 18.5029 0.5 15.5044 0.5 12.3876C0.5 9.2709 1.69283 6.27238 3.83371 4.00734M11.9739 3.5C10.8581 3.5 9.75396 3.72774 8.72918 4.16928C7.70441 4.61082 6.78054 5.25687 6.01412 6.06787C6.01409 6.06791 6.01415 6.06784 6.01412 6.06787C4.39964 7.77595 3.5 10.0373 3.5 12.3876C3.5 14.7312 4.39437 16.9861 6.0001 18.6925L8.38457 21.0769L8.40145 21.0941L21.4989 34.6187L34.5964 21.0941L34.6133 21.0769L36.9995 18.6907C38.6144 16.9862 39.504 14.7208 39.4801 12.3725C39.456 10.0182 38.5157 7.76584 36.8584 6.09341L36.8416 6.0762C36.06 5.26171 35.1218 4.61364 34.0834 4.17093C33.045 3.72821 31.9278 3.5 30.7989 3.5C29.6701 3.5 28.5529 3.72821 27.5144 4.17093C26.4796 4.6121 25.5443 5.25721 24.7643 6.06773L22.8231 8.15828C22.7416 8.24605 22.6499 8.32374 22.5499 8.3897C22.1935 8.62482 21.7759 8.75015 21.3489 8.75015C20.9219 8.75015 20.5043 8.62482 20.1479 8.3897C20.0479 8.32374 19.9562 8.24605 19.8747 8.15828L17.9294 6.0633C17.1638 5.25444 16.2415 4.60999 15.2186 4.16928C14.1939 3.72774 13.0898 3.5 11.9739 3.5ZM7.54209 1.41414C6.14244 2.0172 4.8805 2.89968 3.83371 4.00734Z" fill="#E7B7C8"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M24.2686 11.0457C24.8226 10.988 25.363 11.2421 25.672 11.7056L28.2267 15.5376H31.9239C32.7523 15.5376 33.4239 16.2092 33.4239 17.0376C33.4239 17.866 32.7523 18.5376 31.9239 18.5376H27.4239C26.9224 18.5376 26.454 18.287 26.1758 17.8697L24.7576 15.7423L22.8166 20.5947C22.5973 21.1431 22.0764 21.5118 21.4863 21.5363C20.8961 21.5609 20.3464 21.2368 20.0823 20.7084L18.013 16.5699L16.4846 18.0983C16.2033 18.3796 15.8217 18.5376 15.4239 18.5376H10.9239C10.0955 18.5376 9.42391 17.866 9.42391 17.0376C9.42391 16.2092 10.0955 15.5376 10.9239 15.5376H14.8026L17.3633 12.9769C17.7042 12.636 18.1882 12.4797 18.6642 12.557C19.1401 12.6342 19.5499 12.9355 19.7656 13.3668L21.2717 16.3792L23.0312 11.9805C23.2381 11.4633 23.7145 11.1034 24.2686 11.0457Z" fill="#E7B7C8"/>
</svg>

Before

Width:  |  Height:  |  Size: 2.8 KiB

@ -1,4 +0,0 @@
<svg width="41" height="41" viewBox="0 0 41 41" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M4.60118 36.4012C2.94191 34.6939 2.01367 32.4069 2.01367 30.0262C2.01367 27.6454 2.94191 25.3585 4.60118 23.6512L23.6512 4.60118C25.3585 2.94191 27.6454 2.01367 30.0262 2.01367C32.4069 2.01367 34.6939 2.94191 36.4012 4.60118V4.60118C38.0604 6.30847 38.9887 8.59542 38.9887 10.9762C38.9887 13.3569 38.0604 15.6439 36.4012 17.3512L17.3512 36.4012C15.6439 38.0604 13.3569 38.9887 10.9762 38.9887C8.59542 38.9887 6.30847 38.0604 4.60118 36.4012V36.4012Z" stroke="#205072" stroke-width="3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M14.5 14.5L26.8 26.8" stroke="#205072" stroke-width="3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
</svg>

Before

Width:  |  Height:  |  Size: 806 B

@ -1,4 +0,0 @@
<svg width="40" height="43" viewBox="0 0 40 43" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M24.5449 8.40171C24.7648 7.84572 24.6334 7.21225 24.2107 6.78948C23.7879 6.36671 23.1544 6.23538 22.5984 6.45523C21.059 7.06394 19.5756 7.80565 18.165 8.67194C18.0753 8.72701 17.9917 8.79136 17.9155 8.86393C17.6262 9.13946 17.3959 9.47087 17.2385 9.83808C17.0811 10.2053 17 10.6006 17 11.0001C17 11.3997 17.0811 11.795 17.2385 12.1622C17.3911 12.5182 17.6122 12.8406 17.8892 13.111C18.1596 13.3879 18.4819 13.609 18.8379 13.7616C19.2051 13.919 19.6005 14.0001 20 14.0001C20.3995 14.0001 20.7949 13.919 21.1621 13.7616C21.5293 13.6042 21.8607 13.3739 22.1362 13.0846L22.3282 12.8351C23.1945 11.4245 23.9362 9.94111 24.5449 8.40171Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M5 42.5H35L35.0045 42.5C36.1957 42.4964 37.3371 42.0217 38.1794 41.1794C39.0217 40.3371 39.4964 39.1957 39.5 38.0045L39.5 38L39.5 14L39.5 13.9955C39.4964 12.8043 39.0217 11.6629 38.1794 10.8206C37.3371 9.97834 36.1957 9.50356 35.0045 9.5H30.3937C29.6658 4.41156 25.2897 0.5 20 0.5C14.7103 0.5 10.3342 4.41156 9.60633 9.5H5L4.99552 9.50001C3.80433 9.50356 2.66294 9.97834 1.82064 10.8206C0.97834 11.6629 0.503558 12.8043 0.5 13.9955V38L0.500007 38.0045C0.503564 39.1957 0.97834 40.3371 1.82064 41.1794C2.66294 42.0217 3.80433 42.4964 4.99552 42.5L5 42.5ZM12.5 11C12.5 6.85786 15.8579 3.5 20 3.5C24.1421 3.5 27.5 6.85786 27.5 11C27.5 15.1421 24.1421 18.5 20 18.5C15.8579 18.5 12.5 15.1421 12.5 11ZM9.60633 12.5C10.2641 17.0985 13.9015 20.7359 18.5 21.3937V39.5H5.00241C4.60451 39.4983 4.22336 39.3394 3.94196 39.058C3.66051 38.7766 3.50168 38.3954 3.5 37.9974V14.0026C3.50168 13.6046 3.66051 13.2234 3.94196 12.942C4.22341 12.6605 4.60465 12.5017 5.00263 12.5H9.60633ZM21.5 21.3937V39.5H34.9976C35.3955 39.4983 35.7766 39.3394 36.058 39.058C36.3394 38.7766 36.4983 38.3955 36.5 37.9976V14.0024C36.4983 13.6045 36.3394 13.2234 36.058 12.942C35.7766 12.6605 35.3954 12.5017 34.9974 12.5H30.3937C29.7359 17.0985 26.0985 20.7359 21.5 21.3937Z" fill="white"/>
</svg>

Before

Width:  |  Height:  |  Size: 2.0 KiB

@ -1,4 +0,0 @@
<svg width="40" height="43" viewBox="0 0 40 43" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M24.5449 8.40171C24.7648 7.84572 24.6334 7.21225 24.2107 6.78948C23.7879 6.36671 23.1544 6.23538 22.5984 6.45523C21.059 7.06394 19.5756 7.80565 18.165 8.67194C18.0753 8.72701 17.9917 8.79136 17.9155 8.86393C17.6262 9.13946 17.3959 9.47087 17.2385 9.83808C17.0811 10.2053 17 10.6006 17 11.0001C17 11.3997 17.0811 11.795 17.2385 12.1622C17.3911 12.5182 17.6122 12.8406 17.8892 13.111C18.1596 13.3879 18.4819 13.609 18.8379 13.7616C19.2051 13.919 19.6005 14.0001 20 14.0001C20.3995 14.0001 20.7949 13.919 21.1621 13.7616C21.5293 13.6042 21.8607 13.3739 22.1362 13.0846L22.3282 12.8351C23.1945 11.4245 23.9362 9.94111 24.5449 8.40171Z" fill="#70C3A1"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M5 42.5H35L35.0045 42.5C36.1957 42.4964 37.3371 42.0217 38.1794 41.1794C39.0217 40.3371 39.4964 39.1957 39.5 38.0045L39.5 38L39.5 14L39.5 13.9955C39.4964 12.8043 39.0217 11.6629 38.1794 10.8206C37.3371 9.97834 36.1957 9.50356 35.0045 9.5H30.3937C29.6658 4.41156 25.2897 0.5 20 0.5C14.7103 0.5 10.3342 4.41156 9.60633 9.5H5L4.99552 9.50001C3.80433 9.50356 2.66294 9.97834 1.82064 10.8206C0.97834 11.6629 0.503558 12.8043 0.5 13.9955V38L0.500007 38.0045C0.503564 39.1957 0.97834 40.3371 1.82064 41.1794C2.66294 42.0217 3.80433 42.4964 4.99552 42.5L5 42.5ZM12.5 11C12.5 6.85786 15.8579 3.5 20 3.5C24.1421 3.5 27.5 6.85786 27.5 11C27.5 15.1421 24.1421 18.5 20 18.5C15.8579 18.5 12.5 15.1421 12.5 11ZM9.60633 12.5C10.2641 17.0985 13.9015 20.7359 18.5 21.3937V39.5H5.00241C4.60451 39.4983 4.22336 39.3394 3.94196 39.058C3.66051 38.7766 3.50168 38.3954 3.5 37.9974V14.0026C3.50168 13.6046 3.66051 13.2234 3.94196 12.942C4.22341 12.6605 4.60465 12.5017 5.00263 12.5H9.60633ZM21.5 21.3937V39.5H34.9976C35.3955 39.4983 35.7766 39.3394 36.058 39.058C36.3394 38.7766 36.4983 38.3955 36.5 37.9976V14.0024C36.4983 13.6045 36.3394 13.2234 36.058 12.942C35.7766 12.6605 35.3954 12.5017 34.9974 12.5H30.3937C29.7359 17.0985 26.0985 20.7359 21.5 21.3937Z" fill="#70C3A1"/>
</svg>

Before

Width:  |  Height:  |  Size: 2.0 KiB

@ -1,4 +0,0 @@
<svg width="40" height="41" viewBox="0 0 40 41" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M8 1.5C8 0.671631 8.67163 0 9.5 0C10.3284 0 11 0.671631 11 1.5V3H20V1.5C20 0.671631 20.6716 0 21.5 0C22.3284 0 23 0.671631 23 1.5V3H24C27.866 3 31 6.13403 31 10V20.1063C36.0884 20.8342 40 25.2103 40 30.5C40 36.299 35.299 41 29.5 41C24.2103 41 19.8342 37.0884 19.1063 32L19.0151 30.7142C19.0051 30.6443 19 30.5728 19 30.5C19 29.6716 19.6716 29 20.5 29C21.3284 29 22 29.6716 22 30.5C22 34.6421 25.3579 38 29.5 38C33.6421 38 37 34.6421 37 30.5C37 26.3579 33.6421 23 29.5 23C28.1243 23 26.835 23.3704 25.7266 24.017C26.4474 24.1262 27 24.7487 27 25.5C27 26.3284 26.3284 27 25.5 27H22.5C21.6716 27 21 26.3284 21 25.5V22.5C21 21.6716 21.6716 21 22.5 21C23.0344 21 23.5037 21.2795 23.7693 21.7004C25.0203 20.8842 26.4559 20.3273 28 20.1063V15H3V25C3 27.2091 4.79089 29 7 29H15.5C16.3284 29 17 29.6716 17 30.5C17 31.3284 16.3284 32 15.5 32H7C3.13403 32 0 28.866 0 25V10C0 6.13403 3.13403 3 7 3H8V1.5ZM20 6V7.5C20 8.32837 20.6716 9 21.5 9C22.3284 9 23 8.32837 23 7.5V6H24C26.2091 6 28 7.79089 28 10V12H3V10C3 7.79089 4.79089 6 7 6H8V7.5C8 8.32837 8.67163 9 9.5 9C10.3284 9 11 8.32837 11 7.5V6H20Z" fill="#205072"/>
<path d="M28 27.5C28 26.6716 28.6716 26 29.5 26C30.3284 26 31 26.6716 31 27.5V29.8435L32.8851 30.8363C33.6182 31.2223 33.8995 32.1294 33.5135 32.8624C33.1274 33.5953 32.2203 33.8767 31.4873 33.4907L28.8256 32.089C28.3185 31.8219 28.0275 31.3055 28.0242 30.7699C28.0135 30.7112 28.0062 30.6512 28.0026 30.5903C28.0009 30.5604 28 30.5303 28 30.5V27.5Z" fill="#205072"/>
</svg>

Before

Width:  |  Height:  |  Size: 1.6 KiB

@ -1,3 +0,0 @@
<svg width="40" height="41" viewBox="0 0 40 41" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M9.5 0C8.67163 0 8 0.671631 8 1.5V3H7C3.13403 3 0 6.13403 0 10V25C0 28.866 3.13403 32 7 32H19.1063C19.8342 37.0884 24.2103 41 29.5 41C35.299 41 40 36.299 40 30.5C40 25.2103 36.0884 20.8342 31 20.1063V10C31 6.13403 27.866 3 24 3H23V1.5C23 0.671631 22.3284 0 21.5 0C20.6716 0 20 0.671631 20 1.5V3H11V1.5C11 0.671631 10.3284 0 9.5 0ZM28 20.1063C23.4015 20.7642 19.7642 24.4015 19.1063 29H7C4.79089 29 3 27.2091 3 25V15H28V20.1063ZM20 7.5V6H11V7.5C11 8.32837 10.3284 9 9.5 9C8.67163 9 8 8.32837 8 7.5V6H7C4.79089 6 3 7.79089 3 10V12H28V10C28 7.79089 26.2091 6 24 6H23V7.5C23 8.32837 22.3284 9 21.5 9C20.6716 9 20 8.32837 20 7.5ZM37 30.5C37 34.6421 33.6421 38 29.5 38C25.3579 38 22 34.6421 22 30.5C22 26.3579 25.3579 23 29.5 23C33.6421 23 37 26.3579 37 30.5ZM28 27.5C28 26.6716 28.6716 26 29.5 26C30.3284 26 31 26.6716 31 27.5V29H32.5C33.3284 29 34 29.6716 34 30.5C34 31.3284 33.3284 32 32.5 32H31V33.5C31 34.3284 30.3284 35 29.5 35C28.6716 35 28 34.3284 28 33.5V32H26.5C25.6716 32 25 31.3284 25 30.5C25 29.6716 25.6716 29 26.5 29H28V27.5Z" fill="#205072"/>
</svg>

Before

Width:  |  Height:  |  Size: 1.2 KiB

@ -1,3 +0,0 @@
<svg width="39" height="37" viewBox="0 0 39 37" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M17.174 0.724609L20.1927 3.96729L17.4208 5.5072L15.5 3.43787L6.758 12.8575C4.38647 15.2163 3.09998 18.3149 3.09998 21.5988C3.09998 24.8824 4.38654 27.9812 6.72699 30.3092C9.08301 32.6525 12.1985 33.9321 15.5 33.9321C18.8015 33.9321 21.917 32.6371 24.2575 30.3092V30.2937C24.7654 29.7919 25.2236 29.2543 25.6299 28.6866C25.7373 28.5366 25.8411 28.3845 25.9411 28.2305L26.3483 28.4521C27.2065 28.9194 28.1786 29.0876 29.1186 28.9573C29.0879 29.0131 29.0569 29.0687 29.0255 29.1243L28.9648 29.2305L28.931 29.2888C28.9083 29.3278 28.8855 29.3665 28.8625 29.4052C28.2034 30.5139 27.3988 31.5476 26.4585 32.4829C23.529 35.3966 19.6385 37 15.5 37C11.3615 37 7.47101 35.3966 4.5415 32.4829C1.612 29.5692 0 25.6996 0 21.5834C0 17.467 1.612 13.5975 4.5415 10.6837L13.826 0.709106C14.26 0.262085 14.88 0 15.5 0C16.12 0 16.74 0.262085 17.174 0.724609ZM15.314 27.7654C13.6555 27.7654 12.1055 27.1179 10.9275 25.9617C9.74951 24.79 9.11401 23.2483 9.11401 21.5988C9.11401 20.7509 8.4165 20.0571 7.56403 20.0571C6.71149 20.0571 6.01404 20.7509 6.01404 21.5988C6.01404 24.0654 6.97498 26.3933 8.742 28.1354C10.4935 29.8774 12.834 30.8488 15.314 30.8488C16.1665 30.8488 16.864 30.155 16.864 29.3071C16.864 28.4591 16.1665 27.7654 15.314 27.7654ZM29.2172 3.18262C28.7661 2.93701 28.2206 2.93933 27.7715 3.18872L18.7715 8.18872C18.2953 8.45337 18 8.9552 18 9.5V10.3564V10.6V19.6C18 20.1493 18.3003 20.6548 18.7828 20.9174L27.7828 25.8174C28.2339 26.063 28.7794 26.0607 29.2285 25.8113L38.2285 20.8113C38.7047 20.5466 39 20.0448 39 19.5V10.5V10.1263V9.40002C39 8.85071 38.6997 8.34521 38.2172 8.08264L29.2172 3.18262ZM35.3874 9.95776L28.5073 6.21191L21.6126 10.0422L28.4927 13.7881L35.3874 9.95776ZM21 13.1246V18.7087L27 21.9755V16.3912L21 13.1246ZM36 18.6174L30 21.9507V16.3826L36 13.0493V18.6174Z" fill="#E7B7C8"/>
</svg>

Before

Width:  |  Height:  |  Size: 1.9 KiB

@ -1,14 +0,0 @@
<svg width="240" height="140" viewBox="0 0 240 140" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_477_4572)">
<path fill-rule="evenodd" clip-rule="evenodd" d="M188.245 15.5C184.655 15.5 181.745 18.4101 181.745 22C181.745 25.5899 184.655 28.5 188.245 28.5H197.961V37.4388C164.583 40.7036 138.5 68.8478 138.5 103.084C138.5 139.513 168.032 169.045 204.461 169.045C240.891 169.045 270.423 139.513 270.423 103.084C270.423 68.8478 244.34 40.7036 210.961 37.4388V28.5H220.678C224.268 28.5 227.178 25.5899 227.178 22C227.178 18.4101 224.268 15.5 220.678 15.5H204.461H188.245ZM183.427 76.582C185.956 75.4228 188.705 74.8228 191.487 74.8228C194.269 74.8228 197.018 75.4228 199.547 76.582C201.345 77.4059 203.001 78.4985 204.46 79.8183C205.92 78.4985 207.576 77.4059 209.374 76.582C211.902 75.4228 214.652 74.8228 217.434 74.8228C220.216 74.8228 222.965 75.4228 225.494 76.582C227.934 77.7004 230.113 79.3139 231.895 81.3187C233.834 83.2521 235.381 85.5438 236.449 88.0676C237.555 90.6798 238.124 93.4873 238.124 96.3236C238.124 99.16 237.555 101.967 236.449 104.58C235.351 107.175 233.746 109.525 231.728 111.493L228.58 114.64L209.723 134.575C208.495 135.873 206.787 136.609 205.001 136.609L204.995 136.609H204.995C204.938 136.609 204.489 136.613 204.033 136.568C203.375 136.502 202.497 136.327 201.553 135.855C200.721 135.438 200.148 134.942 199.892 134.712C199.672 134.514 199.451 134.292 199.349 134.19L199.324 134.164C199.281 134.122 199.239 134.078 199.198 134.035L180.34 114.1L177.161 110.92C177.11 110.869 177.06 110.818 177.011 110.765C173.278 106.776 171.201 101.517 171.201 96.0534C171.201 90.6337 173.244 85.4152 176.921 81.4378C178.721 79.3777 180.939 77.7225 183.427 76.582ZM186.699 90.0044C186.636 90.0788 186.57 90.152 186.503 90.2241C185.024 91.8047 184.201 93.8886 184.201 96.0534C184.201 98.1873 185 100.243 186.44 101.815L189.596 104.971C189.623 104.998 189.65 105.025 189.677 105.053C189.692 105.069 189.707 105.085 189.722 105.101L204.716 120.951L219.198 105.641C219.24 105.597 219.282 105.554 219.324 105.512L222.568 102.268C222.579 102.257 222.59 102.246 222.601 102.235C222.613 102.223 222.626 102.211 222.638 102.199C223.425 101.436 224.05 100.523 224.477 99.5135C224.904 98.5042 225.124 97.4195 225.124 96.3236C225.124 95.2278 224.904 94.1431 224.477 93.1338C224.05 92.1246 223.425 91.2114 222.638 90.4484C222.499 90.3135 222.366 90.1724 222.24 90.0256C221.644 89.3344 220.906 88.7799 220.077 88.3997C219.248 88.0195 218.346 87.8228 217.434 87.8228C216.521 87.8228 215.62 88.0195 214.79 88.3997C213.961 88.7799 213.223 89.3344 212.628 90.0256C212.523 90.1474 212.414 90.2653 212.3 90.3789L209.597 93.0817L209.588 93.0905L209.588 93.0905C209.524 93.1562 209.147 93.54 208.74 93.8652C208.344 94.1822 206.806 95.391 204.46 95.391C202.115 95.391 200.576 94.1822 200.18 93.8652C199.773 93.5399 199.396 93.1559 199.332 93.0905L199.324 93.0817L196.621 90.3789C196.507 90.2653 196.398 90.1474 196.293 90.0256C195.697 89.3344 194.96 88.7799 194.13 88.3997C193.301 88.0195 192.399 87.8228 191.487 87.8228C190.575 87.8228 189.673 88.0195 188.844 88.3997C188.023 88.776 187.292 89.3231 186.699 90.0044ZM151.5 103.084C151.5 73.8342 175.212 50.1226 204.461 50.1226C233.711 50.1226 257.423 73.8342 257.423 103.084C257.423 132.334 233.711 156.045 204.461 156.045C175.212 156.045 151.5 132.334 151.5 103.084Z" fill="url(#paint0_linear_477_4572)"/>
</g>
<defs>
<linearGradient id="paint0_linear_477_4572" x1="316.676" y1="-33.1166" x2="147.171" y2="124.755" gradientUnits="userSpaceOnUse">
<stop offset="0.0466922" stop-color="white" stop-opacity="0.3"/>
<stop offset="1" stop-color="white" stop-opacity="0"/>
</linearGradient>
<clipPath id="clip0_477_4572">
<rect width="240" height="140" rx="13" fill="white"/>
</clipPath>
</defs>
</svg>

Before

Width:  |  Height:  |  Size: 3.7 KiB

@ -1,14 +0,0 @@
<svg width="240" height="140" viewBox="0 0 240 140" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_477_4615)">
<path d="M251.604 53.7271L213.804 12.9571C212.04 11.0696 209.52 10 207 10C204.48 10 201.96 11.0696 200.196 12.8942L162.459 53.6012C150.552 65.4925 144 81.2846 144 98.0833C144 114.882 150.552 130.674 162.459 142.565C174.366 154.457 190.179 161 207 161C223.821 161 239.634 154.457 251.541 142.565C263.448 130.674 270 114.882 270 98.0833C270 81.2846 263.448 65.4925 251.604 53.7271ZM242.595 133.694C233.082 143.195 220.419 148.48 207 148.48C193.581 148.48 180.918 143.257 171.342 133.694C161.829 124.194 156.6 111.547 156.6 98.1462C156.6 84.745 161.829 72.0987 171.468 62.4725L207 24.0304L242.595 62.5354C252.108 72.0358 257.4 84.6821 257.4 98.0833C257.4 111.485 252.171 124.131 242.595 133.631V133.694ZM206.244 123.313C199.503 123.313 193.203 120.67 188.415 115.952C183.627 111.17 181.044 104.878 181.044 98.1462C181.044 94.6858 178.209 91.8546 174.744 91.8546C171.279 91.8546 168.444 94.6858 168.444 98.1462C168.444 108.213 172.35 117.713 179.532 124.823C186.651 131.932 196.164 135.896 206.244 135.896C209.709 135.896 212.544 133.065 212.544 129.605C212.544 126.144 209.709 123.313 206.244 123.313Z" fill="url(#paint0_linear_477_4615)"/>
</g>
<defs>
<linearGradient id="paint0_linear_477_4615" x1="314.177" y1="-37.8106" x2="86.0966" y2="119.011" gradientUnits="userSpaceOnUse">
<stop offset="0.0466922" stop-color="white" stop-opacity="0.3"/>
<stop offset="1" stop-color="white" stop-opacity="0"/>
</linearGradient>
<clipPath id="clip0_477_4615">
<rect width="240" height="140" rx="13" fill="white"/>
</clipPath>
</defs>
</svg>

Before

Width:  |  Height:  |  Size: 1.6 KiB

@ -1,19 +0,0 @@
<svg width="240" height="140" viewBox="0 0 240 140" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_477_4604)">
<path fill-rule="evenodd" clip-rule="evenodd" d="M150.714 22.4224C156.72 19.8347 163.191 18.5 169.73 18.5C176.27 18.5 182.74 19.8347 188.746 22.4224C194.752 25.01 200.166 28.7962 204.658 33.5492L204.697 33.5907L209.894 39.1881L215.092 33.5907C215.105 33.5762 215.119 33.5617 215.133 33.5473C215.144 33.5359 215.154 33.5245 215.165 33.5131C219.72 28.7666 225.188 24.9898 231.239 22.4099C237.291 19.8299 243.801 18.5 250.38 18.5C256.959 18.5 263.469 19.8299 269.521 22.4099C275.556 24.983 281.011 28.7465 285.558 33.4753C295.002 43.0247 300.36 55.8747 300.497 69.3058C300.635 82.7542 295.526 95.7268 286.257 105.471C286.22 105.51 286.182 105.549 286.144 105.587L275.898 115.833L216.813 176.845C216.484 177.185 216.118 177.488 215.723 177.749C214.184 178.764 212.381 179.305 210.537 179.305C208.693 179.305 206.89 178.764 205.351 177.749C204.956 177.488 204.59 177.185 204.261 176.845L145.176 115.833L134.93 105.587C134.887 105.544 134.845 105.501 134.803 105.456C125.618 95.7386 120.5 82.874 120.5 69.5025C120.5 56.1311 125.617 43.2668 134.802 33.5492M169.73 31.5C164.96 31.5 160.239 32.4736 155.858 34.3613C151.477 36.249 147.527 39.011 144.251 42.4782C144.251 42.4783 144.251 42.478 144.251 42.4782C137.347 49.7822 133.5 59.452 133.5 69.5025C133.5 79.5236 137.324 89.1658 144.19 96.4622L154.405 106.677C154.429 106.702 154.454 106.726 154.478 106.751L210.537 164.639L266.596 106.751C266.62 106.726 266.645 106.702 266.669 106.677L276.892 96.4548C283.797 89.1667 287.6 79.4797 287.498 69.4385C287.395 59.3713 283.374 49.7402 276.288 42.5888C276.273 42.5736 276.258 42.5583 276.243 42.543C276.233 42.5334 276.224 42.5238 276.215 42.5142C272.873 39.032 268.862 36.2612 264.422 34.3685C259.983 32.4757 255.206 31.5 250.38 31.5C245.554 31.5 240.777 32.4757 236.338 34.3685C231.914 36.2546 227.915 39.0125 224.58 42.4775L216.264 51.4334C215.911 51.8137 215.514 52.1504 215.08 52.4362C213.541 53.4515 211.738 53.9927 209.894 53.9927C208.051 53.9927 206.248 53.4515 204.709 52.4362C204.275 52.1504 203.878 51.8137 203.525 51.4334L195.191 42.4582C191.918 39.0003 187.975 36.2454 183.602 34.3613C179.221 32.4736 174.501 31.5 169.73 31.5ZM150.714 22.4224C144.709 25.01 139.294 28.7965 134.802 33.5492Z" fill="url(#paint0_linear_477_4604)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M222.395 63.6797C224.796 63.4297 227.137 64.5308 228.476 66.5392L239.399 82.9236H255.199C258.789 82.9236 261.699 85.8338 261.699 89.4236C261.699 93.0135 258.789 95.9236 255.199 95.9236H235.92C233.747 95.9236 231.718 94.8375 230.512 93.0292L224.514 84.0317L216.25 104.69C215.3 107.067 213.043 108.664 210.485 108.771C207.928 108.877 205.546 107.472 204.402 105.183L195.582 87.5441L189.106 94.0198C187.887 95.2388 186.234 95.9236 184.51 95.9236H165.231C161.641 95.9236 158.731 93.0135 158.731 89.4236C158.731 85.8338 161.641 82.9236 165.231 82.9236H181.818L192.767 71.9749C194.244 70.4974 196.342 69.8203 198.404 70.155C200.466 70.4897 202.242 71.7954 203.176 73.6642L209.556 86.4229L217.033 67.7307C217.929 65.4895 219.994 63.9297 222.395 63.6797Z" fill="url(#paint1_linear_477_4604)"/>
</g>
<defs>
<linearGradient id="paint0_linear_477_4604" x1="363.61" y1="-32.4152" x2="188.919" y2="179.557" gradientUnits="userSpaceOnUse">
<stop offset="0.0466922" stop-color="white" stop-opacity="0.3"/>
<stop offset="1" stop-color="white" stop-opacity="0"/>
</linearGradient>
<linearGradient id="paint1_linear_477_4604" x1="363.61" y1="-32.4152" x2="188.919" y2="179.557" gradientUnits="userSpaceOnUse">
<stop offset="0.0466922" stop-color="white" stop-opacity="0.3"/>
<stop offset="1" stop-color="white" stop-opacity="0"/>
</linearGradient>
<clipPath id="clip0_477_4604">
<rect width="240" height="140" rx="13" fill="white"/>
</clipPath>
</defs>
</svg>

Before

Width:  |  Height:  |  Size: 3.8 KiB

@ -1,14 +0,0 @@
<svg width="240" height="140" viewBox="0 0 240 140" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_477_4540)">
<path fill-rule="evenodd" clip-rule="evenodd" d="M191 70C203.426 70 213.5 59.9264 213.5 47.5C213.5 35.0736 203.426 25 191 25C178.574 25 168.5 35.0736 168.5 47.5C168.5 59.9264 178.574 70 191 70ZM191 83C206.099 83 218.997 73.5733 224.128 60.2842C224.897 60.4259 225.69 60.5 226.5 60.5H249V152.833H133V60.5H155.5C156.31 60.5 157.103 60.4259 157.872 60.2842C163.003 73.5733 175.901 83 191 83ZM191 12C171.394 12 155.5 27.8939 155.5 47.5H131.833C128.698 47.5094 125.693 48.7591 123.476 50.9762C121.259 53.1934 120.009 56.1978 120 59.3333V154C120.009 157.136 121.259 160.14 123.476 162.357C125.693 164.574 128.698 165.824 131.833 165.833H250.167C253.302 165.824 256.307 164.574 258.524 162.357C260.741 160.14 261.991 157.136 262 154V59.3333C261.991 56.1978 260.741 53.1934 258.524 50.9762C256.307 48.7591 253.302 47.5094 250.167 47.5H226.5C226.5 27.8939 210.606 12 191 12ZM203.425 35.0752C199.465 36.6409 195.605 38.442 191.864 40.4683C191.575 40.6248 191.287 40.7826 191 40.9417C190.219 41.3742 189.443 41.8165 188.673 42.2686C188.065 42.6258 187.46 42.9891 186.858 43.3585C186.789 43.4243 186.722 43.4917 186.656 43.5607C186.189 44.052 185.813 44.6229 185.545 45.2472C185.488 45.3806 185.436 45.516 185.39 45.653C185.187 46.2468 185.083 46.8708 185.083 47.5002C185.083 48.2748 185.24 49.0413 185.545 49.7532C185.851 50.4651 186.297 51.1077 186.858 51.6419C187.392 52.2028 188.035 52.6493 188.747 52.9544C189.459 53.2595 190.225 53.4169 191 53.4169C191.629 53.4169 192.253 53.313 192.847 53.1103C192.984 53.0636 193.119 53.0116 193.253 52.9544C193.877 52.6869 194.448 52.3106 194.939 51.8438C195.008 51.7782 195.076 51.7109 195.141 51.6419C195.511 51.0404 195.874 50.4353 196.231 49.8268C196.683 49.0568 197.126 48.2811 197.558 47.5002C197.717 47.2128 197.875 46.9247 198.032 46.6359C200.058 42.8951 201.859 39.0347 203.425 35.0752Z" fill="url(#paint0_linear_477_4540)"/>
</g>
<defs>
<linearGradient id="paint0_linear_477_4540" x1="311.787" y1="-36.7077" x2="141.534" y2="133.653" gradientUnits="userSpaceOnUse">
<stop offset="0.0466922" stop-color="white" stop-opacity="0.3"/>
<stop offset="1" stop-color="white" stop-opacity="0"/>
</linearGradient>
<clipPath id="clip0_477_4540">
<rect width="240" height="140" rx="13" fill="white"/>
</clipPath>
</defs>
</svg>

Before

Width:  |  Height:  |  Size: 2.3 KiB

@ -1,5 +0,0 @@
<svg width="43" height="43" viewBox="0 0 43 43" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M41 14H29V2H14V14H2V29H14V41H29V29H41V14Z" stroke="#56C596" stroke-width="3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M21.5 9.5V33.5" stroke="#56C596" stroke-width="3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M9.5 21.5H33.5" stroke="#56C596" stroke-width="3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
</svg>

Before

Width:  |  Height:  |  Size: 523 B

@ -1,5 +0,0 @@
<svg width="42" height="42" viewBox="0 0 42 42" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M31 33C31.8284 33 32.5 33.7899 32.5 34.5C32.5 35.2101 31.8284 36 31 36C30.1716 36 29.5 35.2101 29.5 34.5C29.5 33.7899 30.1716 33 31 33Z" fill="#205072"/>
<path d="M29.5 30.5V27.5C29.5 26.6716 30.1716 26 31 26C31.8284 26 32.5 26.6716 32.5 27.5V30.5C32.5 31.3284 31.8284 32 31 32C30.1716 32 29.5 31.3284 29.5 30.5Z" fill="#205072"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M30.0262 0.512695C27.255 0.512695 24.593 1.59315 22.6058 3.52452L22.5905 3.53957L3.54049 22.5906L3.5255 22.6058C1.59413 24.593 0.513672 27.255 0.513672 30.0262C0.513672 32.7949 1.59222 35.4547 3.5204 37.4414C3.53194 37.4534 3.54373 37.4652 3.55575 37.4769C5.54302 39.4082 8.205 40.4887 10.9762 40.4887C13.7474 40.4887 16.4093 39.4082 18.3966 37.4769L18.4118 37.4619L21.1714 34.7023C22.6684 38.6745 26.5042 41.5 31 41.5C36.799 41.5 41.5 36.799 41.5 31C41.5 26.5039 38.6741 22.6679 34.7016 21.1711L37.4618 18.4109L37.4769 18.3956C39.4082 16.4084 40.4887 13.7464 40.4887 10.9752C40.4887 8.20402 39.4082 5.54204 37.4769 3.55477C37.4669 3.54455 37.4568 3.53446 37.4466 3.52452C35.4593 1.59315 32.7974 0.512695 30.0262 0.512695ZM31.1293 20.5008L35.3327 16.2974C36.7153 14.8709 37.4887 12.9621 37.4887 10.9752C37.4887 8.99199 36.7182 7.08665 35.3404 5.661C33.9147 4.28316 32.0094 3.5127 30.0262 3.5127C28.0392 3.5127 26.1305 4.28606 24.7039 5.66877L16.2472 14.1259L24.7117 22.5904C26.4646 21.2776 28.6415 20.5 31 20.5C31.0432 20.5 31.0862 20.5003 31.1293 20.5008ZM5.66976 24.7039L14.126 16.2473L22.5904 24.7117C21.2776 26.4646 20.5 28.6415 20.5 31C20.5 31.0435 20.5003 31.0869 20.5008 31.1303L16.2984 35.3327C14.8718 36.7154 12.9631 37.4887 10.9762 37.4887C8.99297 37.4887 7.08763 36.7182 5.66198 35.3404C4.28414 33.9148 3.51367 32.0094 3.51367 30.0262C3.51367 28.0393 4.28704 26.1305 5.66976 24.7039ZM23.5 31C23.5 26.8579 26.8579 23.5 31 23.5C35.1421 23.5 38.5 26.8579 38.5 31C38.5 35.1421 35.1421 38.5 31 38.5C26.8579 38.5 23.5 35.1421 23.5 31Z" fill="#205072"/>
</svg>

Before

Width:  |  Height:  |  Size: 2.0 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 28 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 28 KiB

@ -2,7 +2,7 @@
<html lang="en">
<head>
<meta charset="utf-8">
<title>Health Vault</title>
<title>Movie App</title>
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1">
@ -10,7 +10,7 @@
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Titillium+Web:300,400,600,700" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;600;700" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@300;400;600;700" rel="stylesheet">
</head>
<body class="ig-typography ig-scrollbar">
<app-root></app-root>

@ -5,17 +5,16 @@
@use "igniteui-angular/theming" as *;
@include core();
@include typography($font-family: "Montserrat");
@include typography($font-family: "Nunito Sans");
$custom-palette: palette(
$primary: #56C596,
$secondary: #205072,
$surface: #fff,
$error: #CC333F,
$success: #97c556,
$warn: #eb8541,
$info: #329D9C);
@include theme($palette: $custom-palette, $elevation: false);
$primary: #F03F20,
$secondary: #38143B,
$surface: #18091A,
$error: #B81C4C,
$success: #439C47,
$info: #3F51B5);
@include theme($palette: $custom-palette, $schema: $dark-material-schema, $elevation: false, $roundness: 0);
body {
background: hsla(var(--ig-surface-500));

Loading…
Cancel
Save