The Trunk: System-mt.1010.mcz

I often work in low light situations and the bright back light from lcd screens are a strain on the eyes. as well as it lights up the room where other people around me wants it dark.  

The choice is good :-)

Best,

Karl

On Tue, Apr 3, 2018 at 7:49 PM, Bert Freudenberg <[hidden email]> wrote:

Interesting, thank you.

I believe people choose dark themes because they secretly want to look as cool as the hackers in movies. Not that anyone would admit that, of course.

Then again, wanting to look cool is as valid a reason as any, fashion-wise. Choice is good :)

- Bert -

On 3 April 2018 at 15:20, Eliot Miranda <[hidden email]> wrote:

Hi Dark Themers,

    in an earlier life I worked in optics, designing holographic cameras for bubble chamber physics, so I know a little about focussing systems and depth of field.  The iris in the eye expands or contracts to allow or restrict the amount of light entering the eye, attempting to maintain a constant luminosity on the retina so that either not too little, or not too much light falls on the cones and rods in the retina.  When the iris is dilated (open) the eye allows as much light as possible into it.  You can visualize the light from a point (say a pixel) that reaches the iris as a cone.  The lens in the eye focuses this expanding cone back into a contracting one that comes to a point on the retina corresponding to the position of the pixel "out there on the screen".

Focusing is achieved by a muscle around the eye's flexible lens, the cillary muscle, which squeezes the lens into a more spherical shape to cause rays entering the eye to bend more, brings no objects closer to the eye into focus, or by the cillary muscle relaxing, allowing the lens to stretch back to a flatter shape, to bend rays less, bringing objects further away into focus.  In old age shortsightedness is caused by the lens loosing its elasticity and remaining squeezed, and longsightedness by it losing flexibility and the cillary muscle losing strength so that the lens cannot be squeezed as much.  By the time we hit our 40's many of us will suffer one of these two extremes and have to wear glasses either for reading or for driving or, in my case, for both.

Getting back to the cone of rays from a pixel that the iris and lens conspire to bring to a point on the retina, if there is a lot of light incident on the eye and the iris is undilated then this cone is much slimmer.  The result of these differing cones on focus is called depth of field.  When the cone is "fat" depth of field is reduced; only pixels in the same plane (actually a spherical surface, not a plane, because the retina is spherical; film cameras have planar light receptors; the eye and camera obscures etc have spherical light receptors) will be in focus; others out of the plane will produce a diffuse circle on the retina.  When the cone is "slim" (because more light is incident on the eye) depth of field is increased because the size of the out of focus diffuse circle is smaller. Consequently, when there is less light falling on the eye, depth of field is reduced; the cones are fatter and as the eye roams the cillary muscle must work to alter the curvature of the lens to keep things in focus.

The implication for the dark theme is that, while it appears to have better contrast (it does not; but more on that below), the real effect is that it causes the eye to do more work than a light theme because the amount of light entering the eye is less.  So both in the short term and especially over the long term the dark theme, relative to the light theme, will tire your collate muscle and cause your lens to stiffen or squish sooner.

Why then, if what I'm saying is true, did all those World War Two military aircraft use white letters on a black background?  My lotus europa is the same.  The disc of the instrument is illuminated by a lamp so one can see it at night, and were the panel painted white then, for the same contrast, much more light would hit the eye that for white letters on a black background and the pilot's (or driver's) night vision would be impaired as the iris would contract.

I don't want to fear monger, but I do want to suggest that it is healthier and less wearing on the eyes to use light themes.

Eliot

_,,,^..^,,,_ (phone)

On Apr 2, 2018, at 11:12 PM, Marcel Taeumel <[hidden email]> wrote:

<image.png>

Am 03.04.2018 08:07:45 schrieb [hidden email] <[hidden email]>:

Marcel Taeumel uploaded a new version of System to project The Trunk:
http://source.squeak.org/trunk/System-mt.1010.mcz

==================== Summary ====================

Name: System-mt.1010
Author: mt
Time: 3 April 2018, 8:07:14.69082 am
UUID: 322ad26c-26ac-0046-8e31-9db174de998e
Ancestors: System-cmm.1009

Adds an alternate gray-based dark UI theme.

=============== Diff against System-cmm.1009 ===============

Item was added:
+ UserInterfaceTheme subclass: #TrimTheme
+ instanceVariableNames: ''
+ classVariableNames: ''
+ poolDictionaries: ''
+ category: 'System-Support'!

Item was added:
+ ----- Method: TrimTheme class>>addButtons: (in category 'instance creation') -----
+ addButtons: theme
+
+ theme
+ set: #borderColor for: #PluggableButtonMorph to: self gray102;
+ set: #borderWidth for: #PluggableButtonMorph to: 1;
+ set: #borderStyle for: #PluggableButtonMorph to: BorderStyle default;
+ set: #color for: #PluggableButtonMorph to: self gray76;
+
+ set: #textColor for: #PluggableButtonMorph to: self white;
+
+ set: #selectionModifier for: #PluggableButtonMorph to: [ [:c | self gray39] ];
+ set: #hoverModifier for: #PluggableButtonMorph to: [ [:c | self gray51] ];
+ set: #feedbackModifier for: #PluggableButtonMorph to: [ [:c | self gray39] ].
+
+ "And the plus-version."
+ theme
+ set: #disabledColor for: #PluggableButtonMorphPlus to: Color transparent;
+ set: #disabledTextColor for: #PluggableButtonMorphPlus to: self gray128.!

Item was added:
+ ----- Method: TrimTheme class>>addDialogs: (in category 'instance creation') -----
+ addDialogs: theme
+ "self create apply."
+
+ theme
+ set: #borderColor for: #DialogWindow to: self gray59;
+ set: #borderWidth for: #DialogWindow to: 0;
+ set: #borderStyle for: #DialogWindow to: BorderStyle default;
+ set: #color for: #DialogWindow to: self gray64;
+
+ set: #titleBorderColor for: #DialogWindow to: self gray59;
+ set: #titleBorderWidth for: #DialogWindow to: 0;
+ set: #titleBorderStyle for: #DialogWindow to: BorderStyle default;
+ set: #titleColor for: #DialogWindow to: self gray51;
+ set: #titleTextColor for: #DialogWindow to: self white;
+
+ set: #textColor for: #DialogWindow to: self white;
+
+ set: #okColor for: #DialogWindow to: self green;
+ set: #cancelColor for: #DialogWindow to: self red;
+ set: #buttonColor for: #DialogWindow to: self gray59;
+ set: #selectionModifier for: #DialogWindow to: [ [:c | self blue ] ].
+
+ "The List Chooser is a dialog, too."
+ theme
+ set: #addColor for: #ListChooser to: self yellow;
+ set: #disabledColor for: #ListChooser to: Color transparent.
+
+
+ "And the system progress bar."
+ theme
+ set: #borderColor for: #SystemProgressBarMorph to: Color transparent;
+ set: #borderWidth for: #SystemProgressBarMorph to: 0;
+ set: #borderStyle for: #SystemProgressBarMorph to: BorderStyle default;
+ set: #color for: #SystemProgressBarMorph to: self gray64;
+ set: #barColor for: #SystemProgressBarMorph to: self blue.
+
+ "And the balloon morphs."
+ theme
+ set: #borderColor for: #NewBalloonMorph to: self gray168;
+ set: #borderWidth for: #NewBalloonMorph to: 1;
+ set: #color for: #NewBalloonMorph to: self gray102;
+ set: #textColor for: #NewBalloonMorph to: self white.!

Item was added:
+ ----- Method: TrimTheme class>>addFonts: (in category 'instance creation') -----
+ addFonts: theme
+
+ "Set-up fonts."
+ theme
+ set: #balloonHelpFont to: (StrikeFont familyName: 'Darkmap DejaVu Sans' pointSize: 7);
+ set: #standardButtonFont to: (StrikeFont familyName: 'Darkmap DejaVu Sans' pointSize: 7);
+ set: #standardCodeFont to: (StrikeFont familyName: 'Darkmap DejaVu Sans' pointSize: 9);
+ set: #standardFlapFont to: (StrikeFont familyName: 'Darkmap DejaVu Sans' pointSize: 7 emphasized: TextEmphasis bold emphasisCode);
+ set: #haloLabelFont to: (StrikeFont familyName: 'Darkmap DejaVu Sans' pointSize: 9);
+ set: #standardListFont to: (StrikeFont familyName: 'Darkmap DejaVu Sans' pointSize: 9);
+ set: #standardMenuFont to: (StrikeFont familyName: 'Darkmap DejaVu Sans' pointSize: 9);
+ set: #standardSystemFont to: (StrikeFont familyName: 'Darkmap DejaVu Sans' pointSize: 9);
+ set: #windowTitleFont to: (StrikeFont familyName: 'Darkmap DejaVu Sans' pointSize: 9).!

Item was added:
+ ----- Method: TrimTheme class>>addMenusAndDockingBars: (in category 'instance creation') -----
+ addMenusAndDockingBars: theme
+
+ theme
+ set: #borderColor for: #MenuMorph to: self gray51;
+ set: #borderWidth for: #MenuMorph to: 1;
+ set: #borderStyle for: #MenuMorph to: BorderStyle default;
+ set: #color for: #MenuMorph to: self gray27;
+
+ set: #titleBorderColor for: #MenuMorph to: (Color r: 0.6 g: 0.7 b: 1);
+ set: #titleBorderWidth for: #MenuMorph to: 0;
+ set: #titleBorderStyle for: #MenuMorph to: BorderStyle default;
+ set: #titleColor for: #MenuMorph to: Color transparent;
+ set: #titleTextColor for: #MenuMorph to: self white;
+
+ set: #lineColor for: #MenuMorph to: self gray51;
+ set: #lineStyle for: #MenuMorph to: BorderStyle simple;
+ set: #lineWidth for: #MenuMorph to: 1.
+
+ theme
+ set: #textColor for: #MenuItemMorph to: self white;
+ set: #disabledTextColor for: #MenuItemMorph to: self gray128;
+ set: #selectionColor for: #MenuItemMorph to: self gray102;
+ set: #selectionTextColor for: #MenuItemMorph to: self white.
+
+ "The world main docking bar."
+ theme
+ set: #logoColor for: #TheWorldMainDockingBar to: self white;
+ set: #selectionLogoColor for: #TheWorldMainDockingBar to: self white.!

Item was added:
+ ----- Method: TrimTheme class>>addScrollables: (in category 'instance creation') -----
+ addScrollables: theme
+ "self create apply"
+
+ "Sliders"
+ theme
+ set: #borderColor for: #Slider to: self gray76;
+ set: #borderWidth for: #Slider to: 1;
+ set: #color for: #Slider to: self gray61;
+ set: #thumbBorderColor for: #Slider to: self gray61;
+ set: #thumbBorderWidth for: #Slider to: 1;
+ set: #thumbColor for: #Slider to: self gray128;
+ set: #thumbShadowModifier for: #Slider to: [ [:c | c alpha: 0.7] ].
+
+ "Scroll bars"
+ theme
+ set: #thumbBorderWidth for: #ScrollBar to: 1;
+ set: #thumbColorModifier for: #ScrollBar to: [ [:c | c adjustBrightness: 0.2] ];
+ "set: #pagingAreaColorModifier for: #ScrollBar to: [ [:c | self gray51] ];"
+ set: #borderColorModifier for: #ScrollBar to: [ [:c | c adjustBrightness: 0.2] ].
+
+ "Scroll panes (includes generic stuff for list widgets, tree widgets, and text widgets."
+ theme
+ set: #borderColor for: #ScrollPane to: self gray76;
+ set: #borderWidth for: #ScrollPane to: 1;
+ set: #borderStyle for: #ScrollPane to: BorderStyle default;
+ set: #color for: #ScrollPane to: self gray51.
+
+ "List widgets"
+ theme
+ set: #textColor for: #PluggableListMorph to: self white;
+ set: #selectionColor for: #PluggableListMorph to: self blue;
+ derive: #multiSelectionColor for: #PluggableListMorph from: #PluggableListMorph at: #selectionColor do: [:c | c lighter];
+ set: #selectionTextColor for: #PluggableListMorph to: self white;
+ set: #filterColor for: #PluggableListMorph to: self orange;
+ set: #filterTextColor for: #PluggableListMorph to: self white;
+ set: #preSelectionModifier for: #PluggableListMorph to: [ [:c | c alpha: 0.3] ];
+ set: #hoverSelectionModifier for: #PluggableListMorph to: [ [:c | c darker alpha: 0.3] ].
+
+ "Tree widgets"
+ theme
+ set: #higlightTextColor for: #SimpleHierarchicalListMorph to: self red;
+ set: #lineColor for: #SimpleHierarchicalListMorph to: self gray168.
+
+ "Text widgets"
+ theme
+ set: #textColor for: #PluggableTextMorph to: self white;
+ set: #caretColor for: #PluggableTextMorph to: self white;
+ set: #selectionColor for: #PluggableTextMorph to: (self blue alpha: 0.4);
+ set: #unfocusedSelectionModifier for: #PluggableTextMorph to: [ [:c | self blue alpha: 0.3] ];
+ set: #adornmentReadOnly for: #PluggableTextMorph to: self black;
+ set: #adornmentRefuse for: #PluggableTextMorph to: self blue;
+ set: #adornmentConflict for: #PluggableTextMorph to: self red;
+ set: #adornmentDiff for: #PluggableTextMorph to: self green;
+ set: #adornmentNormalEdit for: #PluggableTextMorph to: self orange;
+ set: #adornmentDiffEdit for: #PluggableTextMorph to: self yellow;
+ set: #frameAdornmentWidth for: #PluggableTextMorph to: 1.
+ theme
+ set: #balloonTextColor for: #PluggableTextMorphPlus to: self gray102.!

Item was added:
+ ----- Method: TrimTheme class>>addSyntaxHighlighting: (in category 'instance creation') -----
+ addSyntaxHighlighting: theme
+ "self createDark apply."
+
+ theme
+ set: #color for: #TextAction to: self blue;
+
+ set: #default for: #SHTextStylerST80 to: {self white};
+ set: #invalid for: #SHTextStylerST80 to: {self red};
+ set: #excessCode for: #SHTextStylerST80 to: {self red};
+ set: #comment for: #SHTextStylerST80 to: {self cyan};
+ set: #unfinishedComment for: #SHTextStylerST80 to: {self red. TextEmphasis italic};
+ set: #'$' for: #SHTextStylerST80 to: {self yellow};
+ set: #character for: #SHTextStylerST80 to: {self yellow};
+ set: #integer for: #SHTextStylerST80 to: {self yellow};
+ set: #number for: #SHTextStylerST80 to: {self yellow};
+ set: #- for: #SHTextStylerST80 to: {self yellow};
+ set: #symbol for: #SHTextStylerST80 to: {self orange};
+ set: #stringSymbol for: #SHTextStylerST80 to: {self orange};
+ set: #literalArray for: #SHTextStylerST80 to: {self orange};
+ set: #string for: #SHTextStylerST80 to: {self magenta. TextEmphasis normal};
+ set: #unfinishedString for: #SHTextStylerST80 to: {self red. TextEmphasis normal};
+ set: #assignment for: #SHTextStylerST80 to: {nil. TextEmphasis bold};
+ set: #ansiAssignment for: #SHTextStylerST80 to: {nil. TextEmphasis bold};
+ set: #literal for: #SHTextStylerST80 to: {nil. TextEmphasis italic};
+ set: #keyword for: #SHTextStylerST80 to: {self blue};
+ set: #binary for: #SHTextStylerST80 to: {self blue};
+ set: #unary for: #SHTextStylerST80 to: {self blue};
+ set: #incompleteKeyword for: #SHTextStylerST80 to: {self white. TextEmphasis underlined};
+ set: #incompleteBinary for: #SHTextStylerST80 to: {self white. TextEmphasis underlined};
+ set: #incompleteUnary for: #SHTextStylerST80 to: {self white. TextEmphasis underlined};
+ set: #undefinedKeyword for: #SHTextStylerST80 to: {self red};
+ set: #undefinedBinary for: #SHTextStylerST80 to: {self red};
+ set: #undefinedUnary for: #SHTextStylerST80 to: {self red};
+ set: #patternKeyword for: #SHTextStylerST80 to: {nil};
+ set: #patternBinary for: #SHTextStylerST80 to: {nil};
+ set: #patternUnary for: #SHTextStylerST80 to: {nil};
+ set: #self for: #SHTextStylerST80 to: {self gray168};
+ set: #super for: #SHTextStylerST80 to: {self gray168};
+ set: #true for: #SHTextStylerST80 to: {self red};
+ set: #false for: #SHTextStylerST80 to: {self red};
+ set: #nil for: #SHTextStylerST80 to: {self red};
+ set: #thisContext for: #SHTextStylerST80 to: {self red};
+ set: #return for: #SHTextStylerST80 to: {self red};
+ set: #patternArg for: #SHTextStylerST80 to: {self gray168};
+ set: #methodArg for: #SHTextStylerST80 to: {self gray168};
+ set: #blockPatternArg for: #SHTextStylerST80 to: {self gray168};
+ set: #blockArg for: #SHTextStylerST80 to: {self gray168};
+ set: #argument for: #SHTextStylerST80 to: {self gray168};
+ set: #blockArgColon for: #SHTextStylerST80 to: {self white};
+ set: #leftParenthesis for: #SHTextStylerST80 to: {self white};
+ set: #rightParenthesis for: #SHTextStylerST80 to: {self white};
+ set: #leftParenthesis1 for: #SHTextStylerST80 to: {self gray168};
+ set: #rightParenthesis1 for: #SHTextStylerST80 to: {self gray168};
+ set: #leftParenthesis2 for: #SHTextStylerST80 to: {self gray128};
+ set: #rightParenthesis2 for: #SHTextStylerST80 to: {self gray128};
+ set: #leftParenthesis3 for: #SHTextStylerST80 to: {self gray102};
+ set: #rightParenthesis3 for: #SHTextStylerST80 to: {self gray102};
+ set: #leftParenthesis4 for: #SHTextStylerST80 to: {self gray76};
+ set: #rightParenthesis4 for: #SHTextStylerST80 to: {self gray76};
+ set: #leftParenthesis5 for: #SHTextStylerST80 to: {self gray102};
+ set: #rightParenthesis5 for: #SHTextStylerST80 to: {self gray102};
+ set: #leftParenthesis6 for: #SHTextStylerST80 to: {self gray128};
+ set: #rightParenthesis6 for: #SHTextStylerST80 to: {self gray128};
+ set: #leftParenthesis7 for: #SHTextStylerST80 to: {self gray168};
+ set: #rightParenthesis7 for: #SHTextStylerST80 to: {self gray168};
+ set: #blockStart for: #SHTextStylerST80 to: {self white};
+ set: #blockEnd for: #SHTextStylerST80 to: {self white};
+ set: #blockStart1 for: #SHTextStylerST80 to: {self gray168};
+ set: #blockEnd1 for: #SHTextStylerST80 to: {self gray168};
+ set: #blockStart2 for: #SHTextStylerST80 to: {self gray128};
+ set: #blockEnd2 for: #SHTextStylerST80 to: {self gray128};
+ set: #blockStart3 for: #SHTextStylerST80 to: {self gray102};
+ set: #blockEnd3 for: #SHTextStylerST80 to: {self gray102};
+ set: #blockStart4 for: #SHTextStylerST80 to: {self gray76};
+ set: #blockEnd4 for: #SHTextStylerST80 to: {self gray76};
+ set: #blockStart5 for: #SHTextStylerST80 to: {self gray102};
+ set: #blockEnd5 for: #SHTextStylerST80 to: {self gray102};
+ set: #blockStart6 for: #SHTextStylerST80 to: {self gray128};
+ set: #blockEnd6 for: #SHTextStylerST80 to: {self gray128};
+ set: #blockStart7 for: #SHTextStylerST80 to: {self gray168};
+ set: #blockEnd7 for: #SHTextStylerST80 to: {self gray168};
+ set: #arrayStart for: #SHTextStylerST80 to: {self white};
+ set: #arrayEnd for: #SHTextStylerST80 to: {self white};
+ set: #arrayStart1 for: #SHTextStylerST80 to: {self white};
+ set: #arrayEnd1 for: #SHTextStylerST80 to: {self white};
+ set: #byteArrayStart for: #SHTextStylerST80 to: {self white};
+ set: #byteArrayEnd for: #SHTextStylerST80 to: {self white};
+ set: #byteArrayStart1 for: #SHTextStylerST80 to: {self white};
+ set: #byteArrayEnd1 for: #SHTextStylerST80 to: {self white};
+ set: #leftBrace for: #SHTextStylerST80 to: {self white};
+ set: #rightBrace for: #SHTextStylerST80 to: {self white};
+ set: #cascadeSeparator for: #SHTextStylerST80 to: {self white};
+ set: #statementSeparator for: #SHTextStylerST80 to: {self white};
+ set: #externalCallType for: #SHTextStylerST80 to: {self white};
+ set: #externalCallTypePointerIndicator for: #SHTextStylerST80 to: {self white};
+ set: #primitiveOrExternalCallStart for: #SHTextStylerST80 to: {self white};
+ set: #primitiveOrExternalCallEnd for: #SHTextStylerST80 to: {self white};
+ set: #methodTempBar for: #SHTextStylerST80 to: {self white};
+ set: #blockTempBar for: #SHTextStylerST80 to: {self white};
+ set: #blockArgsBar for: #SHTextStylerST80 to: {self white};
+ set: #primitive for: #SHTextStylerST80 to: {self green. TextEmphasis bold};
+ set: #pragmaKeyword for: #SHTextStylerST80 to: {self green. TextEmphasis bold};
+ set: #pragmaUnary for: #SHTextStylerST80 to: {self green. TextEmphasis bold};
+ set: #pragmaBinary for: #SHTextStylerST80 to: {self green. TextEmphasis bold};
+ set: #externalFunctionCallingConvention for: #SHTextStylerST80 to: {self green. TextEmphasis bold};
+ set: #module for: #SHTextStylerST80 to: {self green. TextEmphasis bold};
+ set: #blockTempVar for: #SHTextStylerST80 to: {self white};
+ set: #blockPatternTempVar for: #SHTextStylerST80 to: {self white};
+ set: #instVar for: #SHTextStylerST80 to: {self white};
+ set: #workspaceVar for: #SHTextStylerST80 to: {self white};
+ set: #undefinedIdentifier for: #SHTextStylerST80 to: {self red};
+ set: #incompleteIdentifier for: #SHTextStylerST80 to: {self white. {TextEmphasis italic. TextEmphasis underlined}};
+ set: #tempVar for: #SHTextStylerST80 to: {self white};
+ set: #patternTempVar for: #SHTextStylerST80 to: {self white};
+ set: #poolConstant for: #SHTextStylerST80 to: {self white};
+ set: #classVar for: #SHTextStylerST80 to: {self white};
+ set: #globalVar for: #SHTextStylerST80 to: {self white}.
+
+ "And the text differ"
+ theme
+ set: #insertTextAttributes for: #TextDiffBuilder to: { TextColor color: self green };
+ set: #removeTextAttributes for: #TextDiffBuilder to: { TextEmphasis struckOut. TextColor color: self red };
+ set: #normalTextAttributes for: #TextDiffBuilder to: { TextEmphasis normal }.!

Item was added:
+ ----- Method: TrimTheme class>>addToolColors: (in category 'instance creation') -----
+ addToolColors: theme
+ "Tool-specific colors."
+
+ "SUnit's TestRunner."
+ theme
+ set: #failureColor for: #TestRunner to: self yellow;
+ set: #errorColor for: #TestRunner to: self red;
+ set: #passColor for: #TestRunner to: self green.
+
+ "Monticello Tools."
+ theme
+ set: #revertedOperationAttributes for: #MCOperationsBrowser to: {TextEmphasis struckOut};
+ set: #ignoredOperationAttributes for: #MCOperationsBrowser to: {TextColor color: self gray128}.
+
+ "Browser."
+ theme set: #noClassCommentColor for: #Browser to: self red.!

Item was added:
+ ----- Method: TrimTheme class>>addWindowColors: (in category 'instance creation') -----
+ addWindowColors: theme
+
+ | windowColorBrightnessAdjustment |
+ windowColorBrightnessAdjustment := -0.35.
+ theme
+ set: #titleFont for: #SystemWindow to: [Preferences windowTitleFont];
+ set: #borderColorModifier for: #SystemWindow to: [ [:c | c adjustBrightness: -0.1] ];
+ set: #borderColorModifier for: #ScrollPane to: [ [:c | c adjustBrightness: 0.1] ];
+ set: #borderWidth for: #SystemWindow to: 1;
+
+ set: #uniformWindowColor for: #Model to: self gray76;
+
+ set: #unfocusedWindowColorModifier for: #SystemWindow to: [ [:color | color alphaMixed: 0.5 with: self gray40] ];
+ set: #unfocusedLabelColor for: #SystemWindow to: self gray168;
+ set: #focusedLabelColor for: #SystemWindow to: Color white;
+
+ set: #customWindowColor for: #Browser to: ((Color r: 0.764 g: 0.9 b: 0.63) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #ChangeList to: ((Color r: 0.719 g: 0.9 b: 0.9) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #ChangeSorter to: ((Color r: 0.719 g: 0.9 b: 0.9) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #ChatNotes to: ((Color r: 1.0 g: 0.7 b: 0.8) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #ClassCommentVersionsBrowser to: ((Color r: 0.753 g: 0.677 b: 0.9) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #Debugger to: ((Color r: 0.9 g: 0.719 b: 0.719) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #DualChangeSorter to: ((Color r: 0.719 g: 0.9 b: 0.9) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #FileContentsBrowser to: ((Color r: 0.7 g: 0.7 b: 0.508) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #FileList to: ((Color r: 0.65 g: 0.65 b: 0.65) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #InstanceBrowser to: ((Color r: 0.726 g: 0.9 b: 0.9) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #Lexicon to: ((Color r: 0.79 g: 0.9 b: 0.79) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #MCTool to: ((Color r: 0.65 g: 0.691 b: 0.876) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #MessageNames to: ((Color r: 0.639 g: 0.9 b: 0.497) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #MessageSet to: ((Color r: 0.719 g: 0.9 b: 0.9) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #PackagePaneBrowser to: ((Color r: 0.9 g: 0.9 b: 0.63) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #PluggableFileList to: (Color lightYellow adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #PreferenceBrowser to: ((Color r: 0.671 g: 0.9 b: 0.9) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #SMLoader to: ((Color r: 0.801 g: 0.801 b: 0.614) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #SMLoaderPlus to: ((Color r: 0.801 g: 0.801 b: 0.614) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #SMReleaseBrowser to: ((Color r: 0.801 g: 0.801 b: 0.614) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #ScriptingDomain to: ((Color r: 0.91 g: 0.91 b: 0.91) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #SelectorBrowser to: ((Color r: 0.45 g: 0.9 b: 0.9) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #StringHolder to: ((Color r: 0.9 g: 0.9 b: 0.719) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #TestRunner to: ((Color r: 0.9 g: 0.576 b: 0.09) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #TranscriptStream to: ((Color r: 0.9 g: 0.75 b: 0.45) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #VersionsBrowser to: ((Color r: 0.782 g: 0.677 b: 0.9) adjustBrightness: windowColorBrightnessAdjustment).!

Item was added:
+ ----- Method: TrimTheme class>>backgroundForm (in category 'instance creation') -----
+ backgroundForm
+
+ | ref |
+ ref := self gray39.
+
+ ^ (SqueakTheme linenblue asFormOfDepth: 32) collectColors: [:c |
+ Color
+ h:ref hue
+ s: ref saturation
+ v: c brightness - 0.12
+ alpha: c alpha]!

Item was added:
+ ----- Method: TrimTheme class>>black (in category 'colors') -----
+ black
+
+ ^ self gray27!

Item was added:
+ ----- Method: TrimTheme class>>blue (in category 'colors') -----
+ blue
+
+ ^ Color r: 94 / 255 g: 140 / 255 b: 204 / 255!

Item was added:
+ ----- Method: TrimTheme class>>create (in category 'instance creation') -----
+ create
+ "doIt: [self create apply.]"
+
+ | themeName |
+ themeName := 'Trim (dark)'.
+ ^ (self named: themeName) in: [:theme |
+ theme merge: (self named: 'Squeak') overwrite: true.
+ theme name: themeName.
+
+ "General morph stuff."
+ theme
+ set: #keyboardFocusColor for: #Morph to: self blue;
+ set: #keyboardFocusWidth for: #Morph to: 2.
+
+ theme set: #background for: #MorphicProject to: self backgroundForm.
+
+ self addFonts: theme.
+ self addWindowColors: theme.
+ self addSyntaxHighlighting: theme.
+ self addMenusAndDockingBars: theme.
+ self addDialogs: theme.
+ self addButtons: theme.
+ self addScrollables: theme.
+ self addToolColors: theme.
+
+ theme]!

Item was added:
+ ----- Method: TrimTheme class>>cyan (in category 'colors') -----
+ cyan
+
+ ^ Color fromString: '#2aa198'!

Item was added:
+ ----- Method: TrimTheme class>>gray102 (in category 'colors - gray') -----
+ gray102
+
+ ^ Color gray: 102 / 255!

Item was added:
+ ----- Method: TrimTheme class>>gray128 (in category 'colors - gray') -----
+ gray128
+
+ ^ Color gray: 128 / 255!

Item was added:
+ ----- Method: TrimTheme class>>gray168 (in category 'colors - gray') -----
+ gray168
+
+ ^ Color gray: 168 / 255!

Item was added:
+ ----- Method: TrimTheme class>>gray27 (in category 'colors - gray') -----
+ gray27
+
+ ^ Color gray: 27 / 255!

Item was added:
+ ----- Method: TrimTheme class>>gray34 (in category 'colors - gray') -----
+ gray34
+
+ ^ Color gray: 34 / 255!

Item was added:
+ ----- Method: TrimTheme class>>gray39 (in category 'colors - gray') -----
+ gray39
+
+ ^ Color gray: 39 / 255!

Item was added:
+ ----- Method: TrimTheme class>>gray40 (in category 'colors - gray') -----
+ gray40
+
+ ^ Color gray: 40 / 255!

Item was added:
+ ----- Method: TrimTheme class>>gray51 (in category 'colors - gray') -----
+ gray51
+
+ ^ Color gray: 51 / 255!

Item was added:
+ ----- Method: TrimTheme class>>gray59 (in category 'colors - gray') -----
+ gray59
+
+ ^ Color gray: 59 / 255!

Item was added:
+ ----- Method: TrimTheme class>>gray61 (in category 'colors - gray') -----
+ gray61
+
+ ^ Color gray: 61 / 255!

Item was added:
+ ----- Method: TrimTheme class>>gray64 (in category 'colors - gray') -----
+ gray64
+
+ ^ Color gray: 64 / 255!

Item was added:
+ ----- Method: TrimTheme class>>gray76 (in category 'colors - gray') -----
+ gray76
+
+ ^ Color gray: 76 / 255!

Item was added:
+ ----- Method: TrimTheme class>>green (in category 'colors') -----
+ green
+
+ ^ Color fromString: '#859900'!

Item was added:
+ ----- Method: TrimTheme class>>magenta (in category 'colors') -----
+ magenta
+
+ ^ (Color r: 0.917 g: 0.317 b: 0.607)!

Item was added:
+ ----- Method: TrimTheme class>>orange (in category 'colors') -----
+ orange
+
+ ^ (Color r: 0.886 g: 0.383 b: 0.175)!

Item was added:
+ ----- Method: TrimTheme class>>red (in category 'colors') -----
+ red
+
+ ^ (Color r: 0.952 g: 0.3 b: 0.288)!

Item was added:
+ ----- Method: TrimTheme class>>violet (in category 'colors') -----
+ violet
+
+ ^ Color fromString: '#6c71c4'!

Item was added:
+ ----- Method: TrimTheme class>>white (in category 'colors') -----
+ white
+
+ ^ Color gray: 240 / 255!

Item was added:
+ ----- Method: TrimTheme class>>yellow (in category 'colors') -----
+ yellow
+
+ ^ Color fromString: '#b58900'!

Item was changed:
----- Method: UserInterfaceTheme class>>cleanUp: (in category 'initialize-release') -----
cleanUp: aggressive

aggressive ifTrue: [
All := nil.
SqueakTheme create; createDuller.
SolarizedTheme createDark; createLight.
MonokaiTheme createDark.
+ CommunityTheme createDark.
+ TrimTheme create].!
- CommunityTheme createDark].!

Hi Eliot,

On 3 April 2018 at 15:20, Eliot Miranda <[hidden email]> wrote:

> Hi Dark Themers,
>
>     in an earlier life I worked in optics, designing holographic cameras for
> bubble chamber physics, so I know a little about focussing systems and depth
> of field.  The iris in the eye expands or contracts to allow or restrict the
> amount of light entering the eye, attempting to maintain a constant
> luminosity on the retina so that either not too little, or not too much
> light falls on the cones and rods in the retina.  When the iris is dilated
> (open) the eye allows as much light as possible into it.  You can visualize
> the light from a point (say a pixel) that reaches the iris as a cone.  The
> lens in the eye focuses this expanding cone back into a contracting one that
> comes to a point on the retina corresponding to the position of the pixel
> "out there on the screen".
>
> Focusing is achieved by a muscle around the eye's flexible lens, the cillary
> muscle, which squeezes the lens into a more spherical shape to cause rays
> entering the eye to bend more, brings no objects closer to the eye into
> focus, or by the cillary muscle relaxing, allowing the lens to stretch back
> to a flatter shape, to bend rays less, bringing objects further away into
> focus.  In old age shortsightedness is caused by the lens loosing its
> elasticity and remaining squeezed, and longsightedness by it losing
> flexibility and the cillary muscle losing strength so that the lens cannot
> be squeezed as much.  By the time we hit our 40's many of us will suffer one
> of these two extremes and have to wear glasses either for reading or for
> driving or, in my case, for both.
>
>
> Getting back to the cone of rays from a pixel that the iris and lens
> conspire to bring to a point on the retina, if there is a lot of light
> incident on the eye and the iris is undilated then this cone is much
> slimmer.  The result of these differing cones on focus is called depth of
> field.  When the cone is "fat" depth of field is reduced; only pixels in the
> same plane (actually a spherical surface, not a plane, because the retina is
> spherical; film cameras have planar light receptors; the eye and camera
> obscures etc have spherical light receptors) will be in focus; others out of
> the plane will produce a diffuse circle on the retina.  When the cone is
> "slim" (because more light is incident on the eye) depth of field is
> increased because the size of the out of focus diffuse circle is smaller.
> Consequently, when there is less light falling on the eye, depth of field is
> reduced; the cones are fatter and as the eye roams the cillary muscle must
> work to alter the curvature of the lens to keep things in focus.
>
> The implication for the dark theme is that, while it appears to have better
> contrast (it does not; but more on that below), the real effect is that it
> causes the eye to do more work than a light theme because the amount of
> light entering the eye is less.  So both in the short term and especially
> over the long term the dark theme, relative to the light theme, will tire
> your collate muscle and cause your lens to stiffen or squish sooner.
>
> Why then, if what I'm saying is true, did all those World War Two military
> aircraft use white letters on a black background?  My lotus europa is the
> same.  The disc of the instrument is illuminated by a lamp so one can see it
> at night, and were the panel painted white then, for the same contrast, much
> more light would hit the eye that for white letters on a black background
> and the pilot's (or driver's) night vision would be impaired as the iris
> would contract.
>
> I don't want to fear monger, but I do want to suggest that it is healthier
> and less wearing on the eyes to use light themes.

Great description, thanks!  I went through this 2 or 3 years ago - I
used to like dark themes because they looked "nicer".  Now I'm
exhausted after looking at them for a few minutes.  I also get to
enjoy dealing with multi-focal glasses.

Although I do miss my green-on-black terminal...

> Eliot
> _,,,^..^,,,_ (phone)

How can you type all this on a phone?  I'd be cross-eyed, as well as
feeling like my phone had a dark theme (which it doesn't). :-)

Cheers.
Alistair

On Tue, Apr 3, 2018 at 12:36 PM, karl ramberg <[hidden email]> wrote:

I often work in low light situations and the bright back light from lcd screens are a strain on the eyes. as well as it lights up the room where other people around me wants it dark.  

The choice is good :-)

+1. At night everything changes.  Dark themes work at night. 

But a spherical screen, such that the eyes do not have to refocus as one looks at different parts of the screen, would be more restful.  I wanted to mention that these issues are behind iPhone's lovely night time low lighting scheme "Night Shift".  And I wanted to discuss contrast more.  But I thought I had gone on for long enough anyway :-)

Best,

Karl

On Tue, Apr 3, 2018 at 7:49 PM, Bert Freudenberg <[hidden email]> wrote:

Interesting, thank you.

I believe people choose dark themes because they secretly want to look as cool as the hackers in movies. Not that anyone would admit that, of course.

Then again, wanting to look cool is as valid a reason as any, fashion-wise. Choice is good :)

- Bert -

On 3 April 2018 at 15:20, Eliot Miranda <[hidden email]> wrote:

Hi Dark Themers,

    in an earlier life I worked in optics, designing holographic cameras for bubble chamber physics, so I know a little about focussing systems and depth of field.  The iris in the eye expands or contracts to allow or restrict the amount of light entering the eye, attempting to maintain a constant luminosity on the retina so that either not too little, or not too much light falls on the cones and rods in the retina.  When the iris is dilated (open) the eye allows as much light as possible into it.  You can visualize the light from a point (say a pixel) that reaches the iris as a cone.  The lens in the eye focuses this expanding cone back into a contracting one that comes to a point on the retina corresponding to the position of the pixel "out there on the screen".

Focusing is achieved by a muscle around the eye's flexible lens, the cillary muscle, which squeezes the lens into a more spherical shape to cause rays entering the eye to bend more, brings no objects closer to the eye into focus, or by the cillary muscle relaxing, allowing the lens to stretch back to a flatter shape, to bend rays less, bringing objects further away into focus.  In old age shortsightedness is caused by the lens loosing its elasticity and remaining squeezed, and longsightedness by it losing flexibility and the cillary muscle losing strength so that the lens cannot be squeezed as much.  By the time we hit our 40's many of us will suffer one of these two extremes and have to wear glasses either for reading or for driving or, in my case, for both.

Getting back to the cone of rays from a pixel that the iris and lens conspire to bring to a point on the retina, if there is a lot of light incident on the eye and the iris is undilated then this cone is much slimmer.  The result of these differing cones on focus is called depth of field.  When the cone is "fat" depth of field is reduced; only pixels in the same plane (actually a spherical surface, not a plane, because the retina is spherical; film cameras have planar light receptors; the eye and camera obscures etc have spherical light receptors) will be in focus; others out of the plane will produce a diffuse circle on the retina.  When the cone is "slim" (because more light is incident on the eye) depth of field is increased because the size of the out of focus diffuse circle is smaller. Consequently, when there is less light falling on the eye, depth of field is reduced; the cones are fatter and as the eye roams the cillary muscle must work to alter the curvature of the lens to keep things in focus.

The implication for the dark theme is that, while it appears to have better contrast (it does not; but more on that below), the real effect is that it causes the eye to do more work than a light theme because the amount of light entering the eye is less.  So both in the short term and especially over the long term the dark theme, relative to the light theme, will tire your collate muscle and cause your lens to stiffen or squish sooner.

Why then, if what I'm saying is true, did all those World War Two military aircraft use white letters on a black background?  My lotus europa is the same.  The disc of the instrument is illuminated by a lamp so one can see it at night, and were the panel painted white then, for the same contrast, much more light would hit the eye that for white letters on a black background and the pilot's (or driver's) night vision would be impaired as the iris would contract.

I don't want to fear monger, but I do want to suggest that it is healthier and less wearing on the eyes to use light themes.

Eliot

_,,,^..^,,,_ (phone)

On Apr 2, 2018, at 11:12 PM, Marcel Taeumel <[hidden email]> wrote:

<image.png>

Am 03.04.2018 08:07:45 schrieb [hidden email] <[hidden email]>:

Marcel Taeumel uploaded a new version of System to project The Trunk:
http://source.squeak.org/trunk/System-mt.1010.mcz

==================== Summary ====================

Name: System-mt.1010
Author: mt
Time: 3 April 2018, 8:07:14.69082 am
UUID: 322ad26c-26ac-0046-8e31-9db174de998e
Ancestors: System-cmm.1009

Adds an alternate gray-based dark UI theme.

=============== Diff against System-cmm.1009 ===============

Item was added:
+ UserInterfaceTheme subclass: #TrimTheme
+ instanceVariableNames: ''
+ classVariableNames: ''
+ poolDictionaries: ''
+ category: 'System-Support'!

Item was added:
+ ----- Method: TrimTheme class>>addButtons: (in category 'instance creation') -----
+ addButtons: theme
+
+ theme
+ set: #borderColor for: #PluggableButtonMorph to: self gray102;
+ set: #borderWidth for: #PluggableButtonMorph to: 1;
+ set: #borderStyle for: #PluggableButtonMorph to: BorderStyle default;
+ set: #color for: #PluggableButtonMorph to: self gray76;
+
+ set: #textColor for: #PluggableButtonMorph to: self white;
+
+ set: #selectionModifier for: #PluggableButtonMorph to: [ [:c | self gray39] ];
+ set: #hoverModifier for: #PluggableButtonMorph to: [ [:c | self gray51] ];
+ set: #feedbackModifier for: #PluggableButtonMorph to: [ [:c | self gray39] ].
+
+ "And the plus-version."
+ theme
+ set: #disabledColor for: #PluggableButtonMorphPlus to: Color transparent;
+ set: #disabledTextColor for: #PluggableButtonMorphPlus to: self gray128.!

Item was added:
+ ----- Method: TrimTheme class>>addDialogs: (in category 'instance creation') -----
+ addDialogs: theme
+ "self create apply."
+
+ theme
+ set: #borderColor for: #DialogWindow to: self gray59;
+ set: #borderWidth for: #DialogWindow to: 0;
+ set: #borderStyle for: #DialogWindow to: BorderStyle default;
+ set: #color for: #DialogWindow to: self gray64;
+
+ set: #titleBorderColor for: #DialogWindow to: self gray59;
+ set: #titleBorderWidth for: #DialogWindow to: 0;
+ set: #titleBorderStyle for: #DialogWindow to: BorderStyle default;
+ set: #titleColor for: #DialogWindow to: self gray51;
+ set: #titleTextColor for: #DialogWindow to: self white;
+
+ set: #textColor for: #DialogWindow to: self white;
+
+ set: #okColor for: #DialogWindow to: self green;
+ set: #cancelColor for: #DialogWindow to: self red;
+ set: #buttonColor for: #DialogWindow to: self gray59;
+ set: #selectionModifier for: #DialogWindow to: [ [:c | self blue ] ].
+
+ "The List Chooser is a dialog, too."
+ theme
+ set: #addColor for: #ListChooser to: self yellow;
+ set: #disabledColor for: #ListChooser to: Color transparent.
+
+
+ "And the system progress bar."
+ theme
+ set: #borderColor for: #SystemProgressBarMorph to: Color transparent;
+ set: #borderWidth for: #SystemProgressBarMorph to: 0;
+ set: #borderStyle for: #SystemProgressBarMorph to: BorderStyle default;
+ set: #color for: #SystemProgressBarMorph to: self gray64;
+ set: #barColor for: #SystemProgressBarMorph to: self blue.
+
+ "And the balloon morphs."
+ theme
+ set: #borderColor for: #NewBalloonMorph to: self gray168;
+ set: #borderWidth for: #NewBalloonMorph to: 1;
+ set: #color for: #NewBalloonMorph to: self gray102;
+ set: #textColor for: #NewBalloonMorph to: self white.!

Item was added:
+ ----- Method: TrimTheme class>>addFonts: (in category 'instance creation') -----
+ addFonts: theme
+
+ "Set-up fonts."
+ theme
+ set: #balloonHelpFont to: (StrikeFont familyName: 'Darkmap DejaVu Sans' pointSize: 7);
+ set: #standardButtonFont to: (StrikeFont familyName: 'Darkmap DejaVu Sans' pointSize: 7);
+ set: #standardCodeFont to: (StrikeFont familyName: 'Darkmap DejaVu Sans' pointSize: 9);
+ set: #standardFlapFont to: (StrikeFont familyName: 'Darkmap DejaVu Sans' pointSize: 7 emphasized: TextEmphasis bold emphasisCode);
+ set: #haloLabelFont to: (StrikeFont familyName: 'Darkmap DejaVu Sans' pointSize: 9);
+ set: #standardListFont to: (StrikeFont familyName: 'Darkmap DejaVu Sans' pointSize: 9);
+ set: #standardMenuFont to: (StrikeFont familyName: 'Darkmap DejaVu Sans' pointSize: 9);
+ set: #standardSystemFont to: (StrikeFont familyName: 'Darkmap DejaVu Sans' pointSize: 9);
+ set: #windowTitleFont to: (StrikeFont familyName: 'Darkmap DejaVu Sans' pointSize: 9).!

Item was added:
+ ----- Method: TrimTheme class>>addMenusAndDockingBars: (in category 'instance creation') -----
+ addMenusAndDockingBars: theme
+
+ theme
+ set: #borderColor for: #MenuMorph to: self gray51;
+ set: #borderWidth for: #MenuMorph to: 1;
+ set: #borderStyle for: #MenuMorph to: BorderStyle default;
+ set: #color for: #MenuMorph to: self gray27;
+
+ set: #titleBorderColor for: #MenuMorph to: (Color r: 0.6 g: 0.7 b: 1);
+ set: #titleBorderWidth for: #MenuMorph to: 0;
+ set: #titleBorderStyle for: #MenuMorph to: BorderStyle default;
+ set: #titleColor for: #MenuMorph to: Color transparent;
+ set: #titleTextColor for: #MenuMorph to: self white;
+
+ set: #lineColor for: #MenuMorph to: self gray51;
+ set: #lineStyle for: #MenuMorph to: BorderStyle simple;
+ set: #lineWidth for: #MenuMorph to: 1.
+
+ theme
+ set: #textColor for: #MenuItemMorph to: self white;
+ set: #disabledTextColor for: #MenuItemMorph to: self gray128;
+ set: #selectionColor for: #MenuItemMorph to: self gray102;
+ set: #selectionTextColor for: #MenuItemMorph to: self white.
+
+ "The world main docking bar."
+ theme
+ set: #logoColor for: #TheWorldMainDockingBar to: self white;
+ set: #selectionLogoColor for: #TheWorldMainDockingBar to: self white.!

Item was added:
+ ----- Method: TrimTheme class>>addScrollables: (in category 'instance creation') -----
+ addScrollables: theme
+ "self create apply"
+
+ "Sliders"
+ theme
+ set: #borderColor for: #Slider to: self gray76;
+ set: #borderWidth for: #Slider to: 1;
+ set: #color for: #Slider to: self gray61;
+ set: #thumbBorderColor for: #Slider to: self gray61;
+ set: #thumbBorderWidth for: #Slider to: 1;
+ set: #thumbColor for: #Slider to: self gray128;
+ set: #thumbShadowModifier for: #Slider to: [ [:c | c alpha: 0.7] ].
+
+ "Scroll bars"
+ theme
+ set: #thumbBorderWidth for: #ScrollBar to: 1;
+ set: #thumbColorModifier for: #ScrollBar to: [ [:c | c adjustBrightness: 0.2] ];
+ "set: #pagingAreaColorModifier for: #ScrollBar to: [ [:c | self gray51] ];"
+ set: #borderColorModifier for: #ScrollBar to: [ [:c | c adjustBrightness: 0.2] ].
+
+ "Scroll panes (includes generic stuff for list widgets, tree widgets, and text widgets."
+ theme
+ set: #borderColor for: #ScrollPane to: self gray76;
+ set: #borderWidth for: #ScrollPane to: 1;
+ set: #borderStyle for: #ScrollPane to: BorderStyle default;
+ set: #color for: #ScrollPane to: self gray51.
+
+ "List widgets"
+ theme
+ set: #textColor for: #PluggableListMorph to: self white;
+ set: #selectionColor for: #PluggableListMorph to: self blue;
+ derive: #multiSelectionColor for: #PluggableListMorph from: #PluggableListMorph at: #selectionColor do: [:c | c lighter];
+ set: #selectionTextColor for: #PluggableListMorph to: self white;
+ set: #filterColor for: #PluggableListMorph to: self orange;
+ set: #filterTextColor for: #PluggableListMorph to: self white;
+ set: #preSelectionModifier for: #PluggableListMorph to: [ [:c | c alpha: 0.3] ];
+ set: #hoverSelectionModifier for: #PluggableListMorph to: [ [:c | c darker alpha: 0.3] ].
+
+ "Tree widgets"
+ theme
+ set: #higlightTextColor for: #SimpleHierarchicalListMorph to: self red;
+ set: #lineColor for: #SimpleHierarchicalListMorph to: self gray168.
+
+ "Text widgets"
+ theme
+ set: #textColor for: #PluggableTextMorph to: self white;
+ set: #caretColor for: #PluggableTextMorph to: self white;
+ set: #selectionColor for: #PluggableTextMorph to: (self blue alpha: 0.4);
+ set: #unfocusedSelectionModifier for: #PluggableTextMorph to: [ [:c | self blue alpha: 0.3] ];
+ set: #adornmentReadOnly for: #PluggableTextMorph to: self black;
+ set: #adornmentRefuse for: #PluggableTextMorph to: self blue;
+ set: #adornmentConflict for: #PluggableTextMorph to: self red;
+ set: #adornmentDiff for: #PluggableTextMorph to: self green;
+ set: #adornmentNormalEdit for: #PluggableTextMorph to: self orange;
+ set: #adornmentDiffEdit for: #PluggableTextMorph to: self yellow;
+ set: #frameAdornmentWidth for: #PluggableTextMorph to: 1.
+ theme
+ set: #balloonTextColor for: #PluggableTextMorphPlus to: self gray102.!

Item was added:
+ ----- Method: TrimTheme class>>addSyntaxHighlighting: (in category 'instance creation') -----
+ addSyntaxHighlighting: theme
+ "self createDark apply."
+
+ theme
+ set: #color for: #TextAction to: self blue;
+
+ set: #default for: #SHTextStylerST80 to: {self white};
+ set: #invalid for: #SHTextStylerST80 to: {self red};
+ set: #excessCode for: #SHTextStylerST80 to: {self red};
+ set: #comment for: #SHTextStylerST80 to: {self cyan};
+ set: #unfinishedComment for: #SHTextStylerST80 to: {self red. TextEmphasis italic};
+ set: #'$' for: #SHTextStylerST80 to: {self yellow};
+ set: #character for: #SHTextStylerST80 to: {self yellow};
+ set: #integer for: #SHTextStylerST80 to: {self yellow};
+ set: #number for: #SHTextStylerST80 to: {self yellow};
+ set: #- for: #SHTextStylerST80 to: {self yellow};
+ set: #symbol for: #SHTextStylerST80 to: {self orange};
+ set: #stringSymbol for: #SHTextStylerST80 to: {self orange};
+ set: #literalArray for: #SHTextStylerST80 to: {self orange};
+ set: #string for: #SHTextStylerST80 to: {self magenta. TextEmphasis normal};
+ set: #unfinishedString for: #SHTextStylerST80 to: {self red. TextEmphasis normal};
+ set: #assignment for: #SHTextStylerST80 to: {nil. TextEmphasis bold};
+ set: #ansiAssignment for: #SHTextStylerST80 to: {nil. TextEmphasis bold};
+ set: #literal for: #SHTextStylerST80 to: {nil. TextEmphasis italic};
+ set: #keyword for: #SHTextStylerST80 to: {self blue};
+ set: #binary for: #SHTextStylerST80 to: {self blue};
+ set: #unary for: #SHTextStylerST80 to: {self blue};
+ set: #incompleteKeyword for: #SHTextStylerST80 to: {self white. TextEmphasis underlined};
+ set: #incompleteBinary for: #SHTextStylerST80 to: {self white. TextEmphasis underlined};
+ set: #incompleteUnary for: #SHTextStylerST80 to: {self white. TextEmphasis underlined};
+ set: #undefinedKeyword for: #SHTextStylerST80 to: {self red};
+ set: #undefinedBinary for: #SHTextStylerST80 to: {self red};
+ set: #undefinedUnary for: #SHTextStylerST80 to: {self red};
+ set: #patternKeyword for: #SHTextStylerST80 to: {nil};
+ set: #patternBinary for: #SHTextStylerST80 to: {nil};
+ set: #patternUnary for: #SHTextStylerST80 to: {nil};
+ set: #self for: #SHTextStylerST80 to: {self gray168};
+ set: #super for: #SHTextStylerST80 to: {self gray168};
+ set: #true for: #SHTextStylerST80 to: {self red};
+ set: #false for: #SHTextStylerST80 to: {self red};
+ set: #nil for: #SHTextStylerST80 to: {self red};
+ set: #thisContext for: #SHTextStylerST80 to: {self red};
+ set: #return for: #SHTextStylerST80 to: {self red};
+ set: #patternArg for: #SHTextStylerST80 to: {self gray168};
+ set: #methodArg for: #SHTextStylerST80 to: {self gray168};
+ set: #blockPatternArg for: #SHTextStylerST80 to: {self gray168};
+ set: #blockArg for: #SHTextStylerST80 to: {self gray168};
+ set: #argument for: #SHTextStylerST80 to: {self gray168};
+ set: #blockArgColon for: #SHTextStylerST80 to: {self white};
+ set: #leftParenthesis for: #SHTextStylerST80 to: {self white};
+ set: #rightParenthesis for: #SHTextStylerST80 to: {self white};
+ set: #leftParenthesis1 for: #SHTextStylerST80 to: {self gray168};
+ set: #rightParenthesis1 for: #SHTextStylerST80 to: {self gray168};
+ set: #leftParenthesis2 for: #SHTextStylerST80 to: {self gray128};
+ set: #rightParenthesis2 for: #SHTextStylerST80 to: {self gray128};
+ set: #leftParenthesis3 for: #SHTextStylerST80 to: {self gray102};
+ set: #rightParenthesis3 for: #SHTextStylerST80 to: {self gray102};
+ set: #leftParenthesis4 for: #SHTextStylerST80 to: {self gray76};
+ set: #rightParenthesis4 for: #SHTextStylerST80 to: {self gray76};
+ set: #leftParenthesis5 for: #SHTextStylerST80 to: {self gray102};
+ set: #rightParenthesis5 for: #SHTextStylerST80 to: {self gray102};
+ set: #leftParenthesis6 for: #SHTextStylerST80 to: {self gray128};
+ set: #rightParenthesis6 for: #SHTextStylerST80 to: {self gray128};
+ set: #leftParenthesis7 for: #SHTextStylerST80 to: {self gray168};
+ set: #rightParenthesis7 for: #SHTextStylerST80 to: {self gray168};
+ set: #blockStart for: #SHTextStylerST80 to: {self white};
+ set: #blockEnd for: #SHTextStylerST80 to: {self white};
+ set: #blockStart1 for: #SHTextStylerST80 to: {self gray168};
+ set: #blockEnd1 for: #SHTextStylerST80 to: {self gray168};
+ set: #blockStart2 for: #SHTextStylerST80 to: {self gray128};
+ set: #blockEnd2 for: #SHTextStylerST80 to: {self gray128};
+ set: #blockStart3 for: #SHTextStylerST80 to: {self gray102};
+ set: #blockEnd3 for: #SHTextStylerST80 to: {self gray102};
+ set: #blockStart4 for: #SHTextStylerST80 to: {self gray76};
+ set: #blockEnd4 for: #SHTextStylerST80 to: {self gray76};
+ set: #blockStart5 for: #SHTextStylerST80 to: {self gray102};
+ set: #blockEnd5 for: #SHTextStylerST80 to: {self gray102};
+ set: #blockStart6 for: #SHTextStylerST80 to: {self gray128};
+ set: #blockEnd6 for: #SHTextStylerST80 to: {self gray128};
+ set: #blockStart7 for: #SHTextStylerST80 to: {self gray168};
+ set: #blockEnd7 for: #SHTextStylerST80 to: {self gray168};
+ set: #arrayStart for: #SHTextStylerST80 to: {self white};
+ set: #arrayEnd for: #SHTextStylerST80 to: {self white};
+ set: #arrayStart1 for: #SHTextStylerST80 to: {self white};
+ set: #arrayEnd1 for: #SHTextStylerST80 to: {self white};
+ set: #byteArrayStart for: #SHTextStylerST80 to: {self white};
+ set: #byteArrayEnd for: #SHTextStylerST80 to: {self white};
+ set: #byteArrayStart1 for: #SHTextStylerST80 to: {self white};
+ set: #byteArrayEnd1 for: #SHTextStylerST80 to: {self white};
+ set: #leftBrace for: #SHTextStylerST80 to: {self white};
+ set: #rightBrace for: #SHTextStylerST80 to: {self white};
+ set: #cascadeSeparator for: #SHTextStylerST80 to: {self white};
+ set: #statementSeparator for: #SHTextStylerST80 to: {self white};
+ set: #externalCallType for: #SHTextStylerST80 to: {self white};
+ set: #externalCallTypePointerIndicator for: #SHTextStylerST80 to: {self white};
+ set: #primitiveOrExternalCallStart for: #SHTextStylerST80 to: {self white};
+ set: #primitiveOrExternalCallEnd for: #SHTextStylerST80 to: {self white};
+ set: #methodTempBar for: #SHTextStylerST80 to: {self white};
+ set: #blockTempBar for: #SHTextStylerST80 to: {self white};
+ set: #blockArgsBar for: #SHTextStylerST80 to: {self white};
+ set: #primitive for: #SHTextStylerST80 to: {self green. TextEmphasis bold};
+ set: #pragmaKeyword for: #SHTextStylerST80 to: {self green. TextEmphasis bold};
+ set: #pragmaUnary for: #SHTextStylerST80 to: {self green. TextEmphasis bold};
+ set: #pragmaBinary for: #SHTextStylerST80 to: {self green. TextEmphasis bold};
+ set: #externalFunctionCallingConvention for: #SHTextStylerST80 to: {self green. TextEmphasis bold};
+ set: #module for: #SHTextStylerST80 to: {self green. TextEmphasis bold};
+ set: #blockTempVar for: #SHTextStylerST80 to: {self white};
+ set: #blockPatternTempVar for: #SHTextStylerST80 to: {self white};
+ set: #instVar for: #SHTextStylerST80 to: {self white};
+ set: #workspaceVar for: #SHTextStylerST80 to: {self white};
+ set: #undefinedIdentifier for: #SHTextStylerST80 to: {self red};
+ set: #incompleteIdentifier for: #SHTextStylerST80 to: {self white. {TextEmphasis italic. TextEmphasis underlined}};
+ set: #tempVar for: #SHTextStylerST80 to: {self white};
+ set: #patternTempVar for: #SHTextStylerST80 to: {self white};
+ set: #poolConstant for: #SHTextStylerST80 to: {self white};
+ set: #classVar for: #SHTextStylerST80 to: {self white};
+ set: #globalVar for: #SHTextStylerST80 to: {self white}.
+
+ "And the text differ"
+ theme
+ set: #insertTextAttributes for: #TextDiffBuilder to: { TextColor color: self green };
+ set: #removeTextAttributes for: #TextDiffBuilder to: { TextEmphasis struckOut. TextColor color: self red };
+ set: #normalTextAttributes for: #TextDiffBuilder to: { TextEmphasis normal }.!

Item was added:
+ ----- Method: TrimTheme class>>addToolColors: (in category 'instance creation') -----
+ addToolColors: theme
+ "Tool-specific colors."
+
+ "SUnit's TestRunner."
+ theme
+ set: #failureColor for: #TestRunner to: self yellow;
+ set: #errorColor for: #TestRunner to: self red;
+ set: #passColor for: #TestRunner to: self green.
+
+ "Monticello Tools."
+ theme
+ set: #revertedOperationAttributes for: #MCOperationsBrowser to: {TextEmphasis struckOut};
+ set: #ignoredOperationAttributes for: #MCOperationsBrowser to: {TextColor color: self gray128}.
+
+ "Browser."
+ theme set: #noClassCommentColor for: #Browser to: self red.!

Item was added:
+ ----- Method: TrimTheme class>>addWindowColors: (in category 'instance creation') -----
+ addWindowColors: theme
+
+ | windowColorBrightnessAdjustment |
+ windowColorBrightnessAdjustment := -0.35.
+ theme
+ set: #titleFont for: #SystemWindow to: [Preferences windowTitleFont];
+ set: #borderColorModifier for: #SystemWindow to: [ [:c | c adjustBrightness: -0.1] ];
+ set: #borderColorModifier for: #ScrollPane to: [ [:c | c adjustBrightness: 0.1] ];
+ set: #borderWidth for: #SystemWindow to: 1;
+
+ set: #uniformWindowColor for: #Model to: self gray76;
+
+ set: #unfocusedWindowColorModifier for: #SystemWindow to: [ [:color | color alphaMixed: 0.5 with: self gray40] ];
+ set: #unfocusedLabelColor for: #SystemWindow to: self gray168;
+ set: #focusedLabelColor for: #SystemWindow to: Color white;
+
+ set: #customWindowColor for: #Browser to: ((Color r: 0.764 g: 0.9 b: 0.63) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #ChangeList to: ((Color r: 0.719 g: 0.9 b: 0.9) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #ChangeSorter to: ((Color r: 0.719 g: 0.9 b: 0.9) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #ChatNotes to: ((Color r: 1.0 g: 0.7 b: 0.8) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #ClassCommentVersionsBrowser to: ((Color r: 0.753 g: 0.677 b: 0.9) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #Debugger to: ((Color r: 0.9 g: 0.719 b: 0.719) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #DualChangeSorter to: ((Color r: 0.719 g: 0.9 b: 0.9) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #FileContentsBrowser to: ((Color r: 0.7 g: 0.7 b: 0.508) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #FileList to: ((Color r: 0.65 g: 0.65 b: 0.65) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #InstanceBrowser to: ((Color r: 0.726 g: 0.9 b: 0.9) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #Lexicon to: ((Color r: 0.79 g: 0.9 b: 0.79) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #MCTool to: ((Color r: 0.65 g: 0.691 b: 0.876) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #MessageNames to: ((Color r: 0.639 g: 0.9 b: 0.497) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #MessageSet to: ((Color r: 0.719 g: 0.9 b: 0.9) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #PackagePaneBrowser to: ((Color r: 0.9 g: 0.9 b: 0.63) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #PluggableFileList to: (Color lightYellow adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #PreferenceBrowser to: ((Color r: 0.671 g: 0.9 b: 0.9) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #SMLoader to: ((Color r: 0.801 g: 0.801 b: 0.614) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #SMLoaderPlus to: ((Color r: 0.801 g: 0.801 b: 0.614) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #SMReleaseBrowser to: ((Color r: 0.801 g: 0.801 b: 0.614) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #ScriptingDomain to: ((Color r: 0.91 g: 0.91 b: 0.91) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #SelectorBrowser to: ((Color r: 0.45 g: 0.9 b: 0.9) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #StringHolder to: ((Color r: 0.9 g: 0.9 b: 0.719) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #TestRunner to: ((Color r: 0.9 g: 0.576 b: 0.09) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #TranscriptStream to: ((Color r: 0.9 g: 0.75 b: 0.45) adjustBrightness: windowColorBrightnessAdjustment);
+ set: #customWindowColor for: #VersionsBrowser to: ((Color r: 0.782 g: 0.677 b: 0.9) adjustBrightness: windowColorBrightnessAdjustment).!

Item was added:
+ ----- Method: TrimTheme class>>backgroundForm (in category 'instance creation') -----
+ backgroundForm
+
+ | ref |
+ ref := self gray39.
+
+ ^ (SqueakTheme linenblue asFormOfDepth: 32) collectColors: [:c |
+ Color
+ h:ref hue
+ s: ref saturation
+ v: c brightness - 0.12
+ alpha: c alpha]!

Item was added:
+ ----- Method: TrimTheme class>>black (in category 'colors') -----
+ black
+
+ ^ self gray27!

Item was added:
+ ----- Method: TrimTheme class>>blue (in category 'colors') -----
+ blue
+
+ ^ Color r: 94 / 255 g: 140 / 255 b: 204 / 255!

Item was added:
+ ----- Method: TrimTheme class>>create (in category 'instance creation') -----
+ create
+ "doIt: [self create apply.]"
+
+ | themeName |
+ themeName := 'Trim (dark)'.
+ ^ (self named: themeName) in: [:theme |
+ theme merge: (self named: 'Squeak') overwrite: true.
+ theme name: themeName.
+
+ "General morph stuff."
+ theme
+ set: #keyboardFocusColor for: #Morph to: self blue;
+ set: #keyboardFocusWidth for: #Morph to: 2.
+
+ theme set: #background for: #MorphicProject to: self backgroundForm.
+
+ self addFonts: theme.
+ self addWindowColors: theme.
+ self addSyntaxHighlighting: theme.
+ self addMenusAndDockingBars: theme.
+ self addDialogs: theme.
+ self addButtons: theme.
+ self addScrollables: theme.
+ self addToolColors: theme.
+
+ theme]!

Item was added:
+ ----- Method: TrimTheme class>>cyan (in category 'colors') -----
+ cyan
+
+ ^ Color fromString: '#2aa198'!

Item was added:
+ ----- Method: TrimTheme class>>gray102 (in category 'colors - gray') -----
+ gray102
+
+ ^ Color gray: 102 / 255!

Item was added:
+ ----- Method: TrimTheme class>>gray128 (in category 'colors - gray') -----
+ gray128
+
+ ^ Color gray: 128 / 255!

Item was added:
+ ----- Method: TrimTheme class>>gray168 (in category 'colors - gray') -----
+ gray168
+
+ ^ Color gray: 168 / 255!

Item was added:
+ ----- Method: TrimTheme class>>gray27 (in category 'colors - gray') -----
+ gray27
+
+ ^ Color gray: 27 / 255!

Item was added:
+ ----- Method: TrimTheme class>>gray34 (in category 'colors - gray') -----
+ gray34
+
+ ^ Color gray: 34 / 255!

Item was added:
+ ----- Method: TrimTheme class>>gray39 (in category 'colors - gray') -----
+ gray39
+
+ ^ Color gray: 39 / 255!

Item was added:
+ ----- Method: TrimTheme class>>gray40 (in category 'colors - gray') -----
+ gray40
+
+ ^ Color gray: 40 / 255!

Item was added:
+ ----- Method: TrimTheme class>>gray51 (in category 'colors - gray') -----
+ gray51
+
+ ^ Color gray: 51 / 255!

Item was added:
+ ----- Method: TrimTheme class>>gray59 (in category 'colors - gray') -----
+ gray59
+
+ ^ Color gray: 59 / 255!

Item was added:
+ ----- Method: TrimTheme class>>gray61 (in category 'colors - gray') -----
+ gray61
+
+ ^ Color gray: 61 / 255!

Item was added:
+ ----- Method: TrimTheme class>>gray64 (in category 'colors - gray') -----
+ gray64
+
+ ^ Color gray: 64 / 255!

Item was added:
+ ----- Method: TrimTheme class>>gray76 (in category 'colors - gray') -----
+ gray76
+
+ ^ Color gray: 76 / 255!

Item was added:
+ ----- Method: TrimTheme class>>green (in category 'colors') -----
+ green
+
+ ^ Color fromString: '#859900'!

Item was added:
+ ----- Method: TrimTheme class>>magenta (in category 'colors') -----
+ magenta
+
+ ^ (Color r: 0.917 g: 0.317 b: 0.607)!

Item was added:
+ ----- Method: TrimTheme class>>orange (in category 'colors') -----
+ orange
+
+ ^ (Color r: 0.886 g: 0.383 b: 0.175)!

Item was added:
+ ----- Method: TrimTheme class>>red (in category 'colors') -----
+ red
+
+ ^ (Color r: 0.952 g: 0.3 b: 0.288)!

Item was added:
+ ----- Method: TrimTheme class>>violet (in category 'colors') -----
+ violet
+
+ ^ Color fromString: '#6c71c4'!

Item was added:
+ ----- Method: TrimTheme class>>white (in category 'colors') -----
+ white
+
+ ^ Color gray: 240 / 255!

Item was added:
+ ----- Method: TrimTheme class>>yellow (in category 'colors') -----
+ yellow
+
+ ^ Color fromString: '#b58900'!

Item was changed:
----- Method: UserInterfaceTheme class>>cleanUp: (in category 'initialize-release') -----
cleanUp: aggressive

aggressive ifTrue: [
All := nil.
SqueakTheme create; createDuller.
SolarizedTheme createDark; createLight.
MonokaiTheme createDark.
+ CommunityTheme createDark.
+ TrimTheme create].!
- CommunityTheme createDark].!

--

_,,,^..^,,,_

best, Eliot