more layout changes

main
Said Gedik 2024-05-13 17:46:41 +02:00
parent cd3ef057bb
commit f47b315128
2 changed files with 52 additions and 15 deletions

View File

@ -1,16 +1,45 @@
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
.head {
color:rgba(41, 46, 50, 0.679);
padding-left: 10px;
padding-right: 10px;
font-family: Arial, Helvetica, sans-serif;
display: flex;
justify-content: space-between;
align-items: center;
border-bottom: 1px solid rgba(0, 0, 0, 0.2);
height: 50px;
margin-bottom: 10px;
}
#topbar { #topbar {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: space-between; justify-content: space-between;
height: 57px; height: 57px;
margin-bottom: 20px; margin-bottom: 50px;
border: dashed green 1px;
} }
.restartButton { .restartButton {
width: 60px; width: 60px;
background-color: white;
border: none;
border: solid 1px rgba(94, 94, 94, 0.18);
color: #000000a7;
border-radius: 3px;
cursor: pointer;
}
.restartButton:hover {
color: #000000;
background-color: rgb(243, 243, 243);
} }
.example-radio-group { .example-radio-group {
@ -165,7 +194,7 @@
.mat-button-toggle-checked { .mat-button-toggle-checked {
background-color: #ef6c00; background-color: #ef6c00;
color: white;
} }
.dot-badge { .dot-badge {

View File

@ -1,5 +1,24 @@
<div class="head">
<h2>Change Calendar</h2>
<!-- User -->
<div style="display: flex; justify-content: center; align-items: center; font-size: 13px;">
<h3 *ngIf="userId"
style="font-family: Arial, Helvetica, sans-serif; display: flex; align-items: center; gap: 5px; color: rgba(0, 0, 0, 0.706);">
<mat-icon style="color: green;">verified_user</mat-icon>{{this.userId}}
</h3>
<h3 *ngIf="errorService.rsso"
style="font-family: Arial, Helvetica, sans-serif; display: flex; align-items: center; gap: 5px;"><mat-icon
style="color: red;">verified_user</mat-icon> RSSO Auth Failed</h3>
<h3 *ngIf="!errorService.rsso &&rssoInit"
style="font-family: Arial, Helvetica, sans-serif; display: flex; align-items: center; gap: 5px;"><mat-icon
style="color: orange;">verified_user</mat-icon> RSSO: initializing</h3>
</div>
</div>
<div *ngIf="!errorService.rsso && !rssoInit" id="topbar"> <div *ngIf="!errorService.rsso && !rssoInit" id="topbar">
<!-- Date Range Picker --> <!-- Date Range Picker -->
<div style="display: flex; gap: 10px;"> <div style="display: flex; gap: 10px;">
<div style="display: flex;"> <div style="display: flex;">
@ -64,18 +83,7 @@
</div> </div>
<!-- User -->
<div style="display: flex; justify-content: center; align-items: center; border: dashed blue 1px;">
<h3 *ngIf="userId" style="font-family: Arial, Helvetica, sans-serif; display: flex; align-items: center; gap: 5px;">
<mat-icon style="color: green;">verified_user</mat-icon>{{this.userId}}
</h3>
<h3 *ngIf="errorService.rsso"
style="font-family: Arial, Helvetica, sans-serif; display: flex; align-items: center; gap: 5px;"><mat-icon
style="color: red;">verified_user</mat-icon> RSSO Auth Failed</h3>
<h3 *ngIf="!errorService.rsso &&rssoInit"
style="font-family: Arial, Helvetica, sans-serif; display: flex; align-items: center; gap: 5px;"><mat-icon
style="color: orange;">verified_user</mat-icon> RSSO: initializing</h3>
</div>