first stab on supporting reader view and reding list

[themes.git] / LCARStrek / browser / readinglist / sidebar.css

diff --git a/LCARStrek/browser/readinglist/sidebar.css b/LCARStrek/browser/readinglist/sidebar.css
new file mode 100644 (file)
index 0000000..b0f8c3b
--- /dev/null
+++ b/LCARStrek/browser/readinglist/sidebar.css
@@ -0,0 +1,150 @@
+/* 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/. */
+
+/* === BEGIN readinglist.inc.css === */
+
+:root, body {
+  overflow-x: hidden;
+}
+
+body {
+  margin: 0;
+  font: 11px "Liberation Sans",Arial,Tahoma,Helvetica,sans-serif;
+  background-color: #000000;
+  color: #FF9F00;
+  -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: #A09090;
+  color: #000000;
+}
+
+.item.selected {
+  background: #008484;
+  color: #000000;
+}
+
+.item:hover {
+  background: #FFCF00;
+  color: #000000;
+}
+
+.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: #A09090;
+  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: #3333FF;
+}
+
+.item:hover .item-domain {
+  color: #000000;
+}
+
+.item:not(:hover):not(.selected) .remove-button {
+  visibility: hidden;
+}
+
+.remove-button {
+  padding: 0;
+  -moz-margin-end: 2px;
+  border-radius: 3px;
+  width: 16px;
+  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;
+}
+
+/* === END readinglist.inc.css === */
+
+.item {
+  -moz-padding-end: 0;
+}
+
+.item-title {
+  margin: 1px 0 0;
+}
+
+.item-title, .item-domain {
+  -moz-margin-end: 6px;
+}
+
+.remove-button {
+  background-color: #000000;
+  background-image: -moz-image-rect(url("chrome://global/skin/icons/close.png"), 0, 16, 16, 0);
+}
+
+.remove-button:hover {
+  background-color: #FFCF00;
+  background-image: -moz-image-rect(url("chrome://global/skin/icons/close.png"), 0, 32, 16, 16);
+}
+
+.remove-button:hover:active {
+  background-color: #FF9F00;
+  background-image: -moz-image-rect(url("chrome://global/skin/icons/close.png"), 0, 32, 16, 16);
+}