franklinblanco/remax-frontend-rs
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Made navbar fixed position

Browse Source
This commit is contained in:
Franklin 2023-03-13 09:16:47 -04:00
parent a10dff41ed
commit 276512841f
6 changed files with 45 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
css/body.css Normal file
View File

@ -0,0 +1,3 @@
body {
margin: 0; /* Remove body margins */
}

28
css/navbar.css
View File

@ -1,18 +1,16 @@
body {
margin: 0; /* Remove body margins */
}
/* Mobile View */ /* Mobile View */
.navbar-background { .navbar-background {
position: fixed;
width: 100%;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: end; justify-content: end;
align-items: center; align-items: center;
align-items: stretch; align-items: stretch;
background-color: #252631; background-color: #252631;
padding: 15px;
padding-right: 40px;
min-height: 44px; min-height: 44px;
} }
.navbar-container { .navbar-container {
@ -21,14 +19,26 @@ body {
justify-content: flex-start; justify-content: flex-start;
align-items: stretch; align-items: stretch;
flex-grow: 1; flex-grow: 1;
padding: 15px;
} }
.navbar-hamburger { .navbar-hamburger {
font-size: 20pt; font-size: 20pt;
color: white; color: white;
display: flex; display: flex;
align-items: start; justify-content: center;
margin-top: 10px; align-items: center;
margin-top: 5px;
max-height: 35px; max-height: 35px;
min-width: 30px;
padding: 15px;
}
.navbar-hamburger:hover {
background-color: #ffffff14;
font-size: 22pt;
font-weight: bold;
border-radius: 3px;
transition-duration: 0.3s;
cursor: pointer;
} }
.navbar-closed{ .navbar-closed{
display: flex; display: flex;
@ -47,9 +57,8 @@ body {
.navbar-item { .navbar-item {
color: white; color: white;
font-size: 12pt; font-size: 12pt;
padding-left: 20px;
padding-right: 20px;
padding-top: 10px; padding-top: 10px;
padding-left: 5px;
padding-bottom: 10px; padding-bottom: 10px;
font-family: Source Sans Pro; font-family: Source Sans Pro;
} }
@ -64,7 +73,6 @@ body {
.navbar-title { .navbar-title {
color: white; color: white;
font-size: 15pt; font-size: 15pt;
padding-left: 20px;
padding-right: 20px; padding-right: 20px;
padding-top: 10px; padding-top: 10px;
padding-bottom: 10px; padding-bottom: 10px;

3
dist/body-1dfd5cf65077c12.css vendored Normal file
View File

@ -0,0 +1,3 @@
body {
margin: 0; /* Remove body margins */
}

3
dist/index.html vendored
View File

@ -1,7 +1,8 @@
<!DOCTYPE html><html><head> <!DOCTYPE html><html><head>
<meta charset="utf-8"> <meta charset="utf-8">
<title>Yew App</title> <title>Yew App</title>
<link rel="stylesheet" href="/navbar-3dafbc875c0918b7.css"> <link rel="stylesheet" href="/body-1dfd5cf65077c12.css">
<link rel="stylesheet" href="/navbar-c70cbfee705a9cf.css">
<link rel="stylesheet" href="/landing-c920ca43256fdcb9.css"> <link rel="stylesheet" href="/landing-c920ca43256fdcb9.css">
<link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro" rel="stylesheet"> <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro" rel="stylesheet">
<script src="https://kit.fontawesome.com/fcdfdfe1ad.js" crossorigin="anonymous"></script> <script src="https://kit.fontawesome.com/fcdfdfe1ad.js" crossorigin="anonymous"></script>

28
dist/navbar-3dafbc875c0918b7.css → dist/navbar-c70cbfee705a9cf.css vendored
View File

@ -1,18 +1,16 @@
body {
margin: 0; /* Remove body margins */
}
/* Mobile View */ /* Mobile View */
.navbar-background { .navbar-background {
position: fixed;
width: 100%;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: end; justify-content: end;
align-items: center; align-items: center;
align-items: stretch; align-items: stretch;
background-color: #252631; background-color: #252631;
padding: 15px;
padding-right: 40px;
min-height: 44px; min-height: 44px;
} }
.navbar-container { .navbar-container {
@ -21,14 +19,26 @@ body {
justify-content: flex-start; justify-content: flex-start;
align-items: stretch; align-items: stretch;
flex-grow: 1; flex-grow: 1;
padding: 15px;
} }
.navbar-hamburger { .navbar-hamburger {
font-size: 20pt; font-size: 20pt;
color: white; color: white;
display: flex; display: flex;
align-items: start; justify-content: center;
margin-top: 10px; align-items: center;
margin-top: 5px;
max-height: 35px; max-height: 35px;
min-width: 30px;
padding: 15px;
}
.navbar-hamburger:hover {
background-color: #ffffff14;
font-size: 22pt;
font-weight: bold;
border-radius: 3px;
transition-duration: 0.3s;
cursor: pointer;
} }
.navbar-closed{ .navbar-closed{
display: flex; display: flex;
@ -47,9 +57,8 @@ body {
.navbar-item { .navbar-item {
color: white; color: white;
font-size: 12pt; font-size: 12pt;
padding-left: 20px;
padding-right: 20px;
padding-top: 10px; padding-top: 10px;
padding-left: 5px;
padding-bottom: 10px; padding-bottom: 10px;
font-family: Source Sans Pro; font-family: Source Sans Pro;
} }
@ -64,7 +73,6 @@ body {
.navbar-title { .navbar-title {
color: white; color: white;
font-size: 15pt; font-size: 15pt;
padding-left: 20px;
padding-right: 20px; padding-right: 20px;
padding-top: 10px; padding-top: 10px;
padding-bottom: 10px; padding-bottom: 10px;

1
index.html
View File

@ -3,6 +3,7 @@
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<title>Yew App</title> <title>Yew App</title>
<link data-trunk type="text/css" href="css/body.css" rel="css" />
<link data-trunk type="text/css" href="css/navbar.css" rel="css" /> <link data-trunk type="text/css" href="css/navbar.css" rel="css" />
<link data-trunk type="text/css" href="css/landing.css" rel="css" /> <link data-trunk type="text/css" href="css/landing.css" rel="css" />
<link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro" rel="stylesheet"> <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro" rel="stylesheet">