Navbar now makes logo clickable
This commit is contained in:
parent
0f8b20782c
commit
72d67dc77c
|
@ -1,7 +1,4 @@
|
|||
|
||||
|
||||
/* Mobile View */
|
||||
|
||||
.navbar-background {
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
|
@ -13,6 +10,7 @@
|
|||
background-color: #252631;
|
||||
min-height: 74px;
|
||||
}
|
||||
|
||||
.navbar-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
@ -21,6 +19,7 @@
|
|||
flex-grow: 1;
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.navbar-hamburger {
|
||||
font-size: 20pt;
|
||||
color: white;
|
||||
|
@ -32,6 +31,7 @@
|
|||
min-width: 30px;
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.navbar-hamburger:hover {
|
||||
background-color: #ffffff14;
|
||||
font-size: 22pt;
|
||||
|
@ -40,6 +40,7 @@
|
|||
transition-duration: 0.3s;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.navbar-closed{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
@ -47,6 +48,7 @@
|
|||
margin-top: 10px;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.navbar-open {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
@ -62,6 +64,7 @@
|
|||
padding-bottom: 10px;
|
||||
font-family: Source Sans Pro;
|
||||
}
|
||||
|
||||
.navbar-item:hover {
|
||||
background-color: #ffffff14;
|
||||
font-size: 13pt;
|
||||
|
@ -71,12 +74,16 @@
|
|||
cursor: pointer;
|
||||
}
|
||||
|
||||
.navbar-brand-container{
|
||||
.navbar-brand-container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
max-width: 250px;
|
||||
}
|
||||
|
||||
.navbar-brand-container:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.navbar-title {
|
||||
|
@ -98,12 +105,14 @@
|
|||
justify-content: flex-start;
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
.navbar {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: flex-end;
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
.navbar-closed {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
@ -111,6 +120,7 @@
|
|||
flex-grow: 1;
|
||||
margin-top: 0px;
|
||||
}
|
||||
|
||||
.navbar-open {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
@ -118,6 +128,7 @@
|
|||
flex-grow: 1;
|
||||
margin-top: 0px;
|
||||
}
|
||||
|
||||
.navbar-item {
|
||||
color: white;
|
||||
font-size: 12pt;
|
||||
|
@ -127,6 +138,7 @@
|
|||
padding-bottom: 10px;
|
||||
font-family: Source Sans Pro;
|
||||
}
|
||||
|
||||
.navbar-item:hover {
|
||||
background-color: #ffffff14;
|
||||
font-size: 13pt;
|
||||
|
@ -135,11 +147,13 @@
|
|||
transition-duration: 0.3s;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.navbar-title {
|
||||
color: white;
|
||||
font-size: 23pt;
|
||||
font-family: Sacramento;
|
||||
}
|
||||
|
||||
.navbar-hamburger {
|
||||
display: none;
|
||||
}
|
||||
|
|
|
@ -1,5 +1,4 @@
|
|||
|
||||
|
||||
.property-search-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
|
|
@ -3,9 +3,9 @@
|
|||
<title>Yew App</title>
|
||||
|
||||
<link rel="stylesheet" href="/body-44d4d46a4658cacc.css">
|
||||
<link rel="stylesheet" href="/navbar-747deb585a2d3e8e.css">
|
||||
<link rel="stylesheet" href="/navbar-75e2d6f22c68a898.css">
|
||||
<link rel="stylesheet" href="/landing-c920ca43256fdcb9.css">
|
||||
<link rel="stylesheet" href="/search-daf569157201d199.css">
|
||||
<link rel="stylesheet" href="/search-9bc9884bfc93b0b5.css">
|
||||
<link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro" rel="stylesheet">
|
||||
<link href="https://fonts.googleapis.com/css?family=Sacramento" rel="stylesheet">
|
||||
<script src="https://kit.fontawesome.com/fcdfdfe1ad.js" crossorigin="anonymous"></script>
|
||||
|
@ -13,9 +13,9 @@
|
|||
<base href="/">
|
||||
|
||||
|
||||
<link rel="preload" href="/remax-template-frontend-94e47e680b3b812_bg.wasm" as="fetch" type="application/wasm" crossorigin="">
|
||||
<link rel="modulepreload" href="/remax-template-frontend-94e47e680b3b812.js"></head>
|
||||
<body><script type="module">import init from '/remax-template-frontend-94e47e680b3b812.js';init('/remax-template-frontend-94e47e680b3b812_bg.wasm');</script><script>(function () {
|
||||
<link rel="preload" href="/remax-template-frontend-4bfc28b84d3a6336_bg.wasm" as="fetch" type="application/wasm" crossorigin="">
|
||||
<link rel="modulepreload" href="/remax-template-frontend-4bfc28b84d3a6336.js"></head>
|
||||
<body><script type="module">import init from '/remax-template-frontend-4bfc28b84d3a6336.js';init('/remax-template-frontend-4bfc28b84d3a6336_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;
|
||||
|
|
|
@ -1,7 +1,4 @@
|
|||
|
||||
|
||||
/* Mobile View */
|
||||
|
||||
.navbar-background {
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
|
@ -13,6 +10,7 @@
|
|||
background-color: #252631;
|
||||
min-height: 74px;
|
||||
}
|
||||
|
||||
.navbar-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
@ -21,6 +19,7 @@
|
|||
flex-grow: 1;
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.navbar-hamburger {
|
||||
font-size: 20pt;
|
||||
color: white;
|
||||
|
@ -32,6 +31,7 @@
|
|||
min-width: 30px;
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.navbar-hamburger:hover {
|
||||
background-color: #ffffff14;
|
||||
font-size: 22pt;
|
||||
|
@ -40,6 +40,7 @@
|
|||
transition-duration: 0.3s;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.navbar-closed{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
@ -47,6 +48,7 @@
|
|||
margin-top: 10px;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.navbar-open {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
@ -62,6 +64,7 @@
|
|||
padding-bottom: 10px;
|
||||
font-family: Source Sans Pro;
|
||||
}
|
||||
|
||||
.navbar-item:hover {
|
||||
background-color: #ffffff14;
|
||||
font-size: 13pt;
|
||||
|
@ -71,12 +74,16 @@
|
|||
cursor: pointer;
|
||||
}
|
||||
|
||||
.navbar-brand-container{
|
||||
.navbar-brand-container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
max-width: 250px;
|
||||
}
|
||||
|
||||
.navbar-brand-container:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.navbar-title {
|
||||
|
@ -98,12 +105,14 @@
|
|||
justify-content: flex-start;
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
.navbar {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: flex-end;
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
.navbar-closed {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
@ -111,6 +120,7 @@
|
|||
flex-grow: 1;
|
||||
margin-top: 0px;
|
||||
}
|
||||
|
||||
.navbar-open {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
@ -118,6 +128,7 @@
|
|||
flex-grow: 1;
|
||||
margin-top: 0px;
|
||||
}
|
||||
|
||||
.navbar-item {
|
||||
color: white;
|
||||
font-size: 12pt;
|
||||
|
@ -127,6 +138,7 @@
|
|||
padding-bottom: 10px;
|
||||
font-family: Source Sans Pro;
|
||||
}
|
||||
|
||||
.navbar-item:hover {
|
||||
background-color: #ffffff14;
|
||||
font-size: 13pt;
|
||||
|
@ -135,11 +147,13 @@
|
|||
transition-duration: 0.3s;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.navbar-title {
|
||||
color: white;
|
||||
font-size: 23pt;
|
||||
font-family: Sacramento;
|
||||
}
|
||||
|
||||
.navbar-hamburger {
|
||||
display: none;
|
||||
}
|
|
@ -780,12 +780,12 @@ function getImports() {
|
|||
const ret = wasm.memory;
|
||||
return addHeapObject(ret);
|
||||
};
|
||||
imports.wbg.__wbindgen_closure_wrapper7693 = function(arg0, arg1, arg2) {
|
||||
const ret = makeMutClosure(arg0, arg1, 632, __wbg_adapter_36);
|
||||
imports.wbg.__wbindgen_closure_wrapper7704 = function(arg0, arg1, arg2) {
|
||||
const ret = makeMutClosure(arg0, arg1, 635, __wbg_adapter_36);
|
||||
return addHeapObject(ret);
|
||||
};
|
||||
imports.wbg.__wbindgen_closure_wrapper7997 = function(arg0, arg1, arg2) {
|
||||
const ret = makeMutClosure(arg0, arg1, 667, __wbg_adapter_39);
|
||||
imports.wbg.__wbindgen_closure_wrapper8008 = function(arg0, arg1, arg2) {
|
||||
const ret = makeMutClosure(arg0, arg1, 670, __wbg_adapter_39);
|
||||
return addHeapObject(ret);
|
||||
};
|
||||
|
||||
|
@ -824,7 +824,7 @@ function initSync(module) {
|
|||
|
||||
async function init(input) {
|
||||
if (typeof input === 'undefined') {
|
||||
input = new URL('remax-template-frontend-94e47e680b3b812_bg.wasm', import.meta.url);
|
||||
input = new URL('remax-template-frontend-4bfc28b84d3a6336_bg.wasm', import.meta.url);
|
||||
}
|
||||
const imports = getImports();
|
||||
|
Binary file not shown.
|
@ -1,5 +1,4 @@
|
|||
|
||||
|
||||
.property-search-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
|
@ -12,16 +12,18 @@ pub fn navigation_bar() -> Html {
|
|||
let cloned_navigator_2 = navigator.clone();
|
||||
let cloned_navigator_3 = navigator.clone();
|
||||
let cloned_navigator_4 = navigator.clone();
|
||||
let cloned_navigator_5 = navigator.clone();
|
||||
|
||||
let navbar_toggle = use_state(|| true);
|
||||
let on_click_hamburger = {
|
||||
let navbar_toggle = navbar_toggle.clone();
|
||||
Callback::from(move |_| navbar_toggle.set(!*navbar_toggle))
|
||||
};
|
||||
|
||||
html! {
|
||||
<div class={"navbar-background"}>
|
||||
<div class={"navbar-container"}>
|
||||
<div class={"navbar-brand-container"}>
|
||||
<div class={"navbar-brand-container"} onclick={move |_| cloned_navigator_5.push(&Route::LandingPage)}>
|
||||
<img class={"navbar-image"} src="images/remax-logo.png" alt=""/>
|
||||
<div class={"navbar-title"}>
|
||||
{NAVBAR_TITLE}
|
||||
|
|
Loading…
Reference in New Issue