Updated styles
All checks were successful
Build Website / Build NPM Project (push) Successful in 1m43s
Build Website / Tag Version (push) Successful in 11s
Build Website / Build & Push Dockerfile (push) Successful in 2m49s

This commit is contained in:
2024-01-11 09:55:42 -05:00
parent fd6c97989c
commit c18f436e5d
21 changed files with 50 additions and 124 deletions

View File

@ -1,5 +1,6 @@
.banner-container {
position: relative;
overflow: hidden;
width: 100%;
height: 100%;
}

View File

@ -20,9 +20,9 @@
</div>
<h3 class="mt-4 mb-0">so we can invade your feed ⚔️</h3>
</div>
<div class="bg-dark text-center text=sm=start">
<div class="d-flex flex-column flex-sm-row flex-wrap justify-content-around container p-3">
<div *ngFor="let group of navigation">
<div class="bg-dark text-center text-sm-start">
<div class="d-flex flex-column flex-sm-row flex-wrap justify-content-center container p-3 pb-0">
<div *ngFor="let group of navigation" class="mx-5">
<h2 class="sitemap-header">{{group.label}}</h2>
<ul>
<ng-container *ngFor="let section of group.children">
@ -32,7 +32,7 @@
</ng-container>
</ul>
</div>
<div>
<div class="mx-5">
<h2 class="sitemap-header">Contact</h2>
<ul>
<li class="font-weight-strong">Robert Sacco</li>

View File

@ -1,5 +1,6 @@
<div class="logo">
<div class="d-flex" aria-label="Legio XXX">
<div class="logo d-flex align-items-center">
<img src="assets/img/eagle.png" class="me-1" alt="SPQR" style="height: 2.5rem; width: auto;">
<div class="d-inline-flex" aria-label="Legio XXX" style="font-family: Serif; font-weight: lighter">
<div>L</div>
<div [@slide]="expand ? 'expand' : 'shrink'" style="overflow: hidden">EGIO · </div>
<div [@margin]="expand ? 'expand' : 'shrink'" [style.marginLeft]="expand ? '0.25rem' : 0">XXX</div>

View File

@ -1,26 +0,0 @@
//.logo {
// .expandable {
// width: 0;
// }
//
// &.expanded {
// .expandable {
// width: auto;
// }
// }
//
// .logo-segment {
// font-family: Arial, sans-serif !important;
// overflow: hidden;
// padding: 0.3em 0;
// width: auto;
// }
//
// .logo-dots {
// width: 30px;
// }
//
// .logo-footer {
// transform: translate(-15px, -8px);
// }
//}

View File

@ -1,16 +1,14 @@
<mat-toolbar class="d-print-none">
<mat-toolbar-row>
<div>
<a class="navbar-brand d-flex align-items-center" routerLink="/" fragment="banner" (click)="scroll('banner')" style="text-decoration: none">
<img src="assets/img/eagle.png" alt="SPQR" height="45px" width="45px">
<xxx-logo class="px-2" [expand]="true"></xxx-logo>
</a>
</div>
<!-- Brand -->
<a class="navbar-brand" routerLink="/" style="text-decoration: none">
<xxx-logo class="px-2" [expand]="true"></xxx-logo>
</a>
<!-- Spacer -->
<div class="flex-grow-1"></div>
<!-- Full NavBar -->
<div *ngIf="!hamburger">
<a *ngFor="let item of links.topLevel" [routerLink]="item.url" [fragment]="item.fragment"
(click)="item.fragment ? scroll(item.fragment) : null">
<a *ngFor="let item of links.topLevel" [routerLink]="item.url" [fragment]="item.fragment">
<button mat-button class="navbar-button" aria-label="Menu">{{item.label}}</button>
</a>
<ng-container *ngFor="let group of links.other">
@ -20,8 +18,7 @@
<mat-menu #menu="matMenu">
<ng-container *ngFor="let section of group.children; let first = first">
<mat-divider *ngIf="!first"></mat-divider>
<button *ngFor="let item of section" mat-menu-item [routerLink]="item.url" [fragment]="item.fragment"
(click)="item.fragment ? scroll(item.fragment) : null">
<button *ngFor="let item of section" mat-menu-item [routerLink]="item.url" [fragment]="item.fragment">
{{item.label}}
</button>
</ng-container>
@ -33,15 +30,15 @@
<mat-icon>menu</mat-icon>
</button>
<mat-menu #menu="matMenu">
<button mat-menu-item *ngFor="let item of links.topLevel" [routerLink]="item.url" [fragment]="item.fragment"
(click)="item.fragment ? scroll(item.fragment) : null">{{item.label}}</button>
<button mat-menu-item *ngFor="let item of links.topLevel" [routerLink]="item.url" [fragment]="item.fragment">
{{item.label}}
</button>
<ng-container *ngFor="let group of links.other">
<button mat-menu-item [matMenuTriggerFor]="menu">{{group.label}}</button>
<mat-menu #menu="matMenu">
<ng-container *ngFor="let section of group.children; let first = first">
<mat-divider *ngIf="!first"></mat-divider>
<button *ngFor="let item of section" mat-menu-item [routerLink]="item.url" [fragment]="item.fragment"
(click)="item.fragment ? scroll(item.fragment) : null">
<button *ngFor="let item of section" mat-menu-item [routerLink]="item.url" [fragment]="item.fragment">
{{item.label}}
</button>
</ng-container>
@ -50,8 +47,3 @@
</mat-menu>
</mat-toolbar-row>
</mat-toolbar>
<div class="navbar-spacing"><!-- Spacing --></div>
<ng-template #navGroup let-group>
</ng-template>

View File

@ -1,16 +1,7 @@
.navbar-spacing {
position: relative;
height: 64px;
width: 100%;
}
::ng-deep mat-toolbar {
background: #000 !important;
border-bottom: #fff solid 1px;
height: 64px;
position: fixed;
top: 0;
z-index: 100;
.mat-toolbar-row {
height: 100%;
@ -18,7 +9,6 @@
.navbar-brand {
color: #fff;
font-weight: lighter;
&:hover img { filter: brightness(5%) sepia(75) saturate(100) hue-rotate(25deg); }
&:hover, &:visited:hover { color: #b10000; }