Optimize CSS selectors

This commit is contained in:
Mimi 2022-11-28 01:30:18 +08:00
parent afc770239a
commit 7384d0377c
2 changed files with 18 additions and 10 deletions

View File

@ -5,7 +5,7 @@ if (hexo-config('note.style') != 'disabled') {
border-radius: $note-border-radius; border-radius: $note-border-radius;
margin-bottom: 20px; margin-bottom: 20px;
padding: 1em 1em 0; padding: 1em;
position: relative; position: relative;
if ($note-style == 'simple') { if ($note-style == 'simple') {
@ -39,6 +39,14 @@ if (hexo-config('note.style') != 'disabled') {
padding-top: 0; padding-top: 0;
} }
:first-child {
margin-top: 0;
}
:last-child {
margin-bottom: 0;
}
if ($note-icons) { if ($note-icons) {
&:not(.no-icon) { &:not(.no-icon) {
padding-left: 2.5em; padding-left: 2.5em;

View File

@ -166,26 +166,26 @@ round-icon($diameter) {
toggle-arrow($position) { toggle-arrow($position) {
if ($position == 'right') { if ($position == 'right') {
.toggle-line:first-child { :first-child {
top: 2px; top: 2px;
transform: rotate(-45deg); transform: rotate(-45deg);
width: 50%; width: 50%;
} }
.toggle-line:last-child { :last-child {
top: -2px; top: -2px;
transform: rotate(45deg); transform: rotate(45deg);
width: 50%; width: 50%;
} }
} else { } else {
.toggle-line:first-child { :first-child {
left: 50%; left: 50%;
top: 2px; top: 2px;
transform: rotate(45deg); transform: rotate(45deg);
width: 50%; width: 50%;
} }
.toggle-line:last-child { :last-child {
left: 50%; left: 50%;
top: -2px; top: -2px;
transform: rotate(-45deg); transform: rotate(-45deg);
@ -195,27 +195,27 @@ toggle-arrow($position) {
} }
toggle-close($position) { toggle-close($position) {
.toggle-line:nth-child(2) { :nth-child(2) {
opacity: 0; opacity: 0;
} }
if ($position == 'right') { if ($position == 'right') {
.toggle-line:first-child { :first-child {
top: 6px; top: 6px;
transform: rotate(-45deg); transform: rotate(-45deg);
} }
.toggle-line:last-child { :last-child {
top: -6px; top: -6px;
transform: rotate(45deg); transform: rotate(45deg);
} }
} else { } else {
.toggle-line:first-child { :first-child {
top: 6px; top: 6px;
transform: rotate(45deg); transform: rotate(45deg);
} }
.toggle-line:last-child { :last-child {
top: -6px; top: -6px;
transform: rotate(-45deg); transform: rotate(-45deg);
} }