Scrollbar and rich text dark

customize.dist/ckeditor-contents.css

@@ -10,10 +10,10 @@ body
     font-size: 13px;
 
     /* Text color */
-    color: #333;
+    color: inherit;
 
     /* Remove the background color to make it transparent */
-    background-color: #fff;
+    background-color: inherit !important;
 
     margin: 0;
     padding: 20px;

customize.dist/src/less2/include/app-noscroll.less

@@ -1,8 +1,21 @@
+@import (reference) "./colortheme-all.less";
+
 .app-noscroll_main() {
     --LessLoader_require: LessLoader_currentFile();
 }
 & {
     .cp-app-noscroll {
+        scrollbar-color: @scrollbar_color;
+        * {
+            scrollbar-width: thin;
+        }
+        ::-webkit-scrollbar {
+            width: 6px;
+        }
+        ::-webkit-scrollbar-thumb {
+            background-color: @cp_scrollbar-fg;
+            width: 6px;
+        }
         height: 100%;
         width: 100%;
         padding: 0px;

customize.dist/src/less2/include/colortheme-dark.less

@@ -61,6 +61,9 @@
 @cryptpad_color_pro: #E4FFDD;
 @cryptpad_color_power: #F6DDFF;
 
+@cp_scrollbar-fg: hsla(0,0%,100%,.2);
+@scrollbar_color: @cp_scrollbar-fg transparent;
+
 // Loading screen
 @cp_loading-bg: #FFF-#E7E7E7;
 @cp_loading-fg: @cryptpad_text_col;

customize.dist/src/less2/include/colortheme.less

@@ -61,6 +61,9 @@
 @cryptpad_color_pro: #E4FFDD;
 @cryptpad_color_power: #F6DDFF;
 
+@cp_scrollbar-fg: fade(@cryptpad_color_black, 20%);
+@scrollbar_color: @cp_scrollbar-fg transparent;
+
 // Loading screen
 @cp_loading-bg: #E7E7E7;
 @cp_loading-fg: @cryptpad_text_col;

www/pad/comment.js

@@ -30,7 +30,7 @@
 
     CKEDITOR.plugins.add('comments', {
         onLoad: function() {
-            CKEDITOR.addCss('comment { background-color: ' + color1 + '; }' +
+            CKEDITOR.addCss('comment { background-color: ' + color1 + '; color:#333; }' +
                 '@keyframes color { 0% { background-color: ' + color2 + '; } 50% { background-color: ' + color1 + '; } 100% { background-color: ' + color2 + '; } }' +
                 'comment.active { animation-name: color; animation-duration: 1s; animation-iteration-count: 2; background-color: ' + color2 + '; outline: none;}' +
                 'comment media-tag { border: 2px solid ' + color1 + ' !important; }' +

www/pad/inner.js

@@ -1216,6 +1216,14 @@ define([
                 $contentContainer.append(h('div#cp-app-pad-comments'));
                 $contentContainer.prepend(h('div#cp-app-pad-toc'));
                 $ckeToolbar.find('.cke_button__image_icon').parent().hide();
+
+                if (window.CryptPad_theme === 'dark') {
+                    var $iframe = $('iframe').contents();
+                    $iframe.find('html').css({
+                        'background-color': '#222', // XXX
+                        'color': '#aaa' // XXX
+                    });
+                }
             }).nThen(waitFor());
 
         }).nThen(function(waitFor) {