Updates
This commit is contained in:
parent
5b1d05b7a8
commit
c4b2af6adc
2 changed files with 86 additions and 15 deletions
65
index.css
65
index.css
|
@ -139,6 +139,71 @@ a {
|
|||
text-align: right;
|
||||
}
|
||||
|
||||
.switch-list {
|
||||
display: inline-flex;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
.switch-list li {
|
||||
margin-inline-end: -1px;
|
||||
}
|
||||
|
||||
.switch-list input {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.switch-list label {
|
||||
position: relative;
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
height: 24px;
|
||||
padding: 0;
|
||||
padding-inline-start: 10px;
|
||||
padding-inline-end: 10px;
|
||||
border: 1px solid #c2c2c2;
|
||||
border-block-start-color: #c9c9c9;
|
||||
border-block-end-color: #a6a6a6;
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
text-align: center;
|
||||
background-color: #fff;
|
||||
color: #000;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.switch-list label:active {
|
||||
background-color: #f0f0f0;
|
||||
}
|
||||
|
||||
.switch-list li:first-child label {
|
||||
border-top-left-radius: 4px;
|
||||
border-bottom-left-radius: 4px;
|
||||
}
|
||||
|
||||
.switch-list li:last-child label {
|
||||
border-top-right-radius: 4px;
|
||||
border-bottom-right-radius: 4px;
|
||||
}
|
||||
|
||||
.switch-list input:checked + label {
|
||||
z-index: 1;
|
||||
border-color: #98989e;
|
||||
border-block-start-color: #a5a5ab;
|
||||
border-block-end-color: #7e7e84;
|
||||
background-image: linear-gradient(to bottom, #b1b1b6, #929297);
|
||||
color: rgba(255, 255, 255, 1);
|
||||
}
|
||||
|
||||
.switch-list input:checked + label:active {
|
||||
border-color: #65656b;
|
||||
border-block-start-color: #808086;
|
||||
border-block-end-color: #414147;
|
||||
background-image: linear-gradient(to bottom, #919196, #57575c);
|
||||
color: rgba(255, 255, 255, 0.95);
|
||||
}
|
||||
|
||||
/** 演示区块 **/
|
||||
.demo__main {
|
||||
margin-block-start: 24px;
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue