3 Commits 5469861a6a ... a4036f238d

Auteur SHA1 Bericht Datum
  Florrie a4036f238d scratch-colorful-messages.css 6 jaren geleden
  Florrie db4ff5f05f scratch-gui-dark.css 6 jaren geleden
  Florrie abfaa25a4f A-Z 6 jaren geleden
3 gewijzigde bestanden met toevoegingen van 101 en 7 verwijderingen
  1. 24 7
      README.md
  2. 36 0
      scratch-colorful-messages.css
  3. 41 0
      scratch-gui-dark.css

+ 24 - 7
README.md

@@ -5,6 +5,16 @@ generally won't have an effect on migrated pages (scratch-www).
 
 Install using your usual userscript manager. I use Violentmonkey.
 
+## scratch-comment-anonymizer
+
+Adds a button beside "Report" to anonymize a Scratch comment.
+Redacts references to the author of the user in the comment's comment thread
+(and hides their profile picture), so anonymity of the user is there for all
+their comments in the thread.
+
+There aren't any settings for this script. It's designed for scratchr2, so it
+won't work when comment sections are migrated to scratch-www.
+
 ## scratch-comment-blocker
 
 Hides comments that are made by specified users from comment sections.
@@ -16,12 +26,19 @@ scratchr2, so it won't have an affect on places like your messages page.
 As such, it's not designed to work with people who actively try to interact
 with you.
 
-## scratch-comment-anonymizer
+## scratch-colorful-messages (.css)
 
-Adds a button beside "Report" to anonymize a Scratch comment.
-Redacts references to the author of the user in the comment's comment thread
-(and hides their profile picture), so anonymity of the user is there for all
-their comments in the thread.
+Userstyle that makes the message screen colorful, coloring each message row by
+the type of message it is (e.g. making comments blue, studio invites green,
+forum posts pink, and so on).
 
-There aren't any settings for this script. It's designed for scratchr2, so it
-won't work when comment sections are migrated to scratch-www.
+Targets the scratch-www /messages/ page.
+
+## scratch-gui-dark (.css)
+
+Silly half-complete userstyle that makes the Scratch 3.0 GUI dark-themed.
+
+Designed to target standalone GUI pages, e.g. llk.github.io/scratch-gui or
+preview.scratch.mit.edu. May mess with the /preview/ project page (not
+tested). Will probably break as scratch-gui is updated and has more features
+added and enabled.

+ 36 - 0
scratch-colorful-messages.css

@@ -0,0 +1,36 @@
+.social-message {
+  border-bottom-color: #C5C5C5;
+}
+
+.social-message.mod-forum-activity {
+  background-color: hsl(300, 55%, 92%);
+}
+
+.social-message.mod-comment-message,
+.social-message.mod-follow-user {
+  background-color: hsl(215, 100%, 90%);
+}
+
+.social-message.mod-curator-invite,
+.social-message.mod-become-manager,
+.social-message.mod-studio-activity {
+  background-color: hsl(163, 60%, 85%);
+}
+
+.social-message.mod-love-favorite {
+  background-color: hsl(45, 90%, 95%);
+}
+
+.social-message.mod-love-project {
+  background-color: hsl(350, 100%, 95%);
+}
+
+.social-message.mod-remix-project {
+  background-color: hsl(260, 100%, 90%);
+}
+
+.social-message.mod-unread {
+  background-color: hsl(100, 95%, 95%);
+  box-shadow: 0 2px 3px -2px rgba(0, 200, 200, 80%);
+  position: relative;
+}

+ 41 - 0
scratch-gui-dark.css

@@ -0,0 +1,41 @@
+body { background-color: black; }
+.blocklyMainBackground { fill: #444 !important; }
+/*.blocklyBlockCanvas { filter: brightness(0.9) saturate(0) !important; }*/
+.blocklySvg { background-color: #222 !important; }
+.blocklyFlyoutBackground { fill: #222 !important; }
+.blocklyFlyout { border-right-color: #000 !important; }
+.blocklyZoom image { opacity: 0.25; }
+.blocklyScrollbarHandle { fill: #555 !important; }
+.blocklyWidgetDiv .goog-menu { background: #555 !important; border-color: #111; }
+.blocklyWidgetDiv .goog-menuitem { color: #FFF !important; }
+.blocklyWidgetDiv .goog-menuitem-highlight { background-color: #999 !important; border-top: 1px solid #333; border-bottom: 1px solid #333 }
+.blocklyWidgetDiv .goog-menuitem-disabled .goog-menuitem-content { color: #AAA !important; }
+.scratchCategoryMenu, .blocklyToolboxDiv, [class^=selector_wrapper] { background: #333 !important; color: #EEE; }
+.scratchCategoryMenuItem.categorySelected { background: #444 !important; }
+[class^=menu-bar_menu-bar_] { background: #222 !important; }
+[class^=sprite-selector_], [class^=stage-selector_] { background: #333 !important; color: #EEE; }
+[class*=sprite-selector-item] { background: #3A3A3A !important; color: #EEE; }
+[class^=selector_new-buttons]::before { background: none !important; }
+[class^=sprite-info] { background: #333 !important; color: #EEE; }
+[class^=gui_extension-button-container] { background: #444 !important; border-color: #222 !important; }
+[class^=gui_body-wrapper] { background-color: #2E2E2E !important; }
+[class*=gui_tab_] { background-color: #444 !important; border-bottom-color: #2E2E2E !important; }
+[class*=gui_tab_][class*=gui_is-selected] { background-color: #555 !important;  }
+[class^=asset-panel_] { background-color: #444 !important; color: #EEE; }
+[class^=sound-editor_round-button] { filter: brightness(0.75) saturate(0) !important; }
+[class*=button_button], [class^=sound-editor_button] { background: #555 !important; border-color: #333 !important; }
+.injectionDiv, .blocklyToolboxDiv, [class^=stage_stage-wrapper], [class^=asset-panel_], [class^=sprite-selector], [class^=stage-selector] { border-color: #111 !important; }
+[class^=stage_stage-wrapper-overlay] { background-color: #000; }
+[class*=stage_stage-overlay-content] { border: 1px solid #333 !important; }
+[class^=stage-header_stage-header-wrapper-overlay] { background-color: #000; }
+[class^=react-tabs]:focus::after { display: none; }
+[class^=input_input-form_], [class^=sprite-info], [class^=stage-header] { border-color: #666 !important; }
+[class^=backpack_backpack-header] { background: #444; color: white; }
+[class^=button_outlined-button] { background: #444 !important; }
+[class^=menu-bar_help-icon] { filter: brightness(0.5); }
+.Popover-body { background: #333; border-color: #222; }
+.Popover-tipShape { fill: #333; stroke: #222; }
+[class^=color-picker_row-header] { color: #EEE; }
+[class^=color-picker_divider] { border-color: #555; }
+[class^=color-picker_swatch] { border-color: #666; }
+[class^=slider_handle] { background-color: #EEE; }