VH_notion.so by versuchshaus

/* ==UserStyle==
@name         VH_notion.so
@version      20220227.15.09
@namespace    userstyles.world/user/versuchshaus
@description  This is my personal adaptation to notion.
A dark theme with customisation for better legibility and a little bit more playfulness.

Notion is awesome!!!
@author       versuchshaus
@license      No License
==/UserStyle== */

@-moz-document domain("notion.so") {
/* ######### FONTS ######### */
@import url('https://fonts.googleapis.com/css2?family=Raleway&display=swap');

* {
    font-family: 'Inter', sans-serif;
}

	
/* ######### BACKGROUND ######### */
.notion-frame {
	background: #191407cf !important;
}

	
/* ######### TIMELINE VIEW ######### */
.notion-timeline-view {
	background: #29220db0 !important;
}

.notion-collection_view-block {
	background: #0000003d !important;
}


/* ######### DIVIDER LINE ######### */
.notion-divider-block div div {
	border-bottom: rgba(202, 10, 255, .6) dotted 5px  !important;
} 

.notion-quote-block div div {
	border-left: rgba(255,163,68, .9) solid 7px  !important;
}

	
/* ######### Thinner Cover Image And Higher Content Block ######### */

/* There is some bugs with it.
On other screens\scaling\resolutions, it may look weird.
To fix it, Adjust "vh" values.
*/
/* Changing content block position, less height - higher content block */

/*
[style^="position: relative; width: 100%; display: flex; flex-direction: column; align-items: center; height: 30vh;"] {
  height: 10vh !important;
}
*/
/* Changing cover image height to match higher content block */
/*
[style^="position: relative; width: 100%; display: flex; flex-direction: column; align-items: center; height: 30vh;"] img {
  height: 16vh !important;
}
*/

/*

.notion-scroller div div div {
	height: 10vh !important;
}

.notion-page-content {
	color: #36af91;
}

.notion-scroller div div {
	height: 10vh;
}

*/

}