dragonwocky/notion-enhancer
1
0
Fork 0
mirror of https://github.com/notion-enhancer/notion-enhancer.git synced 2025-04-19 19:19:03 +00:00
Code Issues Packages Projects Releases Wiki Activity

Update styles.css

Browse Source
This commit is contained in:
Ryo Hilmawan 2020-11-03 18:48:25 +07:00 committed by GitHub
parent 5f8e3cc332
commit 4bca34e231
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 19 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
mods/property-layout/styles.css
View File

@ -5,20 +5,26 @@
* under the MIT license * under the MIT license
*/ */
.propertylayout-enhanced {
overflow: hidden;
transition: max-height 200ms ease-in, opacity 200ms ease-in;
}
.propertylayout-hidden { .propertylayout-hidden {
display: none; max-height: 0 !important;
opacity: 0;
} }
.propertylayout-toggle { .propertylayout-toggle {
width: 100%; width: 100%;
text-align: left; text-align: left;
font-size: 0.85em; font-size: 0.85em;
font-weight: 600;
padding: 0.25em; padding: 0.25em;
background: transparent; background: transparent;
color: var(--theme--text_ui); color: var(--theme--text_ui);
border: none; border: none;
border-radius: 2px; border-radius: 2px;
transition: background 200ms; transition: background 200ms, margin-bottom 200ms ease-in;
} }
.notion-scroller.vertical > div > :first-child .propertylayout-toggle { .notion-scroller.vertical > div > :first-child .propertylayout-toggle {
margin-top: 1em; margin-top: 1em;
@ -26,9 +32,17 @@
.propertylayout-toggle[data-action='show'] { .propertylayout-toggle[data-action='show'] {
margin-bottom: 1em; margin-bottom: 1em;
} }
.propertylayout-toggle::before {
content: '→ ' attr(data-action) ' ';
}
.propertylayout-toggle:hover { .propertylayout-toggle:hover {
background: var(--theme--interactive_hover); background: var(--theme--interactive_hover);
} }
.propertylayout-toggle .triangle {
width: 0.6875em;
height: 0.6875em;
margin: 0 0.75em 0 0.5em;
transition: transform 200ms ease-out 0s;
transform: rotateZ(90deg);
}
.propertylayout-toggle[data-action="hide"] .triangle {
transform: rotateZ(180deg);
}