Merge pull request #133 from RomEYer-AwELF/master

调整样式(已经合并了先前修改)
This commit is contained in:
神戸小鳥
2021-09-06 01:27:42 +08:00
committed by GitHub
2 changed files with 105 additions and 109 deletions

View File

@@ -88,7 +88,7 @@ body {
} }
.mainbtn:hover { .mainbtn:hover {
background: rgb(255, 120, 120); background: #ff7878;
color: #fff; color: #fff;
transition: all .4s ease 0s; transition: all .4s ease 0s;
} }
@@ -154,6 +154,7 @@ body {
padding: 0; padding: 0;
overflow: auto; overflow: auto;
transform: translateX(-50%); transform: translateX(-50%);
text-align: center;
} }
.selectlist > li { .selectlist > li {
@@ -167,95 +168,85 @@ body {
border-radius: 0.2rem; border-radius: 0.2rem;
cursor: pointer; cursor: pointer;
color: #EEEEEE; color: #EEEEEE;
} user-select: none;
.grade1b,
.grade2b,
.grade3b {
padding-left: 1.5rem;
box-sizing: border-box;
} }
.grade0b { .grade0b {
background-color: rgb(70, 70, 70); background-color: #464646;
border: #f8f8f8 2px solid !important; border: #f8f8f8 2px solid !important;
} }
.grade1,
.grade1b::before {
background-color: rgb(116, 191, 255) !important;
}
.grade1b { .grade1b {
background-color: rgb(116, 191, 255); background-color: #6495ed;
border: #f8f8f8 2px solid !important; border: #f8f8f8 2px solid !important;
} }
.grade2,
.grade2b::before {
background-color: rgb(226, 167, 255) !important;
}
.grade2b { .grade2b {
background-color: rgb(226, 167, 255); background-color: #e2a7ff;
border: #f8f8f8 2px solid !important; border: #f8f8f8 2px solid !important;
} }
.grade3,
.grade3b::before {
background-color: #ffa07a !important;
}
.grade3b { .grade3b {
background-color: #ffa07a; background-color: #ffa07a;
border: #f8f8f8 2px solid !important; border: #f8f8f8 2px solid !important;
} }
.grade1b, @media (min-width:1080px) {
.grade2b, .grade0b:hover {
.grade3b { background-color: #c0c0c0;
padding-left: 1.5rem;
box-sizing: border-box;
}
.grade0b:hover {
background-color: rgb(202, 202, 202);
color: #3b3b3b; color: #3b3b3b;
transition: all .4s ease 0s; transition: all .3s ease 0s;
} }
.grade1b:hover { .grade1b:hover {
background-color: rgb(159, 207, 248); background-color: #87cefa;
color: #3b3b3b; color: #3b3b3b;
transition: all .4s ease 0s; transition: all .3s ease 0s;
} }
.grade2b:hover { .grade2b:hover {
background-color: rgb(240, 212, 255); background-color: #e7beff;
color: #3b3b3b; color: #3b3b3b;
transition: all .4s ease 0s; transition: all .3s ease 0s;
} }
.grade3b:hover { .grade3b:hover {
background-color: #f7a989; background-color: #f7a989;
color: #3b3b3b; color: #3b3b3b;
transition: all .4s ease 0s; transition: all .3s ease 0s;
}
} }
.grade0b.selected { .grade0b.selected {
background-color: rgb(202, 202, 202) !important; background-color: #c0c0c0 !important;
box-shadow: #ccc 0px 0px 10px;
color: #3b3b3b; color: #3b3b3b;
} }
.grade1b.selected { .grade1b.selected {
background-color: rgb(198, 229, 255) !important; background-color: #87cefa !important;
box-shadow: #ccc 0px 0px 10px;
color: #3b3b3b; color: #3b3b3b;
} }
.grade2b.selected { .grade2b.selected {
background-color: rgb(240, 212, 255) !important; background-color: #e7beff !important;
box-shadow: #ccc 0px 0px 10px;
color: #3b3b3b; color: #3b3b3b;
} }
.grade3b.selected { .grade3b.selected {
background-color: #f1bfac !important; background-color: #f1bfac !important;
box-shadow: #ccc 0px 0px 10px;
color: #3b3b3b; color: #3b3b3b;
} }
.judge > li.grade1 span,
.judge > li.grade1{
background-color: #87cefa;
}
.judge > li.grade2 span,
.judge > li.grade2{
background-color: #e7beff;
}
.judge > li.grade3 span,
.judge > li.grade3{
background-color: #f7a989;
}
.propinitial { .propinitial {
top: 5rem; top: 5rem;
bottom: 14rem; bottom: 14rem;
@@ -328,13 +319,14 @@ body {
width: calc(100% - 9rem); width: calc(100% - 9rem);
margin: 0.5rem; margin: 0.5rem;
padding: 0.5rem 1rem 0.5rem 7rem; padding: 0.5rem 1rem 0.5rem 7rem;
border-radius: 10px;
} }
.judge > li > span { .judge > li > span {
background-color: #393E46;
height: calc(100% - 1rem); height: calc(100% - 1rem);
padding: 0.5rem 0; padding: 0.5rem 0;
top: 0; top: 0;
border-radius: 10px;
} }

View File

@@ -85,7 +85,7 @@ body {
} }
.mainbtn:hover { .mainbtn:hover {
background: rgb(255, 120, 120); background: #ff7878;
color: #fff; color: #fff;
transition: all .4s ease 0s; transition: all .4s ease 0s;
} }
@@ -150,6 +150,7 @@ body {
padding: 0; padding: 0;
overflow: auto; overflow: auto;
transform: translateX(-50%); transform: translateX(-50%);
text-align: center;
} }
.selectlist > li { .selectlist > li {
@@ -164,80 +165,82 @@ body {
cursor: pointer; cursor: pointer;
} }
.grade1b,
.grade2b,
.grade3b {
padding-left: 1.5rem;
box-sizing: border-box;
}
.grade0b { .grade0b {
background-color: rgb(237, 237, 237); background-color: #ededed;
border: #c5c5c5 2px solid !important; border: #c5c5c5 2px solid !important;
} }
.grade1,
.grade1b::before {
background-color: rgb(116, 191, 255) !important;
}
.grade1b { .grade1b {
background-color: rgb(116, 191, 255); background-color: #7ea5ec;
border: #c5c5c5 2px solid !important; border: #c5c5c5 2px solid !important;
} }
.grade2,
.grade2b::before {
background-color: rgb(226, 167, 255) !important;
}
.grade2b { .grade2b {
background-color: rgb(226, 167, 255); background-color: #e2a7ff;
border: #c5c5c5 2px solid !important; border: #c5c5c5 2px solid !important;
} }
.grade3,
.grade3b::before {
background-color: #ffa07a !important;
}
.grade3b { .grade3b {
background-color: #ffa07a; background-color: #ffa07a;
border: #c5c5c5 2px solid !important; border: #c5c5c5 2px solid !important;
} }
.grade0b:hover { @media (min-width:1080px) {
background-color: rgb(160, 160, 160); .grade0b:hover {
transition: all .4s ease 0s; background-color: #868686;
} transition: all .3s ease 0s;
.grade1b:hover { }
background-color: rgb(159, 207, 248);
transition: all .4s ease 0s;
}
.grade2b:hover {
background-color: rgb(240, 212, 255);
transition: all .4s ease 0s;
}
.grade3b:hover {
background-color: #f7a989;
transition: all .4s ease 0s;
}
.grade1b:hover {
background-color: #5d90ff;
transition: all .3s ease 0s;
}
.grade2b:hover {
background-color: #bc72ec;
transition: all .3s ease 0s;
}
.grade3b:hover {
background-color: #e09074;
transition: all .3s ease 0s;
}
}
.grade0b.selected { .grade0b.selected {
background-color: rgb(160, 160, 160); background-color: #444;
color: #3b3b3b; box-shadow: #bbb 0px 0px 10px;
color: #fff;
} }
.grade1b.selected { .grade1b.selected {
background-color: rgb(159, 207, 248); background-color: #407dec;
color: #3b3b3b; box-shadow: #bbb 0px 0px 10px;
color: #fff;
} }
.grade2b.selected { .grade2b.selected {
background-color: rgb(240, 212, 255); background-color: #b362e7;
color: #3b3b3b; box-shadow: #bbb 0px 0px 10px;
color: #fff;
} }
.grade3b.selected { .grade3b.selected {
background-color: #f7a989; background-color: #ff7f4d;
color: #3b3b3b; box-shadow: #bbb 0px 0px 10px;
color: #fff;
}
.judge > li.grade1 span,
.judge > li.grade1{
background-color: #7ea5ec;
}
.judge > li.grade2 span,
.judge > li.grade2{
background-color: #e2a7ff;
}
.judge > li.grade3 span,
.judge > li.grade3{
background-color: #ffa07a;
} }
.propinitial { .propinitial {
@@ -279,9 +282,9 @@ body {
} }
.lifeTrajectory { .lifeTrajectory {
border: 1px lightblue solid; border: 1px #a7a7a7 solid;
border-radius: 10px; border-radius: 10px;
background-color: aliceblue; background-color: #ffffff;
} }
.judge > li, .judge > li,
@@ -291,8 +294,8 @@ body {
margin: 0.5rem 0; margin: 0.5rem 0;
padding: 0.5rem 1rem 0.5rem 6rem; padding: 0.5rem 1rem 0.5rem 6rem;
font-size: 1.4rem; font-size: 1.4rem;
background-color: white; background-color: #fff;
box-shadow: lightblue 0 0 0.4rem; box-shadow: #a7a7a7 0 0 0.4rem;
user-select: none; user-select: none;
} }
@@ -309,13 +312,14 @@ body {
width: calc(100% - 9rem); width: calc(100% - 9rem);
margin: 0.5rem; margin: 0.5rem;
padding: 0.5rem 1rem 0.5rem 7rem; padding: 0.5rem 1rem 0.5rem 7rem;
border-radius: 10px;
} }
.judge > li > span { .judge > li > span {
background-color: white;
height: calc(100% - 1rem); height: calc(100% - 1rem);
padding: 0.5rem 0; padding: 0.5rem 0;
top: 0; top: 0;
border-radius: 10px;
} }