Gruvbox Dark Theme for Roam Research

RoamGruv.css

/** Main Body */
.roam-body-main > div {
  background-color: #282828;
  color: #ebdbb2;
}
/** Top & Sidebars */
.roam-sidebar-content, .log-button, .bp3-icon, .rm-db-title, .roam-right-sidebar-content {
  background-color: #1d2021 !important;
  color: #ebdbb2 !important;
}
.starred-pages-wrapper {
  color: #ebdbb2 !important;  
}
.roam-topbar {
 background-color: #1d2021; 
}
#roam-sidebar-logo > div > span {
  color: #ebdbb2 !important;  
}
#right-sidebar {
  background-color: #1d2021;
  color: #ebdbb2;
}
.bp3-button:not([class*="bp3-intent-"]) {
  color: #ebdbb2 !important;  
}
.bp3-button[class*="bp3-icon-"]::before {
  color: #ebdbb2 !important;  
}
/** Code Mirror Things */
.CodeMirror-code, .CodeMirror-linenumber, .cm-formatting {
    font-size: 1.05em;
}
.cm-variable-3 {
  color: #fabd2f !important;
}
.CodeMirror-scroll, .CodeMirror-sizer, .CodeMirror-gutter, .CodeMirror-gutters, .CodeMirror-linenumber {
  background-color: #3c3836 !important;  
  color: #ebdbb2;
}
.cm-tag {
  color: #689d6a !important;
}
.cm-atom, .cm-number {
  color: #d3869b !important;
}
/** .... Things like 'color' and 'font-size' */
.cm-property {
  color: #fe8019;
}
/** Comments */
.cm-comment {
  color: #696d70 !important;
}
/** .... Words like '!important' in CSS */
.cm-s-default .cm-keyword {
  color: #cc241d;
}
/** .... Names of CSS Selectors */
.cm-s-default .cm-qualifier {
  color: #b8bb26;
}
.CodeMirror {
  background-color: #504945 !important;
  color: #ebdbb2;
}
/** Blocks */
.block-bullet-view, .rm-reference-item{
  background-color: #282828 !important;
  color: #ebdbb2; 
}
/** The Bullet */
.rm-bullet__inner {
  background-color: #689d6a !important;
}
/** Bullet Point Relationship Lines */
.block-border-left {
    border-left: 1px solid #689d6a;
}
/** The Collapsed Bullet */
.rm-bullet.rm-bullet--closed .rm-bullet__inner {
    border: 4px solid #458588;
}
/** The '/' search box*/
.bp3-elevation-3, .bp3-elevation-3 > .dont-unfocus-block {
  background-color: #282828 !important;
}
.dont-unfocus-block:hover, .dont-unfocus-block:focus {
  background-color: #504945 !important;
}
/** Headings */
h1 {
  color: #fabd2f !important;
}
h2 {
  color: #b8bb26 !important;
}
h3 {
  color: #8ec07c !important;
}
/** Links */
a, .rm-page-ref-link-color {
  color: #fe8019;
}
.rm-page-ref-brackets {
  color: #bdae93;
}
/** Bold */
strong {
  color: #cc241d !important;
}
/** Search Bar */
.bp3-input {
  background-color: #282828 !important;
}
.bp3-transition-container .bp3-popover-enter-done {
  background-color: red !important;
}
.bp3-popover-content, .bp3-button {
  background-color: #1d2021 !important;
  color: #ebdbb2 !important;
}
body > div:nth-child(16) > div > div > div > div.bp3-popover-content > div > div > div.flex-h-box > div:nth-child(3) > div:nth-child(1) > div, body > div:nth-child(16) > div > div > div > div.bp3-popover-content > div > div > div.flex-h-box > div:nth-child(1) > div:nth-child(1) > div {
  background-color: #1d2021 !important;
  color: #ebdbb2 !important;
}
.rm-inline-references {
    background-color: #1d2021;
    border-left: 2px solid #689d6a;
}
.rm-zoom-path {
  color: #ebdbb2;
}
.checkmark {
  background-color: #d3869b !important;
  color: #ebdbb2 !important;
}
.rm-all-pages .table .rm-pages-row.rm-pages-row-header {
  background-color: #1d2021 !important;
  color: #ebdbb2 !important;
}
.rm-all-pages .table .rm-pages-row .rm-pages-title-col, .sorted-header-text {

  color: #ebdbb2 !important;
}
.rm-clickable-pill {
  background-color: #689d6a !important;
  color: #ebdbb2 !important;
}
.rm-clickable-pill.empty-pill {
  background-color: #ebdbb2 !important;
  color: #282828 !important;
}
.bp3-control .bp3-control-indicator {
  background-color: #ebdbb2 !important;
}