From 545552a246bde80e99e7be1ed65e9273cda8410c Mon Sep 17 00:00:00 2001
From: =?utf8?q?Jean-Philippe=20Bruy=C3=A8re?= <jp_bruyere@hotmail.com>
Date: Tue, 2 Jun 2020 17:11:59 +0200
Subject: [PATCH] default styling

---
 Crow/Default.style                           | 20 +++++----
 Crow/Icons/expandable.svg                    | 12 +++---
 Crow/Templates/CheckBox.template             |  2 +-
 Crow/Templates/Expandable.template           | 12 +++---
 Crow/Templates/Popper.template               |  4 +-
 Crow/Templates/RadioButton.template          |  2 +-
 Crow/Templates/Spinner.template              |  6 +--
 Crow/src/Widgets/Label.cs                    |  6 +--
 Crow/src/Widgets/Shape.cs                    |  2 +-
 Samples/common/ui/Interfaces/Divers/all.crow | 43 +++++++++++++-------
 Samples/common/ui/templates/colorItem2.crow  |  2 +-
 11 files changed, 63 insertions(+), 48 deletions(-)

diff --git a/Crow/Default.style b/Crow/Default.style
index 9309503d..0c188df6 100644
--- a/Crow/Default.style
+++ b/Crow/Default.style
@@ -3,18 +3,21 @@ ControlBorderColor = "DimGrey";
 ControlBorderWidth = "1";
 ControlCaptionColor = "LightGrey";
 ControlCaptionHoverColor = "White";
-
-IconSize = "12";
+ControlCornerRadius = "0";
+ControlInsideMargin = "1";
+IconSize = "11";
 IconMargin = "1";
+ToggleIconSize = "16";
 
 Button, CheckBox, RadioButton, ComboBox, Expandable,
 MessageBox, Popper, Slider, Spinner, TextBox {
 	Focusable = "true";
 	Height = "Fit";
+	Background = "${ControlBackground}";
+	CornerRadius = "${ControlCornerRadius}";
+	Margin="0";
 }
-Border {
-	Foreground = "Grey";
-}
+
 CheckBox { Caption = "CheckBox"; }
 RadioButton { Caption = "RadioButton"; }
 Expandable { Caption = "Expandable"; }
@@ -22,14 +25,13 @@ Popper { Caption = "Popper";}
 GroupBox { Caption = "Group Box"; }
 
 Control {
-	Margin="0";
+	Margin="${ControlInsideMargin}";
 	Spacing="3";
 }
 ControlBorder {
 	BorderWidth	= "${ControlBorderWidth}";
 	Foreground  = "${ControlBorderColor}";
-	Background	= "${ControlBackground}";
-	CornerRadius = "0";	
+	Margin = "${ControlInsideMargin}";
 }
 ControlCaption {
 	Foreground  = "${ControlCaptionColor}";
@@ -37,7 +39,7 @@ ControlCaption {
 	MouseLeave	= "{Foreground=${ControlCaptionColor}}";
 }
 ControlEditableText {
-	Foreground	= "LightGrey";
+	Foreground	= "${ControlCaptionColor}";
 	Background	= "Transparent";
 	MinimumSize	= "40,10";
 	Margin		= "1";
diff --git a/Crow/Icons/expandable.svg b/Crow/Icons/expandable.svg
index 134d02e8..e2bffbc5 100644
--- a/Crow/Icons/expandable.svg
+++ b/Crow/Icons/expandable.svg
@@ -1,11 +1,11 @@
-<svg width="9" height="9" xmlns="http://www.w3.org/2000/svg">
+<svg width="10" height="10" xmlns="http://www.w3.org/2000/svg">
  <g id="False">
-  <rect height="8" width="8" y="0.5" x="0.5" stroke="#000" fill="#fff" stroke-width="1"/>
-  <line stroke-linecap="undefined" stroke-linejoin="undefined" id="svg_2" y2="4.5" x2="7" y1="4.5" x1="2" stroke="#000" fill="none"/>
-  <line stroke-linecap="undefined" stroke-linejoin="undefined" id="svg_3" y2="7" x2="4.5" y1="2" x1="4.5" stroke="#000" fill="none"/>
+  <rect height="9" width="9" y="0.5" x="0.5" stroke="#000" fill="#fff" stroke-width="1"/>-->
+  <line stroke-linecap="undefined" stroke-linejoin="undefined" x1="5" y1="2" x2="5" y2="8" stroke="#000" fill="none"/>
+  <line stroke-linecap="undefined" stroke-linejoin="undefined" x1="2" y1="5" x2="8" y2="5" stroke="#000" fill="none"/>
  </g>
  <g id="True">
-  <rect height="8" width="8" y="0.5" x="0.5" stroke="#000" fill="#fff" stroke-width="1"/>
-  <line stroke-linecap="undefined" stroke-linejoin="undefined" id="svg_2" y2="4.5" x2="7" y1="4.5" x1="2" stroke="#000" fill="none"/>
+  <rect height="9" width="9" y="0.5" x="0.5" stroke="#000" fill="#fff" stroke-width="1"/>
+  <line stroke-linecap="undefined" stroke-linejoin="undefined" x1="2" y1="5" x2="8" y2="5" stroke="#000" fill="none"/>
  </g>
 </svg>
\ No newline at end of file
diff --git a/Crow/Templates/CheckBox.template b/Crow/Templates/CheckBox.template
index 795c293f..9e2a568f 100644
--- a/Crow/Templates/CheckBox.template
+++ b/Crow/Templates/CheckBox.template
@@ -1,5 +1,5 @@
 <?xml version="1.0"?>
 <HorizontalStack Style="Control" Background="{./Background}">
-	<Image Style="Icon" Path="#Crow.Icons.checkbox.svg" SvgSub="{./IsChecked}"/>
+	<Image Style="Icon" Width="${ToggleIconSize}" Height="${ToggleIconSize}" Path="#Crow.Icons.checkbox.svg" SvgSub="{./IsChecked}"/>
 	<Label Style="ControlCaption" Font="{./Font}" Text="{./Caption}" Foreground="{./Foreground}"/>
 </HorizontalStack>
\ No newline at end of file
diff --git a/Crow/Templates/Expandable.template b/Crow/Templates/Expandable.template
index ac52ae34..efa24b92 100644
--- a/Crow/Templates/Expandable.template
+++ b/Crow/Templates/Expandable.template
@@ -1,11 +1,11 @@
 <?xml version="1.0"?>
-<Border Style="ControlBorder" >
+<Border Style="ControlBorder" Background="{./Background}" CornerRadius="{./CornerRadius}">
 	<VerticalStack>
-		<HorizontalStack Spacing="1" Height="Fit" Focusable="true" MouseDoubleClick="./onClickForExpand">
-			<Container Margin="1" Width="9" Height="9" MouseDown="./onClickForExpand"
-					MouseEnter="{Background=CornflowerBlue}" MouseLeave="{Background=Transparent}">
-				<Image Path="#Crow.Icons.expandable.svg" Visible="{./IsExpandable}"	SvgSub="{./IsExpanded}"/>
-			</Container>
+		<HorizontalStack Spacing="1" Focusable="true" MouseDoubleClick="./onClickForExpand">
+			<Image Style="Icon" MouseDown="./onClickForExpand"
+					MouseEnter="{Background=White}" MouseLeave="{Background=Transparent}"
+					Background="{./Background}"
+					Path="#Crow.Icons.expandable.svg" Visible="{./IsExpandable}"	SvgSub="{./IsExpanded}" />			
 			<Label Style="ControlCaption" Text="{./Caption}"/>
 		</HorizontalStack>
 		<Container Name="Content" Visible="false"/>
diff --git a/Crow/Templates/Popper.template b/Crow/Templates/Popper.template
index 01b46630..d9b9f1ac 100644
--- a/Crow/Templates/Popper.template
+++ b/Crow/Templates/Popper.template
@@ -1,9 +1,9 @@
 <?xml version="1.0"?>
 <CheckBox Caption="{./Caption}" IsChecked="{²./IsPopped}" Foreground="{./Foreground}" Background="{./Background}">
 	<Template>
-		<Border Style="ControlBorder" Foreground="{./Foreground}" Background="{./Background}" >
+		<Border Style="ControlBorder" Background="{./Background}" CornerRadius="{./CornerRadius}">
 			<HorizontalStack Spacing="1">
-				<Image Style="Icon" Margin="1" Width="9" Height="9"	
+				<Image Style="Icon" 
 					MouseEnter="{Background=White}" MouseLeave="{Background=Transparent}"
 					Background="{./Background}"
 					Path="#Crow.Icons.expandable.svg" SvgSub="{./IsChecked}"/>
diff --git a/Crow/Templates/RadioButton.template b/Crow/Templates/RadioButton.template
index 36a17495..97ab3d96 100644
--- a/Crow/Templates/RadioButton.template
+++ b/Crow/Templates/RadioButton.template
@@ -1,5 +1,5 @@
 <?xml version="1.0"?>
 <HorizontalStack Style="Control" Background="{./Background}">
-	<Image Style="Icon" Path="#Crow.Icons.radiobutton.svg" SvgSub="{./IsChecked}"/>
+	<Image Style="Icon"  Width="${ToggleIconSize}" Height="${ToggleIconSize}" Path="#Crow.Icons.radiobutton.svg" SvgSub="{./IsChecked}"/>
 	<Label Style="ControlCaption" Font="{./Font}" Text="{./Caption}" Foreground="{./Foreground}"/>
 </HorizontalStack>
\ No newline at end of file
diff --git a/Crow/Templates/Spinner.template b/Crow/Templates/Spinner.template
index 825f75b6..b3d87f88 100644
--- a/Crow/Templates/Spinner.template
+++ b/Crow/Templates/Spinner.template
@@ -1,9 +1,9 @@
 <?xml version="1.0"?>
-<Border Style="ControlBorder" >
-	<HorizontalStack Margin="0" Spacing="1">
+<Border Style="ControlBorder" Background="{./Background}" CornerRadius="{./CornerRadius}">
+	<HorizontalStack Spacing="1">
 		<TextBox Style="ControlEditableText" Foreground="{./Foreground}" Font="{./Font}" Width="Stretched"
 			Text="{²./Value}" TextAlignment="Right" />
-		<VerticalStack Width="16" Height="Stretched" Spacing="0" Margin="2">
+		<VerticalStack Width="16" Height="Stretched" Spacing="0" Margin="0">
 			<Shape KeepProportions="false" Margin="1" Style="ArrowBut" Height="50%" MouseDown="./onUp" Size="10,10" Path="M 4.5,0.5 L 9.5,9.5 L 0.5,9.5 Z F"/>
 			<Shape KeepProportions="false" Margin="1" Style="ArrowBut"	Height="50%" MouseDown="./onDown" Size="10,10" Path="M 0.5,0.5 L 9.5,0.5 L 4.5,9.5 Z F"/>
 		</VerticalStack>
diff --git a/Crow/src/Widgets/Label.cs b/Crow/src/Widgets/Label.cs
index 860c16ca..34a2d69e 100644
--- a/Crow/src/Widgets/Label.cs
+++ b/Crow/src/Widgets/Label.cs
@@ -424,7 +424,7 @@ namespace Crow {
 					fe = gr.FontExtents;
 					te = new TextExtents ();
 
-					cachedTextSize.Height = (int)Math.Ceiling ((fe.Ascent+fe.Descent) * Math.Max (1, lines.Count)) + Margin * 2;
+					cachedTextSize.Height = (int)Math.Ceiling ((fe.Ascent+fe.Descent) * Math.Max (1, lines.Count));
 
 					try {
 						for (int i = 0; i < lines.Count; i++) {
@@ -435,14 +435,14 @@ namespace Crow {
 							if (tmp.XAdvance > te.XAdvance)
 								te = tmp;
 						}
-						cachedTextSize.Width = (int)Math.Ceiling (te.XAdvance) + Margin * 2;
+						cachedTextSize.Width = (int)Math.Ceiling (te.XAdvance);
 						textMeasureIsUpToDate = true;
 					} catch {							
 						return -1;
 					}					
 				}
 			}
-			return lt == LayoutingType.Height ? cachedTextSize.Height : cachedTextSize.Width;
+			return Margin * 2 + (lt == LayoutingType.Height ? cachedTextSize.Height : cachedTextSize.Width);
 		}
 		protected override void onDraw (Context gr)
 		{
diff --git a/Crow/src/Widgets/Shape.cs b/Crow/src/Widgets/Shape.cs
index 853b4abd..c30099a4 100644
--- a/Crow/src/Widgets/Shape.cs
+++ b/Crow/src/Widgets/Shape.cs
@@ -178,7 +178,7 @@ namespace Crow
 		/// <summary>
 		/// View box 
 		/// </summary>
-		[DefaultValue ("0,0")]
+		[DefaultValue ("32,32")]
 		public Size Size {
 			get { return size; }
 			set {
diff --git a/Samples/common/ui/Interfaces/Divers/all.crow b/Samples/common/ui/Interfaces/Divers/all.crow
index e553e023..bb390def 100644
--- a/Samples/common/ui/Interfaces/Divers/all.crow
+++ b/Samples/common/ui/Interfaces/Divers/all.crow
@@ -1,18 +1,31 @@
 <?xml version="1.0"?>
-<VerticalStack Name="TopContainer" Margin="100" Background="DarkGrey" Spacing="10">
-	<VerticalStack Width="200" Height="Fit" Spacing="5">
-		<Label/>
-		<TextBox />
-		<Button />
-		<CheckBox />
-		<RadioButton/>
-		<Spinner/>			
-		<Slider />
-		<Popper />
-		<Expandable />
-	</VerticalStack>
-		
-	<Widget Width="200" Height="20" Background="Teal"/>
+<VerticalStack Name="TopContainer" Margin="10" Background="DarkGrey" Spacing="10">
+	<HorizontalStack Height="Fit" >		
+		<VerticalStack Width="200" Height="Fit" Spacing="0">
+			<Label/>
+			<TextBox />
+			<Button />
+			<CheckBox />
+			<RadioButton/>
+			<Spinner/>			
+			<Slider />
+			<Popper />
+			<Expandable />
+			<ScrollBar Style="HScrollBar"/>
+		</VerticalStack>
+		<VerticalStack Width="200" Height="Fit" Spacing="0">
+			<Slider Name="margin" Background="DarkSlateGrey" Foreground="Black"  />
+			<Label Background="DarkSlateGrey" Foreground="Black" Margin="{../margin.Value}" />
+			<TextBox Background="DarkSlateGrey" Foreground="Black" Margin="{../margin.Value}"/>
+			<Button Background="DarkSlateGrey" Foreground="Black" Margin="{../margin.Value}" />
+			<CheckBox Background="DarkSlateGrey" Foreground="Black" Margin="{../margin.Value}"/>
+			<RadioButton Background="DarkSlateGrey" Foreground="Black" Margin="{../margin.Value}"/>
+			<Spinner Background="DarkSlateGrey" Foreground="Black" Margin="{../margin.Value}" />			
+			<Popper Background="DarkSlateGrey" Foreground="Black" Margin="{../margin.Value}" />
+			<Expandable Background="DarkSlateGrey" Foreground="Black" Margin="{../margin.Value}"/>
+		</VerticalStack>
+	</HorizontalStack>
+<!--	<Widget Width="200" Height="20" Background="Teal"/>
 	<Widget Width="200" Height="20" Background="SeaGreen"/>
 	<Widget Width="200" Height="20" Background="MediumSeaGreen"/>
 	<Widget Width="200" Height="20" Background="DarkSlateGrey"/>
@@ -20,5 +33,5 @@
 	<Widget Width="200" Height="20" Background="SteelBlue"/>
 	<Widget Width="200" Height="20" Background="CornflowerBlue"/>
 	<Widget Width="200" Height="20" Background="Brown"/>	
-	<Widget Width="200" Height="20" Background="FireBrick"/>
+	<Widget Width="200" Height="20" Background="FireBrick"/>-->
 </VerticalStack>
\ No newline at end of file
diff --git a/Samples/common/ui/templates/colorItem2.crow b/Samples/common/ui/templates/colorItem2.crow
index 83239b32..52966d60 100644
--- a/Samples/common/ui/templates/colorItem2.crow
+++ b/Samples/common/ui/templates/colorItem2.crow
@@ -1,7 +1,7 @@
 <?xml version="1.0"?>
 <Border Foreground="Transparent" Focusable="true" HorizontalAlignment="Left" Height="Fit">
 	<HorizontalStack Margin="0"
-				MouseEnter="{Background=CornflowerBlue}"
+				MouseEnter="{Background=DarkSlateGrey}"
 				MouseLeave="{Background=Transparent}">
 		<Widget Height="8" Width="14" Background="{}" Margin="0" CornerRadius="2"/>
 		<Label Text="{}" Margin="0" Width="Stretched" Font="mono, 8"/>
-- 
2.47.3