toolbar improvements, better colours

MetaBrush.cabal

@@ -83,13 +83,12 @@ executable MetaBrush
         Main.hs
 
     other-modules:
-        MetaBrush.Asset.Brush
+        MetaBrush.Asset.Colours
-      , MetaBrush.Asset.Colours
       , MetaBrush.Asset.Cursor
       , MetaBrush.Asset.Logo
       , MetaBrush.Asset.Magnifier
-      , MetaBrush.Asset.Meta
       , MetaBrush.Asset.TickBox
+      , MetaBrush.Asset.Tools
       , MetaBrush.Asset.WindowIcons
       , MetaBrush.Document
       , MetaBrush.Event

app/Main.hs

@@ -39,16 +39,14 @@ import qualified Data.Text as Text
   ( pack )
 
 -- MetaBrush
-import MetaBrush.Asset.Brush
-  ( drawBrush )
 import MetaBrush.Asset.Colours
-  ( ColourRecord(..), colours )
+  ( ColourRecord(..), getColours )
 import MetaBrush.Asset.Cursor
   ( drawCursorIcon )
 import MetaBrush.Asset.Logo
   ( drawLogo )
-import MetaBrush.Asset.Meta
+import MetaBrush.Asset.Tools
-  ( drawMeta )
+  ( drawBrush, drawMeta, drawPath, drawPen )
 import MetaBrush.Asset.WindowIcons
   ( drawMinimise, drawRestoreDown, drawMaximise, drawClose )
 import MetaBrush.Event
@@ -99,7 +97,7 @@ main = do
   iconPath <- Directory.canonicalizePath =<< Cabal.getDataFileName "icon.png"
   GTK.windowSetIconFromFile window iconPath
 
-  Colours { .. } <- colours windowWidgetPath
+  colours <- getColours windowWidgetPath
 
   ---------------------------------------------------------
   -- Create base UI elements
@@ -148,8 +146,7 @@ main = do
   GTK.boxPackStart logo logoArea True True 0
 
   void $ GTK.onWidgetDraw logoArea
-    $ Cairo.renderWithContext
+    $ Cairo.renderWithContext ( drawLogo colours )
-      ( drawLogo logo_base logo_highlight logo_base ) 
 
   ---------------------------------------------------------
   -- Title bar
@@ -200,18 +197,18 @@ main = do
 
   void $ GTK.onWidgetDraw minimiseArea
     $ Cairo.renderWithContext
-      ( drawMinimise plain )
+      ( drawMinimise colours )
 
   void $ GTK.onWidgetDraw fullscreenArea \ cairoContext -> do
     Just gdkWindow <- GTK.widgetGetWindow window
     windowState <- GDK.windowGetState gdkWindow
     if any ( \case { GDK.WindowStateFullscreen -> True; GDK.WindowStateMaximized -> True; _ -> False } ) windowState
-    then Cairo.renderWithContext ( drawRestoreDown plain ) cairoContext
+    then Cairo.renderWithContext ( drawRestoreDown colours ) cairoContext
-    else Cairo.renderWithContext ( drawMaximise    plain ) cairoContext
+    else Cairo.renderWithContext ( drawMaximise    colours ) cairoContext
 
   void $ GTK.onWidgetDraw closeArea
     $ Cairo.renderWithContext
-      ( drawClose plain )
+      ( drawClose colours )
 
 
   for_ [ minimiseButton, fullscreenButton, closeButton ] \ button -> do
@@ -227,21 +224,37 @@ main = do
   GTK.widgetSetValign  toolBar GTK.AlignStart
   GTK.widgetSetVexpand toolBar True
 
-  toolBarPhantomRadioButton <- GTK.radioButtonNew ( [] @GTK.RadioButton )
+  selectionTool <- GTK.radioButtonNew ( [] @GTK.RadioButton )
+  penTool       <- GTK.radioButtonNewFromWidget ( Just selectionTool )
 
-  selectionTool <- GTK.radioButtonNewFromWidget ( Just toolBarPhantomRadioButton )
+  pathTool  <- GTK.radioButtonNew ( [] @GTK.RadioButton )
-  brushTool     <- GTK.radioButtonNewFromWidget ( Just toolBarPhantomRadioButton )
+  brushTool <- GTK.radioButtonNewFromWidget ( Just pathTool )
-  metaTool      <- GTK.radioButtonNewFromWidget ( Just toolBarPhantomRadioButton )
+  metaTool  <- GTK.radioButtonNewFromWidget ( Just pathTool )
+
+  toolSep1 <- GTK.boxNew GTK.OrientationVertical 0
 
   GTK.boxPackStart toolBar selectionTool True True 0
+  GTK.boxPackStart toolBar       penTool True True 0
+  GTK.boxPackStart toolBar      toolSep1 True True 0
+  GTK.boxPackStart toolBar      pathTool True True 0
   GTK.boxPackStart toolBar     brushTool True True 0
   GTK.boxPackStart toolBar      metaTool True True 0
 
-  for_ [ selectionTool, brushTool, metaTool ] \ tool -> do
+  for_ [ selectionTool, penTool, pathTool, brushTool, metaTool ] \ tool -> do
     GTK.toggleButtonSetMode tool False -- don't display radio indicator
     widgetAddClass tool "toolItem"
 
+  widgetAddClass toolSep1 "toolBarSeparator"
+
+  GTK.widgetSetTooltipText selectionTool ( Just "Select" )
+  GTK.widgetSetTooltipText       penTool ( Just "Draw" )
+  GTK.widgetSetTooltipText      pathTool ( Just "Brush path" )
+  GTK.widgetSetTooltipText     brushTool ( Just "Brushes" )
+  GTK.widgetSetTooltipText      metaTool ( Just "Meta-parameters" )
+
   selectionToolArea <- GTK.drawingAreaNew
+  penToolArea       <- GTK.drawingAreaNew
+  pathToolArea      <- GTK.drawingAreaNew
   brushToolArea     <- GTK.drawingAreaNew
   metaToolArea      <- GTK.drawingAreaNew
 
@@ -252,20 +265,30 @@ main = do
 -}
 
   GTK.containerAdd selectionTool selectionToolArea
+  GTK.containerAdd       penTool       penToolArea
+  GTK.containerAdd      pathTool      pathToolArea
   GTK.containerAdd     brushTool     brushToolArea
   GTK.containerAdd      metaTool      metaToolArea
 
   void $ GTK.onWidgetDraw selectionToolArea
     $ Cairo.renderWithContext
-      ( drawCursorIcon logo_base )
+      ( drawCursorIcon colours )
+
+  void $ GTK.onWidgetDraw penToolArea
+    $ Cairo.renderWithContext
+      ( drawPen colours )
+
+  void $ GTK.onWidgetDraw pathToolArea
+    $ Cairo.renderWithContext
+      ( drawPath colours )
 
   void $ GTK.onWidgetDraw brushToolArea
     $ Cairo.renderWithContext
-      ( drawBrush logo_base logo_highlight logo_base )
+      ( drawBrush colours )
 
   void $ GTK.onWidgetDraw metaToolArea
     $ Cairo.renderWithContext
-      ( drawMeta logo_highlight )
+      ( drawMeta colours )
 
   ---------------------------------------------------------
   -- File bar
@@ -297,9 +320,9 @@ main = do
     -- Make both file tab elements activate styling on the whole tab
     -- (e.g. hovering over the close file button should highlight the whole tab).
     void $ GTK.onButtonClicked pgButton do
-      active <- GTK.toggleButtonGetActive pgButton
+      isActive <- GTK.toggleButtonGetActive pgButton
       flags  <- GTK.widgetGetStateFlags tab
-      if active
+      if isActive
       then GTK.widgetSetStateFlags tab ( GTK.StateFlagsActive : flags ) True
       else GTK.widgetSetStateFlags tab ( filter ( /= GTK.StateFlagsActive ) flags ) True
 
@@ -324,7 +347,7 @@ main = do
   ---------------------------------------------------------
   -- Main viewport
 
-  widgetAddClass viewportGrid "viewport_bg"
+  widgetAddClass viewportGrid "viewport"
   
   rvRulerCorner   <- GTK.revealerNew
   rvLeftRuler     <- GTK.revealerNew
@@ -374,8 +397,8 @@ main = do
   GTK.widgetSetHexpand viewportOverlay True
   GTK.widgetSetVexpand viewportOverlay True
 
-  viewport <- GTK.drawingAreaNew
+  viewportArea <- GTK.drawingAreaNew
-  GTK.setContainerChild viewportOverlay viewport
+  GTK.setContainerChild viewportOverlay viewportArea
 
   viewportScrollbarGrid <- GTK.gridNew
   GTK.overlayAddOverlay viewportOverlay viewportScrollbarGrid

assets/theme.css

@@ -2,25 +2,85 @@
   all: unset;
 }
 
+/* Colors parsed by application */
+.bg {
+  background-color: rgb(41, 40, 40);
+}
+.active {
+  background-color: rgb(72,70,61);
+}
+.highlight {
+  color: rgb(234,223,204)
+}
+.cursor {
+  color:rgb(234,223,204);
+}
+.cursorStroke {
+  color: black;
+}
+.plain {
+  color: rgb(212, 190, 152);
+}
+.base {
+  color: rgb(234, 223, 204);
+}
+.splash {
+  color: rgb(245, 136, 27);
+}
+.pathPoint {
+  color: rgb(129, 131, 241);
+}
+.pathPointStroke {
+  color: black;
+}
+.controlPoint {
+  color: rgb(161,221,233);
+}
+.controlPointStroke {
+  color: black;
+}
+.path {
+  color: rgb(184,80,80);
+}
+.brushStroke {
+  color: rgb(235,118,219);
+}
+.viewport {
+  background-color: rgb(236, 223, 210);
+  -GtkWidget-window-dragging: false;
+}
+.viewportScrollbar {
+  background-color: rgba(45, 39, 39, 0.66);
+  margin: 4px;
+  min-width: 8px;
+  min-height: 8px;
+}
+.tabScrollbar {
+  background-color: rgba(48, 45, 38, 0.66);
+}
+.magnifier {
+  color: rgb(236, 223, 210);
+}
+.glass {
+  color: rgba(156, 231, 255, 0.5);
+}
+
+
+
+/* Proper CSS styling */
+
+/* GTK tooltips */
+tooltip {
+  color: rgb(212, 190, 152);
+  background-color: rgb(41, 40, 40);
+  border: 1px solid rgb(28,25,25);
+}
+
 .window {
   -GtkWidget-window-dragging: true;
 }
 
-/* Window background colour */
-.bg {
-  background-color: rgb(41, 40, 40);
-}
-
-/* Viewport background colour */
-.viewport_bg {
-  background-color: rgb(236, 223, 210);
-  -GtkWidget-window-dragging: false;
-}
-
 /* Basic text colour */
-.plain {
-  color: rgb(212, 190, 152);
-}
 
 /* Basic text font */
 .text {
@@ -58,19 +118,6 @@
   color: rgb(245, 136, 27);
 }
 
-/* Viewport scrollbar colour */
-.viewportScrollbar {
-  color: purple; /* debugging */
-  background-color: rgba(45, 39, 39, 0.66);
-  margin: 4px;
-  min-width: 8px;
-  min-height: 8px;
-}
-
-/* Tab scrollbar colour */
-.tabScrollbar {
-  background-color: rgba(48, 45, 38, 0.66);
-}
 
 /* Rulers */
 .ruler {
@@ -80,15 +127,7 @@
   background-size: 16px 16px;  
 }
 
-/* Magnifying glass base colour */
-.magnifier {
-  color: rgb(236, 223, 210);
-}
 
-/* Magnifying glass glass colour */
-.glass {
-  color: rgba(156, 231, 255, 0.5);
-}
 
 /* Cursor colour */
 .cursor {
@@ -202,13 +241,23 @@
   margin-top: 28px;
 }
 
+.toolBarSeparator {
+  min-height: 2px;
+  margin-left: 10px;
+  margin-right: 10px;
+  margin-top: 4px;
+  margin-bottom: 4px;
+  background-color: rgb(72,70,61);
+}
+
 .toolItem {
   border-left: 2px solid rgb(41, 40, 40);
-  min-height: 32px;
+  min-height: 40px;
-  min-width: 38px;
+  min-width: 40px;
-  padding-top: 12px;
+  padding-top: 8px;
   padding-bottom: 8px;
-  padding-left: 6px;
+  padding-left: 3px;
+  padding-right: 3px;
 }
 
 .toolItem:hover {

src/app/MetaBrush/Asset/Brush.hs

@@ -1,62 +0,0 @@
-module MetaBrush.Asset.Brush
-  ( drawBrush )
-  where
-
--- gi-cairo-render
-import qualified GI.Cairo.Render as Cairo
-
--- gi-gdk
-import qualified GI.Gdk as GDK
-
--- MetaBrush
-import MetaBrush.Render.Util
-  ( withRGBA )
-
---------------------------------------------------------------------------------
-
--- | Calligraphy brush icon. Width = 29, height = 29.
-drawBrush :: GDK.RGBA -> GDK.RGBA -> GDK.RGBA -> Cairo.Render Bool
-drawBrush brushColour bodyColour loopColour = do
-
-  -- Loop
-  Cairo.setLineWidth 1
-  withRGBA loopColour Cairo.setSourceRGBA
-  Cairo.newPath
-  Cairo.moveTo  23.144531 6.199219
-  Cairo.curveTo 22.40625  6.890625 21.382813 5.953125 20.375    7.300781
-  Cairo.curveTo 21.109375 5.925781 19.828125 5.410156 20.398438 4.324219
-  Cairo.curveTo 20.894531 3.375    21.757813 2.621094 23.046875 3.636719
-  Cairo.curveTo 24.035156 4.414063 24.128906 5.273438 23.144531 6.199219
-  Cairo.closePath
-  Cairo.strokePreserve
-
-  -- Brush body
-  withRGBA bodyColour Cairo.setSourceRGBA
-  Cairo.newPath
-  Cairo.moveTo  20.605469  7.359375
-  Cairo.curveTo 20.988281  7.566406 21.476563  8.136719 21.195313  8.464844
-  Cairo.lineTo  15.539063 14.84375
-  Cairo.lineTo  14.90625  18.964844
-  Cairo.curveTo 14.074219 19.195313 11.992188 17.941406 11.246094 17.457031
-  Cairo.curveTo 10.5      16.976563  9.460938 15.597656  9.816406 15.351563
-  Cairo.lineTo  13.507813 13.835938
-  Cairo.lineTo  18.980469  6.996094
-  Cairo.curveTo 19.25      6.660156 19.671875  6.613281 20         6.894531
-  Cairo.closePath
-  Cairo.fillPreserve
-
-  -- Brush tip
-  withRGBA brushColour Cairo.setSourceRGBA
-  Cairo.newPath
-  Cairo.moveTo  10.339844 19.335938
-  Cairo.curveTo 11.089844 19.847656 11.996094 20.34375  12.683594 20.507813
-  Cairo.curveTo 12.683594 20.507813  7.59375  24.476563  7.59375  24.476563
-  Cairo.curveTo  6.867188 25.160156  4.785156 26.105469  4.601563 25.941406
-  Cairo.curveTo  4.4375   25.792969  5.042969 24.261719  5.652344 23.140625
-  Cairo.curveTo  5.652344 23.140625  8.566406 17.773438  8.566406 17.773438
-  Cairo.curveTo  8.804688 18.136719  9.585938 18.820313 10.339844 19.335938
-  Cairo.curveTo 10.339844 19.335938 10.339844 19.335938 10.339844 19.335938
-  Cairo.closePath
-  Cairo.fillPreserve
-
-  pure True

src/app/MetaBrush/Asset/Colours.hs

@@ -10,7 +10,7 @@
 
 module MetaBrush.Asset.Colours
   ( ColourRecord(..), ColourType
-  , colours
+  , Colours, getColours
   )
   where
 
@@ -33,26 +33,30 @@ import Data.Text
 data ColourRecord a
   = Colours
   { bg                  :: !a
-    , viewport_bg        :: !a
+  , active              :: !a
-    , plain              :: !a
-    , contrast           :: !a
   , highlight           :: !a
-    , logo_base          :: !a
+  , cursor              :: !a
-    , logo_highlight     :: !a
+  , cursorOutline       :: !a
-    , viewport_scrollbar :: !a
+  , plain               :: !a
-    , tab_scrollbar      :: !a
+  , base                :: !a
-    , ruler              :: !a
+  , splash              :: !a
+  , pathPoint           :: !a
+  , pathPointOutline    :: !a
+  , controlPoint        :: !a
+  , controlPointOutline :: !a
+  , path                :: !a
+  , brushStroke         :: !a
+  , viewport            :: !a
+  , viewportScrollbar   :: !a
+  , tabScrollbar        :: !a
   , magnifier           :: !a
   , glass               :: !a
-    , cursor             :: !a
-    , point              :: !a
-    , control            :: !a
   }
   deriving stock ( Show, Functor, Foldable, Traversable )
 
 data ColourType
-  = Color
+  = Colour
-  | BackgroundColor
+  | BackgroundColour
   deriving stock Show
 
 data ColourName
@@ -65,31 +69,35 @@ data ColourName
 
 colourNames :: ColourRecord ColourName
 colourNames = Colours
-    { bg                 = ColourName "bg"                 BackgroundColor [ GTK.StateFlagsNormal ]
+  { bg                  = ColourName "bg"                BackgroundColour [ GTK.StateFlagsNormal ]
-    , viewport_bg        = ColourName "viewport_bg"        BackgroundColor [ GTK.StateFlagsNormal ]
+  , active              = ColourName "active"            BackgroundColour [ GTK.StateFlagsNormal ]
-    , plain              = ColourName "plain"              Color           [ GTK.StateFlagsNormal ]
+  , highlight           = ColourName "highlight"                   Colour [ GTK.StateFlagsNormal ]
-    , contrast           = ColourName "contrast"           Color           [ GTK.StateFlagsNormal ]
+  , cursor              = ColourName "cursor"                      Colour [ GTK.StateFlagsNormal ]
-    , highlight          = ColourName "highlight"          Color           [ GTK.StateFlagsNormal ]
+  , cursorOutline       = ColourName "cursorStroke"                Colour [ GTK.StateFlagsNormal ]
-    , logo_base          = ColourName "logo_base"          Color           [ GTK.StateFlagsNormal ]
+  , plain               = ColourName "plain"                       Colour [ GTK.StateFlagsNormal ]
-    , logo_highlight     = ColourName "logo_highlight"     Color           [ GTK.StateFlagsNormal ]
+  , base                = ColourName "base"                        Colour [ GTK.StateFlagsNormal ]
-    , viewport_scrollbar = ColourName "viewport_scrollbar" Color           [ GTK.StateFlagsNormal ]
+  , splash              = ColourName "splash"                      Colour [ GTK.StateFlagsNormal ]
-    , tab_scrollbar      = ColourName "tab_scrollbar"      Color           [ GTK.StateFlagsNormal ]
+  , pathPoint           = ColourName "pathPoint"                   Colour [ GTK.StateFlagsNormal ]
-    , ruler              = ColourName "ruler"              BackgroundColor [ GTK.StateFlagsNormal ]
+  , pathPointOutline    = ColourName "pathPointStroke"             Colour [ GTK.StateFlagsNormal ]
-    , magnifier          = ColourName "magnifier"          Color           [ GTK.StateFlagsNormal ]
+  , controlPoint        = ColourName "controlPoint"                Colour [ GTK.StateFlagsNormal ]
-    , glass              = ColourName "glass"              Color           [ GTK.StateFlagsNormal ]
+  , controlPointOutline = ColourName "controlPointStroke"          Colour [ GTK.StateFlagsNormal ]
-    , cursor             = ColourName "cursor"             Color           [ GTK.StateFlagsNormal ]
+  , path                = ColourName "path"                        Colour [ GTK.StateFlagsNormal ]
-    , point              = ColourName "point"              Color           [ GTK.StateFlagsNormal ]
+  , brushStroke         = ColourName "brushStroke"                 Colour [ GTK.StateFlagsNormal ]
-    , control            = ColourName "control"            Color           [ GTK.StateFlagsNormal ]
+  , viewport            = ColourName "viewport"                    Colour [ GTK.StateFlagsNormal ]
+  , viewportScrollbar   = ColourName "viewportScrollbar" BackgroundColour [ GTK.StateFlagsNormal ]
+  , tabScrollbar        = ColourName "tabScrollbar"      BackgroundColour [ GTK.StateFlagsNormal ]
+  , magnifier           = ColourName "magnifier"                   Colour [ GTK.StateFlagsNormal ]
+  , glass               = ColourName "glass"                       Colour [ GTK.StateFlagsNormal ]
   }
 
 type Colours = ColourRecord GDK.RGBA
 
-colours :: GTK.WidgetPath -> IO Colours
+getColours :: GTK.WidgetPath -> IO Colours
-colours windowWidgetPath =
+getColours windowWidgetPath =
   for colourNames \ ( ColourName { .. } ) -> do
     style <- GTK.styleContextNew
     GTK.styleContextSetPath  style windowWidgetPath
     GTK.styleContextAddClass style colourName
     case colourType of
-      BackgroundColor -> GTK.styleContextGetBackgroundColor style stateFlags
+      BackgroundColour -> GTK.styleContextGetBackgroundColor style stateFlags
-      Color           -> GTK.styleContextGetColor           style stateFlags
+      Colour           -> GTK.styleContextGetColor           style stateFlags

src/app/MetaBrush/Asset/Cursor.hs

@@ -1,3 +1,5 @@
+{-# LANGUAGE NamedFieldPuns #-}
+
 module MetaBrush.Asset.Cursor
   ( drawCursor, drawCursorIcon )
   where
@@ -5,21 +7,20 @@ module MetaBrush.Asset.Cursor
 -- gi-cairo-render
 import qualified GI.Cairo.Render as Cairo
 
--- gi-gdk
-import qualified GI.Gdk as GDK
-
 -- MetaBrush
+import MetaBrush.Asset.Colours
+  ( ColourRecord(..), Colours )
 import MetaBrush.Render.Util
   ( withRGBA )
 
 --------------------------------------------------------------------------------
 
 -- | "Selection" mouse cursor. 18 x 18.
-drawCursor :: GDK.RGBA -> GDK.RGBA -> Cairo.Render Bool
+drawCursor :: Colours -> Cairo.Render Bool
-drawCursor cursorColour outlineColour = do
+drawCursor ( Colours { cursor, cursorOutline } ) = do
 
   Cairo.setLineWidth 1
-  withRGBA outlineColour Cairo.setSourceRGBA
+  withRGBA cursorOutline Cairo.setSourceRGBA
   Cairo.newPath
   Cairo.moveTo 12.625 10.582031
   Cairo.curveTo 5.699219 11.101563 4.097656 12.3125 0 17.976563
@@ -27,20 +28,20 @@ drawCursor cursorColour outlineColour = do
   Cairo.closePath
   Cairo.strokePreserve
 
-  withRGBA cursorColour  Cairo.setSourceRGBA
+  withRGBA cursor Cairo.setSourceRGBA
   Cairo.fillPreserve
   
   pure True
 
--- | "Selection" tool icon. 30 x 30.
+-- | "Selection" tool icon. 40 x 40.
-drawCursorIcon :: GDK.RGBA -> Cairo.Render Bool
+drawCursorIcon :: Colours -> Cairo.Render Bool
-drawCursorIcon cursorColour = do
+drawCursorIcon ( Colours { cursor } )  = do
 
-  withRGBA cursorColour Cairo.setSourceRGBA
+  withRGBA cursor Cairo.setSourceRGBA
   Cairo.newPath
-  Cairo.moveTo 24.023438 16.3125
+  Cairo.moveTo 29.035156 22.058594
-  Cairo.curveTo 15.636719 16.9375 13.699219 18.40625 8.742188 25.261719
+  Cairo.curveTo 20.089844 22.722656 18.023438 24.289063 12.734375 31.605469
-  Cairo.lineTo 8.835938 3.503906
+  Cairo.lineTo 12.835938 8.394531
   Cairo.closePath
   Cairo.fillPreserve
 

src/app/MetaBrush/Asset/Logo.hs

@@ -1,3 +1,5 @@
+{-# LANGUAGE NamedFieldPuns #-}
+
 module MetaBrush.Asset.Logo
   ( drawLogo )
   where
@@ -5,22 +7,21 @@ module MetaBrush.Asset.Logo
 -- gi-cairo-render
 import qualified GI.Cairo.Render as Cairo
 
--- gi-gdk
-import qualified GI.Gdk as GDK
-
 -- MetaBrush
+import MetaBrush.Asset.Colours
+  ( ColourRecord(..), Colours )
 import MetaBrush.Render.Util
   ( withRGBA )
 
 --------------------------------------------------------------------------------
 
 -- | MetaBrush logo. Width = 29, height = 29.
-drawLogo :: GDK.RGBA -> GDK.RGBA -> GDK.RGBA -> Cairo.Render Bool
+drawLogo :: Colours -> Cairo.Render Bool
-drawLogo brushColour bodyColour loopColour = do
+drawLogo ( Colours { base, splash } ) = do
 
   -- Loop
   Cairo.setLineWidth 1
-  withRGBA loopColour Cairo.setSourceRGBA
+  withRGBA base Cairo.setSourceRGBA
   Cairo.newPath
   Cairo.moveTo  17.480469 7.847656
   Cairo.curveTo 16.890625 8.402344 16.070313 7.648438 15.257813 8.730469
@@ -32,7 +33,7 @@ drawLogo brushColour bodyColour loopColour = do
   Cairo.strokePreserve
 
   -- Body
-  withRGBA bodyColour Cairo.setSourceRGBA
+  withRGBA splash Cairo.setSourceRGBA
   Cairo.newPath
   Cairo.moveTo  14.53125  8.257813
   Cairo.curveTo 14.386719 8.273438  14.246094  8.351563 14.140625  8.484375
@@ -67,7 +68,7 @@ drawLogo brushColour bodyColour loopColour = do
   Cairo.fillPreserve
 
   -- Brush tip
-  withRGBA brushColour Cairo.setSourceRGBA
+  withRGBA base Cairo.setSourceRGBA
   Cairo.newPath
   Cairo.moveTo  7.199219 18.394531
   Cairo.curveTo 7.804688 18.804688 8.53125  19.203125 9.082031 19.335938

src/app/MetaBrush/Asset/Magnifier.hs

@@ -1,3 +1,4 @@
+{-# LANGUAGE NamedFieldPuns   #-}
 {-# LANGUAGE NegativeLiterals #-}
 
 module MetaBrush.Asset.Magnifier
@@ -7,21 +8,20 @@ module MetaBrush.Asset.Magnifier
 -- gi-cairo-render
 import qualified GI.Cairo.Render as Cairo
 
--- gi-gdk
-import qualified GI.Gdk as GDK
-
 -- MetaBrush
+import MetaBrush.Asset.Colours
+  ( ColourRecord(..), Colours )
 import MetaBrush.Render.Util
   ( withRGBA )
 
 --------------------------------------------------------------------------------
 
 -- | Magnifying glass icon. Width = 19, height = 25.
-drawMagnifier :: GDK.RGBA -> GDK.RGBA -> Cairo.Render Bool
+drawMagnifier :: Colours -> Cairo.Render Bool
-drawMagnifier magnifierColour glassColour = do
+drawMagnifier ( Colours { magnifier, glass } ) = do
 
   -- Magnifying glass.
-  withRGBA glassColour Cairo.setSourceRGBA
+  withRGBA glass Cairo.setSourceRGBA
   Cairo.newPath
   Cairo.moveTo  18.191406  6.144531
   Cairo.curveTo 19.238281 10.191406 16.804688 14.324219 12.753906 15.371094
@@ -32,7 +32,7 @@ drawMagnifier magnifierColour glassColour = do
   Cairo.fillPreserve
 
   -- Magnifier.
-  withRGBA magnifierColour Cairo.setSourceRGBA
+  withRGBA magnifier Cairo.setSourceRGBA
   Cairo.newPath
   Cairo.moveTo   11.144531  0.00390625
   Cairo.curveTo  8.296875  -0.09375   5.484375   1.332031  3.933594  3.960938

src/app/MetaBrush/Asset/Meta.hs

@@ -1,44 +0,0 @@
-module MetaBrush.Asset.Meta
-  ( drawMeta )
-  where
-
--- gi-cairo-render
-import qualified GI.Cairo.Render as Cairo
-
--- gi-gdk
-import qualified GI.Gdk as GDK
-
--- MetaBrush
-import MetaBrush.Render.Util
-  ( withRGBA )
-
---------------------------------------------------------------------------------
-
--- | MetaParameter icon. Width = 29, height = 29.
-drawMeta :: GDK.RGBA -> Cairo.Render Bool
-drawMeta metaColour = do
-  withRGBA metaColour Cairo.setSourceRGBA
-  Cairo.newPath
-  Cairo.moveTo  16.140625 11.976563
-  Cairo.curveTo 15.042969 10.355469 13.957031  7.050781 13.257813  7.195313
-  Cairo.curveTo 12.878906  7.078125  5.332031 18.234375  4.664063 19.019531
-  Cairo.curveTo  3.90625  18.234375  2.886719 19.078125  2.800781 20.273438
-  Cairo.curveTo  2.800781 20.886719  4.28125  22.585938  5.566406 20.738281
-  Cairo.curveTo  5.6875   20.566406 11.421875 12.542969 11.957031 11.753906
-  Cairo.curveTo 12.421875 12.714844 14.351563 16.082031 14.46875  16.230469
-  Cairo.curveTo 15.605469 15.660156 15.863281 15.316406 16.476563 14.589844
-  Cairo.curveTo 17.171875 13.621094 17.265625 13.5      18.207031 12.261719
-  Cairo.curveTo 18.644531 13.164063 20        14.65625  21.238281 16.253906
-  Cairo.curveTo 21.703125 16.855469 23.695313 18.898438 24.28125  18.671875
-  Cairo.curveTo 24.589844 18.550781 25.699219 17.550781 25.894531 16.492188
-  Cairo.curveTo 25.941406 16.253906 26.050781 15.351563 25.847656 15.167969
-  Cairo.curveTo 25.707031 15.039063 24.519531 15.707031 24.148438 15.5625
-  Cairo.curveTo 23.507813 14.621094 22.722656 12.988281 22.042969 11.859375
-  Cairo.curveTo 20.964844  9.90625  20.125     7.507813 19.257813 8.039063
-  Cairo.curveTo 18.652344  8.410156 18.308594  8.867188 18.179688 9.058594
-  Cairo.curveTo 17.574219  9.9375   17.289063 10.367188 16.140625 11.976563
-  Cairo.curveTo 16.140625 11.976563 16.140625 11.976563 16.140625 11.976563
-  Cairo.closePath
-  Cairo.fillPreserve
-
-  pure True

src/app/MetaBrush/Asset/TickBox.hs

@@ -1,3 +1,4 @@
+{-# LANGUAGE NamedFieldPuns   #-}
 {-# LANGUAGE NegativeLiterals #-}
 
 module MetaBrush.Asset.TickBox
@@ -7,19 +8,18 @@ module MetaBrush.Asset.TickBox
 -- gi-cairo-render
 import qualified GI.Cairo.Render as Cairo
 
--- gi-gdk
-import qualified GI.Gdk as GDK
-
 -- MetaBrush
+import MetaBrush.Asset.Colours
+  ( ColourRecord(..), Colours )
 import MetaBrush.Render.Util
   ( withRGBA )
 
 --------------------------------------------------------------------------------
 
 -- | Non-ticked box. Width = 14, height = 12.
-drawBox :: GDK.RGBA -> Cairo.Render Bool
+drawBox :: Colours -> Cairo.Render Bool
-drawBox boxColour = do
+drawBox ( Colours { plain } ) = do
-  withRGBA boxColour Cairo.setSourceRGBA
+  withRGBA plain Cairo.setSourceRGBA
 
   Cairo.newPath
   Cairo.moveTo   2.015625  0.769531
@@ -49,11 +49,11 @@ drawBox boxColour = do
 
 
 -- | Ticked box. Width = 14, height = 12.
-drawTickedBox :: GDK.RGBA -> GDK.RGBA -> Cairo.Render Bool
+drawTickedBox :: Colours -> Cairo.Render Bool
-drawTickedBox boxColour tickColour = do
+drawTickedBox ( Colours { plain } ) = do
 
   -- Box
-  withRGBA boxColour Cairo.setSourceRGBA
+  withRGBA plain Cairo.setSourceRGBA
   Cairo.newPath
   Cairo.moveTo   2.015625  0.769531
   Cairo.curveTo  0.910156  0.769531  0         1.679688  0         2.785156
@@ -77,7 +77,7 @@ drawTickedBox boxColour tickColour = do
   Cairo.fillPreserve
 
   -- Tickmark
-  withRGBA tickColour Cairo.setSourceRGBA
+  withRGBA plain Cairo.setSourceRGBA
   Cairo.newPath
   Cairo.moveTo  13.40625  0.0078125
   Cairo.curveTo 13.191406 0.0390625 12.96875   0.144531  12.785156 0.328125

src/app/MetaBrush/Asset/Tools.hs

@@ -0,0 +1,224 @@
+{-# LANGUAGE NamedFieldPuns  #-}
+{-# LANGUAGE RecordWildCards #-}
+
+module MetaBrush.Asset.Tools
+  ( drawBrush, drawMeta, drawPath, drawPen )
+  where
+
+-- gi-cairo-render
+import qualified GI.Cairo.Render as Cairo
+
+-- MetaBrush
+import MetaBrush.Asset.Colours
+  ( ColourRecord(..), Colours )
+import MetaBrush.Render.Util
+  ( withRGBA )
+
+--------------------------------------------------------------------------------
+
+-- | Calligraphy brush icon. Width = 40 height = 40.
+drawBrush :: Colours -> Cairo.Render Bool
+drawBrush ( Colours { base, splash } ) = do
+
+  -- Loop
+  Cairo.newPath
+  Cairo.moveTo 29.957031 6.425781
+  Cairo.curveTo 29.101563 7.550781 27.472656 6.492188 26.386719 8.589844
+  Cairo.curveTo 27.082031 6.519531 25.195313 6.105469 25.730469 4.472656
+  Cairo.curveTo 26.195313 3.050781 27.214844 1.808594 29.230469 2.910156
+  Cairo.curveTo 30.773438 3.757813 31.101563 4.917969 29.957031 6.425781
+  Cairo.closePath
+
+  Cairo.setLineWidth 1
+  withRGBA base Cairo.setSourceRGBA
+  Cairo.strokePreserve
+
+  -- Brush body
+
+  Cairo.newPath
+  Cairo.moveTo 26.722656 8.613281
+  Cairo.curveTo 27.296875 8.8125 28.105469 9.488281 27.792969 10.007813
+  Cairo.lineTo 21.464844 20.125
+  Cairo.lineTo 21.542969 25.960938
+  Cairo.curveTo 20.449219 26.472656 17.285156 25.222656 16.144531 24.730469
+  Cairo.curveTo 15.003906 24.238281 13.246094 22.574219 13.683594 22.15625
+  Cairo.lineTo 18.425781 19.203125
+  Cairo.lineTo 24.394531 8.492188
+  Cairo.curveTo 24.691406 7.964844 25.261719 7.804688 25.777344 8.117188
+  Cairo.closePath
+
+  withRGBA splash Cairo.setSourceRGBA
+  Cairo.fillPreserve
+
+  -- Brush tip
+  Cairo.newPath
+  Cairo.moveTo 15.324219 27.53125
+  Cairo.curveTo 16.480469 28.0625 17.847656 28.539063 18.835938 28.609375
+  Cairo.curveTo 18.835938 28.609375 12.730469 35.265625 12.730469 35.265625
+  Cairo.curveTo 11.882813 36.382813 9.226563 38.167969 8.9375 37.984375
+  Cairo.curveTo 8.671875 37.820313 9.160156 35.5625 9.738281 33.875
+  Cairo.curveTo 9.738281 33.875 12.515625 25.789063 12.515625 25.789063
+  Cairo.curveTo 12.929688 26.230469 14.167969 26.996094 15.324219 27.53125
+  Cairo.curveTo 15.324219 27.53125 15.324219 27.53125 15.324219 27.53125
+  Cairo.closePath
+
+  withRGBA base Cairo.setSourceRGBA
+  Cairo.fillPreserve
+
+  pure True
+
+-- | MetaParameter icon. Width = 40 height = 40.
+drawMeta :: Colours -> Cairo.Render Bool
+drawMeta ( Colours { splash } )  = do
+
+  Cairo.newPath
+  Cairo.moveTo 20.96875 16.375
+  Cairo.curveTo 19.3125 13.929688 17.671875 8.941406 16.617188 9.160156
+  Cairo.curveTo 16.046875 8.984375 4.667969 25.808594 3.65625 26.996094
+  Cairo.curveTo 2.515625 25.808594 0.976563 27.082031 0.847656 28.882813
+  Cairo.curveTo 0.847656 29.804688 3.082031 32.371094 5.019531 29.585938
+  Cairo.curveTo 5.203125 29.324219 13.851563 17.222656 14.65625 16.039063
+  Cairo.curveTo 15.359375 17.488281 18.269531 22.5625 18.445313 22.785156
+  Cairo.curveTo 20.15625 21.925781 20.546875 21.410156 21.46875 20.3125
+  Cairo.curveTo 22.523438 18.851563 22.664063 18.667969 24.082031 16.800781
+  Cairo.curveTo 24.742188 18.164063 26.789063 20.410156 28.652344 22.820313
+  Cairo.curveTo 29.355469 23.730469 32.359375 26.8125 33.242188 26.46875
+  Cairo.curveTo 33.710938 26.285156 35.382813 24.777344 35.679688 23.179688
+  Cairo.curveTo 35.746094 22.820313 35.914063 21.457031 35.609375 21.183594
+  Cairo.curveTo 35.394531 20.988281 33.601563 22 33.042969 21.777344
+  Cairo.curveTo 32.074219 20.359375 30.890625 17.894531 29.867188 16.191406
+  Cairo.curveTo 28.242188 13.25 26.972656 9.632813 25.664063 10.433594
+  Cairo.curveTo 24.757813 10.992188 24.238281 11.683594 24.039063 11.972656
+  Cairo.curveTo 23.128906 13.292969 22.699219 13.945313 20.96875 16.375
+  Cairo.curveTo 20.96875 16.375 20.96875 16.375 20.96875 16.375
+  Cairo.closePath
+
+  withRGBA splash Cairo.setSourceRGBA
+  Cairo.fillPreserve
+
+  pure True
+
+-- | Path icon. Width = 40 height = 40.
+drawPath :: Colours -> Cairo.Render Bool
+drawPath ( Colours { .. } ) = do
+
+  Cairo.setLineCap  Cairo.LineCapRound
+  Cairo.setLineJoin Cairo.LineJoinMiter
+
+  -- Path
+  Cairo.newPath
+  Cairo.moveTo  7.226563 15.027344
+  Cairo.curveTo 26.421875 10.488281 30.699219 15.492188 27.621094 31.34375
+
+  Cairo.setLineWidth 4
+  withRGBA path Cairo.setSourceRGBA
+  Cairo.stroke
+
+  -- Control point and connecting lines
+  Cairo.newPath
+  Cairo.moveTo 35.660156 8.5
+  Cairo.curveTo 35.660156 10.75 33.835938 12.574219 31.585938 12.574219
+  Cairo.curveTo 29.335938 12.574219 27.511719 10.75 27.511719 8.5
+  Cairo.curveTo 27.511719 6.25 29.335938 4.425781 31.585938 4.425781
+  Cairo.curveTo 33.835938 4.425781 35.660156 6.25 35.660156 8.5
+  Cairo.closePath
+
+  Cairo.setLineWidth 1.5
+  withRGBA controlPoint Cairo.setSourceRGBA
+  Cairo.fillPreserve
+  withRGBA controlPointOutline Cairo.setSourceRGBA
+  Cairo.stroke
+  withRGBA controlPoint Cairo.setSourceRGBA
+
+  Cairo.setLineWidth 2
+
+  Cairo.newPath 
+  Cairo.moveTo 7.179688 14.882813
+  Cairo.lineTo 31.820313 8.4375
+  Cairo.stroke
+
+  Cairo.newPath
+  Cairo.moveTo 27.414063 31.332031
+  Cairo.lineTo 31.691406 8.421875
+  Cairo.stroke
+
+  Cairo.setLineWidth 1.5
+
+  -- Path points
+  Cairo.newPath
+  Cairo.moveTo 11.042969 12.636719
+  Cairo.lineTo 11.042969 17.09375
+  Cairo.lineTo 7.179688 19.324219
+  Cairo.lineTo 3.316406 17.09375
+  Cairo.lineTo 3.316406 12.636719
+  Cairo.lineTo 7.179688 10.40625
+  Cairo.closePath
+
+  withRGBA pathPoint Cairo.setSourceRGBA
+  Cairo.fillPreserve
+  withRGBA pathPointOutline Cairo.setSourceRGBA
+  Cairo.stroke
+
+  Cairo.newPath
+  Cairo.moveTo 31.269531 28.988281
+  Cairo.lineTo 31.269531 33.449219
+  Cairo.lineTo 27.40625 35.679688
+  Cairo.lineTo 23.546875 33.449219
+  Cairo.lineTo 23.546875 28.988281
+  Cairo.lineTo 27.40625 26.761719
+  Cairo.closePath
+
+  withRGBA pathPoint Cairo.setSourceRGBA
+  Cairo.fillPreserve
+  withRGBA pathPointOutline Cairo.setSourceRGBA
+  Cairo.stroke
+
+  pure True
+
+-- | Pen icon. Width = 40 height = 40.
+drawPen :: Colours -> Cairo.Render Bool
+drawPen ( Colours { base, splash } ) = do
+
+  withRGBA base Cairo.setSourceRGBA
+  Cairo.newPath
+  Cairo.moveTo 24.480469 16.863281
+  Cairo.lineTo 19.988281 14.269531
+  Cairo.curveTo 16.316406 20.628906 15.089844 20.941406 13.644531 21.570313
+  Cairo.curveTo 12.195313 22.195313 12.871094 23.601563 12.871094 23.601563
+  Cairo.curveTo 13.957031 25.621094 12.503906 29.265625 12.25 30.207031
+  Cairo.curveTo 11.898438 30.246094 11.398438 30.492188 11.207031 30.820313
+  Cairo.curveTo 10.921875 31.316406 11.453125 32.253906 11.867188 32.613281
+  Cairo.lineTo 12.710938 31.144531
+  Cairo.lineTo 12.90625 30.800781
+  Cairo.lineTo 16.179688 25.09375
+  Cairo.curveTo 16.179688 25.09375 15.855469 24.117188 16.128906 23.5625
+  Cairo.curveTo 16.398438 23.003906 17.054688 22.324219 18.019531 22.882813
+  Cairo.curveTo 18.984375 23.4375 18.726563 24.347656 18.375 24.859375
+  Cairo.curveTo 18.027344 25.371094 17.011719 25.574219 17.011719 25.574219
+  Cairo.lineTo 13.742188 31.28125
+  Cairo.lineTo 13.542969 31.625
+  Cairo.lineTo 12.703125 33.09375
+  Cairo.curveTo 13.222656 33.285156 14.355469 33.460938 14.644531 32.964844
+  Cairo.curveTo 14.847656 32.609375 14.796875 32.027344 14.625 31.6875
+  Cairo.curveTo 16.632813 29.617188 18.609375 28.128906 20.011719 27.804688
+  Cairo.curveTo 21.449219 27.46875 21.308594 26.394531 21.308594 26.394531
+  Cairo.curveTo 21.179688 22.230469 24.476563 16.863281 24.476563 16.863281
+  Cairo.closePath
+  Cairo.fillPreserve
+
+  withRGBA splash Cairo.setSourceRGBA
+  Cairo.newPath
+  Cairo.moveTo 23.878906 6.710938
+  Cairo.lineTo 21.644531 10.582031
+  Cairo.lineTo 21.109375 10.273438
+  Cairo.curveTo 20.601563 9.980469 19.816406 10.390625 19.523438 10.898438
+  Cairo.curveTo 19.230469 11.40625 19.542969 11.816406 20.046875 12.113281
+  Cairo.lineTo 26.375 15.765625
+  Cairo.curveTo 26.882813 16.058594 27.394531 16.121094 27.6875 15.613281
+  Cairo.curveTo 27.980469 15.105469 27.945313 14.21875 27.4375 13.925781
+  Cairo.lineTo 26.640625 13.464844
+  Cairo.lineTo 28.875 9.597656
+  Cairo.closePath
+  Cairo.fillPreserve
+
+  pure True

src/app/MetaBrush/Asset/WindowIcons.hs

@@ -1,3 +1,5 @@
+{-# LANGUAGE NamedFieldPuns  #-}
+
 module MetaBrush.Asset.WindowIcons
   ( drawMinimise, drawRestoreDown, drawMaximise, drawClose )
   where
@@ -5,20 +7,19 @@ module MetaBrush.Asset.WindowIcons
 -- gi-cairo-render
 import qualified GI.Cairo.Render as Cairo
 
--- gi-gdk
-import qualified GI.Gdk as GDK
-
 -- MetaBrush
+import MetaBrush.Asset.Colours
+  ( ColourRecord(..), Colours )
 import MetaBrush.Render.Util
   ( withRGBA )
 
 --------------------------------------------------------------------------------
 
 -- | Minimise window icon.  
-drawMinimise :: GDK.RGBA -> Cairo.Render Bool
+drawMinimise :: Colours -> Cairo.Render Bool
-drawMinimise iconColour = do
+drawMinimise ( Colours { plain } ) = do
 
-  withRGBA iconColour Cairo.setSourceRGBA
+  withRGBA plain Cairo.setSourceRGBA
 
   Cairo.newPath
   Cairo.moveTo 6.144531 12.914063
@@ -31,10 +32,10 @@ drawMinimise iconColour = do
   pure True
 
 -- | Restore down window icon.
-drawRestoreDown :: GDK.RGBA -> Cairo.Render Bool
+drawRestoreDown :: Colours -> Cairo.Render Bool
-drawRestoreDown iconColour = do
+drawRestoreDown ( Colours { plain } ) = do
 
-  withRGBA iconColour Cairo.setSourceRGBA
+  withRGBA plain Cairo.setSourceRGBA
 
   Cairo.newPath
   Cairo.moveTo 8.453125 4.179688
@@ -63,10 +64,10 @@ drawRestoreDown iconColour = do
   pure True
 
 -- | Maximise window icon.
-drawMaximise :: GDK.RGBA -> Cairo.Render Bool
+drawMaximise :: Colours -> Cairo.Render Bool
-drawMaximise iconColour = do
+drawMaximise ( Colours { plain } ) = do
 
-  withRGBA iconColour Cairo.setSourceRGBA
+  withRGBA plain Cairo.setSourceRGBA
 
   Cairo.newPath  
   Cairo.moveTo 5.386719 5.449219
@@ -84,11 +85,11 @@ drawMaximise iconColour = do
   pure True
 
 -- | Close window icon.
-drawClose :: GDK.RGBA -> Cairo.Render Bool
+drawClose :: Colours -> Cairo.Render Bool
-drawClose iconColour = do
+drawClose ( Colours { plain } ) = do
 
   Cairo.setLineWidth 2
-  withRGBA iconColour Cairo.setSourceRGBA
+  withRGBA plain Cairo.setSourceRGBA
 
   Cairo.setLineCap  Cairo.LineCapRound
   Cairo.setLineJoin Cairo.LineJoinMiter