You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
147 lines
3.5 KiB
147 lines
3.5 KiB
2 years ago
|
/* @settings
|
||
|
|
name: Scroll to Top Plugin
|
||
|
|
id: obsidian-scroll-to-top-plugin
|
||
|
|
settings:
|
||
|
|
-
|
||
|
|
id: scroll-to-top-bottom
|
||
|
|
title: Scroll to top bottom position placement
|
||
|
|
type: variable-number
|
||
|
|
default: 2.65
|
||
|
|
format: em
|
||
|
|
-
|
||
|
|
id: scroll-to-top-left
|
||
|
|
title: Scroll to top right position placement
|
||
|
|
type: variable-number
|
||
|
|
default: 2.05
|
||
|
|
format: em
|
||
|
|
-
|
||
|
|
id: scroll-to-bottom-bottom
|
||
|
|
title: Scroll to bottom bottom position placement
|
||
|
|
type: variable-number
|
||
|
|
default: 5.75
|
||
|
|
format: em
|
||
|
|
-
|
||
|
|
id: scroll-to-bottom-left
|
||
|
|
title: Scroll to bottom right position placement
|
||
|
|
type: variable-number
|
||
|
|
default: 2.05
|
||
|
|
format: em
|
||
|
|
-
|
||
|
|
id: scroll-to-top-width
|
||
|
|
title: Scroll to top button width
|
||
|
|
type: variable-number
|
||
|
|
default: 1.875
|
||
|
|
format: em
|
||
|
|
-
|
||
|
|
id: scroll-to-top-height
|
||
|
|
title: Scroll to top button height
|
||
|
|
type: variable-number
|
||
|
|
default: 1.875
|
||
|
|
format: em
|
||
|
|
-
|
||
|
|
id: scroll-to-bottom-width
|
||
|
|
title: Scroll to bottom button width
|
||
|
|
type: variable-number
|
||
|
|
default: 1.875
|
||
|
|
format: em
|
||
|
|
-
|
||
|
|
id: scroll-to-bottom-height
|
||
|
|
title: Scroll to bottom button height
|
||
|
|
type: variable-number
|
||
|
|
default: 1.875
|
||
|
|
format: em
|
||
|
|
*/
|
||
|
|
|
||
|
|
/* In case not using the style settings plugin */
|
||
|
|
:root {
|
||
|
|
--scroll-to-bottom-bottom: 2.65em;
|
||
|
|
--scroll-to-bottom-left: 2.05em;
|
||
|
|
--scroll-to-top-bottom: 5.75em;
|
||
|
|
--scroll-to-top-left: 2.05em;
|
||
|
|
--scroll-input-width: 1.875em;
|
||
|
|
--scroll-to-top-width: var(--scroll-input-width);
|
||
|
|
--scroll-to-top-height: var(--scroll-input-width);
|
||
|
|
--scroll-to-bottom-width: var(--scroll-input-width);
|
||
|
|
--scroll-to-bottom-height: var(--scroll-input-width);
|
||
|
|
}
|
||
|
|
|
||
|
|
.div-scrollToTop {
|
||
|
|
position: absolute;
|
||
|
|
bottom: var(--scroll-to-top-bottom);
|
||
|
|
right: var(--scroll-to-top-left);
|
||
|
|
z-index: 99;
|
||
|
|
}
|
||
|
|
|
||
|
|
.div-scrollToBottom {
|
||
|
|
position: absolute;
|
||
|
|
bottom: var(--scroll-to-bottom-bottom);
|
||
|
|
right: var(--scroll-to-bottom-left);
|
||
|
|
z-index: 99;
|
||
|
|
}
|
||
|
|
|
||
|
|
#__C_scrollToTop {
|
||
|
|
width: auto;
|
||
|
|
height: auto;
|
||
|
|
padding: 3px;
|
||
|
|
display: grid;
|
||
|
|
user-select: none;
|
||
|
|
border-radius: 6px;
|
||
|
|
transition: 200ms ease;
|
||
|
|
min-width: fit-content;
|
||
|
|
justify-content: space-around;
|
||
|
|
z-index: var(--layer-status-bar);
|
||
|
|
box-shadow: 0px 3px 32px rgb(31 38 135 / 15%);
|
||
|
|
border: 1px solid var(--background-modifier-border);
|
||
|
|
}
|
||
|
|
#__C_scrollToTop .buttonItem {
|
||
|
|
margin: 2px;
|
||
|
|
border: none;
|
||
|
|
cursor: pointer;
|
||
|
|
padding: 5px 6px;
|
||
|
|
box-shadow: none;
|
||
|
|
margin-left: 3px;
|
||
|
|
margin-right: 3px;
|
||
|
|
border-radius: 3px;
|
||
|
|
width: var(--scroll-to-top-width);
|
||
|
|
height: var(--scroll-to-top-height);
|
||
|
|
font-size: initial !important;
|
||
|
|
background-color: var(--background-primary-alt);
|
||
|
|
}
|
||
|
|
|
||
|
|
#__C_scrollToTop button.buttonItem:hover {
|
||
|
|
background-color: var(--background-secondary);
|
||
|
|
}
|
||
|
|
|
||
|
|
#__C_scrollToBottom {
|
||
|
|
width: auto;
|
||
|
|
height: auto;
|
||
|
|
padding: 3px;
|
||
|
|
display: grid;
|
||
|
|
user-select: none;
|
||
|
|
border-radius: 6px;
|
||
|
|
transition: 200ms ease;
|
||
|
|
min-width: fit-content;
|
||
|
|
justify-content: space-around;
|
||
|
|
z-index: var(--layer-status-bar);
|
||
|
|
box-shadow: 0px 3px 32px rgb(31 38 135 / 15%);
|
||
|
|
border: 1px solid var(--background-modifier-border);
|
||
|
|
}
|
||
|
|
#__C_scrollToBottom .buttonItem {
|
||
|
|
margin: 2px;
|
||
|
|
border: none;
|
||
|
|
cursor: pointer;
|
||
|
|
padding: 5px 6px;
|
||
|
|
box-shadow: none;
|
||
|
|
margin-left: 3px;
|
||
|
|
margin-right: 3px;
|
||
|
|
width: var(--scroll-to-bottom-width);
|
||
|
|
height: var(--scroll-to-bottom-height);
|
||
|
|
border-radius: 3px;
|
||
|
|
font-size: initial !important;
|
||
|
|
background-color: var(--background-primary-alt);
|
||
|
|
}
|
||
|
|
|
||
|
|
#__C_scrollToBottom button.buttonItem:hover {
|
||
|
|
background-color: var(--background-secondary);
|
||
|
|
}
|