isa/gnome-shell
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Use stippled line instead of gradient in calendar

Browse Source 
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>
This commit is contained in:
David Zeuthen 2011-01-24 16:01:08 -05:00
parent 50c5591ec2
commit b10458e57a
2 changed files with 14 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
data/theme/gnome-shell.css
View File

@ -675,10 +675,8 @@ StTooltip StLabel {
/* Calendar popup */ /* Calendar popup */
.calendar-vertical-separator { .calendar-vertical-separator {
-gradient-width: 2px; -stipple-width: 1px;
-gradient-start: rgba(8,8,8,0); -stipple-color: #505050;
-gradient-end: #333333;
-margin-vertical: 1.5em;
width: 1em; width: 1em;
} }

29
js/ui/dateMenu.js
View File

@ -29,23 +29,18 @@ function _onVertSepRepaint (area)
let cr = area.get_context(); let cr = area.get_context();
let themeNode = area.get_theme_node(); let themeNode = area.get_theme_node();
let [width, height] = area.get_surface_size(); let [width, height] = area.get_surface_size();
let found, margin, gradientHeight; let found;
[found, margin] = themeNode.lookup_length('-margin-vertical', false); let stippleWidth = 1.0;
[found, gradientWidth] = themeNode.lookup_length('-gradient-width', false); let stippleColor = new Clutter.Color();
let startColor = new Clutter.Color(); [found, stippleWidth] = themeNode.lookup_length('-stipple-width', false);
themeNode.lookup_color('-gradient-start', false, startColor); themeNode.lookup_color('-stipple-color', false, stippleColor);
let endColor = new Clutter.Color(); let x = Math.floor(width/2) + 0.5;
themeNode.lookup_color('-gradient-end', false, endColor); cr.moveTo(x, 0);
cr.lineTo(x, height);
let gradientHeight = (height - margin * 2); Clutter.cairo_set_source_color(cr, stippleColor);
let gradientOffset = (width - gradientWidth) / 2; cr.setDash([1, 3], 1); // Hard-code for now
let pattern = new Cairo.LinearGradient(gradientOffset, margin, gradientOffset + gradientWidth, height - margin); cr.setLineWidth(stippleWidth);
pattern.addColorStopRGBA(0, startColor.red / 255, startColor.green / 255, startColor.blue / 255, startColor.alpha / 255); cr.stroke();
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();
}; };
function DateMenuButton() { function DateMenuButton() {