aheh/Polaris
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add files via upload

Browse Source
This commit is contained in:
Russell
2023-05-04 12:49:26 -06:00
committed by GitHub
parent e1269646b0
commit b1fa014789
1 changed files with 136 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
static/assets/css/main.css
+136 -1
View File
@@ -1,7 +1,6 @@
@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200');
@import url('/assets/css/fonts.css');
@import url('/assets/css/themes.css');
@import url('/assets/css/games.css');
@import url('/assets/css/nav.css');
@import url('/assets/css/sidebar.css');
@import url('/assets/css/dropdown.css');
@@ -174,4 +173,140 @@ input:checked+.slider:before {
-webkit-transform: translateX(26px);
-ms-transform: translateX(26px);
transform: translateX(26px);
}
.games {
width: 100%;
display: flex;
justify-content: center;
flex-wrap: wrap;
padding-bottom: 30px;
}
.game {
min-width: 200px;
min-height: 200px;
display: block;
border-radius: 15px;
border: 1px solid #ffffff;
cursor: pointer;
transition: .4s;
overflow: hidden;
position: relative;
box-shadow: 0px 0px 10px #00000020;
margin: 10px;
}
.game:hover {
box-shadow: 0px 0px 20px #00000030;
filter: brightness(95%);
transform: translateY(-2px);
border-color: #ffffff;
}
.game>img {
width: 100%;
height: 100%;
object-fit: cover;
position: absolute;
left: 0;
top: 0;
object-position: center;
}
.game:after {
content: '';
top: 0;
left: 0;
position: absolute;
width: 100%;
height: 100%;
background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 100%);
}
.game>h3 {
position: absolute;
bottom: 25px;
left: 20px;
color: #fff;
font-size: 25px;
z-index: 10;
margin-bottom: 20px;
}
.game>span {
position: absolute;
bottom: 20px;
left: 20px;
color: #fff;
z-index: 10;
font-size: 15px;
}
.apps {
width: 100%;
display: flex;
justify-content: center;
flex-wrap: wrap;
padding-bottom: 30px;
}
.app {
min-width: 200px;
min-height: 200px;
display: block;
border-radius: 15px;
border: 1px solid #ffffff;
cursor: pointer;
transition: .4s;
overflow: hidden;
position: relative;
box-shadow: 0px 0px 10px #00000020;
margin: 10px;
}
.app:hover {
box-shadow: 0px 0px 20px #00000030;
filter: brightness(95%);
transform: translateY(-2px);
border-color: #ffffff;
}
.app>img {
width: 100%;
height: 100%;
object-fit: cover;
position: absolute;
left: 0;
top: 0;
object-position: center;
}
.app:after {
content: '';
top: 0;
left: 0;
position: absolute;
width: 100%;
height: 100%;
background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 100%);
}
.app>h3 {
position: absolute;
bottom: 25px;
left: 20px;
color: #fff;
font-size: 25px;
z-index: 10;
margin-bottom: 20px;
}
.app>span {
position: absolute;
bottom: 20px;
left: 20px;
color: #fff;
z-index: 10;
font-size: 15px;
}