Files
Website/Static/mdui-v1.0.1/css/ui.css
hanasaki-misaki 175e737898 新增页面内容
2023-03-18 18:13:54 +08:00

419 lines
6.9 KiB
CSS

/* 去除左右滚动 */
body{
overflow-x:hidden!important;
}
/* a标签去除下划线 */
a{
text-decoration:none!important;
}
/* loading start */
#loading {
position: fixed;
top: 0px;
bottom: 0;
left: 0;
right: 0;
z-index: 10000;
background-color: #cacaca;
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
justify-content: center;
align-items: center;
}
#loading span img {
width: 100%;
height: 100%;
position: relative;
}
@keyframes loadingA {
from {}
to {
transform: rotate(360deg);
}
}
/* loading end */
/* slideshow */
.slideshow-container {
position: relative;
height: 400px;
width: 100%;
overflow: hidden;
}
.slideshow-image {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0;
transition: opacity 1s ease-in-out;
}
.slideshow-image.active {
opacity: 1;
}
.slideshow-image.last-active {
opacity: 0;
}
.ui-center {
border-radius: 15px;
border: solid 2px rgba(128, 128, 128, 0.664);
/* offset-x | offset-y | blur-radius | color */
}
.box-Text {
margin-top: 15px;
}
.mdui-toolbar {
height: 92px;
line-height: 56px;
}
.mdui-typo a::before {
display: none;
}
.pgw-bodg {
position: fixed;
z-index: -999;
width: 100%;
height: 100%;
background: #00000000;
background-attachment: local;
background-position: center;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
background-repeat: no-repeat;
background-image: url(https://img-cdn-cos.lolicon.team/1/2023/03/18/1x6415730a4ec05.webp/all70);
animation: run 60s linear infinite;
animation-direction: alternate;
}
.font-ui {
font-weight: 700;
font-style: italic;
}
.home-bodg {
position: fixed;
z-index: -999;
width: 100%;
height: 100%;
background: #00000000;
background-attachment: local;
background-position: center;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
background-repeat: no-repeat;
background-image: url(https://img-cdn-cos.lolicon.team/1/2023/03/18/1x6415730a4ec05.webp/all70);
}
@keyframes run {
from {
background-position: 0px;
}
to {
background-position: 100%;
}
}
.mdui-typo-headlineg {
margin: 0 0 0.3em 0;
font-weight: 400;
font-size: 24px;
-moz-osx-font-smoothing: grayscale;
}
.pgw-footer {
position: absolute;
right: 0;
bottom: 0;
left: 0;
z-index: 1005;
backdrop-filter: blur(5px);
}
html,
body {
display: flex;
flex-flow: column;
height: 100vh;
font-family: 'Saira', 'Noto Sans SC';
font-weight: normal;
font-style: normal;
}
.load {
position: fixed;
z-index: -999;
width: 100%;
height: 100vh;
background: #00000000;
background-attachment: local;
background-position: center;
-webkit-background-size: auto;
-moz-background-size: auto;
background-size: cover;
background-repeat: no-repeat;
}
.main {
flex: 1;
}
.div-height {
height: 50px;
background-color: rgba(99, 162, 255, 0.664);
backdrop-filter: blur(5px);
}
.pc-introduction {
height: 100vh;
width: 30%;
}
.pc-intro-img {
height: 100vh;
}
.middle-section {
position: absolute;
bottom: 0;
height: 30px;
/*脚部的高度*/
clear: both;
width: 100%;
}
.y-row {
display: flex;
width: auto;
justify-content: space-between;
flex-wrap: nowrap;
overflow: scroll;
overflow-x: auto;
height: 150px;
}
.bitem {
flex: 0 0 80px;
padding: 5px
}
.pc-flex {
display: flex;
flex-wrap: nowrap;
flex-direction: row;
justify-content: space-between;
height: 100vh;
}
.pc-flex-item2 {
display: flex;
flex: 1;
flex-wrap: nowrap;
justify-content: space-between
}
.zhe {
backdrop-filter: blur(5px);
}
.mdui-toolbarm,
.mdui-toolbarb {
backdrop-filter: blur(5px);
}
.mdui-grid-tile {
border-radius: 15px;
float: left;
width: 25em;
margin-left: 15px;
position: relative;
}
.mdui-grid-tile img{
aspect-ratio: 16/9;
}
@media (max-width: 983px) {
.mdui-hidden-lok-down {
display: none !important;
}
}
@media (min-width: 982px) {
.mdui-hidden-xm-pe {
display: none !important;
}
}
.banner {
max-width: 1200px;
margin-bottom: 15px;
box-sizing: border-box;
margin-right: auto;
margin-left: auto;
padding-right: 8px;
padding-left: 8px;
}
@media (min-width: 1383px){
.c-scl{
margin: 0 auto;
margin-top: 60px;
max-width: 1408px;
padding: 0px;
}
}
@media (max-width: 1384px){
.c-scl{
display: none;
}
}
@media (max-width: 1384px){
.c-inner{
display: none;
}
}
@media (min-width: 835px){
.c-secttl{
font-size: 3.75rem!important;
padding-bottom: calc(20px - 0.1em);
}
}
.c-secttl{
margin-left: 15px;
color: #fffef5;
font-size: 10.4vw;
font-weight: 700;
line-height: 1;
padding-bottom: 12px;
}
@media (min-width: 1383px){
.slow{
text-align: center;
margin: 0 auto;
margin-top: 61px;
margin-left: 15px;
max-width: 1408px;
border: 2px solid #585858;
border-radius: 15px;
backdrop-filter: blur(5px);
}
}
@media (max-width: 1384px){
.slow{
display: none;
}
}
@media (min-width: 1383px){
.slow-two{
text-align: center;
margin: 0 auto;
margin-top: 300px;
margin-left: 15px;
max-width: 1408px;
border: 2px solid #585858;
border-radius: 15px;
backdrop-filter: blur(5px);
}
}
@media (max-width: 1384px){
.slow{
display: none;
}
}
@media (min-width: 1383px){
.slow-tree{
text-align: center;
margin: 0 auto;
margin-top: 490px;
margin-left: 15px;
margin-bottom: 45px;
max-width: 1408px;
border: 2px solid #585858;
border-radius: 15px;
backdrop-filter: blur(5px);
}
}
@media (max-width: 1384px){
.slow-tree{
display: none;
}
}
.slow h2{
padding: 35px 0px 35px 0px;
}
.slow-two h2{
padding: 35px 0px 35px 0px;
}
.slow-tree h2{
padding: 35px 0px 35px 0px;
}
.dnone{
display: none;
}
.list-news{
text-align: center;
margin: 0 auto;
margin-top: 15px;
margin-left: 15px;
max-width: 1408px;
border: 2px solid #585858;
border-radius: 15px;
backdrop-filter: blur(5px);
}
.list-news h3{
margin-top: 1rem;
}
.border-radius-15{
border-radius: 15px;
}
@media (max-width: 1384px){
#player-card{
display: none;
}
}
/* 选中第1个#player-card */
#player-card:first-child{
margin-right: 0px;
}
#player-card{
float:right;
margin-right: 32px;
}
/* 选中最后一个#player-card */
#player-card:last-child{
margin-left: 15px;
}