Skip to content

Commit

Permalink
Adjust NavBar Layout
Browse files Browse the repository at this point in the history
  • Loading branch information
@KristinShuyiHan
KristinShuyiHan committed Jan 24, 2024
1 parent 08488d5 commit 22f6711
Show file tree
Hide file tree
Showing 16 changed files with 1,037 additions and 904 deletions.
295 changes: 148 additions & 147 deletions src/frontend/src/App.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,247 +2,248 @@

html,
body {
font-family: "Montserrat", sans-serif;
font-family: "Montserrat", sans-serif;
}

.row-header {
margin: 0px auto;
padding: 0px auto;
margin: 0px auto;
padding: 0px auto;
}

a.nav-link {
margin-left: 35px;
border-radius: 5px;
}

a.active {
color: fff;
border-bottom: rgb(250, 250, 250) 0 solid !important;
color: fff;
border-bottom: rgb(250, 250, 250) 0 solid !important;
}

.row-content {
margin: 0px auto;
padding: 50px 0px 50px 0px;
border-bottom: 1px ridge;
min-height: 400px;
margin: 0px auto;
padding: 50px 0px 50px 0px;
border-bottom: 1px ridge;
min-height: 400px;
}

.footer {
background-color: #d1c4e9;
margin: 0px auto;
padding: 10px 0px 10px 0px;
background-color: #d1c4e9;
margin: 0px auto;
padding: 10px 0px 10px 0px;
}

address {
font-size: 80%;
margin: 0px;
color: #0f0f0f;
font-size: 80%;
margin: 0px;
color: #0f0f0f;
}

.navbar-dark {
background-color: white
background-color: white;
}

.navbar-light {
background-color: darkslategray;
background-color: darkslategray;
}

.modal-body {
overflow: scroll;
overflow: scroll;
}

.modal-content {
height: 500px;
height: 500px;
}

.btn-secondary {
background-color: none;
border-color: none;
background-color: none;
border-color: none;
}

body {
margin: 0;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto",
"Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans",
"Helvetica Neue", sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
margin: 0;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen",
"Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue",
sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}

input[type="range"][orient="vertical"] {
writing-mode: bt-lr;
/* IE */
-webkit-appearance: slider-vertical;
/* WebKit */
width: 8px;
height: 175px;
padding: 0 5px;
writing-mode: bt-lr;
/* IE */
-webkit-appearance: slider-vertical;
/* WebKit */
width: 8px;
height: 175px;
padding: 0 5px;
}

.progress-bar-vertical {
width: 20px;
min-height: 100px;
display: flex;
align-items: flex-end;
margin-right: 20px;
float: left;
width: 20px;
min-height: 100px;
display: flex;
align-items: flex-end;
margin-right: 20px;
float: left;
}

.progress-bar-vertical .progress-bar {
width: 100%;
height: 0;
-webkit-transition: height 0.6s ease;
-o-transition: height 0.6s ease;
transition: height 0.6s ease;
width: 100%;
height: 0;
-webkit-transition: height 0.6s ease;
-o-transition: height 0.6s ease;
transition: height 0.6s ease;
}

code {
font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New",
monospace;
font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New",
monospace;
}

a.active.border-0 {
color: fff;
border: 0px !important;
color: fff;
border: 0px !important;
}

/* Carousel */
@font-face {
font-family: "revicons";
fallback: fallback;
src: url(/static/media/revicons.04eb8fc5.woff) format('woff'), url(/static/media/revicons.17629a5d.ttf) format('ttf'), url(/static/media/revicons.2feb69cc.eot) format('ttf')
font-family: "revicons";
fallback: fallback;
src: url(/static/media/revicons.04eb8fc5.woff) format("woff"),
url(/static/media/revicons.17629a5d.ttf) format("ttf"),
url(/static/media/revicons.2feb69cc.eot) format("ttf");
}

.react-multi-carousel-list {
display: flex;
align-items: center;
overflow: hidden;
position: relative
display: flex;
align-items: center;
overflow: hidden;
position: relative;
}

.react-multi-carousel-track {
list-style: none;
padding: 0;
margin: 0;
display: flex;
flex-direction: row;
position: relative;
transform-style: preserve-3d;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
will-change: transform, transition
list-style: none;
padding: 0;
margin: 0;
display: flex;
flex-direction: row;
position: relative;
transform-style: preserve-3d;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
will-change: transform, transition;
}

.react-multiple-carousel__arrow {
position: absolute;
outline: 0;
transition: all .5s;
border-radius: 35px;
z-index: 1000;
border: 0;
background: rgba(0, 0, 0, 0.5);
min-width: 43px;
min-height: 43px;
opacity: 1;
cursor: pointer
position: absolute;
outline: 0;
transition: all 0.5s;
border-radius: 35px;
z-index: 1000;
border: 0;
background: rgba(0, 0, 0, 0.5);
min-width: 43px;
min-height: 43px;
opacity: 1;
cursor: pointer;
}

.react-multiple-carousel__arrow:hover {
background: rgba(0, 0, 0, 0.8)
background: rgba(0, 0, 0, 0.8);
}

.react-multiple-carousel__arrow::before {
font-size: 20px;
color: #fff;
display: block;
font-family: revicons;
text-align: center;
z-index: 2;
position: relative
font-size: 20px;
color: #fff;
display: block;
font-family: revicons;
text-align: center;
z-index: 2;
position: relative;
}

.react-multiple-carousel__arrow--left {
left: calc(4% + 1px)
left: calc(4% + 1px);
}

.react-multiple-carousel__arrow--left::before {
content: "\e824"
content: "\e824";
}

.react-multiple-carousel__arrow--right {
right: calc(4% + 1px)
right: calc(4% + 1px);
}

.react-multiple-carousel__arrow--right::before {
content: "\e825"
content: "\e825";
}

.react-multi-carousel-dot-list {
position: absolute;
bottom: 0;
display: flex;
left: 0;
right: 0;
justify-content: center;
margin: auto;
padding: 0;
margin: 0;
list-style: none;
text-align: center
position: absolute;
bottom: 0;
display: flex;
left: 0;
right: 0;
justify-content: center;
margin: auto;
padding: 0;
margin: 0;
list-style: none;
text-align: center;
}

.react-multi-carousel-dot button {
display: inline-block;
width: 12px;
height: 12px;
border-radius: 50%;
opacity: 1;
padding: 5px 5px 5px 5px;
box-shadow: none;
transition: background .5s;
border-width: 2px;
border-style: solid;
border-color: grey;
padding: 0;
margin: 0;
margin-right: 6px;
outline: 0;
cursor: pointer
display: inline-block;
width: 12px;
height: 12px;
border-radius: 50%;
opacity: 1;
padding: 5px 5px 5px 5px;
box-shadow: none;
transition: background 0.5s;
border-width: 2px;
border-style: solid;
border-color: grey;
padding: 0;
margin: 0;
margin-right: 6px;
outline: 0;
cursor: pointer;
}

.react-multi-carousel-dot button:hover:active {
background: #080808
background: #080808;
}

.react-multi-carousel-dot--active button {
background: #080808
background: #080808;
}

.react-multi-carousel-item {
transform-style: preserve-3d;
-webkit-backface-visibility: hidden;
backface-visibility: hidden
}

@media all and (-ms-high-contrast:none),
(-ms-high-contrast:active) {
.react-multi-carousel-item {
flex-shrink: 0 !important
}

.react-multi-carousel-track {
overflow: visible !important
}
}

#video_background{
width: 100vw;
height: 100vh;
object-fit: cover;
position: fixed;
left: 0;
right: 0;
top: 0;
bottom: 0;
z-index: -1;
filter: brightness(0.7);
}
transform-style: preserve-3d;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
.react-multi-carousel-item {
flex-shrink: 0 !important;
}

.react-multi-carousel-track {
overflow: visible !important;
}
}

#video_background {
width: 100vw;
height: 100vh;
object-fit: cover;
position: fixed;
left: 0;
right: 0;
top: 0;
bottom: 0;
z-index: -1;
filter: brightness(0.7);
}
Binary file added src/frontend/src/assets/images/about.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/frontend/src/assets/images/contact.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/frontend/src/assets/images/dashboard.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/frontend/src/assets/images/login.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
0 src/frontend/src/assets/images/music.png → src/frontend/src/assets/images/media.png
View file
File renamed without changes
Binary file added src/frontend/src/assets/images/project.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading

0 comments on commit 22f6711

Please sign in to comment.