Update index.css

This commit is contained in:
路人甲 2024-08-06 23:15:59 +08:00
parent e5a3435926
commit dc64307e79

View File

@ -70,7 +70,7 @@ header{
position: absolute; position: absolute;
left: 0; left: 0;
top: 0; top: 0;
height: 500px; height: 550px;
width: 100%; width: 100%;
z-index: -1; z-index: -1;
background: url('../image/bg.svg') center top repeat-x; background: url('../image/bg.svg') center top repeat-x;
@ -205,7 +205,7 @@ header{
.mod-panel .bd{ .mod-panel .bd{
display: flex; display: flex;
padding-top: 10px; padding-top: 20px;
} }
.mod-panel .panel-left{ .mod-panel .panel-left{
width: 55%; width: 55%;
@ -314,31 +314,47 @@ header{
} }
.mod-panel .panel-right{ .mod-panel .panel-right{
width: 45%; width: 45%;
background: #fff;
box-shadow: 0 1px 5px 0 rgba(0,0,0,0.025);
border: 1px solid rgba(0,0,0,0.025);
} }
.mod-panel .panel-right .c-hd{ .mod-panel .panel-right .c-hd{
height: 44px; height: 44px;
border-bottom: 1px solid #f4f4f4; margin-bottom: 10px;
}
.mod-panel .panel-right .c-hd ul{
display: flex;
} }
.mod-panel .panel-right .c-hd li{ .mod-panel .panel-right .c-hd li{
float: left; flex: 1;
width: 25%;
height: 44px; height: 44px;
line-height: 44px; line-height: 44px;
} }
.mod-panel .panel-right .c-hd li a{ .mod-panel .panel-right .c-hd li a{
position: relative;
display: block; display: block;
text-align: center; text-align: center;
text-decoration: none; text-decoration: none;
font-size: 14px; font-size: 16px;
color: #999; font-weight: bold;
color: rgba(0,0,0,0.25);
cursor: pointer; cursor: pointer;
transition: all 0.25s ease-in;
}
.mod-panel .panel-right .c-hd li a::after{
position: absolute;
left: 50%;
bottom: 0;
display: block;
content: '';
width: 0px;
height: 0px;
margin-left: 0px;
background: #2095f2;
border-radius: 0px;
transition: all 0.25s ease-in;
} }
.mod-panel .panel-right .c-hd li.active a{ .mod-panel .panel-right .c-hd li.active a{
position: relative; flex: 1.5;
color: #333; font-size: 20px;
color: rgba(0,0,0,0.9);
} }
.mod-panel .panel-right .c-hd li.active a::after{ .mod-panel .panel-right .c-hd li.active a::after{
position: absolute; position: absolute;
@ -347,7 +363,7 @@ header{
display: block; display: block;
content: ''; content: '';
width: 16px; width: 16px;
height: 4px; height: 6px;
margin-left: -8px; margin-left: -8px;
background: #2095f2; background: #2095f2;
border-radius: 3px; border-radius: 3px;
@ -355,6 +371,10 @@ header{
.mod-panel .panel-right .c-bd{ .mod-panel .panel-right .c-bd{
height: 450px; height: 450px;
padding: 18px 20px; padding: 18px 20px;
background: #fff;
box-shadow: 0 0 0 3px rgba(0,0,0,0.025);
border: 1px solid rgba(0,0,0,0.025);
border-radius: 12px;
} }
.mod-panel .panel-right .c-panel{ .mod-panel .panel-right .c-panel{
display: none; display: none;
@ -783,7 +803,7 @@ header{
float: none; float: none;
padding-top: 0; padding-top: 0;
width: auto; width: auto;
margin-bottom: 15px; margin-bottom: 20px;
text-align: center; text-align: center;
} }
.mod-panel .panel-left h1{ .mod-panel .panel-left h1{
@ -929,9 +949,21 @@ header{
} }
@media screen and (max-width: 640px) { @media screen and (max-width: 640px) {
.mod-panel .panel-right .c-hd{
margin-bottom: 4px;
}
.mod-panel .panel-right .c-hd li a{
font-size: 14px;
}
.mod-panel .panel-right .c-hd li.active a{
font-size: 16px;
}
.mod-panel .panel-right .c-bd{ .mod-panel .panel-right .c-bd{
padding: 15px 10px; padding: 15px 10px;
} }
.mod-panel .panel-right .c-hd li.active a::after{
height: 4px;
}
.mod-intro .hd{ .mod-intro .hd{
margin: 0 0 5px; margin: 0 0 5px;