roam-research
/* | |
### ROAM CUSTOM THEME ### | |
> Many thanks to the Roam Slack community for all the resources, particularly @Anthony and @Mark for their patience with me that helped in this construction. Mostly adapted from Anthony's bear themes, with some mix and matches from other people's codes. I don't know what I'm doing really, just wanted to make it pretty. | |
> Edits by Rob Haisfield | |
> v1.0 | |
*/ | |
/* Editor */ | |
body {font-size: 150%; font-family: 'Inter' !important;} | |
div, textarea { | |
font-family: 'Inter' !important; | |
} | |
.loading-astrolabe { | |
margin: auto; | |
position: relative; | |
width: 250px; | |
height: 250px; | |
} | |
.loading-astrolabe .wand { | |
position: absolute; | |
width: 80%; | |
top: 24.5%; | |
left: 10%; | |
animation: nav 3.5s linear infinite; | |
} | |
.loading-astrolabe .wand-small { | |
position: absolute; | |
width: 80%; | |
top: 24.5%; | |
left: 11.5%; | |
} | |
.loading-astrolabe .background { | |
width: 100%; | |
border: none; | |
margin-left: -3px; | |
} | |
.spinner-astrolabe { | |
margin: auto; | |
margin-top: 100px; | |
position: relative; | |
width: 200px; | |
height: 200px; | |
} | |
.spinner-astrolabe .wand { | |
position: absolute; | |
width: 80%; | |
top: 24.5%; | |
left: 10%; | |
animation: nav 3.5s linear 20s; | |
} | |
.spinner-astrolabe .wand:hover { | |
animation: nav 3.5s linear infinite; | |
} | |
.spinner-astrolabe .wand-small { | |
position: absolute; | |
width: 80%; | |
top: 24.5%; | |
left: 11.5%; | |
} | |
.spinner-astrolabe .background { | |
width: 100%; | |
border: none; | |
margin-left: -3px; | |
} | |
@keyframes spin { | |
0% { | |
transform: rotate(0deg); | |
} | |
100% { | |
transform: rotate(360deg); | |
} | |
} | |
@keyframes nav { | |
0% { | |
transform: rotate(0deg); | |
} | |
15% { | |
transform: rotate(-30deg); | |
} | |
25% { | |
transform: rotate(30deg); | |
} | |
40% { | |
transform: rotate(-15deg); | |
} | |
50% { | |
transform: rotate(40deg); | |
} | |
70% { | |
transform: rotate(-50deg); | |
} | |
85% { | |
transform: rotate(75deg); | |
} | |
90% { | |
transform: rotate(-180deg); | |
} | |
100% { | |
transform: rotate(-355deg); | |
} | |
} | |
.spinner-square { | |
box-sizing: border-box; | |
width: 300px; | |
height: 300px; | |
background-color: grey; | |
display: grid; | |
grid-template-rows: 1fr 1fr; | |
padding: 20px; | |
grid-gap: 20px; | |
z-index: 3; | |
grid-template-columns: 1fr 1fr; | |
cursor: pointer; | |
} | |
.spinner-square .spinner-square-front { | |
background-color: white; | |
z-index: 5; | |
} | |
.spinner-square .spinner-square-rotate { | |
position: absolute; | |
margin-left: 75px; | |
margin-top: 75px; | |
background-color: black; | |
width: 150px; | |
height: 150px; | |
animation: spin 4.5s linear infinite; | |
} | |
.scrollbar { | |
margin-left: 30px; | |
float: left; | |
height: 300px; | |
width: 65px; | |
background: #F5F5F5; | |
overflow-y: scroll; | |
margin-bottom: 25px; | |
} | |
#scroll-1::-webkit-scrollbar-track { | |
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); | |
border-radius: 8px; | |
background-color: #F5F5F5; | |
} | |
#scroll-1::-webkit-scrollbar { | |
width: 8px; | |
background-color: #F5F5F5; | |
} | |
#scroll-1::-webkit-scrollbar-thumb { | |
border-radius: 8px; | |
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); | |
background-color: #8A9BA8; | |
} | |
#home { | |
padding: 50px; | |
background-color: blue; | |
color: #182026; | |
} | |
#home .icons { | |
padding-left: 20px; | |
} | |
#home .icons .bp3-icon-large:hover { | |
transform: scale(2); | |
margin-left: 60px; | |
} | |
#home2 .dark { | |
color: white; | |
background-color: #343a40; | |
} | |
#home2 .container { | |
margin: auto; | |
max-width: 1110px; | |
} | |
#home2 .block { | |
padding: 7em 0 0; | |
} | |
#home2 #header { | |
width: 100%; | |
position: fixed; | |
top: 0; | |
} | |
#home2 #header .nav { | |
display: flex; | |
flex: 0 0 auto; | |
align-items: center; | |
padding: 10px 14px; | |
} | |
#home2 #header .nav .bp3-button { | |
color: white; | |
} | |
#home2 #body { | |
margin-top: 50px; | |
} | |
#home2 h1 { | |
margin-bottom: 20px; | |
} | |
#home2 .row { | |
display: flex; | |
flex-wrap: wrap; | |
} | |
#home2 .col { | |
margin: 24px auto; | |
max-width: 300px; | |
} | |
#home2 #testimonials .testimonial { | |
text-align: center; | |
} | |
#home2 #logo-graph { | |
-webkit-filter: grayscale(100%) brightness(60%) contrast(10000000%); | |
opacity: .4; | |
display: grid; | |
} | |
#home2 #footer { | |
padding-bottom: 7em; | |
} | |
#page { | |
font-family: Segoe UI, Roboto, sans-serif; | |
} | |
#page1 { | |
margin: 0 auto; | |
padding-top: 4em; | |
max-width: 40em; | |
font-family: Segoe UI, Roboto, sans-serif; | |
color: #808080; | |
} | |
#page1 h1, | |
#page1 h2 { | |
color: #4d4d4d; | |
text-align: center; | |
} | |
#page1 .sub { | |
width: 400px; | |
margin: 8px auto; | |
} | |
#page1 .hero { | |
margin: 0 auto; | |
display: flex; | |
justify-content: center; | |
} | |
#page1 .hero button { | |
min-height: 50px; | |
font-size: 1.8em; | |
padding: 16px 20px; | |
margin: 8px; | |
} | |
#page1 .zk { | |
padding: 25px; | |
} | |
#page1 .quotes { | |
max-width: 80vw; | |
margin: 20px auto; | |
} | |
#page1 .quote { | |
float: right; | |
padding-top: 1em; | |
} | |
#secret-invite-wrapper { | |
height: 100vh; | |
background-color: black; | |
overscroll-behavior: none; | |
} | |
#secret-invite-wrapper #secret-invite { | |
position: relative; | |
margin: 0 auto; | |
padding-top: 4em; | |
max-width: 40em; | |
font-family: Segoe UI, Roboto, sans-serif; | |
color: #b3b3b3; | |
} | |
#secret-invite-wrapper #secret-invite #secret-scroll { | |
position: absolute; | |
height: 90vh; | |
overflow: scroll; | |
} | |
#secret-invite-wrapper #secret-invite h1, | |
#secret-invite-wrapper #secret-invite h2 { | |
color: #cccccc; | |
text-align: center; | |
} | |
#secret-invite-wrapper #secret-invite .sub { | |
width: 400px; | |
margin: 8px auto; | |
} | |
#secret-invite-wrapper #secret-invite .hero { | |
margin: 0 auto; | |
display: flex; | |
justify-content: center; | |
} | |
#secret-invite-wrapper #secret-invite .hero button { | |
min-height: 50px; | |
font-size: 1.8em; | |
padding: 16px 20px; | |
margin: 8px; | |
} | |
#secret-invite-wrapper #secret-invite .zk { | |
padding: 25px; | |
} | |
#secret-invite-wrapper #secret-invite .quotes { | |
max-width: 80vw; | |
margin: 20px auto; | |
} | |
#secret-invite-wrapper #secret-invite .quote { | |
float: right; | |
padding-top: 1em; | |
} | |
html { | |
scroll-behavior: smooth; | |
} | |
#landing-page * { | |
margin: 0; | |
padding: 0; | |
} | |
#landing-page #form { | |
display: flex; | |
flex-direction: column; | |
align-items: center; | |
padding: 12px; | |
} | |
#landing-page #form .ff { | |
text-align: center; | |
line-height: 1.8em; | |
font-size: 1.2em; | |
max-width: 400px; | |
} | |
#landing-page #form form { | |
display: flex; | |
flex-direction: column; | |
} | |
#landing-page #form form textarea { | |
max-width: 70vw; | |
width: 300px; | |
resize: none; | |
border: 1px solid lightgrey; | |
padding: 4px; | |
} | |
#landing-page #form form input { | |
max-width: 70vw; | |
width: 300px; | |
padding: 4px; | |
margin: 8px; | |
} | |
#landing-page #header ul { | |
display: flex; | |
list-style-type: none; | |
background-color: #293742; | |
color: #f5f8fa; | |
} | |
#landing-page #header ul .logo { | |
padding: 8px; | |
} | |
#landing-page #header ul li:hover { | |
background-color: #182026; | |
} | |
#landing-page #header ul li a { | |
display: block; | |
padding: 8px; | |
text-decoration: none; | |
width: 100%; | |
height: 100%; | |
color: inherit; | |
} | |
#landing-page #cover { | |
background-color: #182026; | |
padding: 40px 0 0 0; | |
min-height: 100vh; | |
color: #ced9e0; | |
display: flex; | |
flex-direction: column; | |
align-items: center; | |
} | |
#landing-page #cover .a { | |
background-color: #ced9e0; | |
color: #182026; | |
border-radius: 4px; | |
cursor: pointer; | |
text-decoration: none; | |
} | |
#landing-page #cover .a:hover { | |
color: #0e5a8a; | |
} | |
#landing-page #cover #tag-line { | |
padding: 30px 40px 0px; | |
} | |
#landing-page #cover #tag-line ul { | |
line-height: 32px; | |
margin-left: 32px; | |
margin-right: 16px; | |
margin-top: 25px; | |
font-size: 16px; | |
} | |
#landing-page #cover #endorsement { | |
margin: 80px 20px 20px; | |
} | |
#landing-page #cover #callouts { | |
margin-top: 10%; | |
} | |
#landing-page #cover #callouts button { | |
font-size: 20px; | |
padding: 20px; | |
background-color: #182026; | |
} | |
#landing-page #cover #image-collection { | |
flex: 1 1 400px; | |
max-width: 500px; | |
background-color: #ced9e0; | |
color: #293742; | |
padding: 40px 40px 40px; | |
display: flex; | |
flex-direction: column; | |
align-items: center; | |
} | |
#landing-page #cover #image-collection #images { | |
color: #182026; | |
padding: 40px 0px; | |
display: grid; | |
grid-template-columns: repeat(auto-fill, minmax(100px, auto)); | |
grid-column-gap: 20px; | |
justify-items: start; | |
align-items: center; | |
} | |
#landing-page #cover #image-collection #images img { | |
margin: 8px; | |
max-height: 70px; | |
max-width: 100%; | |
} | |
#landing-page #features { | |
padding: 40px 40px; | |
background-color: #293742; | |
border-top: 1px solid #5c7080; | |
color: #d8e1e8; | |
flex-direction: column; | |
} | |
#landing-page #features ul { | |
padding-left: 16px; | |
} | |
#landing-page #features .feature { | |
margin: 40px 0px; | |
display: flex; | |
justify-content: center; | |
flex-wrap: wrap; | |
} | |
#landing-page #features .feature .feature-content { | |
width: 400px; | |
margin: 40px; | |
} | |
#landing-page #features .feature .feature-image { | |
min-height: 400px; | |
min-width: 400px; | |
background-color: grey; | |
} | |
.rm-emoji-block-view { | |
display: flex; | |
flex: 0 0 auto; | |
flex-wrap: wrap; | |
margin-left: 40px; | |
align-items: center; | |
} | |
.rm-emoji-block-view .rm-emoji-button { | |
display: flex; | |
flex: 0 0 auto; | |
align-items: center; | |
cursor: pointer; | |
border-radius: 20px; | |
height: 20px; | |
margin: 0px 4px 4px 0px; | |
} | |
.rm-emoji-block-view .rm-emoji-button .rm-emoji { | |
height: 16px; | |
margin: 0px 4px; | |
} | |
.rm-emoji-block-view .rm-emoji-button .rm-emoji-number { | |
height: 100%; | |
font-size: 10px; | |
margin-right: 6px; | |
font-weight: 500; | |
} | |
.rm-emoji-tooltip { | |
max-width: 200px; | |
overflow-wrap: break-word; | |
font-size: 12px; | |
color: white; | |
font-weight: 600; | |
} | |
.kanban-board { | |
background-color: #a7b6c2; | |
min-width: 100%; | |
min-height: 48px; | |
padding: 8px; | |
overflow-x: scroll; | |
} | |
.kanban-column { | |
background-color: #ededed; | |
margin: 0px 4px 0px 4px; | |
padding: 4px; | |
min-width: 200px; | |
} | |
.kanban-title { | |
text-align: center; | |
} | |
.kanban-card { | |
background-color: white; | |
margin: 8px; | |
padding: 8px; | |
} | |
html { | |
font-family: 'Inter', sans-serif; | |
} | |
@supports (font-variation-settings: normal) { | |
html { | |
font-family: 'Inter var', sans-serif; | |
} | |
} | |
body { | |
overscroll-behavior: none; | |
} | |
::-webkit-scrollbar { | |
width: 0px; | |
background: transparent; | |
} | |
* { | |
box-sizing: border-box; | |
} | |
*:focus { | |
outline-width: 0; | |
} | |
.roam-lift { | |
z-index: 10000; | |
} | |
.CodeMirror { | |
height: auto !important; | |
} | |
@media (max-width: 500px) { | |
.bp3-omnibar { | |
max-width: 310px; | |
left: calc((100vw - 310px) / 2); | |
} | |
} | |
.rm-line { | |
background-color: #ced9e0; | |
flex: 0 0 1px; | |
} | |
.roam-body { | |
height: 100vh; | |
overflow: hidden; | |
position: relative; | |
background-color: #fdf6e3; /* RTB add: bear color - solarized light */ | |
} | |
.roam-body .roam-app { | |
height: 100%; | |
width: 100%; | |
position: relative; | |
-webkit-overflow-scrolling: touch; | |
color: #202b33; | |
} | |
.roam-body .roam-app h1 { | |
color: #202b33; | |
} | |
.roam-body .roam-app .roam-sidebar-container { | |
position: absolute; | |
top: 45px; | |
left: -232px; | |
width: 232px; | |
bottom: 45px; | |
z-index: 999; | |
transition: all 200ms ease-in; | |
background-color: #2f3437; | |
background-color: #182026; | |
} | |
.roam-body .roam-app .roam-sidebar-container .roam-hover-sidebar-reveal { | |
position: absolute; | |
z-index: 99; | |
top: 0px; | |
right: -8px; | |
bottom: 0px; | |
width: 0px; | |
} | |
.roam-body .roam-app .roam-sidebar-container .roam-sidebar-topnav { | |
position: absolute; | |
top: 0; | |
padding: 16px; | |
} | |
.roam-body .roam-app .roam-sidebar-container .roam-sidebar-content { | |
height: 100%; | |
position: relative; | |
} | |
.roam-body .roam-app .roam-sidebar-container .roam-sidebar-content .log-button { | |
padding: 8px 20px; | |
font-weight: bold; | |
cursor: pointer; | |
font-size: 14px; | |
color: #5c7080; | |
} | |
.roam-body .roam-app .roam-sidebar-container .roam-sidebar-content .log-button:hover { | |
color: #f5f8fa; | |
background-color: #10161a; | |
} | |
.roam-body .roam-app .roam-sidebar-container .roam-sidebar-content .starred-pages-wrapper { | |
color: #5c7080; | |
} | |
.roam-body .roam-app .roam-sidebar-container .roam-sidebar-content .starred-pages-wrapper .starred-pages { | |
overflow-y: auto; | |
} | |
.roam-body .roam-app .roam-sidebar-container .roam-sidebar-content .starred-pages-wrapper .starred-pages .page { | |
text-decoration: none; | |
cursor: pointer; | |
font-size: 14px; | |
padding: 8px 0px 8px 4px; | |
color: #5c7080; | |
} | |
.roam-body .roam-app .roam-sidebar-container .roam-sidebar-content .starred-pages-wrapper .starred-pages .page:hover { | |
color: #f5f8fa; | |
background-color: #10161a; | |
} | |
.roam-body .roam-app .roam-sidebar-container .roam-sidebar-content .starred-pages-wrapper .title { | |
padding: 8px; | |
margin-bottom: 8px; | |
font-size: 14px; | |
font-weight: bold; | |
} | |
.roam-body .roam-app .roam-sidebar-container .roam-sidebar-content .roam-sidebar-body { | |
margin-top: 64px; | |
width: 100%; | |
transition: all 150ms ease-in; | |
position: absolute; | |
overflow: scroll; | |
} | |
.roam-body .roam-app .roam-main { | |
width: 100%; | |
display: flex; | |
} | |
.roam-body .roam-app .roam-main .roam-article { | |
position: relative; | |
padding: 16px 42px 120px; | |
font-size: 20px; /* RTB add: larger font */ | |
color: #444444; /* RTB add: roam color - solarized light */ | |
} | |
.roam-body .roam-app .roam-main .roam-article .rm-title-display { | |
margin-bottom: 32px; | |
} | |
#right-sidebar .rm-reference-container { | |
padding-top: 0px; | |
border-top: none; | |
} | |
.roam-block .rm-reference-container { | |
padding-top: 0px; | |
border-top: none; | |
} | |
.pointer { | |
cursor: pointer; | |
} | |
.roam-topbar { | |
height: 45px; | |
position: fixed; | |
width: 100%; | |
z-index: 101; | |
background-color: #fcf5e5; /* RTB change: bear background - solarized light */ | |
padding-right: 16px; | |
padding-left: 16px; | |
display: flex; | |
flex-direction: column; | |
justify-content: center; | |
} | |
.trunc { | |
max-width: 120px; | |
white-space: nowrap; | |
text-overflow: ellipsis; | |
overflow: hidden; | |
} | |
.bblack { | |
border: 1px solid black; | |
background-color: lightgrey; | |
} | |
.roam-popup-container { | |
display: flex; | |
flex-direction: column; | |
overflow: scroll; | |
} | |
.roam-popup-container .roam-popup-content { | |
position: absolute; | |
top: 34px; | |
bottom: 10px; | |
width: 100%; | |
overflow-y: scroll; | |
} | |
.rm-input { | |
width: 100%; | |
outline: 1px solid transparent; | |
vertical-align: top; | |
background-color: transparent; | |
border: none; | |
resize: none; | |
} | |
.rm-input::-webkit-input-placeholder { | |
color: #ced9e0; | |
} | |
.rm-input:-moz-placeholder { | |
/* Firefox 18- */ | |
color: #ced9e0; | |
} | |
.rm-input::-moz-placeholder { | |
/* Firefox 19+ */ | |
color: #ced9e0; | |
} | |
.rm-input:-ms-input-placeholder { | |
color: #ced9e0; | |
} | |
.rm-input::placeholder { | |
color: #ced9e0; | |
} | |
.rm-title-textarea { | |
width: 100%; | |
outline: 1px solid transparent; | |
vertical-align: top; | |
line-height: 1.3em; | |
background-color: transparent; | |
border: none; | |
resize: none; | |
} | |
.rm-title-textarea::-webkit-input-placeholder { | |
color: #ced9e0; | |
} | |
.rm-title-textarea:-moz-placeholder { | |
/* Firefox 18- */ | |
color: #ced9e0; | |
} | |
.rm-title-textarea::-moz-placeholder { | |
/* Firefox 19+ */ | |
color: #ced9e0; | |
} | |
.rm-title-textarea:-ms-input-placeholder { | |
color: #ced9e0; | |
} | |
.rm-title-textarea::placeholder { | |
color: #ced9e0; | |
} | |
.rm-title-untitled { | |
color: #ced9e0; | |
} | |
.rm-title-display { | |
line-height: 1.3em; | |
font-weight: 450; | |
word-break: break-word; | |
min-width: 100px; | |
width: 100%; | |
cursor: text; | |
outline: 1px solid transparent; | |
} | |
.roam-log-container .roam-log-page { | |
border-top: 1px solid #738694; | |
margin-top: 40px; | |
padding-top: 40px; | |
padding-bottom: 16px; | |
margin-bottom: 16px; | |
} | |
.roam-log-container .roam-log-page:first-child { | |
border: 0px solid blue; | |
margin-top: 0px; | |
min-height: 500px; | |
padding-top: 0px; | |
} | |
.roam-log-container .roam-log-preview { | |
color: #8a9ba8; | |
} | |
.roam-log-container .roam-log-preview h1 { | |
color: #8a9ba8; | |
} | |
.roam-log-container .roam-log-preview:hover { | |
background-color: grey; | |
} | |
#buffer { | |
display: flex; | |
flex-direction: column; | |
} | |
#buffer .help-title { | |
color: #f5f8fa; | |
text-align: center; | |
font-size: 16px; | |
font-weight: bold; | |
} | |
#buffer .help-sub-title { | |
color: #e1e8ed; | |
text-align: center; | |
} | |
#buffer .help-item-text { | |
color: #e1e8ed; | |
} | |
#buffer .help-item-label { | |
opacity: 0.6; | |
color: #e1e8ed; | |
} | |
.roam-table { | |
padding-bottom: 24px; | |
overflow-x: scroll; | |
} | |
.roam-table th, | |
.roam-table td, | |
.roam-table tr { | |
font-size: 12px; | |
min-width: 100px; | |
max-height: 20px; | |
padding: 8px 16px; | |
margin: 0p; | |
border: 1px solid grey; | |
} | |
.roam-table td { | |
max-height: 20px; | |
overflow: scroll; | |
} | |
.import-table { | |
padding-bottom: 24px; | |
max-width: 100%; | |
} | |
.import-table table { | |
width: 100%; | |
} | |
.import-table th, | |
.import-table td, | |
.import-table tr { | |
font-size: 12px; | |
max-height: 20px; | |
padding: 8px 16px; | |
margin: 0p; | |
border: 1px solid grey; | |
} | |
.import-table td { | |
max-height: 20px; | |
} | |
.import-table td .import-preview { | |
white-space: pre-wrap; | |
word-break: break-word; | |
max-width: 50px; | |
} | |
#info { | |
padding: 8px 0px; | |
margin: 0px 8px; | |
font-size: 12px; | |
} | |
#info table { | |
margin: 0 auto; | |
} | |
#info table, | |
#info th, | |
#info td { | |
padding: 8px; | |
margin: 0p; | |
border: 1px solid grey; | |
} | |
.hoverparent:hover .hoveronly { | |
opacity: 1; | |
} | |
.hoveronly { | |
opacity: 0; | |
} | |
.hoveronly:hover { | |
opacity: 1; | |
} | |
.tiny { | |
font-size: 7px; | |
} | |
.CodeMirror { | |
font-family: monospace; | |
} | |
.CodeMirror .CodeMirror-code pre { | |
font-family: monospace; | |
box-shadow: none; | |
} | |
.block-mention { | |
margin: 4px 8px 4px 0px; | |
cursor: pointer; | |
padding: 8px; | |
background-color: #bfccd6; | |
} | |
.block-mention:hover { | |
background-color: #a7b6c2; | |
} | |
.rm-page-ref { | |
cursor: pointer; | |
} | |
.rm-page-ref:hover { | |
text-decoration: underline; | |
} | |
.rm-page-ref-tag { | |
color: #a7b6c2; | |
} | |
.rm-page-ref-brackets { | |
color: #268bd261; /* color of brackets*/ | |
} | |
.rm-page-ref-link-color { | |
color: #9d6500; /* color of page link references*/ | |
} | |
.rm-page-ref-namespace-color { | |
color: green; | |
} | |
.rm-block-ref { | |
padding: 4px 2px; | |
margin: -4px 0px; | |
font-size: 20px; /* RTB change: block ref's same size as others */ | |
display: inline; | |
border-bottom: 1px solid #93a1a1; | |
cursor: alias; | |
padding-left: 0px; /* RTB add: align to left */ | |
} | |
.rm-block-ref:hover { | |
background-color: #f5f8fa; | |
} | |
.rm-reference-container { | |
border-top: 2px solid #202b33; | |
padding-top: 12px; | |
margin-bottom: 8px; | |
} | |
.check-container { | |
display: inline-block; | |
position: relative; | |
padding-left: 16px; /* RTB change: align checkbox for updated spacing */ | |
margin-bottom: 10px; | |
cursor: pointer; | |
font-size: 22px; | |
-webkit-user-select: none; | |
-moz-user-select: none; | |
-ms-user-select: none; | |
user-select: none; | |
vertical-align: bottom; | |
top: -12px; /* RTB change: align checkbox for updated spacing */ | |
} | |
/* Hide the browser's default checkbox */ | |
.check-container input { | |
position: absolute; | |
opacity: 0; | |
cursor: pointer; | |
height: 0; | |
width: 0; | |
} | |
/* Create a custom checkbox */ | |
.checkmark { | |
position: absolute; | |
top: 0px; | |
left: 0; | |
height: 12px; | |
border-radius: 2px; | |
width: 12px; | |
border: 1px solid #a7b6c2; | |
} | |
/* On mouse-over, add a grey background color */ | |
/* When the checkbox is checked, add a blue background */ | |
.check-container input:checked ~ .checkmark { | |
background-color: #9d6500; /* solarized light */ | |
border: none; | |
} | |
/* Create the checkmark/indicator (hidden when not checked) */ | |
.checkmark:after { | |
content: ""; | |
position: absolute; | |
display: none; | |
} | |
/* Show the checkmark when checked */ | |
.check-container input:checked ~ .checkmark:after { | |
display: block; | |
} | |
/* Style the checkmark/indicator */ | |
.check-container .checkmark:after { | |
left: 3.5px; | |
top: 0.25px; | |
width: 5px; | |
height: 10px; | |
border: solid white; | |
border-width: 0 2px 2px 0; | |
-webkit-transform: rotate(45deg); | |
-ms-transform: rotate(45deg); | |
transform: rotate(40deg) scale(0.8); | |
} | |
#roam-sidebar-logo a { | |
text-decoration: none; | |
} | |
#roam-sidebar-logo:hover { | |
background-color: #10161a; | |
} | |
.rm-find-or-create-wrapper { | |
position: relative; | |
transition: all 200ms ease-in; | |
} | |
.rm-find-or-create-wrapper .bp3-transition-container { | |
width: 100%; | |
} | |
.rm-find-or-create-wrapper .bp3-menu { | |
max-width: none; | |
max-height: 400px; | |
} | |
.rm-find-or-create-wrapper .rm-menu-item { | |
padding: 6px; | |
cursor: pointer; | |
border-radius: 2px; | |
} | |
.rm-find-or-create-wrapper .rm-menu-item .rm-search-title { | |
font-weight: bold; | |
} | |
.rm-find-or-create-wrapper .rm-menu-item .rm-search-title .rm-new-page { | |
color: #0d8050; | |
} | |
.rm-find-or-create-wrapper .rm-menu-item .rm-search-list-item { | |
word-break: break-word; | |
color: #8a9ba8; | |
overflow-wrap: break-spaces; | |
margin-left: -20px; | |
} | |
.rm-fill { | |
width: 100%; | |
} | |
.rm-pages-sort-menu-item { | |
padding-right: 16px; | |
padding-left: 16px; | |
font-weight: bold; | |
} | |
.rm-pages-row-highlight { | |
background-color: #f5f8fa; | |
} | |
.rm-pages-row { | |
display: flex; | |
flex: 0 0 auto; | |
justify-content: space-between; | |
align-items: flex-start; | |
} | |
.rm-pages-row .rm-pages-sort-header { | |
display: flex; | |
flex: 0 0 auto; | |
align-items: center; | |
cursor: pointer; | |
} | |
.rm-pages-row .rm-pages-sort-header:hover { | |
text-decoration: underline; | |
} | |
.rm-pages-row .rm-pages-title-col { | |
padding: 8px 4px; | |
flex: 1 0 50%; | |
text-overflow: ellipsis; | |
} | |
.rm-pages-row .rm-pages-action-col { | |
text-align: right; | |
flex: 1 0 0; | |
padding: 8px 4px; | |
} | |
.rm-pages-row .rm-pages-col { | |
color: #8a9ba8; | |
padding: 8px 4px; | |
flex: 1 0 15%; | |
} | |
.rm-reference-item { | |
margin-top: 8px; | |
margin-right: 8px; | |
flex: 1 1 100%; | |
word-break: break-word; | |
background-color: #f5f8fa; | |
padding-right: 8px; | |
} | |
.rm-level1 { | |
font-family: 'Computer Modern Serif'; /* RTB change */ | |
font-weight: 400; | |
font-size: 1.8em; | |
} | |
.rm-level1 textarea { | |
line-height: 1.2; | |
} | |
.rm-level1 .roam-block { | |
line-height: 1.2; | |
margin-top: -8px; /* RTB add */ | |
} | |
.rm-level2 { | |
font-family: 'Computer Modern Serif' !important; /* RTB change */ | |
font-weight: 400; | |
font-size: 1.4em; | |
} | |
/* RTB new section */ | |
.rm-level2 .roam-block { | |
margin-top: -8px; | |
} | |
.rm-level3 { | |
font-weight: 500; | |
font-size: 1.2em; | |
color: #5c7080; | |
} | |
/* RTB new section */ | |
.rm-level3 .roam-block { | |
margin-top: -5px; | |
} | |
.rm-title1 { | |
word-break: break-word; | |
font-weight: 400; | |
} | |
.rm-histogram-table { | |
width: 100%; | |
margin-left: -8px; | |
box-sizing: border-box; | |
} | |
.rm-histogram-table td { | |
vertical-align: top; | |
min-width: 18px; | |
max-width: 18px; | |
border: 1px solid transparent; | |
} | |
.rm-histogram-table td .flex-v-box { | |
border-right: 0.2px solid #48aff0; | |
justify-content: flex-start; | |
align-items: center; | |
} | |
.rm-histogram-table td .flex-v-box .bp3-popover-wrapper { | |
margin-top: 0px; | |
margin-bottom: 0px; | |
padding-bottom: 0px; | |
} | |
.rm-histogram-table td .flex-v-box .table-edited-by-view { | |
transform-origin: center; | |
background-size: cover; | |
border: 1px solid darkgray; | |
font-size: 0.7em; | |
height: 12px; | |
width: 12px; | |
margin: 0px; | |
padding: 0px; | |
border-radius: 100%; | |
background-repeat: no-repeat; | |
} | |
.slider .slider-cell { | |
border: 1px solid transparent; | |
flex: "1 0 100%"; | |
} | |
.slider .flex-v-box { | |
justify-content: flex-start; | |
align-items: center; | |
} | |
.slider .flex-v-box .bp3-popover-wrapper { | |
margin-top: 0px; | |
margin-bottom: 0px; | |
padding-bottom: 0px; | |
} | |
.slider .flex-v-box .table-edited-by-view { | |
transform-origin: center; | |
background-size: cover; | |
border: 1px solid darkgray; | |
font-size: 0.7em; | |
height: 12px; | |
width: 12px; | |
margin: 0px; | |
padding: 0px; | |
border-radius: 100%; | |
background-repeat: no-repeat; | |
} | |
.nowrap { | |
white-space: nowrap; | |
} | |
#rm-mobile-bar .rm-mobile-button { | |
flex: 1 0 0; | |
} | |
.roam-intense { | |
background-color: yellow; | |
margin: -2px; | |
padding: 2px; | |
} | |
.roam-highlight { | |
background-color: #abffa0c4; | |
margin: -2px; | |
padding: 2px; | |
} | |
.roam-bullet-closed { | |
background-color: #ced9e0; | |
} | |
#right-sidebar .roam-bullet-closed { | |
background-color: #a7b6c2; | |
} | |
.level1 { | |
font-family: Roboto, sans-serif; | |
font-weight: 200; | |
font-size: 40px; | |
color: #444444; | |
letter-spacing: normal; | |
/*-ms-font-feature-settings: 'ss20' 1;*/ | |
} | |
.rm-pm-editor { | |
padding: 5px; | |
min-height: 100px; | |
outline: 0 !important; | |
} | |
.rm-pm-editor h1 { | |
font-family: 'Inter', sans-serif; | |
font-weight: 400; | |
font-size: 1.8em; | |
} | |
.rm-pm-editor h1 textarea { | |
line-height: 1.2; | |
} | |
.rm-pm-editor h1 .roam-block { | |
line-height: 1.2; | |
} | |
.rm-pm-editor h2 { | |
font-family: 'Inter', sans-serif !important; | |
font-weight: 400; | |
font-size: 1.4em; | |
} | |
.rm-pm-editor h3 { | |
font-weight: 500; | |
font-size: 1.2em; | |
color: #5c7080; | |
} | |
.rm-pm-editor img { | |
max-width: 100%; | |
} | |
.rm-pm-sub-editor-wrapper { | |
padding: 2.5px; | |
margin: 2px; | |
background-color: rgba(201, 201, 207, 0.1); | |
} | |
.rm-section-item { | |
width: -webkit-max-content; | |
width: -moz-max-content; | |
width: max-content; | |
} | |
.rm-section { | |
background-color: yellow; | |
} | |
.rm-section-selected { | |
background-color: lightblue; | |
} | |
.rm-edit-view-wrapper { | |
min-width: 21px; | |
} | |
.edited-by-view { | |
flex: 0 0 21px; | |
transform-origin: center; | |
background-size: cover; | |
border: 1px solid darkgray; | |
font-size: 0.7em; | |
margin-top: 6.5px; | |
margin-right: 6px; | |
margin-left: 0px; | |
height: 15px; | |
width: 15px; | |
border-radius: 100%; | |
background-repeat: no-repeat; | |
} | |
.roam-block-container { | |
max-width: 740px; | |
border-radius: 2px; | |
} | |
.block-highlight-grey { | |
background-color: #ced9e0; | |
} | |
.block-highlight-blue { | |
background-color: #7cccff; | |
} | |
.block-highlight-yellow { | |
background-color: yellow; | |
} | |
.block-bullet-view { | |
flex: 1 1 100%; | |
margin-left: 5px; | |
} | |
.block-border-left { | |
/* border-left: 1px solid #bfccd6; RTB: Remove left-side vertical lines */ | |
} | |
.text-align-left { | |
text-align: left; | |
} | |
.text-align-center { | |
text-align: center; | |
} | |
.text-align-right { | |
text-align: right; | |
} | |
.text-align-justify { | |
text-align: justify; | |
} | |
.roam-block { | |
min-height: calc(1.5em + 8px); | |
box-sizing: border-box; | |
white-space: pre-wrap; | |
overflow-wrap: break-word; | |
margin-top: -1px; | |
min-width: 100px; | |
width: 100%; | |
line-height: 1.5em; | |
cursor: text; | |
padding-top: 4px; | |
padding-bottom: 4px; | |
} | |
.roam-block .span-view { | |
box-sizing: border-box; | |
} | |
.rm-block-text { | |
max-width: 700px; /* RTB change: desired section width */ | |
} | |
.controls { | |
display: flex; | |
flex: 0 0 40px; | |
padding-top: 4px; | |
padding-left: 4px; | |
} | |
.controls .block-expand { | |
transform: scale(1); | |
transform-origin: center; | |
} | |
.controls .block-expand .rm-caret { | |
transition: all 100ms ease-in; | |
} | |
.controls .block-expand .rm-rotate-90 { | |
transform: rotate(-90deg); | |
} | |
.controls .opacity-none { | |
opacity: 0; | |
} | |
.controls .opacity-7 { | |
opacity: 0.7; | |
} | |
.controls .cursor-pointer { | |
cursor: pointer; | |
} | |
.controls .cursor-grab { | |
cursor: grab; | |
} | |
.controls .bk-light-grey { | |
background-color: #ced9e0; | |
} | |
.controls .simple-bullet-outer { | |
display: flex; | |
height: 13px; | |
width: 13px; | |
margin-top: 6.3px; /* RTB change: center bullet to match font sizing */ | |
border-radius: 50%; | |
justify-content: center; | |
align-items: center; | |
} | |
.controls .simple-bullet-outer .simple-bullet-inner { | |
border-radius: 50%; | |
width: 5px; | |
height: 5px; | |
background-color: #9d6500; /* RTB change: solarized light bullet */ | |
} | |
.version-bullet { | |
background-color: #a7b6c2; | |
border: none; | |
display: flex; | |
cursor: pointer; | |
flex-direction: column; | |
align-items: center; | |
justify-content: center; | |
padding: 0px; | |
transform: scale(0.9); | |
transform-origin: center; | |
margin-top: 2px; | |
margin-left: 0px; | |
height: 16px; | |
font-size: 9px; | |
color: white; | |
text-align: center; | |
min-height: 16px; | |
max-height: 16px; | |
min-width: 16px; | |
max-width: 16px; | |
border-radius: 16px; | |
} | |
.dnd-separator { | |
position: relative; | |
width: 100%; | |
} | |
.dnd-separator .dnd-drop-area { | |
position: absolute; | |
top: -11px; | |
height: 28px; | |
width: 100%; | |
} | |
.dnd-separator .dnd-drop-bar { | |
position: absolute; | |
z-index: 0; | |
top: -4px; | |
left: 20px; | |
width: 96%; | |
height: 4px; | |
border-radius: 10px; | |
background-color: #5c7080; | |
} | |
.rm-database { | |
background-color: #182026; | |
color: #ced9e0; | |
} | |
.rm-mentions-search-items { | |
padding: 8px; | |
} | |
.rm-mentions-search-items .rm-mentions-title { | |
font-size: 20px; | |
font-weight: lighter; | |
margin: 4px; | |
} | |
.rm-mentions-search-items .rm-mentions-search-item { | |
padding: 12px; | |
cursor: pointer; | |
background-color: #f5f8fa; | |
border: 1px solid #bfccd6; | |
} | |
.rm-mentions-search-items .rm-mentions-search-item:hover { | |
background-color: #bfccd6; | |
} | |
.block-ref-count-button { | |
font-size: 0.9em; | |
} | |
.rm-grey-text { | |
color: #8a9ba8; | |
} | |
.rm-red-text { | |
color: red; | |
} | |
.flex-v-box { | |
display: flex; | |
flex: 0 0 auto; | |
flex-direction: column; | |
} | |
.flex-h-box { | |
display: flex; | |
flex: 0 0 auto; | |
padding-bottom: 10px; /* RTB add: a little extra space between bullets */ | |
} | |
.flex-align-start { | |
align-items: flex-start; | |
} | |
.flex-justify-start { | |
justify-content: flex-start; | |
} | |
.tags-input { | |
display: inline-block; | |
width: 10em; | |
margin: 0 0 4px; | |
padding: 4px 6px; | |
background: none; | |
border: 0; | |
outline: 0; | |
font: inherit; | |
color: inherit; | |
text-align: left; | |
text-shadow: none; | |
} | |
.tags-input:focus { | |
/* box-shadow: 0 0 5px rgba(81, 203, 238, 1); */ | |
/* border: 2px solid white; */ | |
/* border-bottom-color: #448cca; */ | |
} | |
.tags-output { | |
display: inline-block; | |
margin-left: 4px; | |
} | |
.tags-output-item { | |
display: inline-block; | |
background-color: lightgrey; | |
cursor: pointer; | |
margin: 0 4px 4px 0; | |
padding: 4px 6px; | |
font-size: 10px; | |
border-radius: 4px; | |
} | |
.tags-output-item2 { | |
background-color: black; | |
display: inline-block; | |
text-decoration: none; | |
color: white; | |
cursor: pointer; | |
margin-left: 6px; | |
} | |
html { | |
margin: 0; | |
min-height: 100%; | |
} | |
body { | |
margin: 0; | |
padding: 0; | |
} | |
div { | |
font-family: 'Computer Modern Serif'; /* RTB change: desired font (bear) */ | |
font-size: 1em; | |
line-height: 1.5em; | |
margin: 0px; | |
padding: 0px; | |
} | |
textarea { | |
font-family: 'Computer Modern Serif'; /* RTB change: desired font (bear) */ | |
font-size: 1em; | |
line-height: 1.5em; | |
margin: 0px; | |
padding: 0px; | |
} | |
.xtra { | |
transform: scale(3); | |
border-radius: 50%; | |
padding: 4px; | |
} | |
.border { | |
border: 1px solid ; | |
} | |
.display-flex { | |
display: -webkit-flex; | |
display: flex; | |
} | |
.display-inline-flex { | |
display: -webkit-inline-flex; | |
display: inline-flex; | |
} | |
.react-resizable { | |
position: relative; | |
} | |
.react-resizable-handle { | |
position: absolute; | |
width: 20px; | |
height: 20px; | |
bottom: 0; | |
right: 0; | |
background: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2IDYiIHN0eWxlPSJiYWNrZ3JvdW5kLWNvbG9yOiNmZmZmZmYwMCIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSI2cHgiIGhlaWdodD0iNnB4Ij48ZyBvcGFjaXR5PSIwLjMwMiI+PHBhdGggZD0iTSA2IDYgTCAwIDYgTCAwIDQuMiBMIDQgNC4yIEwgNC4yIDQuMiBMIDQuMiAwIEwgNiAwIEwgNiA2IEwgNiA2IFoiIGZpbGw9IiMwMDAwMDAiLz48L2c+PC9zdmc+'); | |
background-position: bottom right; | |
padding: 0 3px 3px 0; | |
background-repeat: no-repeat; | |
background-origin: content-box; | |
box-sizing: border-box; | |
cursor: se-resize; | |
} | |
.resize-card { | |
overflow-y: hidden; | |
} | |
.noselect { | |
-webkit-touch-callout: none; | |
/* iOS Safari */ | |
-webkit-user-select: none; | |
/* Safari */ | |
-khtml-user-select: none; | |
/* Konqueror HTML */ | |
-moz-user-select: none; | |
/* Firefox */ | |
-ms-user-select: none; | |
/* Internet Explorer/Edge */ | |
user-select: none; | |
/* Non-prefixed version, currently */ | |
} | |
/* RTB additions below */ | |
#roam-right-sidebar-content span.simple-bullet-outer.cursor-grab { | |
margin-top: 3px; | |
} | |
#roam-right-sidebar-content .block-bullet-view .simple-bullet-outer { | |
margin-top: 3px; | |
} | |
#roam-right-sidebar-content .rm-level1 .roam-block { | |
margin-top: -5px; | |
} | |
#roam-right-sidebar-content .rm-level2 .roam-block { | |
margin-top: -5px; | |
} | |
#roam-right-sidebar-content .rm-level3 .roam-block { | |
margin-top: -3px; | |
} | |
#roam-right-sidebar-content { | |
font-size: 16px; | |
} | |
#roam-right-sidebar-content .rm-block-ref { | |
font-size: 14px; /* make block ref in side-bar a little smaller to show that's it's a reference */ | |
/* color: #9d6500; Don't change color of full block ref in sidebar */ | |
} | |
a { | |
color: #9d6500; /* solarized light color */ | |
} | |
/* | |
Popup menu when typing / below | |
.bp3-elevation-3 { | |
background-color: navajowhite !important; | |
} | |
.bp3-elevation-3 div { | |
font-family: ... | |
} | |
*/ | |
#right-sidebar { | |
background-color: rgb(247, 249, 251) !important; /* nicer light gray color */ | |
} | |
/* target block embeds on main page and in sidebar */ | |
div[id^='block-input-'] > span > div { | |
background-color: #acb0e830 !important; | |
} | |
/* RTB additions below */ | |
#roam-right-sidebar-content span.simple-bullet-outer.cursor-grab { | |
margin-top: 3px; | |
} | |
#roam-right-sidebar-content .block-bullet-view .simple-bullet-outer { | |
margin-top: 3px; | |
} | |
#roam-right-sidebar-content .rm-level1 .roam-block { | |
margin-top: -5px; | |
} | |
#roam-right-sidebar-content .rm-level2 .roam-block { | |
margin-top: -5px; | |
} | |
#roam-right-sidebar-content .rm-level3 .roam-block { | |
margin-top: -3px; | |
} | |
/* Side Bar */ | |
.roam-body .roam-app .roam-sidebar-container .roam-sidebar-content .log-button, | |
.roam-body .roam-app .roam-sidebar-container .roam-sidebar-content .starred-pages-wrapper, | |
.roam-body .roam-app .roam-sidebar-container .roam-sidebar-content .starred-pages-wrapper .starred-pages .page { | |
background-color: #586f76; | |
color: #e9e1cc; | |
} | |
/* Better hover effect for shortcut pages in left side-bar */ | |
.roam-body .roam-app .roam-sidebar-container .roam-sidebar-content .starred-pages-wrapper .starred-pages .page:hover { | |
color: #DAD5B6; | |
background-color: #767558; | |
} | |
/* Omni Sidebar Hover State */ | |
.roam-body .roam-app .roam-sidebar-container .roam-sidebar-content .log-button:hover { | |
color: #DAD5B6; | |
background-color: #767558; | |
} | |
/* Side Bar Open/Close Icon */ | |
.bp3-button:before, | |
.bp3-minimal:before, | |
.bp3-icon-menu:before, | |
.bp3-small:before { | |
color: #e9e1cc !important; | |
} | |
/* Change sideboard to all one color */ | |
.roam-body .roam-app .roam-sidebar-container { | |
background-color: #586F76 !important; | |
} | |
/*Change Roam Research logo color to match theme*/ | |
#roam-sidebar-logo { | |
filter: brightness(0) saturate(100%) invert(92%) sepia(20%) saturate(457%) hue-rotate(315deg) brightness(108%) contrast(99%); | |
} | |
#roam-sidebar-logo:focus, #roam-sidebar-logo:hover { | |
text-decoration: none !important; | |
} | |
/* Change color of the email address at top of left sidebar to match theme */ | |
.bp3-button div { | |
color: #FEF6E5 !important; | |
} | |
/*Pill Page References*/ | |
/*span.rm-page-ref { | |
background-color: #fbd15b75 !important; | |
font-size: 18px; | |
letter-spacing: .07em; | |
} | |
span.rm-page-ref { | |
color: black !important; | |
border-radius: 10px; | |
padding: 2px 3px 2px 3px; | |
} | |
span.rm-page-ref:hover { | |
color: black !important; | |
background-color: #b0d4fc !important; | |
text-decoration: none; | |
} | |
span.rm-page-ref:hover { | |
color: #000 !important; | |
background-color: #ffca36d9 !important; | |
border-radius: 15px; | |
text-decoration: none; | |
}*/ | |
/* Tag Styles hashtags*/ | |
/*.rm-page-ref-tag | |
color: #f8c764 !important; | |
background-color: #423212; | |
border-radius: 10px; | |
padding: 2px 3px 2px 3px; | |
} | |
.rm-page-ref-tag:hover { | |
color: white !important; | |
background-color: #e88a24; | |
text-decoration: none; | |
} | |
*/ | |
/*scrollbar*/ | |
::-webkit-scrollbar { | |
width: 7px; | |
} | |
/*lets me customize color of the selected block and text within it*/ | |
.rm-block-input { | |
line-height: 1.5em; | |
width: 100%; | |
outline: 1px solid rgba(0, 0, 0, 0); | |
overflow-wrap: break-spaces; | |
vertical-align: top; | |
margin-top: -1px; | |
color: #000 !important; | |
background-color: #bf9a286b; | |
padding-top: 4px; | |
padding-bottom: 4px; | |
padding-left: 5px; | |
letter-spacing: inherit; | |
border-radius: 10px; | |
resize: none; | |
} | |
/* search bar full width */ | |
.rm-find-or-create-wrapper { | |
flex: 0 1 100% !important; | |
} | |
/* reduces font size when I'm doing an inline search with [[]] or (()) */ | |
div.bp3-elevation-3 { | |
font-size: 0.7em; | |
} | |
/*Wraps text when I'm doing an inline search with [[]] or (())*/ | |
.bp3-text-overflow-ellipsis { | |
text-overflow: unset; | |
white-space: unset; | |
} | |
/* Increases the height of the inline search box */ | |
div.bp3-elevation-3[style^='max-height: 300px; top: 26px; overflow: auto;'] { | |
max-height: 600px !important; | |
} | |
/* Right side bar reference boxes */ | |
#right-sidebar .rm-reference-item { | |
background-color: #ede6f9; | |
border-radius: 15px; | |
padding: 5px; | |
} | |
/*RR change: additional text styles*/ | |
.roam-app strong { | |
color: #6c71c4 !important; | |
} | |
.roam-app em { | |
color: #d33682; | |
} | |
/*RR change: Markdown Links */ | |
.roam-app a { | |
color: #2aa198; | |
} | |
.roam-app a:focus, | |
.roam-app a:hover { | |
color: #2aa198; | |
text-decoration: underline; | |
} | |
/* Reference Boxes */ | |
/*.rm-reference-item { | |
background-color: #ede6f9; | |
border-radius: 15px; | |
padding: 20px; | |
}*/ | |
.roam-block .rm-reference-main { | |
border: 2px solid #ced9e0; | |
padding: 0px 16px 12px 16px; | |
background-color: #ced9e073; | |
} | |
.loading-astrolabe{ | |
display: block; | |
-moz-box-sizing: border-box; | |
box-sizing: border-box; | |
background: url(https://i.imgur.com/KWl6pqT.gif) no-repeat; | |
width: 600px; | |
height: 600px; | |
padding-left: 600px; /* Equal to width of new image */ | |
} | |
.loading-astrolabe .wand{ | |
visibility: hidden !important; | |
} | |
/* full width of text */ | |
.roam-block-container { | |
max-width: 100% !important; | |
} | |
div.roam-center > div:first-child { | |
padding-right: calc((100% - 950px) / 2) !important; | |
padding-left: calc((100% - 1500px) / 2) !important; | |
} | |
.hoverparent[style^='position: relative; width: 500px;'] { | |
width: 100% !important; | |
} | |
.hoverparent .react-resizable[style^='width: 500px;'] { | |
width: 100% !important; | |
} | |
.react-resizable[style^='width: 580px;'], | |
.react-resizable[style^='width: 720px;'] { | |
width: 100% !important; | |
} | |
.hoverparent[style^="position: relative; width: 580px;"], | |
.hoverparent[style^="position: relative; width: 720px;"] { | |
width: 100% !important; | |
} | |
.rm-block-text { | |
max-width: 100%; | |
} | |
/* Andy Matuschak Mode */ | |
.roam-center { | |
flex: 1 1 100% !important; | |
flex-basis: 10% !important; | |
} | |
#right-sidebar { | |
background-color: #fcf5e5 !important; | |
} | |
#right-sidebar #roam-right-sidebar-content { | |
overflow: scroll !important; | |
white-space: wrap; | |
display: flex; | |
/* Below is for masonry layout */ | |
} | |
#right-sidebar #roam-right-sidebar-content > div { | |
position: relative; | |
display: flex; | |
flex: 1 0 40%; | |
flex-direction: column; | |
padding: 10px; | |
border: 1px solid #bfbfbf !important; | |
border-radius: 5px; | |
background-color: rgb(247, 249, 251) !important; | |
align-self: flex-start; | |
margin-right: 0px !important; | |
height: 780px; | |
overflow-y: scroll; | |
/* Below is for masonry layout */ | |
margin-bottom: 16px; | |
min-height: fit-content; | |
width: 900px; | |
} | |
.roam-log-container .roam-log-page { | |
padding: 10px; | |
border: 1px solid #000; | |
border-radius: 5px; | |
background-color: #fcf5e5 !important; | |
} | |
.roam-toolkit-block-mode--highlight{background-color: #bf9a286b; !important;} | |
.kanban-board { | |
margin-right: -14% !important; | |
margin-left: 0% !important; | |
font-size: 12px !important;} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment