notion-enhancer/repo/indentation-lines/client.css
2022-02-08 17:52:34 -08:00

104 lines
4.1 KiB
CSS

/**
* notion-enhancer: indentation lines
* (c) 2020 Alexa Baldon <alnbaldon@gmail.com> (https://github.com/runargs)
* (c) 2021 dragonwocky <thedragonring.bod@gmail.com> (https://dragonwocky.me/)
* (https://notion-enhancer.github.io/) under the MIT license
*/
.notion-page-content .notion-bulleted_list-block > div > div:last-child,
.notion-page-content .notion-numbered_list-block > div > div:last-child,
.notion-page-content .notion-to_do-block > div > div:last-child,
.notion-page-content .notion-toggle-block > div > div:last-child,
.notion-page-content .notion-selectable.notion-sub_header-block > div > div > div:last-child,
.notion-page-content .notion-selectable.notion-sub_sub_header-block > div > div > div:last-child,
.notion-page-content .notion-selectable.notion-sub_sub_sub_header-block > div > div > div:last-child,
.notion-page-content .notion-table_of_contents-block > div > div > a > div > div {
position: relative;
}
.notion-page-content .notion-bulleted_list-block > div > div:last-child::before,
.notion-page-content .notion-numbered_list-block > div > div:last-child::before,
.notion-page-content .notion-to_do-block > div > div:last-child::before,
.notion-page-content .notion-toggle-block > div > div:last-child::before,
.notion-page-content .notion-selectable.notion-sub_header-block > div > div > div:last-child::before,
.notion-page-content .notion-selectable.notion-sub_sub_header-block > div > div > div:last-child::before,
.notion-page-content .notion-selectable.notion-sub_sub_sub_header-block > div > div > div:last-child::before,
.notion-page-content .pseudoSelection > div > div:last-child::before {
content: '';
position: absolute;
height: calc(100% - 2em);
top: 2em;
margin-inline-start: -14.48px;
}
.notion-page-content
.notion-table_of_contents-block
> div
> div
> a
> div
> div:not([style*='margin-left: 0px'])
> div::before {
content: '';
position: absolute;
height: 100%;
top: 0;
margin-inline-start: -14.48px;
}
/* add background to block dragger */
.notion-frame
> [style*='position: absolute; top: 0px; left: 0px;']
[style*='position: absolute; top: 3px; left: -20px; width: 18px; height: 24px; pointer-events: auto; cursor: -webkit-grab;']
[data-block-id],
.notion-peek-renderer
> div
> [style*='position: absolute; top: 0px; left: 0px;']
[style*='position: absolute; top: 3px; left: -20px; width: 18px; height: 24px; pointer-events: auto; cursor: -webkit-grab;']
[data-block-id] {
background: var(--theme--bg) !important;
border-radius: 3px;
}
.notion-frame
> [style*='position: absolute; top: 0px; left: 0px;']
[style*='position: absolute; top: 3px; left: -20px; width: 18px; height: 24px; pointer-events: auto; cursor: -webkit-grab;']
+ .notion-focusable,
.notion-peek-renderer
> div
> [style*='position: absolute; top: 0px; left: 0px;']
[style*='position: absolute; top: 3px; left: -20px; width: 18px; height: 24px; pointer-events: auto; cursor: -webkit-grab;']
+ .notion-focusable {
left: -42px !important;
background: transparent !important;
}
.notion-frame
> [style*='position: absolute; top: 0px; left: 0px;']
[style*='position: absolute; top: 3px; left: -20px; width: 18px; height: 24px; pointer-events: auto; cursor: -webkit-grab;']
+ .notion-focusable
> .plus,
.notion-peek-renderer
> div
> [style*='position: absolute; top: 0px; left: 0px;']
[style*='position: absolute; top: 3px; left: -20px; width: 18px; height: 24px; pointer-events: auto; cursor: -webkit-grab;']
+ .notion-focusable
> .plus {
border-radius: 3px;
width: 18px !important;
padding: 0 1px !important;
background: var(--theme--bg) !important;
}
.notion-frame
> [style*='position: absolute; top: 0px; left: 0px;']
[style*='position: absolute; top: 3px; left: -20px; width: 18px; height: 24px; pointer-events: auto; cursor: -webkit-grab;']
+ .notion-focusable
> .plus:hover,
.notion-peek-renderer
> div
> [style*='position: absolute; top: 0px; left: 0px;']
[style*='position: absolute; top: 3px; left: -20px; width: 18px; height: 24px; pointer-events: auto; cursor: -webkit-grab;']
+ .notion-focusable
> .plus:hover {
background: var(--theme--ui_interactive-hover) !important;
}