From b10458e57aac3e27868fe597c857993b1a65dfff Mon Sep 17 00:00:00 2001
From: David Zeuthen <davidz@redhat.com>
Date: Mon, 24 Jan 2011 16:01:08 -0500
Subject: [PATCH] Use stippled line instead of gradient in calendar

See

 http://people.freedesktop.org/~david/shell-calendar-with-dash.png

We still have to move around some stuff to make it look like the mock-up, see

 https://live.gnome.org/GnomeShell/Design/Whiteboards/DateNTime

Thanks to Colin for binding Cairo's, set_dash() method.

Signed-off-by: David Zeuthen <davidz@redhat.com>
---
 data/theme/gnome-shell.css |  6 ++----
 js/ui/dateMenu.js          | 29 ++++++++++++-----------------
 2 files changed, 14 insertions(+), 21 deletions(-)

diff --git a/data/theme/gnome-shell.css b/data/theme/gnome-shell.css
index 4c1a67915..46962622e 100644
--- a/data/theme/gnome-shell.css
+++ b/data/theme/gnome-shell.css
@@ -675,10 +675,8 @@ StTooltip StLabel {
 /* Calendar popup */
 
 .calendar-vertical-separator {
-    -gradient-width: 2px;
-    -gradient-start: rgba(8,8,8,0);
-    -gradient-end: #333333;
-    -margin-vertical: 1.5em;
+    -stipple-width: 1px;
+    -stipple-color: #505050;
     width: 1em;
 }
 
diff --git a/js/ui/dateMenu.js b/js/ui/dateMenu.js
index 4a3dd2b33..8616735d4 100644
--- a/js/ui/dateMenu.js
+++ b/js/ui/dateMenu.js
@@ -29,23 +29,18 @@ function _onVertSepRepaint (area)
     let cr = area.get_context();
     let themeNode = area.get_theme_node();
     let [width, height] = area.get_surface_size();
-    let found, margin, gradientHeight;
-    [found, margin] = themeNode.lookup_length('-margin-vertical', false);
-    [found, gradientWidth] = themeNode.lookup_length('-gradient-width', false);
-    let startColor = new Clutter.Color();
-    themeNode.lookup_color('-gradient-start', false, startColor);
-    let endColor = new Clutter.Color();
-    themeNode.lookup_color('-gradient-end', false, endColor);
-
-    let gradientHeight = (height - margin * 2);
-    let gradientOffset = (width - gradientWidth) / 2;
-    let pattern = new Cairo.LinearGradient(gradientOffset, margin, gradientOffset + gradientWidth, height - margin);
-    pattern.addColorStopRGBA(0, startColor.red / 255, startColor.green / 255, startColor.blue / 255, startColor.alpha / 255);
-    pattern.addColorStopRGBA(0.5, endColor.red / 255, endColor.green / 255, endColor.blue / 255, endColor.alpha / 255);
-    pattern.addColorStopRGBA(1, startColor.red / 255, startColor.green / 255, startColor.blue / 255, startColor.alpha / 255);
-    cr.setSource(pattern);
-    cr.rectangle(gradientOffset, margin, gradientWidth, gradientHeight);
-    cr.fill();
+    let found;
+    let stippleWidth = 1.0;
+    let stippleColor = new Clutter.Color();
+    [found, stippleWidth] = themeNode.lookup_length('-stipple-width', false);
+    themeNode.lookup_color('-stipple-color', false, stippleColor);
+    let x = Math.floor(width/2) + 0.5;
+    cr.moveTo(x, 0);
+    cr.lineTo(x, height);
+    Clutter.cairo_set_source_color(cr, stippleColor);
+    cr.setDash([1, 3], 1); // Hard-code for now
+    cr.setLineWidth(stippleWidth);
+    cr.stroke();
 };
 
 function DateMenuButton() {