optimize style sheets, support tabIndex in popup

This commit is contained in:
2023-04-21 10:59:56 +08:00
parent cbdb2c7868
commit c4316e7e52
16 changed files with 235 additions and 199 deletions

View File

@ -1,4 +1,4 @@
@import './functions/func.scss';
@import "./functions/func.scss";
$headerLineHeight: 24px;
$buttonHeight: 28px;
@ -75,6 +75,14 @@ $buttonHeight: 28px;
&:hover {
opacity: .8;
}
&:focus,
&:focus-visible {
outline: none;
opacity: .8;
background-color: rgb(0 0 0/10%);
border-radius: var(--corner-radius);
}
}
}
@ -118,7 +126,7 @@ $buttonHeight: 28px;
width: 40px;
height: 40px;
&+span {
+span {
padding-left: 16px;
}
}
@ -148,7 +156,7 @@ $buttonHeight: 28px;
font-weight: bold;
}
&+* {
+* {
flex: 1 1 auto;
margin-right: 10px;
box-sizing: border-box;
@ -156,30 +164,11 @@ $buttonHeight: 28px;
line-height: var(--line-height);
}
&+input[type="text"],
&+input[type="email"],
&+input[type="tel"],
&+textarea {
border: 1px solid var(--border-color);
border-radius: var(--border-radius);
+textarea {
text-indent: var(--text-indent);
transition: border-color .12s ease;
&:hover {
border-color: var(--focus-color);
}
&:focus,
&:focus-visible {
outline: none;
}
}
&+.drop-wrapper>.drop-header>.drop-text {
font-size: 12px;
}
&+.checkbox-wrapper {
+.checkbox-wrapper {
padding: 0;
}
}
@ -210,14 +199,12 @@ $buttonHeight: 28px;
background-color: var(--title-bg-color);
transition: opacity .12s ease;
&:focus,
&:hover {
opacity: .8;
}
&:focus,
&:focus-visible {
outline: none;
}
@include outline();
}
}