From 3bfcabbfdacd0ee9c7c774ae345bc7d157668bb6 Mon Sep 17 00:00:00 2001
From: Sam Hewitt <hewittsamuel@gmail.com>
Date: Fri, 13 Mar 2015 02:48:57 -0400
Subject: [PATCH] Gnome shell theme refinements

---
 Paper/gnome-shell/assets/no-events.svg        | 184 ++++++++++++++++++
 Paper/gnome-shell/assets/no-notifications.svg | 179 +++++++++++++++++
 Paper/gnome-shell/gnome-shell.css             |  90 +++++----
 3 files changed, 417 insertions(+), 36 deletions(-)
 create mode 100644 Paper/gnome-shell/assets/no-events.svg
 create mode 100644 Paper/gnome-shell/assets/no-notifications.svg

diff --git a/Paper/gnome-shell/assets/no-events.svg b/Paper/gnome-shell/assets/no-events.svg
new file mode 100644
index 0000000..2c2e65c
--- /dev/null
+++ b/Paper/gnome-shell/assets/no-events.svg
@@ -0,0 +1,184 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:osb="http://www.openswatchbook.org/uri/2009/osb"
+   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:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   sodipodi:docname="no-events.svg"
+   inkscape:export-filename="/home/sam/source-symbolic.png"
+   inkscape:export-xdpi="270"
+   inkscape:export-ydpi="270"
+   height="64"
+   id="svg7384"
+   style="enable-background:new"
+   version="1.1"
+   inkscape:version="0.91 r13725"
+   width="64">
+  <sodipodi:namedview
+     inkscape:bbox-nodes="true"
+     inkscape:bbox-paths="false"
+     bordercolor="#666666"
+     borderlayer="false"
+     borderopacity="1"
+     inkscape:current-layer="g6058"
+     inkscape:cx="-160.5"
+     inkscape:cy="-1.9999994"
+     gridtolerance="10"
+     inkscape:guide-bbox="true"
+     guidetolerance="10"
+     id="namedview88"
+     inkscape:object-nodes="true"
+     inkscape:object-paths="true"
+     objecttolerance="10"
+     pagecolor="#f7f7f7"
+     inkscape:pageopacity="1"
+     inkscape:pageshadow="2"
+     showborder="true"
+     showgrid="false"
+     showguides="true"
+     inkscape:showpageshadow="false"
+     inkscape:snap-bbox="true"
+     inkscape:snap-bbox-edge-midpoints="false"
+     inkscape:snap-bbox-midpoints="true"
+     inkscape:snap-center="false"
+     inkscape:snap-global="true"
+     inkscape:snap-grids="true"
+     inkscape:snap-intersection-paths="true"
+     inkscape:snap-midpoints="true"
+     inkscape:snap-nodes="true"
+     inkscape:snap-object-midpoints="true"
+     inkscape:snap-others="true"
+     inkscape:snap-page="false"
+     inkscape:snap-smooth-nodes="true"
+     inkscape:snap-to-guides="true"
+     inkscape:window-height="699"
+     inkscape:window-maximized="1"
+     inkscape:window-width="1366"
+     inkscape:window-x="0"
+     inkscape:window-y="27"
+     inkscape:zoom="1">
+    <inkscape:grid
+       color="#000000"
+       dotted="false"
+       empcolor="#0800ff"
+       empopacity="0.4627451"
+       empspacing="4"
+       enabled="true"
+       id="grid4866"
+       opacity="0.16470588"
+       originx="-564"
+       originy="-176"
+       snapvisiblegridlinesonly="true"
+       spacingx="0.25px"
+       spacingy="0.25px"
+       type="xygrid"
+       visible="true" />
+  </sodipodi:namedview>
+  <metadata
+     id="metadata90">
+    <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>Paper Symbolic Icon Theme</dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <title
+     id="title8473">Paper Symbolic Icon Theme</title>
+  <defs
+     id="defs7386">
+    <linearGradient
+       id="linearGradient5606"
+       osb:paint="solid">
+      <stop
+         id="stop5608"
+         offset="0"
+         style="stop-color:#000000;stop-opacity:1;" />
+    </linearGradient>
+    <filter
+       inkscape:collect="always"
+       id="filter7554"
+       style="color-interpolation-filters:sRGB">
+      <feBlend
+         inkscape:collect="always"
+         id="feBlend7556"
+         in2="BackgroundImage"
+         mode="darken" />
+    </filter>
+  </defs>
+  <g
+     inkscape:groupmode="layer"
+     id="layer9"
+     inkscape:label="status"
+     style="display:inline"
+     transform="translate(-805.0002,6.999999)" />
+  <g
+     inkscape:groupmode="layer"
+     id="layer10"
+     inkscape:label="devices"
+     style="display:inline;filter:url(#filter7554)"
+     transform="translate(-805.0002,6.999999)" />
+  <g
+     inkscape:groupmode="layer"
+     id="layer1"
+     inkscape:label="places"
+     style="display:inline"
+     transform="translate(-564,-610)" />
+  <g
+     inkscape:groupmode="layer"
+     id="layer14"
+     inkscape:label="mimetypes"
+     style="display:inline"
+     transform="translate(-805.0002,6.999999)" />
+  <g
+     inkscape:groupmode="layer"
+     id="layer15"
+     inkscape:label="emblems"
+     style="display:inline"
+     transform="translate(-805.0002,6.999999)" />
+  <g
+     inkscape:groupmode="layer"
+     id="g71291"
+     inkscape:label="emotes"
+     style="display:inline"
+     transform="translate(-805.0002,6.999999)" />
+  <g
+     inkscape:groupmode="layer"
+     id="layer2"
+     inkscape:label="categories"
+     style="display:inline"
+     transform="translate(-564,-460)" />
+  <g
+     inkscape:groupmode="layer"
+     id="g6058"
+     inkscape:label="apps"
+     style="display:inline"
+     transform="translate(-564,-460)">
+    <path
+       inkscape:connector-curvature="0"
+       d="m 576.01653,464 c -9,0 -8,8 -8,8 0,12 0,48 0,48 l 56,0 c 0,0 0,-5 0,-4 l 0,-44 c 0,-8 -8,-8 -8,-8 z m 0,20 40,0 0,21.25 0,3.375 0,3.375 -40,0 0,-3.375 0,-6.625 z"
+       id="path6716"
+       sodipodi:nodetypes="sccccscsccccccccc"
+       style="color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:Sans;-inkscape-font-specification:Sans;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;letter-spacing:normal;word-spacing:normal;text-transform:none;direction:ltr;block-progression:tb;writing-mode:lr-tb;baseline-shift:baseline;text-anchor:start;display:inline;overflow:visible;visibility:visible;fill:#dbdee0;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:2;marker:none;enable-background:new;opacity:0.35" />
+    <g
+       id="g6718"
+       inkscape:label="emblem-important"
+       style="fill:#dbdee0;fill-opacity:1;opacity:0.35"
+       transform="matrix(4,0,0,4,-823.73801,-3389.7124)" />
+  </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer12"
+     inkscape:label="actions"
+     style="display:inline"
+     transform="translate(-805.0002,6.999999)" />
+</svg>
diff --git a/Paper/gnome-shell/assets/no-notifications.svg b/Paper/gnome-shell/assets/no-notifications.svg
new file mode 100644
index 0000000..b040657
--- /dev/null
+++ b/Paper/gnome-shell/assets/no-notifications.svg
@@ -0,0 +1,179 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:osb="http://www.openswatchbook.org/uri/2009/osb"
+   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:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   sodipodi:docname="no-notifications.svg"
+   inkscape:export-filename="/home/sam/source-symbolic.png"
+   inkscape:export-xdpi="270"
+   inkscape:export-ydpi="270"
+   height="64"
+   id="svg7384"
+   style="enable-background:new"
+   version="1.1"
+   inkscape:version="0.91 r13725"
+   width="64">
+  <sodipodi:namedview
+     inkscape:bbox-nodes="true"
+     inkscape:bbox-paths="false"
+     bordercolor="#666666"
+     borderlayer="false"
+     borderopacity="1"
+     inkscape:current-layer="layer9"
+     inkscape:cx="-112.38124"
+     inkscape:cy="3.033443"
+     gridtolerance="10"
+     inkscape:guide-bbox="true"
+     guidetolerance="10"
+     id="namedview88"
+     inkscape:object-nodes="true"
+     inkscape:object-paths="true"
+     objecttolerance="10"
+     pagecolor="#f7f7f7"
+     inkscape:pageopacity="1"
+     inkscape:pageshadow="2"
+     showborder="true"
+     showgrid="false"
+     showguides="true"
+     inkscape:showpageshadow="false"
+     inkscape:snap-bbox="true"
+     inkscape:snap-bbox-edge-midpoints="false"
+     inkscape:snap-bbox-midpoints="true"
+     inkscape:snap-center="false"
+     inkscape:snap-global="true"
+     inkscape:snap-grids="true"
+     inkscape:snap-intersection-paths="true"
+     inkscape:snap-midpoints="true"
+     inkscape:snap-nodes="true"
+     inkscape:snap-object-midpoints="true"
+     inkscape:snap-others="true"
+     inkscape:snap-page="false"
+     inkscape:snap-smooth-nodes="true"
+     inkscape:snap-to-guides="true"
+     inkscape:window-height="699"
+     inkscape:window-maximized="1"
+     inkscape:window-width="1366"
+     inkscape:window-x="0"
+     inkscape:window-y="27"
+     inkscape:zoom="1">
+    <inkscape:grid
+       color="#000000"
+       dotted="false"
+       empcolor="#0800ff"
+       empopacity="0.4627451"
+       empspacing="4"
+       enabled="true"
+       id="grid4866"
+       opacity="0.16470588"
+       originx="-164.00023"
+       originy="-472.00336"
+       snapvisiblegridlinesonly="true"
+       spacingx="0.25px"
+       spacingy="0.25px"
+       type="xygrid"
+       visible="true" />
+  </sodipodi:namedview>
+  <metadata
+     id="metadata90">
+    <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>Paper Symbolic Icon Theme</dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <title
+     id="title8473">Paper Symbolic Icon Theme</title>
+  <defs
+     id="defs7386">
+    <linearGradient
+       id="linearGradient5606"
+       osb:paint="solid">
+      <stop
+         id="stop5608"
+         offset="0"
+         style="stop-color:#000000;stop-opacity:1;" />
+    </linearGradient>
+    <filter
+       inkscape:collect="always"
+       id="filter7554"
+       style="color-interpolation-filters:sRGB">
+      <feBlend
+         inkscape:collect="always"
+         id="feBlend7556"
+         in2="BackgroundImage"
+         mode="darken" />
+    </filter>
+  </defs>
+  <g
+     inkscape:groupmode="layer"
+     id="layer9"
+     inkscape:label="status"
+     style="display:inline"
+     transform="translate(-405.00043,303.00336)">
+    <path
+       inkscape:connector-curvature="0"
+       d="m 437.00156,-299.99996 c 2.20912,0 4,1.79088 4,4 -0.001,0.1332 -0.008,0.266 -0.024,0.3984 9.16128,1.83532 16.02412,9.88492 16.02344,19.60156 l -5.6e-4,7.99996 0,10 8,8 0,2 -8,0 -40,0 -8,0 0,-2 8,-8 L 417.001,-276 c 3.2e-4,-9.71664 6.86272,-17.76628 16.02344,-19.60156 -0.016,-0.1324 -0.024,-0.2652 -0.024,-0.3984 0,-2.20912 1.79088,-4 4,-4 z M 443.91508,-244 c -1.42652,2.47084 -4.061,3.99496 -6.91408,4 -2.85588,-0.002 -5.49396,-1.52676 -6.92188,-4 z"
+       id="rect11474"
+       sodipodi:nodetypes="sccscccccccccscssscccc"
+       style="opacity:1;fill:#dbdee0;fill-opacity:1;stroke:none;stroke-width:3;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+  </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer10"
+     inkscape:label="devices"
+     style="display:inline;filter:url(#filter7554)"
+     transform="translate(-405.00043,303.00336)" />
+  <g
+     inkscape:groupmode="layer"
+     id="layer1"
+     inkscape:label="places"
+     style="display:inline"
+     transform="translate(-164.00023,-313.99664)" />
+  <g
+     inkscape:groupmode="layer"
+     id="layer14"
+     inkscape:label="mimetypes"
+     style="display:inline"
+     transform="translate(-405.00043,303.00336)" />
+  <g
+     inkscape:groupmode="layer"
+     id="layer15"
+     inkscape:label="emblems"
+     style="display:inline"
+     transform="translate(-405.00043,303.00336)" />
+  <g
+     inkscape:groupmode="layer"
+     id="g71291"
+     inkscape:label="emotes"
+     style="display:inline"
+     transform="translate(-405.00043,303.00336)" />
+  <g
+     inkscape:groupmode="layer"
+     id="layer2"
+     inkscape:label="categories"
+     style="display:inline"
+     transform="translate(-164.00023,-163.99664)" />
+  <g
+     inkscape:groupmode="layer"
+     id="g6058"
+     inkscape:label="apps"
+     style="display:inline"
+     transform="translate(-164.00023,-163.99664)" />
+  <g
+     inkscape:groupmode="layer"
+     id="layer12"
+     inkscape:label="actions"
+     style="display:inline"
+     transform="translate(-405.00043,303.00336)" />
+</svg>
diff --git a/Paper/gnome-shell/gnome-shell.css b/Paper/gnome-shell/gnome-shell.css
index 3c8542f..bfe64ad 100644
--- a/Paper/gnome-shell/gnome-shell.css
+++ b/Paper/gnome-shell/gnome-shell.css
@@ -32,10 +32,19 @@ stage {
   font-weight: bold;
   background:none;
   background-gradient-direction: none;
+  border:none;
   border-color: rgba(0,0,0,0);
   box-shadow: none;
   text-shadow: none;
   icon-shadow: none; }
+  .button:hover {
+    color: #fff;
+    border-color: rgba(0,0,0,0);
+    border:none;
+    background-color: rgba(255,255,255,0.1);
+    box-shadow: none;
+    text-shadow: none;
+    icon-shadow: none; }
   .button:focus {
     color: #fff;
     border-color: rgba(0,0,0,0);
@@ -104,7 +113,7 @@ StScrollBar {
     background-color: #454d50;
     margin: 3px; }
     StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover {
-      background-color: #515a5a; }
+      background-color: #515a5e; }
     StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
       background-color: #9FB0B9; }
 
@@ -162,7 +171,7 @@ StScrollBar {
 .modal-dialog {
   border-radius: 2px;
   color: #dbdee0;
-  background-color: #454D50 ;
+  background-color: #454d50;
   border: 1px solid rgba(0,0,0,0);
   box-shadow: 0 5px 10px 0 rgba(0,0,0,0.5);
   padding: 24px; }
@@ -387,8 +396,9 @@ StScrollBar {
   border-radius: 8px;
   min-width: 200px; }
   .popup-menu .popup-sub-menu {
-    background-color: #454D50;
-    box-shadow: inset 0 -1px 0px #282c2c; }
+    background-color: #394042;
+    border-width: 0px;
+    box-shadow: none;}
   .popup-menu .popup-menu-content {
     padding: 1em 0em; }
   .popup-menu .popup-menu-item {
@@ -398,14 +408,14 @@ StScrollBar {
     .popup-menu .popup-menu-item:rtl {
       padding: .4em 0em .4em 1.75em; }
     .popup-menu .popup-menu-item:checked {
-      background-color: #454D50;
-      box-shadow: inset 0 1px 0px #282c2c;
+      background-color: #454d50;
+      box-shadow: none;
       font-weight: bold; }
     .popup-menu .popup-menu-item:hover, .popup-menu .popup-menu-item:focus {
-      background-color: rgba(238, 238, 236, 0.1);
+      background-color: rgba(255, 255, 255, 0.1);
       color: #dbdee0; }
     .popup-menu .popup-menu-item:active {
-      background-color: #2d3335;
+      background-color: #515a5e;
       color: #ffffff; }
     .popup-menu .popup-menu-item:insensitive {
       color: rgba(255, 255, 255, 0.2); }
@@ -428,7 +438,7 @@ StScrollBar {
   -arrow-border-radius: 6px;
   -arrow-background-color: #454d50;
   -arrow-border-width: 1px;
-  -arrow-border-color: rgba(0,0,0,0.4);
+  -arrow-border-color: #454d50;
   -arrow-base: 24px;
   -arrow-rise: 11px;
   -arrow-box-shadow: 0 1px 3px black; }
@@ -437,7 +447,7 @@ StScrollBar {
   height: 1px;
   margin: 6px 64px;
   background-color: transparent;
-  border-color: #454D50;
+  border-color: #454d50;
   border-bottom-width: 1px;
   border-bottom-style: solid; }
 
@@ -462,7 +472,7 @@ StScrollBar {
   .osd-window .level {
     height: 0.6em;
     border-radius: 0.3em;
-    background-color: rgba(11, 12, 13, 0.5);
+    background-color: rgba(0, 0, 0, 0.2);
     color: #dbdee0; }
 
 /* App Switcher */
@@ -536,10 +546,12 @@ StScrollBar {
 .resize-popup,
 .switcher-list, .workspace-switcher-container {
   color: #dbdee0;
-  background-color: #2d3335;
-  border: 1px solid rgba(0,0,0,0.4);
-  border-radius: 10px;
-  padding: 12px; }
+  background-color: #454d50;
+  border: none;
+  border-radius: 8px;
+  padding: 12px;
+  box-shadow: 0 5px 10px 0 rgba(0,0,0,0.5);
+  border: 1px solid rgba(0,0,0,0); }
 
 /* Tiled window previews */
 .tile-preview {
@@ -557,7 +569,7 @@ StScrollBar {
 
 /* TOP BAR */
 #panel {
-  background-color: #454D50;
+  background-color: #454d50;
   font-weight: bold;
   height: 1.86em; }
   #panel.unlock-screen, #panel.login-screen, #panel.lock-screen {
@@ -566,7 +578,7 @@ StScrollBar {
     spacing: 4px; }
   #panel .panel-corner {
     -panel-corner-radius: 0px;
-    -panel-corner-background-color: #454D50;
+    -panel-corner-background-color: #454d50;
     -panel-corner-border-width: 2px;
     -panel-corner-border-color: transparent; }
     #panel .panel-corner:active, #panel .panel-corner:overview, #panel .panel-corner:focus {
@@ -743,14 +755,16 @@ StScrollBar {
 
 .message-list-section-close > StIcon {
   icon-size: 16px;
-  border-radius: 8px;
-  color: #454d50;
-  background-color: rgba(255,255,255,0.22); }
+  padding: 1px;
+  border-radius: 10px;
+  color: rgba(255,255,255,0.4);
+  background-color: rgba(255,255,255,0.0); }
 
 /* FIXME: how do you do this in sass? */
 .message-list-section-close:hover > StIcon,
 .message-list-section-close:focus > StIcon {
-  background-color: rgba(255,255,255,0.3); }
+  background-color: rgba(255,255,255,0.9);
+  color: #454d50;}
 
 .message {
   background-color: #454d50;
@@ -778,7 +792,6 @@ StScrollBar {
 .message-content {
   padding: 8px; }
 
-
 .system-switch-user-submenu-icon {
   icon-size: 48px;
   border: none; }
@@ -799,14 +812,14 @@ StScrollBar {
   border-radius: 32px;
   /* wish we could do 50% */
   padding: 13px;
-  border: 1px solid #282c2c; }
+  border: 1px solid rgba(0,0,0,0.2); }
   .system-menu-action:hover, .system-menu-action:focus {
     color: #ffffff;
     background-color: #9FB0B9;
     border: none;
     padding: 14px; }
   .system-menu-action:active {
-    background-color: #2d3335;
+    background-color: #394042;
     color: #ffffff; }
   .system-menu-action > StIcon {
     icon-size: 16px; }
@@ -917,13 +930,13 @@ StScrollBar {
 .window-clone-border {
   border: 4px solid rgba(159, 176, 185, 0.7);
   border-radius: 4px;
-  box-shadow: 0 2px 5px 0 rgba(0,0,0,0.5); }
+  box-shadow: 0 2px 5px 0 rgba(0,0,0,0.0); }
 
 .window-caption {
   spacing: 25px;
-  color: #dbdee0;
+  color: rgba(255,255,255,0.8);
   background-color: rgba(0,0,0,0.5);
-  border-radius: 8px;
+  border-radius: 3px;
   padding: 4px 12px;
   -shell-caption-spacing: 12px; }
   .window-caption:hover {
@@ -945,7 +958,8 @@ StScrollBar {
     border: 1px solid rgba(0,0,0,0);
     background-color: #fff;
     color: #777;
-    box-shadow: 0 5px 10px 0 rgba(0,0,0,0.5); }
+    box-shadow: 0 5px 10px 0 rgba(0,0,0,0.5);
+    transition-duration: 200ms; }
   .search-entry .search-entry-icon {
     icon-size: 1em;
     padding: 0 4px;
@@ -1218,18 +1232,21 @@ StScrollBar {
   .notification-banner .notification-button {
     border: none;
     padding: 4px 4px 5px;
-    color: #738c99;
+    color: #777;
     font-weight: bold;
     background-color: #fff;
     border-color: rgba(0,0,0,0.0);
-    border-radius: 2px;
-    box-shadow: none}
+    box-shadow: none;
+    border-radius: 0px;}
     .notification-banner .notification-button:first-child {
       border-radius: 0 0 0 2px; }
+    .notification-banner .notification-button:not(:first-child):not(:last-child) {
+      border-radius: 0px; }
     .notification-banner .notification-button:last-child {
       border-radius: 0 0 2px 0; }
     .notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus, .notification-banner .notification-button:focus {
-      background-color: #f0f3f4; }
+      background-color: #f7f7f7;
+      color: #738c99; }
 
 .notification {
   font-size: 11pt;
@@ -1237,7 +1254,7 @@ StScrollBar {
   margin: 5px;
   border-radius: 6px;
   color: #555;
-  background-color: #f7f7f7;
+  background-color: #fff;
   border: 1px solid rgba(0,0,0,0.2);
   spacing-rows: 4px;
   padding: 8px;
@@ -1282,7 +1299,7 @@ StScrollBar {
   height: 24px;
   padding: 4px 4px 5px;
   color: #555;
-  background-color: #f7f7f7;
+  background-color: #fff;
   border-radius: 0 0 6px 6px; }
 
 .notification-icon-button {
@@ -1292,10 +1309,11 @@ StScrollBar {
   border: none;
   border-top-width: 1px;
   color: #555;
-  background-color: #f7f7f7;
+  background-color: #fff;
   border-color: rgba(0,0,0,0.2);
   border-radius: 0 0 3px 3px;
-  box-shadow: inset 0 1px rgba(255,255,255,0.1); }
+  /*box-shadow: inset 0 1px rgba(255,255,255,0.1);*/
+  box-shadow: none; }
   .notification-icon-button > StIcon {
     icons-size: 16px;
     width: 16px;