Spookie/assets/styles/app.scss

/*
	jet black (tiefschwarz) - RAL 9005: #0e0e10, rgba(14, 14, 16, 1.0);
	mango: #FF8040, rgba(255, 130, 67, 1.0);
	gray: #a1a1a1, rgba(161, 161, 161, 1.0)
*/

/*
@media (prefers-color-scheme: light) {}
@media (prefers-color-scheme: dark) {}
*/

/* debug */
* {
  //border: 1px solid gray;
}


html, body{
  margin: 0;
  padding: 0;
  background: black;
  background: linear-gradient(90deg, rgba(14,14,16,1) 0%, rgba(255,128,64,1) 35%, rgba(14,14,16,1) 100%);
}

$primary: #FF8040;
$jet-black: #0e0e10;


@import 'quill/dist/quill.core.css';
// customize some Bootstrap variables


.pages-editor-raw {
  width: 100%;
  height: 650px !important;
  background-color: black;
  color: white;
}

.ql-container {
  overflow-y: scroll;
  height: 650px !important;
}

.no-overflow {
  overflow-y: visible !important;
  height: auto !important;
}

.ql-syntax {
  background-color: #222222;
  border: 1px solid #888;
  border-left: 3px solid $primary;
  color: #666;
  page-break-inside: avoid;
  font-family: monospace;
  font-size: 15px;
  line-height: 1.6;
  margin-bottom: 1.6em;
  max-width: 100%;
  overflow: auto;
  padding: 1em 1.5em;
  display: block;
  word-wrap: break-word;
}


.ql-editor {
  counter-reset: line;
  padding-left: 0;
}

.ql-editor div:before {
  counter-increment: line;
  content: counter(line);
  display: inline-block;
  border-right: 1px solid red;
  padding: 0 .5em;
  margin-right: .5em;
  color: #888
}

.ql-syntax pre:before {
  counter-increment: line;
  content: counter(line);
  display: inline-block;
  border-right: 1px solid #ddd;
  padding: 2px .5em;
  margin-right: .5em;
  color: #888
}