Organized css
This commit is contained in:
		
							
								
								
									
										132
									
								
								src/styles.scss
									
									
									
									
									
								
							
							
						
						
									
										132
									
								
								src/styles.scss
									
									
									
									
									
								
							@@ -19,7 +19,6 @@
 | 
				
			|||||||
    background-color: #555;
 | 
					    background-color: #555;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					 | 
				
			||||||
html, body {
 | 
					html, body {
 | 
				
			||||||
    padding: 0;
 | 
					    padding: 0;
 | 
				
			||||||
    margin: 0;
 | 
					    margin: 0;
 | 
				
			||||||
@@ -30,12 +29,12 @@ html, body {
 | 
				
			|||||||
    background-color: #2F323A;
 | 
					    background-color: #2F323A;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.mobile-height{
 | 
					.bg-primary {
 | 
				
			||||||
    height: calc(100vh - 56px);
 | 
					    background-color: #f8f8f8 !important;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.desktop-height{
 | 
					.bg-secondary {
 | 
				
			||||||
    height: calc(100vh - 64px);
 | 
					    background-color: #2F323A !important;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.center {
 | 
					.center {
 | 
				
			||||||
@@ -45,67 +44,25 @@ html, body {
 | 
				
			|||||||
    transform: translate(-50%, -50%);
 | 
					    transform: translate(-50%, -50%);
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.off-center {
 | 
					.curs-pointer {
 | 
				
			||||||
    position: fixed;
 | 
					    cursor: pointer;
 | 
				
			||||||
    left: calc(50% - 75px);
 | 
					 | 
				
			||||||
    top: 75%;
 | 
					 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.mat-list-item {
 | 
					.desktop-height{
 | 
				
			||||||
    height: auto !important;
 | 
					    height: calc(100vh - 64px);
 | 
				
			||||||
    color: #9CA4B6 !important;
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
    &.active {
 | 
					 | 
				
			||||||
        background-color: #262930 !important;
 | 
					 | 
				
			||||||
        color: #1CA8DD !important;
 | 
					 | 
				
			||||||
    }
 | 
					 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.text-muted {
 | 
					.hover:hover {
 | 
				
			||||||
    color: #7f7f7f !important;
 | 
					    cursor: pointer;
 | 
				
			||||||
 | 
					    background-color: #dddddd !important;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.mat-divider {
 | 
					.flex-basis-0 {
 | 
				
			||||||
    color: #9CA4B6 !important;
 | 
					    flex-basis: 0;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.bg-primary {
 | 
					.flex-basis-auto {
 | 
				
			||||||
    background-color: #f8f8f8 !important;
 | 
					    flex-basis: auto;
 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
.bg-secondary {
 | 
					 | 
				
			||||||
    background-color: #2F323A !important;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
.scale-150 {
 | 
					 | 
				
			||||||
    transform: scale(1.5);
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
.scale-200 {
 | 
					 | 
				
			||||||
    transform: scale(2);
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
.scale-300 {
 | 
					 | 
				
			||||||
    transform: scale(3);
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
.scale-500 {
 | 
					 | 
				
			||||||
    transform: scale(5);
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
.material-icons {
 | 
					 | 
				
			||||||
    display: inline-flex;
 | 
					 | 
				
			||||||
    align-items: center;
 | 
					 | 
				
			||||||
    justify-content: center;
 | 
					 | 
				
			||||||
    vertical-align: middle;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
.mat-stroked-button:not([disabled]) {
 | 
					 | 
				
			||||||
    border-color: #ffffff !important;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
.mat-form-field label {
 | 
					 | 
				
			||||||
    color: #ffffff !important;
 | 
					 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.flex-grow-0 {
 | 
					.flex-grow-0 {
 | 
				
			||||||
@@ -132,10 +89,61 @@ html, body {
 | 
				
			|||||||
    flex-shrink: 1;
 | 
					    flex-shrink: 1;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.flex-basis-0 {
 | 
					.mat-divider {
 | 
				
			||||||
    flex-basis: 0;
 | 
					    color: #9CA4B6 !important;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.flex-basis-auto {
 | 
					.mat-form-field label {
 | 
				
			||||||
    flex-basis: auto;
 | 
					    color: #ffffff !important;
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					.mat-list-item {
 | 
				
			||||||
 | 
					    height: auto !important;
 | 
				
			||||||
 | 
					    color: #9CA4B6 !important;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					    &.active {
 | 
				
			||||||
 | 
					        background-color: #262930 !important;
 | 
				
			||||||
 | 
					        color: #1CA8DD !important;
 | 
				
			||||||
 | 
					    }
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					.mat-stroked-button:not([disabled]) {
 | 
				
			||||||
 | 
					    border-color: #ffffff !important;
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					.material-icons {
 | 
				
			||||||
 | 
					    display: inline-flex;
 | 
				
			||||||
 | 
					    align-items: center;
 | 
				
			||||||
 | 
					    justify-content: center;
 | 
				
			||||||
 | 
					    vertical-align: middle;
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					.mobile-height{
 | 
				
			||||||
 | 
					    height: calc(100vh - 56px);
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					.off-center {
 | 
				
			||||||
 | 
					    position: fixed;
 | 
				
			||||||
 | 
					    left: calc(50% - 75px);
 | 
				
			||||||
 | 
					    top: 75%;
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					.scale-150 {
 | 
				
			||||||
 | 
					    transform: scale(1.5);
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					.scale-200 {
 | 
				
			||||||
 | 
					    transform: scale(2);
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					.scale-300 {
 | 
				
			||||||
 | 
					    transform: scale(3);
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					.scale-500 {
 | 
				
			||||||
 | 
					    transform: scale(5);
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					.text-muted {
 | 
				
			||||||
 | 
					    color: #7f7f7f !important;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 
 | 
				
			|||||||
		Reference in New Issue
	
	Block a user