Violentmonkey compact light theme

violentmonkey.light.compact.css

.CodeMirror-code {
  font-size: 15px;
}
.scripts {
  contain: strict;
  display: block !important;
}
.tab-installed .script {
  display: flex;
  align-items: center;
  height: 2.5rem !important;
  width: auto !important;
  margin: 0;
  padding: 0 2rem;
  border: none;
  border-bottom: 1px solid transparent !important;
  border-radius: 0;
  background: none !important;
  contain: strict;
}
.tab-installed .script-name {
  font-weight: bold;
}
.tab-installed .script-author {
  width: 10rem;
  white-space: nowrap;
}
.tab-installed .script-info {
  line-height: 2.5;
  flex: 100;
  margin-left: 17rem;
}
.tab-installed .script-icon {
  left: 15.5rem;
  top: .2rem;
  width: 2rem;
  height: 2rem;
}
.tab-installed .script-icon[src^="/public/images/icon"] {
  visibility: hidden;
}
.tab-installed .script-info > :last-child {
  line-height: 1.3;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 10rem;
}
.tab-installed .script-info > :last-child > .ml-1 {
  width: 4rem;
  text-align: right;
  color: #666;
}
.tab-installed .script:nth-child(even) {
  background-color: #f3f3f3 !important;
}
.tab-installed .script:-webkit-any(.disabled, .removed) {
  opacity: .7;
}
.tab-installed .script:-webkit-any(.disabled, .removed) .script-name {
  font-weight: normal;
}
.aside-content {
  display: flex;
  width: auto;
  height: 3rem;
  padding: 0;
  color: hsl(28, 70%, 45%);
  border: none;
}
.aside-menu {
  display: flex;
  align-items: center;
  border: none;
}
.aside-menu > a.active {
  color: white;
  background-color: hsl(24, 60%, 50%);
}
.aside-menu > a:hover:not(.active) {
  color: hsl(28, 70%, 35%);
  background-color: hsla(28, 70%, 45%, .1);
}
.aside-menu > a {
  font-weight: bold;
  line-height: 2.5rem;
  padding: 0 1rem;
  color: hsl(28, 70%, 45%);
}
.tab header:not(#\0) {
  height: auto;
  padding: .5rem 2rem;
  border-top: 1px solid #ddd;
  background: #EEE;
}
.page-options {
  flex-direction: column;
}
.aside-content img {
  width: 3rem;
  height: 3rem;
  margin: .25rem 2rem;
}
.aside-content h1 {
  align-self: center;
  margin: 0 2rem 0 0;
}
.script-buttons {
  align-items: center;
  position: absolute;
  margin: 0 .5rem 0 0;
  width: calc(100% - 18.5rem);
}
.script-buttons .disabled {
  color: #0002;
}
.script-buttons > .flex {
  flex-wrap: nowrap;
  flex-grow: 0;
}
.btn-ghost:not(.active):hover {
  border-color: transparent;
  background: none;
}
:not(.disabled) > .btn-ghost:hover {
  color: hsl(28, 70%, 45%);
}
.sep {
  display: none;
}
.filter-search input {
  border: none;
  background: transparent;
  font-weight: bold;
}
.filter-search input::placeholder {
  font-weight: normal;
}
.filter-search input:focus {
  background: #eee;
}
section {
  border: none;
}
section > h3 {
  background: none;
}
textarea {
  font: normal 1rem/1.3 monospace;
  border-color: #bbb;
  background: #eee;
}
.script-buttons > .flex > :first-child {
  position: absolute;
  z-index: 1000;
  top: 0;
  right: 0;
  bottom: 0;
  left: 17rem;
}
.script-buttons > .flex > :first-child .btn-ghost {
  width: 100%;
  height: 100%;
  color: transparent;
}
.script-buttons > .flex > :first-child .btn-ghost:hover {
  background: none;
}
:not(.flex-col) > .flex-auto {
  width: auto;
}
.script.focused:not(#\0) {
  background: hsl(24, 60%, 85%) !important;
  box-shadow: none;
}
.script-author > .ellipsis {
  max-width: calc(100% - 1.5rem);
}
.script-message:not(:empty) {
  position: absolute;
  z-index: 100;
  margin: 1.25rem 0 0 2rem;
  padding: 1px .5em 2px;
  opacity: .5;
  color: white;
  border-radius: .5em;
  background: hsl(19, 50%, 47%);
}
.script-message:hover {
  opacity: 1;
}
.tab-installed .vl-dropdown-menu {
  position: static;
  display: flex !important;
  align-items: center;
  margin: 0;
  padding: 0;
  border: none;
  background: none;
}
.tab-installed header .vl-dropdown {
  display: inline-flex;
}
.tab-installed header .vl-dropdown-toggle {
  display: none;
}
.tab-installed a.dropdown-menu-item {
  font-size: 0;
}
.tab-installed .dropdown-menu-item[href*="openuserjs"]::before {
  font-size: 1rem;
  content: "OUJS";
}
.tab-installed .dropdown-menu-item[href*="greasyfork"]::before {
  font-size: 1rem;
  content: "GF";
}
.filter-sort .vl-dropdown-menu > * {
  margin: 0 1rem;
}
.filter-sort select {
  padding: .25em .5em;
  border: none;
  background: transparent;
}
.filter-sort input {
  vertical-align: bottom;
}
.filter-sort input:checked + span {
  text-decoration: underline;
}
a.dropdown-menu-item:hover {
  cursor: alias;
  text-decoration: underline;
  color: hsl(24, 57%, 40%);
  background: none;
}
div.dropdown-menu-item:hover {
  background: none;
}
.dropdown-menu-item {
  color: #000;
  cursor: pointer;
}
.tab-installed header .vl-dropdown-left {
  order: 1;
}
.tab-installed header > :first-child {
  display: flex;
}
a.dropdown-menu-item {
  color: hsl(24, 57%, 40%);
}
.filter-search select {
  border: none;
  background: transparent;
}
input[type="checkbox"]:checked {
  filter: hue-rotate(180deg);
}
a {
  color: hsl(24, 57%, 40%);
}

@media (min-width: 1000px) {
  .tab-settings {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
  }
  .tab-settings > :not(h1) {
    width: calc(50% - 3rem);
  }
  .show-advanced {
    visibility: hidden;
  }
  .tab-settings > :last-child {
    display: block !important;
  }
}

@media (min-width: 1550px) {
  .scripts {
    display: flex !important;
  }
  .tab-installed .script {
    width: 50% !important;
    border-radius: 0;
  }
  .script-name {
    line-height: 1.3;
    width: auto !important;
    white-space: normal;
  }
  .tab-installed .script:nth-child(2n) {
    background: none !important;
  }
  .tab-installed .script:nth-child(4n + 2),
  .tab-installed .script:nth-child(4n + 3) {
    background: #f3f3f3 !important
  }
  .tab-installed .script-author,
  .tab-installed .script-info > :last-child,
  .tab-installed .script-info > :last-child {
    width: 7rem;
    flex-basis: 7rem;
  }
}

@media (min-width: 2500px) {
  .tab-installed .script {
    width: 33% !important;
  }
  .tab-installed .script:nth-child(2n) {
    background: #f3f3f3 !important
  }
  .tab-installed .script:nth-child(2n + 1) {
    background: none !important
  }
}