add firefox theme40.20150819

3 files changed, 213 insertions, 0 deletions

diff --git a/arc-firefox-theme/chrome/browser/readinglist/icons.svg b/arc-firefox-theme/chrome/browser/readinglist/icons.svg
new file mode 100644
index 0000000..6aa0159
--- /dev/null
+++ b/arc-firefox-theme/chrome/browser/readinglist/icons.svg
@@ -0,0 +1,56 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- This Source Code Form is subject to the terms of the Mozilla Public
+   - License, v. 2.0. If a copy of the MPL was not distributed with this
+   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
+<svg xmlns="http://www.w3.org/2000/svg"
+     xmlns:xlink="http://www.w3.org/1999/xlink"
+     viewBox="0 0 14 14"
+     xml:space="preserve">
+
+  <defs>
+    <style type="text/css">
+      use:not(:target) {
+        display: none;
+      }
+
+      #addpage, #alreadyadded {
+        fill: #808080;
+      }
+      #addpage-hover, #alreadyadded-hover {
+        fill: #555555;
+      }
+      #addpage-active, #alreadyadded-active {
+        fill: #0095DD;
+      }
+    </style>
+
+    <mask id="plus-mask">
+      <rect width="100%" height="100%" fill="white"/>
+      <rect x="3" y="6" width="8" height="2"/>
+      <rect x="6" y="3" width="2" height="8"/>
+    </mask>
+
+    <mask id="minus-mask">
+      <rect width="100%" height="100%" fill="white"/>
+      <rect x="3" y="6" width="8" height="2"/>
+    </mask>
+
+    <g id="addpage-shape">
+      <circle cx="7" cy="7" r="6" mask="url(#plus-mask)"/>
+    </g>
+
+    <g id="removepage-shape">
+      <circle cx="7" cy="7" r="6" mask="url(#minus-mask)"/>
+    </g>
+
+  </defs>
+
+  <use id="addpage"                 xlink:href="#addpage-shape"/>
+  <use id="addpage-hover"           xlink:href="#addpage-shape"/>
+  <use id="addpage-active"          xlink:href="#addpage-shape"/>
+
+  <use id="alreadyadded"            xlink:href="#removepage-shape"/>
+  <use id="alreadyadded-hover"      xlink:href="#removepage-shape"/>
+  <use id="alreadyadded-active"     xlink:href="#removepage-shape"/>
+
+</svg>
diff --git a/arc-firefox-theme/chrome/browser/readinglist/readinglist-icon.svg b/arc-firefox-theme/chrome/browser/readinglist/readinglist-icon.svg
new file mode 100644
index 0000000..0a24a67
--- /dev/null
+++ b/arc-firefox-theme/chrome/browser/readinglist/readinglist-icon.svg
@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 16 16">
+  <rect x="4.8" y="6.4" fill="#808080" width="11.2" height="3.2"/>
+  <rect x="4.8" y="11.2" fill="#808080" width="11.2" height="3.2"/>
+  <rect x="4.8" y="1.6" fill="#808080" width="11.2" height="3.2"/>
+  <circle fill="#808080" cx="1.6" cy="3.2" r="1.6"/>
+  <circle fill="#808080" cx="1.6" cy="8" r="1.6"/>
+  <circle fill="#808080" cx="1.6" cy="12.8" r="1.6"/>
+</svg>
diff --git a/arc-firefox-theme/chrome/browser/readinglist/sidebar.css b/arc-firefox-theme/chrome/browser/readinglist/sidebar.css
new file mode 100644
index 0000000..27fc12b
--- /dev/null
+++ b/arc-firefox-theme/chrome/browser/readinglist/sidebar.css
@@ -0,0 +1,148 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+
+:root, body {
+  overflow-x: hidden;
+}
+
+body {
+  margin: 0;
+  font: message-box;
+  color: #333333;
+  -moz-user-select: none;
+  overflow: hidden;
+}
+
+#emptyListInfo {
+  cursor: default;
+  padding: 3em 1em;
+  text-align: center;
+}
+
+.item {
+  display: flex;
+  flex-flow: row;
+  cursor: pointer;
+  padding: 6px;
+  opacity: 0;
+  max-height: 0;
+  transition: opacity 150ms ease-in-out, max-height 150ms ease-in-out 150ms;
+}
+
+.item.active {
+  background: #FEFEFE;
+}
+
+.item.selected {
+  background: #FDFDFD;
+}
+
+.item-thumb-container {
+  min-width: 64px;
+  max-width: 64px;
+  min-height: 40px;
+  max-height: 40px;
+  border: 1px solid white;
+  box-shadow: 0px 1px 2px rgba(0,0,0,.35);
+  margin: 5px;
+  background-color: #ebebeb;
+  background-size: contain;
+  background-repeat: no-repeat;
+  background-position: center;
+  background-image: url("chrome://branding/content/silhouette-40.svg");
+}
+
+.item-thumb-container.preview-available {
+  background-color: #fff;
+  background-size: cover;
+}
+
+.item-summary-container {
+  display: flex;
+  flex-flow: column;
+  -moz-padding-start: 4px;
+  overflow: hidden;
+  flex-grow: 1;
+}
+
+.item-title-lines {
+  display: flex;
+}
+
+.item-title {
+  overflow: hidden;
+  max-height: 2.8em;
+  line-height: 1.4;
+  flex-grow: 1;
+}
+
+.item-domain {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  max-height: 1.4em;
+  color: #0095DD;
+}
+
+.item:hover .item-domain {
+  color: #008ACB;
+}
+
+.item:not(:hover):not(.selected) .remove-button {
+  visibility: hidden;
+}
+
+.remove-button {
+  padding: 0;
+  width: 16px;
+  height: 16px;
+  min-width: 16px;
+  min-height: 16px;
+  background-size: contain;
+  background-color: transparent;
+  border-width: 0;
+}
+
+.item.visible {
+  opacity: 1;
+  max-height: 80px;
+  transition: max-height 250ms ease-in-out, opacity 250ms ease-in-out 250ms;
+}
+
+html {
+  border: 1px solid ThreeDShadow;
+  background-color: -moz-Field;
+  color: -moz-FieldText;
+  box-sizing: border-box;
+}
+
+.item {
+  -moz-padding-end: 0;
+}
+
+.item.active {
+  background-color: -moz-cellhighlight;
+  color: -moz-cellhighlighttext;
+}
+
+.item-title {
+  margin: 1px 0 0;
+}
+
+.item-title, .item-domain {
+  -moz-margin-end: 6px;
+}
+
+.remove-button {
+  background-image: -moz-image-rect(url("chrome://global/skin/icons/close.svg"), 0, 16, 16, 0);
+}
+
+.remove-button:hover {
+  background-image: -moz-image-rect(url("chrome://global/skin/icons/close.svg"), 0, 32, 16, 16);
+}
+
+.remove-button:hover:active {
+  background-image: -moz-image-rect(url("chrome://global/skin/icons/close.svg"), 0, 48, 16, 32);
+}