[gnome-shell] messageTray: Restyle the summary counters
- From: Debarshi Ray <debarshir src gnome org>
- To: commits-list gnome org
- Cc:
- Subject: [gnome-shell] messageTray: Restyle the summary counters
- Date: Mon, 10 Sep 2012 16:12:32 +0000 (UTC)
commit 8a269041fb3044d7efec0689ff5bd606feb84ee9
Author: Debarshi Ray <debarshir gnome org>
Date: Mon Sep 10 17:41:30 2012 +0200
messageTray: Restyle the summary counters
They are bigger and show an ellipsis if the count goes over 99. They
now have a blurred background and a drop shadow based on
data/theme/close-window.svg.
https://bugzilla.gnome.org/show_bug.cgi?id=682891
data/Makefile.am | 1 +
data/theme/gnome-shell.css | 15 +++--
data/theme/summary-counter.svg | 120 ++++++++++++++++++++++++++++++++++++++++
js/ui/messageTray.js | 24 +++++++-
4 files changed, 150 insertions(+), 10 deletions(-)
---
diff --git a/data/Makefile.am b/data/Makefile.am
index f369516..055ad3a 100644
--- a/data/Makefile.am
+++ b/data/Makefile.am
@@ -39,6 +39,7 @@ dist_theme_DATA = \
theme/process-working.svg \
theme/running-indicator.svg \
theme/source-button-border.svg \
+ theme/summary-counter.svg \
theme/toggle-off-us.svg \
theme/toggle-off-intl.svg \
theme/toggle-on-us.svg \
diff --git a/data/theme/gnome-shell.css b/data/theme/gnome-shell.css
index dee7e4c..2337cef 100644
--- a/data/theme/gnome-shell.css
+++ b/data/theme/gnome-shell.css
@@ -1438,13 +1438,14 @@ StButton.popup-menu-item:insensitive {
}
.summary-source-counter {
- color: white;
- background-color: #3465A4;
- text-shadow: black 1px 1px 0;
- font-size: 9pt;
- border-radius: 1em;
- min-height: 1em;
- min-width: 1em;
+ background-image: url("summary-counter.svg");
+ background-size: 2.5em;
+ font-size: 10pt;
+ font-weight: bold;
+ height: 2.5em;
+ width: 2.5em;
+ -shell-counter-overlap-x: 4px;
+ -shell-counter-overlap-y: 4px;
}
/* App Switcher */
diff --git a/data/theme/summary-counter.svg b/data/theme/summary-counter.svg
new file mode 100644
index 0000000..c3264fd
--- /dev/null
+++ b/data/theme/summary-counter.svg
@@ -0,0 +1,120 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Generator: Adobe Illustrator 13.0.2, SVG Export Plug-In . SVG Version: 6.00 Build 14948) -->
+
+<svg
+ xmlns:dc="http://purl.org/dc/elements/1.1/";
+ xmlns:cc="http://creativecommons.org/ns#";
+ xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#";
+ xmlns:svg="http://www.w3.org/2000/svg";
+ xmlns="http://www.w3.org/2000/svg";
+ xmlns:xlink="http://www.w3.org/1999/xlink";
+ xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd";
+ xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape";
+ version="1.0"
+ id="Foreground"
+ x="0px"
+ y="0px"
+ width="32"
+ height="32"
+ viewBox="0 0 23.272727 23.272727"
+ enable-background="new 0 0 16 16"
+ xml:space="preserve"
+ sodipodi:version="0.32"
+ inkscape:version="0.48.2 r9819"
+ sodipodi:docname="summary-counter.svg"
+ inkscape:output_extension="org.inkscape.output.svg.inkscape"><metadata
+ id="metadata2399"><rdf:RDF><cc:Work
+ rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
+ rdf:resource="http://purl.org/dc/dcmitype/StillImage"; /><dc:title /></cc:Work></rdf:RDF></metadata><defs
+ id="defs2397"><linearGradient
+ id="linearGradient3173"><stop
+ style="stop-color:#c4c4c4;stop-opacity:1;"
+ offset="0"
+ id="stop3175" /><stop
+ style="stop-color:#ffffff;stop-opacity:1;"
+ offset="1"
+ id="stop3177" /></linearGradient><inkscape:perspective
+ sodipodi:type="inkscape:persp3d"
+ inkscape:vp_x="0 : 8 : 1"
+ inkscape:vp_y="0 : 1000 : 0"
+ inkscape:vp_z="16 : 8 : 1"
+ inkscape:persp3d-origin="8 : 5.3333333 : 1"
+ id="perspective2401" /><filter
+ color-interpolation-filters="sRGB"
+ inkscape:collect="always"
+ id="filter16494-4"
+ x="-0.20989846"
+ width="1.4197969"
+ y="-0.20903821"
+ height="1.4180764"><feGaussianBlur
+ inkscape:collect="always"
+ stdDeviation="1.3282637"
+ id="feGaussianBlur16496-8" /></filter><radialGradient
+ inkscape:collect="always"
+ xlink:href="#linearGradient16498-6"
+ id="radialGradient16504-1"
+ cx="7.6582627"
+ cy="5.8191104"
+ fx="7.6582627"
+ fy="5.8191104"
+ r="8.6928644"
+ gradientTransform="matrix(1.0474339,0,0,1.0517402,-0.3632615,-0.42032492)"
+ gradientUnits="userSpaceOnUse" /><linearGradient
+ inkscape:collect="always"
+ id="linearGradient16498-6"><stop
+ style="stop-color:#9FD0FF;stop-opacity:1"
+ offset="0"
+ id="stop16500-8" /><stop
+ style="stop-color:#3465A4;stop-opacity:1"
+ offset="1"
+ id="stop16502-0" /></linearGradient></defs><sodipodi:namedview
+ inkscape:window-height="709"
+ inkscape:window-width="1366"
+ inkscape:pageshadow="2"
+ inkscape:pageopacity="0"
+ guidetolerance="10.0"
+ gridtolerance="10.0"
+ objecttolerance="10.0"
+ borderopacity="1.0"
+ bordercolor="#666666"
+ pagecolor="#000000"
+ id="base"
+ showgrid="false"
+ inkscape:zoom="11.313708"
+ inkscape:cx="15.386407"
+ inkscape:cy="13.739577"
+ inkscape:window-x="0"
+ inkscape:window-y="1179"
+ inkscape:current-layer="g16402-8"
+ showguides="true"
+ inkscape:guide-bbox="true"
+ borderlayer="true"
+ inkscape:showpageshadow="false"
+ inkscape:window-maximized="1"><inkscape:grid
+ type="xygrid"
+ id="grid11246"
+ empspacing="5"
+ visible="true"
+ enabled="true"
+ snapvisiblegridlinesonly="true" /></sodipodi:namedview><g
+ style="display:inline"
+ id="g16402-8"
+ transform="translate(4.7533483,2.8238929)"><g
+ id="g3175-4"
+ transform="translate(-0.89995416,0.94028614)"><path
+ sodipodi:type="inkscape:offset"
+ inkscape:radius="0"
+ inkscape:original="M 7.65625 0.125 C 3.2589349 0.125 -0.3125 3.7070002 -0.3125 8.125 C -0.3125 12.543001 3.2589349 16.125 7.65625 16.125 C 12.053566 16.125 15.625 12.543001 15.625 8.125 C 15.625 3.7070002 12.053566 0.125 7.65625 0.125 z "
+ xlink:href="#path2394-32"
+ style="opacity:0.52994014;color:#000000;fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:#000000;stroke-width:2.18181825;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0;marker:none;visibility:visible;display:inline;overflow:visible;filter:url(#filter16494-4);enable-background:accumulate"
+ id="path16480-5"
+ inkscape:href="#path2394-32"
+ d="m 7.65625,0.125 c -4.3973151,0 -7.96875,3.5820002 -7.96875,8 0,4.418001 3.5714349,8 7.96875,8 4.397316,0 7.96875,-3.581999 7.96875,-8 0,-4.4179998 -3.571434,-8 -7.96875,-8 z"
+ transform="translate(0,1.028519)" /><path
+ clip-rule="evenodd"
+ d="m -0.30428257,8.1237596 c 0,-4.4179998 3.56522987,-7.9999996 7.96254497,-7.9999996 4.3973156,0 7.9625456,3.5819998 7.9625456,7.9999996 0,4.4180014 -3.56523,8.0000004 -7.9625456,8.0000004 -4.3973151,0 -7.96254497,-3.581999 -7.96254497,-8.0000004 z"
+ id="path2394-32"
+ style="color:#000000;fill:url(#radialGradient16504-1);fill-opacity:1;fill-rule:nonzero;stroke:#eeeeec;stroke-width:1.4545455;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0;marker:none;visibility:visible;display:inline;overflow:visible;enable-background:accumulate"
+ sodipodi:nodetypes="csssc"
+ inkscape:connector-curvature="0" /><g
+ id="g3172-6" /></g></g></svg>
\ No newline at end of file
diff --git a/js/ui/messageTray.js b/js/ui/messageTray.js
index 481161a..1a60366 100644
--- a/js/ui/messageTray.js
+++ b/js/ui/messageTray.js
@@ -953,11 +953,22 @@ const SourceActor = new Lang.Class({
}));
this._actorDestroyed = false;
- this._counterLabel = new St.Label();
+ this._counterLabel = new St.Label( {x_align: Clutter.ActorAlign.CENTER,
+ x_expand: true,
+ y_align: Clutter.ActorAlign.CENTER,
+ y_expand: true });
+
this._counterBin = new St.Bin({ style_class: 'summary-source-counter',
- child: this._counterLabel });
+ child: this._counterLabel,
+ layout_manager: new Clutter.BinLayout() });
this._counterBin.hide();
+ this._counterBin.connect('style-changed', Lang.bind(this, function() {
+ let themeNode = this._counterBin.get_theme_node();
+ this._counterBin.translation_x = themeNode.get_length('-shell-counter-overlap-x');
+ this._counterBin.translation_y = themeNode.get_length('-shell-counter-overlap-y');
+ }));
+
this._iconBin = new St.Bin({ width: size,
height: size,
x_fill: true,
@@ -1026,7 +1037,14 @@ const SourceActor = new Lang.Class({
return;
this._counterBin.visible = this._source.countVisible;
- this._counterLabel.set_text(this._source.count.toString());
+
+ let text;
+ if (this._source.count < 100)
+ text = this._source.count.toString();
+ else
+ text = String.fromCharCode(0x22EF); // midline horizontal ellipsis
+
+ this._counterLabel.set_text(text);
}
});
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]
