STEMMechanics/Website
1
0
Fork 0
Code Issues 4 Pull Requests 3 Actions Packages Projects Releases 3 Wiki Activity

added transitions

Browse Source
This commit is contained in:
James Collins
2023-04-18 10:43:54 +10:00
parent c8e90b6887
commit b9cd3e3f9f
2 changed files with 15 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
resources/js/components/SMMastHead.vue
View File

@@ -93,13 +93,20 @@ const tabs = () => {
margin-bottom: 32px; margin-bottom: 32px;
font-size: 80%; font-size: 80%;
text-decoration: none; text-decoration: none;
transition: color 0.1s linear;
&:hover { &:hover {
color: rgb(255, 255, 255, 1); color: rgb(255, 255, 255, 1);
ion-icon {
margin-left: -4px;
margin-right: 8px;
}
} }
ion-icon { ion-icon {
margin-right: 4px; margin-right: 4px;
transition: margin 0.1s linear;
} }
} }
} }

12
resources/js/components/SMNavbar.vue
View File

@@ -173,7 +173,7 @@ body[data-route-name="page-home"] {
background-color: var(--navbar-color) !important; background-color: var(--navbar-color) !important;
#sm-nav { #sm-nav {
display: flex; max-height: 100vh;
} }
#sm-nav-toggle { #sm-nav-toggle {
@@ -223,22 +223,26 @@ body[data-route-name="page-home"] {
#sm-nav-toggle { #sm-nav-toggle {
padding: 24px; padding: 24px;
cursor: pointer;
} }
} }
#sm-nav { #sm-nav {
display: none; display: flex;
flex-direction: column; flex-direction: column;
width: 100%; width: 100%;
font-weight: 800; font-weight: 800;
padding-bottom: 12px; transition: max-height 0.5s ease-in-out;
height: auto;
max-height: 0;
overflow: hidden;
ul { ul {
display: block; display: block;
width: 100%; width: 100%;
list-style-type: none; list-style-type: none;
margin: 0; margin: 0;
padding: 0; padding: 0 0 12px 0;
li a { li a {
color: var(--base-color-text); color: var(--base-color-text);