style(next): split the main theme CSS code into multiple files

src/public/stylesheets/theme-next/notes/text.css

@@ -0,0 +1,104 @@
+/*
+ * TEXT NOTES
+ */
+
+/*
+ * Code Blocks 
+ */
+
+ .ck-content pre {
+    border: 0;
+    border-radius: 6px;
+    box-shadow: var(--code-block-box-shadow);
+    padding: 0 !important;
+    margin-top: 2px !important;
+    overflow: unset;
+}
+
+html .note-detail-editable-text :not(figure, .include-note, hr):first-child {
+    /* Create some space for the top-side shadow */
+    margin-top: 1px !important;
+}
+
+.ck.ck-editor__editable pre[data-language]::after {
+    --ck-color-code-block-label-background: rgba(128, 128, 128, .5);
+    border-radius: 0 0 5px 5px;
+    padding: 0px 10px;
+    letter-spacing: .5px;
+    font-weight: bold;
+}
+
+.ck-content pre code {
+    display: block;
+    padding: 1em;
+    overflow: auto;
+}
+
+.ck-content pre code::-webkit-scrollbar {
+    height: 6px;
+}
+
+.ck-content pre code::-webkit-scrollbar-thumb {
+    height: 4px;
+    border: none !important;
+    background: gray !important;
+}
+
+.ck-content pre code::-webkit-scrollbar-track, ::-webkit-scrollbar-thumb {
+    cursor: default;
+}
+
+.ck-content blockquote {
+    background: var(--card-background-color);
+    border: 1px solid var(--card-border-color) !important;
+    box-shadow: var(--card-box-shadow);
+    border-radius: 10px;
+    padding: 1em 2.5em;
+    position: relative;
+    font-style: unset !important;
+}
+
+.ck-content blockquote p:last-of-type {
+    margin-bottom: 0 !important;
+}
+
+.ck-content blockquote:before,
+.ck-content blockquote:after {
+    position: absolute;
+    top: 0;
+    font-size: 48px;
+    opacity: 0.1;
+}
+
+.ck-content blockquote:before {
+    content: "“";
+    left: 0.2em;
+}
+
+.ck-content blockquote:after {
+    content: "”";
+    right: 0.35em;            
+}
+
+.ck-content hr {
+    margin: 5px 0;
+    height: 1px;
+    background-color: var(--main-border-color);
+    opacity: 1;
+}
+
+.ck-content p code {
+    border: 1px solid var(--card-border-color);
+    box-shadow: var(--card-box-shadow);
+    border-radius: 6px;
+    background-color: var(--card-background-color);
+}
+
+.note-detail-printable:not(.word-wrap) pre code {
+    white-space: pre;
+    margin-right: 1em;
+}
+
+.code-sample-wrapper .hljs {
+    transition: background-color linear 100ms;
+}

src/public/stylesheets/theme-next/settings.css

@@ -0,0 +1,59 @@
+/*
+ * Settings
+ */
+ :root {
+    --options-card-padding: 17px;
+    --options-title-font-size: 1rem;
+    --options-title-offset: 13px;
+}
+
+.options-section {    
+    border-radius: 12px;
+    border: 1px solid var(--card-border-color) !important;
+    box-shadow: var(--card-box-shadow);
+    background: var(--card-background-color);
+    padding: var(--options-card-padding);
+    margin-bottom: calc(var(--options-title-offset) + 26px) !important;
+}
+
+.note-detail-content-widget-content.options {
+    --default-padding: 15px;
+    padding-top: calc(var(--default-padding) + var(--options-title-offset) + var(--options-title-font-size));
+    padding-bottom: var(--default-padding);
+}
+
+.options-section h4 {
+    font-size: var(--options-title-font-size);
+    font-weight: bold;
+    color: var(--launcher-pane-text-color);
+    margin-top: calc(-1 * var(--options-card-padding) - var(--options-title-font-size) - var(--options-title-offset)) !important;
+    margin-bottom: calc(var(--options-title-offset) + var(--options-card-padding)) !important;
+    margin-left: calc(-1 * var(--options-card-padding));
+}
+
+.options-section h5 {
+    font-size: var(--options-title-font-size);
+    font-weight: bold;
+    margin-top: 1em !important;
+    margin-bottom: unset !important;
+}
+
+.options-section h5:first-of-type {
+    margin-top: unset !important;
+}
+
+.options-section hr {
+    margin-left: calc(var(--options-card-padding) * -1);
+    margin-right: calc(var(--options-card-padding) * -1);
+}
+
+.options-section p:last-of-type:not(:first-of-type),
+.options-section h4 + p:last-child,
+.options-section .existing-anonymized-databases {
+    margin-bottom: 0;
+}
+
+.options-section .options-mime-types {
+    padding: 0;
+    margin: 0;
+}