Fixed anchorpoint, tiny-ing and centering of navbar

This commit is contained in:
Peter 2025-04-05 00:55:37 +02:00
parent ca96b36246
commit ba258fbf30
3 changed files with 8 additions and 9 deletions

View File

@ -32,7 +32,7 @@ header .container {
#nav.active { #nav.active {
height: 80px; height: 80px;
background-color: var(--color-primary); background-color: var(--color-primary);
box-shadow: 0px 2px 3px -1px rgba(30,30,30,0.1); box-shadow: 0 2px 3px -1px rgba(30,30,30,0.1);
} }
.nav_link.active { .nav_link.active {
@ -127,11 +127,11 @@ nav img {
} }
#menu_toggle span:first-child { #menu_toggle span:first-child {
transform-origin: 0% 0%; transform-origin: 0 0;
} }
#menu_toggle span:nth-last-child(2) { #menu_toggle span:nth-last-child(2) {
transform-origin: 0% 100%; transform-origin: 0 100%;
} }
#menu_toggle input:checked ~ span { #menu_toggle input:checked ~ span {
@ -162,7 +162,7 @@ nav img {
background: #cdcdcd; background: #cdcdcd;
border-radius: 3px; border-radius: 3px;
z-index: 1; z-index: 1;
transform-origin: 4px 0px; transform-origin: 4px 0;
transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0), background 0.5s cubic-bezier(0.77,0.2,0.05,1.0), opacity 0.55s ease; transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0), background 0.5s cubic-bezier(0.77,0.2,0.05,1.0), opacity 0.55s ease;
} }
@ -176,7 +176,7 @@ nav img {
padding: 125px 50px 50px; padding: 125px 50px 50px;
background: var(--color-primary); background: var(--color-primary);
list-style-type: none; list-style-type: none;
transform-origin: 0% 0%; transform-origin: 0 0;
transform: translate(-100%, 0); transform: translate(-100%, 0);
transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0); transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
} }
@ -250,7 +250,7 @@ nav img {
transition-delay: 0.1s; transition-delay: 0.1s;
font-size: 0.9em; font-size: 0.9em;
min-width: 160px; min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
z-index: 1; z-index: 1;
text-align: left; text-align: left;
width: 200px; width: 200px;
@ -367,7 +367,7 @@ nav img {
@supports (-ms-ime-align:auto) { @supports (-ms-ime-align:auto) {
.dropdown2{ .dropdown2{
top: 0px; top: 0;
} }
} }

View File

@ -7,7 +7,6 @@
} }
.switch-div{ .switch-div{
position: absolute;
right: 40px; right: 40px;
} }

View File

@ -30,7 +30,7 @@
} }
</style> </style>
</head> </head>
<body onload="start()"> <body>
<app-root></app-root> <app-root></app-root>
</body> </body>
</html> </html>