Optimize directory structure. Optimize Slogan.
This commit is contained in:
7
src/assets/css/components/common/fit-center.scss
Normal file
7
src/assets/css/components/common/fit-center.scss
Normal file
@@ -0,0 +1,7 @@
|
||||
.fit-center {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
5
src/assets/css/components/common/fit-fullscreen.scss
Normal file
5
src/assets/css/components/common/fit-fullscreen.scss
Normal file
@@ -0,0 +1,5 @@
|
||||
.fit-fullscreen {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
}
|
||||
16
src/assets/css/components/common/hide-scrollbar.scss
Normal file
16
src/assets/css/components/common/hide-scrollbar.scss
Normal file
@@ -0,0 +1,16 @@
|
||||
.hide-scrollbar-mask {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.hide-scrollbar-selection {
|
||||
position: relative;
|
||||
overflow: scroll;
|
||||
scrollbar-width: none;
|
||||
-ms-overflow-style: none;
|
||||
}
|
||||
|
||||
.hide-scrollbar-selection::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
10
src/assets/css/components/common/loading-mask.scss
Normal file
10
src/assets/css/components/common/loading-mask.scss
Normal file
@@ -0,0 +1,10 @@
|
||||
.loading-mask {
|
||||
position: absolute;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 100;
|
||||
background-color: rgba(200, 200, 200, 0.2);
|
||||
}
|
||||
63
src/assets/css/components/home/slogan.scss
Normal file
63
src/assets/css/components/home/slogan.scss
Normal file
@@ -0,0 +1,63 @@
|
||||
@use "../../mixins" as mixins;
|
||||
|
||||
.center-box {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.big-logo {
|
||||
font: {
|
||||
size: 5em;
|
||||
weight: bold;
|
||||
};
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.slogan {
|
||||
font: {
|
||||
size: 1.3em;
|
||||
style: italic;
|
||||
};
|
||||
color: #666;
|
||||
|
||||
.cursor {
|
||||
font-style: normal;
|
||||
animation: 1s infinite;
|
||||
|
||||
@include mixins.unique-keyframes {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.scroll-down {
|
||||
position: absolute;
|
||||
bottom: 10px;
|
||||
padding: 20px;
|
||||
cursor: pointer;
|
||||
animation: 1.5s infinite;
|
||||
@include mixins.unique-keyframes {
|
||||
0%,
|
||||
100% {
|
||||
-ms-filter: none;
|
||||
filter: none;
|
||||
opacity: 1;
|
||||
transform: translateY(10px);
|
||||
}
|
||||
|
||||
50% {
|
||||
-ms-filter: alpha(opacity=40);
|
||||
filter: alpha(opacity=40);
|
||||
opacity: .4;
|
||||
transform: translateY(-10px);
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user