Stable navbar
This commit is contained in:
parent
a7a9d06bc6
commit
24b72dac63
BIN
assets/images/blanco-lorenzo-logo-gray-transparent.png
Normal file
BIN
assets/images/blanco-lorenzo-logo-gray-transparent.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 38 KiB |
BIN
assets/images/blanco-lorenzo-logo-white-transparent.png
Normal file
BIN
assets/images/blanco-lorenzo-logo-white-transparent.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 80 KiB |
15
css/body.css
15
css/body.css
@ -8,10 +8,21 @@ body {
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: stretch;
|
||||
padding-left: 5vw;
|
||||
padding-right: 5vw;
|
||||
padding-left: clamp(35px, 10%, 10vw);
|
||||
padding-right: clamp(35px, 5%, 10vw);
|
||||
padding-top: clamp(85px, 10vw, 160px)
|
||||
}
|
||||
@media only screen and (min-width: 1000px) {
|
||||
.page-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: stretch;
|
||||
padding-left: clamp(35px, 25%, 10vw);
|
||||
padding-right: clamp(35px, 25%, 10vw);
|
||||
padding-top: clamp(85px, 10vw, 160px)
|
||||
}
|
||||
}
|
||||
/*
|
||||
@media only screen and (min-width: 750px) {
|
||||
.page-container {
|
||||
|
@ -20,7 +20,8 @@
|
||||
justify-content: flex-start;
|
||||
align-items: stretch;
|
||||
flex-grow: 1;
|
||||
padding: 15px;
|
||||
padding: 10px;
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
.navbar-hamburger {
|
||||
@ -117,6 +118,9 @@
|
||||
padding-bottom: 10px;
|
||||
font-family: Poppins;
|
||||
}
|
||||
.navbar-item-selected {
|
||||
cursor: default;
|
||||
}
|
||||
.navbar-item:hover {
|
||||
background-color: #ffffff14;
|
||||
scale: 1.15;
|
||||
@ -127,10 +131,10 @@
|
||||
|
||||
.navbar-brand-container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: start;
|
||||
height: 50px;
|
||||
max-width: 350px;
|
||||
}
|
||||
|
||||
@ -139,10 +143,9 @@
|
||||
}
|
||||
|
||||
.navbar-image {
|
||||
width: 60px;
|
||||
height: 50px;
|
||||
width: 26.6px;
|
||||
height: 40px;
|
||||
object-fit: cover;
|
||||
margin-top: -10px;
|
||||
}
|
||||
|
||||
/* Desktop view */
|
||||
@ -160,7 +163,7 @@
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding-left: 7vw;
|
||||
padding-left: 10vw;
|
||||
}
|
||||
|
||||
.navbar {
|
||||
@ -187,6 +190,12 @@
|
||||
margin-top: 0px;
|
||||
}
|
||||
|
||||
.navbar-image {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.navbar-item {
|
||||
color: #6B6B6B;
|
||||
font-size: 12pt;
|
||||
|
@ -237,12 +237,11 @@
|
||||
font-size: clamp(12px, 1.4vw, 21px);
|
||||
}
|
||||
.start-section-right-column-subject-1-photo {
|
||||
width: clamp(250px, 27vw, 290px);
|
||||
width: clamp(220px, 27vw, 290px);
|
||||
}
|
||||
.start-section-right-column-subject-2-photo {
|
||||
width: clamp(240px, 25vw, 275px);
|
||||
width: clamp(220px, 23vw, 275px);
|
||||
margin-right: 20px;
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
.start-section-right-column-subject-2-title {
|
||||
font-size: clamp(12px, 1.4vw, 21px);
|
||||
|
@ -951,7 +951,7 @@ function initSync(module) {
|
||||
|
||||
async function init(input) {
|
||||
if (typeof input === 'undefined') {
|
||||
input = new URL('bl-frontend-8ea2c9cc7a3c1e00_bg.wasm', import.meta.url);
|
||||
input = new URL('bl-frontend-3471ad16c4b84cf4_bg.wasm', import.meta.url);
|
||||
}
|
||||
const imports = getImports();
|
||||
|
Binary file not shown.
@ -8,10 +8,21 @@ body {
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: stretch;
|
||||
padding-left: 5vw;
|
||||
padding-right: 5vw;
|
||||
padding-left: clamp(35px, 10%, 10vw);
|
||||
padding-right: clamp(35px, 5%, 10vw);
|
||||
padding-top: clamp(85px, 10vw, 160px)
|
||||
}
|
||||
@media only screen and (min-width: 1000px) {
|
||||
.page-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: stretch;
|
||||
padding-left: clamp(35px, 25%, 10vw);
|
||||
padding-right: clamp(35px, 25%, 10vw);
|
||||
padding-top: clamp(85px, 10vw, 160px)
|
||||
}
|
||||
}
|
||||
/*
|
||||
@media only screen and (min-width: 750px) {
|
||||
.page-container {
|
BIN
dist/images/blanco-lorenzo-logo-gray-transparent.png
vendored
Normal file
BIN
dist/images/blanco-lorenzo-logo-gray-transparent.png
vendored
Normal file
Binary file not shown.
After Width: | Height: | Size: 38 KiB |
BIN
dist/images/blanco-lorenzo-logo-white-transparent.png
vendored
Normal file
BIN
dist/images/blanco-lorenzo-logo-white-transparent.png
vendored
Normal file
Binary file not shown.
After Width: | Height: | Size: 80 KiB |
12
dist/index.html
vendored
12
dist/index.html
vendored
@ -2,10 +2,10 @@
|
||||
<meta charset="utf-8">
|
||||
<title>Blanco Lorenzo</title>
|
||||
|
||||
<link rel="stylesheet" href="/body-543b917958789c41.css">
|
||||
<link rel="stylesheet" href="/navbar-b9323c6a829e08b2.css">
|
||||
<link rel="stylesheet" href="/body-e8d660df182d57de.css">
|
||||
<link rel="stylesheet" href="/navbar-561b968ed8df59d4.css">
|
||||
<link rel="stylesheet" href="/footer-c920ca43256fdcb9.css">
|
||||
<link rel="stylesheet" href="/start-e5bb49a25da0d3bc.css">
|
||||
<link rel="stylesheet" href="/start-bd1c7d143fbbfa68.css">
|
||||
<link rel="stylesheet" href="/services-e3fac511f8ec30fa.css">
|
||||
<link rel="stylesheet" href="/call_to_action-c920ca43256fdcb9.css">
|
||||
<link rel="stylesheet" href="/service_card-1dcd0bfd8e0f3c95.css">
|
||||
@ -16,9 +16,9 @@
|
||||
<base href="/">
|
||||
|
||||
|
||||
<link rel="preload" href="/bl-frontend-8ea2c9cc7a3c1e00_bg.wasm" as="fetch" type="application/wasm" crossorigin="">
|
||||
<link rel="modulepreload" href="/bl-frontend-8ea2c9cc7a3c1e00.js"></head>
|
||||
<body><script type="module">import init from '/bl-frontend-8ea2c9cc7a3c1e00.js';init('/bl-frontend-8ea2c9cc7a3c1e00_bg.wasm');</script><script>(function () {
|
||||
<link rel="preload" href="/bl-frontend-3471ad16c4b84cf4_bg.wasm" as="fetch" type="application/wasm" crossorigin="">
|
||||
<link rel="modulepreload" href="/bl-frontend-3471ad16c4b84cf4.js"></head>
|
||||
<body><script type="module">import init from '/bl-frontend-3471ad16c4b84cf4.js';init('/bl-frontend-3471ad16c4b84cf4_bg.wasm');</script><script>(function () {
|
||||
var protocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:';
|
||||
var url = protocol + '//' + window.location.host + '/_trunk/ws';
|
||||
var poll_interval = 5000;
|
||||
|
@ -20,7 +20,8 @@
|
||||
justify-content: flex-start;
|
||||
align-items: stretch;
|
||||
flex-grow: 1;
|
||||
padding: 15px;
|
||||
padding: 10px;
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
.navbar-hamburger {
|
||||
@ -117,6 +118,9 @@
|
||||
padding-bottom: 10px;
|
||||
font-family: Poppins;
|
||||
}
|
||||
.navbar-item-selected {
|
||||
cursor: default;
|
||||
}
|
||||
.navbar-item:hover {
|
||||
background-color: #ffffff14;
|
||||
scale: 1.15;
|
||||
@ -127,10 +131,10 @@
|
||||
|
||||
.navbar-brand-container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: start;
|
||||
height: 50px;
|
||||
max-width: 350px;
|
||||
}
|
||||
|
||||
@ -139,10 +143,9 @@
|
||||
}
|
||||
|
||||
.navbar-image {
|
||||
width: 60px;
|
||||
height: 50px;
|
||||
width: 26.6px;
|
||||
height: 40px;
|
||||
object-fit: cover;
|
||||
margin-top: -10px;
|
||||
}
|
||||
|
||||
/* Desktop view */
|
||||
@ -160,7 +163,7 @@
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding-left: 7vw;
|
||||
padding-left: 10vw;
|
||||
}
|
||||
|
||||
.navbar {
|
||||
@ -187,6 +190,12 @@
|
||||
margin-top: 0px;
|
||||
}
|
||||
|
||||
.navbar-image {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.navbar-item {
|
||||
color: #6B6B6B;
|
||||
font-size: 12pt;
|
@ -237,12 +237,11 @@
|
||||
font-size: clamp(12px, 1.4vw, 21px);
|
||||
}
|
||||
.start-section-right-column-subject-1-photo {
|
||||
width: clamp(250px, 27vw, 290px);
|
||||
width: clamp(220px, 27vw, 290px);
|
||||
}
|
||||
.start-section-right-column-subject-2-photo {
|
||||
width: clamp(240px, 25vw, 275px);
|
||||
width: clamp(220px, 23vw, 275px);
|
||||
margin-right: 20px;
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
.start-section-right-column-subject-2-title {
|
||||
font-size: clamp(12px, 1.4vw, 21px);
|
@ -41,7 +41,7 @@ pub fn navigation_bar() -> Html {
|
||||
<div class={"navbar-background"}>
|
||||
<div class={"navbar-container"}>
|
||||
<div class={"navbar-brand-container"} onclick={move |_| cloned_navigator_6.push(&Route::MainPage)}>
|
||||
<img class={"navbar-image"} src={ if (*window_device_handle) == WindowDevice::Mobile {"images/logo-white.png"} else {"images/logo-color.png"}} alt=""/>
|
||||
<img class={"navbar-image"} src={ if (*window_device_handle) == WindowDevice::Mobile {"images/blanco-lorenzo-logo-white-transparent.png"} else {"images/blanco-lorenzo-logo-gray-transparent.png"}} alt=""/>
|
||||
</div>
|
||||
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user