first stab on supporting reader view and reding list
authorRobert Kaiser <kairo@kairo.at>
Fri, 10 Apr 2015 23:56:48 +0000 (01:56 +0200)
committerRobert Kaiser <kairo@kairo.at>
Fri, 10 Apr 2015 23:56:48 +0000 (01:56 +0200)
13 files changed:
LCARStrek/browser/browser.css
LCARStrek/browser/readerMode.svg [new file with mode: 0644]
LCARStrek/browser/readinglist/icons.svg [new file with mode: 0644]
LCARStrek/browser/readinglist/readinglist-icon.svg [new file with mode: 0644]
LCARStrek/browser/readinglist/sidebar.css [new file with mode: 0644]
LCARStrek/global/reader/RM-Add-24x24.svg [new file with mode: 0644]
LCARStrek/global/reader/RM-Close-24x24.svg [new file with mode: 0644]
LCARStrek/global/reader/RM-Delete-24x24.svg [new file with mode: 0644]
LCARStrek/global/reader/RM-Minus-24x24.svg [new file with mode: 0644]
LCARStrek/global/reader/RM-Plus-24x24.svg [new file with mode: 0644]
LCARStrek/global/reader/RM-Reading-List-24x24.svg [new file with mode: 0644]
LCARStrek/global/reader/RM-Type-Controls-24x24.svg [new file with mode: 0644]
LCARStrek/global/reader/RM-Type-Controls-Arrow.svg [new file with mode: 0644]

index 0f0e96ef78fcac72d19558b177cd3f19038e552e..60c6a30688083805761586a7518046a0b9c34b1a 100644 (file)
@@ -2347,6 +2347,62 @@ richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url-
   -moz-image-region: rect(0, 32px, 16px, 16px);
 }
 
+/* === BEGIN readinglist.inc.css === */
+
+/* Reading List button */
+
+#urlbar:not([focused]):not(:hover) #readinglist-addremove-button {
+  opacity: 0;
+  width: 0px;
+}
+
+#readinglist-addremove-button {
+  list-style-image: url("chrome://browser/skin/readinglist/icons.svg#addpage");
+  -moz-image-region: rect(0, 14px, 14px, 0);
+  transition: width 150ms ease-in-out, opacity 150ms ease-in-out 150ms;
+  opacity: 1;
+  width: 20px;
+}
+
+#readinglist-addremove-button:hover {
+  list-style-image: url("chrome://browser/skin/readinglist/icons.svg#addpage-hover");
+}
+
+#readinglist-addremove-button:active {
+  list-style-image: url("chrome://browser/skin/readinglist/icons.svg#addpage-active");
+}
+
+#readinglist-addremove-button[already-added="true"] {
+  list-style-image: url("chrome://browser/skin/readinglist/icons.svg#alreadyadded");
+}
+
+#readinglist-addremove-button[already-added="true"]:hover {
+  list-style-image: url("chrome://browser/skin/readinglist/icons.svg#alreadyadded-hover");
+}
+
+#readinglist-addremove-button[already-added="true"]:active {
+  list-style-image: url("chrome://browser/skin/readinglist/icons.svg#alreadyadded-active");
+}
+
+/* === END readinglist.inc.css === */
+
+/* Reader mode button */
+
+#reader-mode-button {
+  list-style-image: url("chrome://browser/skin/readerMode.svg");
+  -moz-image-region: rect(0, 16px, 16px, 0);
+}
+
+#reader-mode-button:hover,
+#reader-mode-button[readeractive]:hover {
+  -moz-image-region: rect(0, 32px, 16px, 16px);
+}
+
+#reader-mode-button:hover:active,
+#reader-mode-button[readeractive] {
+  -moz-image-region: rect(0, 48px, 16px, 32px);
+}
+
 /* social share panel */
 
 .social-share-frame {
@@ -2528,8 +2584,22 @@ toolbarbutton[type="socialmark"] > .toolbarbutton-icon {
 
 /* ::::: content area ::::: */
 
+#sidebar-box {
+  background-color: #9C9CFF;
+  color: #000000;
+}
+
 #sidebar {
-  background-color: Window;
+  background-color: #000000;
+}
+
+#sidebar-splitter {
+  -moz-margin-start: 0;
+}
+
+#sidebar-header {
+  color: #000000;
+  padding: 2px;
 }
 
 #sidebar-title {
@@ -2548,6 +2618,16 @@ toolbarbutton[type="socialmark"] > .toolbarbutton-icon {
   list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
 }
 
+#sidebar-splitter:-moz-locale-dir(ltr),
+#sidebar:-moz-locale-dir(ltr) {
+  border-radius: 0 5px 0 0;
+}
+
+#sidebar-splitter:-moz-locale-dir(rtl),
+#sidebar:-moz-locale-dir(rtl) {
+  border-radius: 5px 0 0 0;
+}
+
 .browserContainer > findbar {
 /*
   background-color: -moz-dialog;
@@ -3448,6 +3528,12 @@ notification[value="translation"] {
   -moz-image-region: auto;
 }
 
+#menu_readingList,
+#BMB_readingList {
+  list-style-image: url("chrome://browser/skin/readinglist/readinglist-icon.svg");
+  -moz-image-region: auto;
+}
+
 /* ::::: Keyboard UI Panel ::::: */
 
 .KUI-panel {
diff --git a/LCARStrek/browser/readerMode.svg b/LCARStrek/browser/readerMode.svg
new file mode 100644 (file)
index 0000000..b08904c
--- /dev/null
@@ -0,0 +1,34 @@
+<?xml version="1.0" encoding="utf-8"?>\r
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">\r
+<svg version="1.1"\r
+ xmlns="http://www.w3.org/2000/svg"\r
+ xmlns:xlink="http://www.w3.org/1999/xlink"\r
+ x="0"\r
+ y="0"\r
+ width="48"\r
+ height="16"\r
+ viewBox="0 0 48 16">\r
+<defs>\r
+  <path id="glyphShape-readerMode-book" d="M5.5,5h-2C3.2,5,3,5.2,3,5.5S3.2,6,3.5,6h2 C5.8,6,6,5.8,6,5.5S5.8,5,5.5,5z M5.5,7h-2C3.2,7,3,7.2,3,7.5S3.2,8,3.5,8h2C5.8,8,6,7.8,6,7.5S5.8,7,5.5,7z M5.5,9h-2 C3.2,9,3,9.2,3,9.5S3.2,10,3.5,10h2C5.8,10,6,9.8,6,9.5S5.8,9,5.5,9z M15.4,2c0,0-3.1,0-4.4,0S8.1,2.5,8,4.3C7.9,2.5,6.3,2,5,2 S0.6,2,0.6,2C0.3,2,0,2.3,0,2.7v9.6C0,12.6,0.3,13,0.6,13c0,0,2.6,0,4.4,0c1.6,0,2.8,1,3,2.3C8.2,14,9.4,13,11,13 c1.8,0,4.4,0,4.4,0c0.4,0,0.6-0.4,0.6-0.8V2.7C16,2.3,15.7,2,15.4,2z M14,11L14,11c-0.2,0-1.6,0-3,0c-1.6,0-2.9,0.8-3,2.2 C7.9,11.8,6.6,11,5,11c-1.4,0-2.8,0-3,0l0,0l0,0V4c0,0,2.7,0,3.5,0C6.6,4,8,5.5,8,6.8C8,5.5,9.4,4,10.5,4C11.3,4,14,4,14,4V11 L14,11z"/>\r
+  <linearGradient id="gradient-state-default" x1="0%" y1="0%" x2="0" y2="100%">\r
+    <stop stop-color="#A09090" offset="0%"/>\r
+    <stop stop-color="#A09090" offset="100%"/>\r
+  </linearGradient>\r
+  <linearGradient id="gradient-state-hover" x1="0%" y1="0%" x2="0" y2="100%">\r
+    <stop stop-color="#FFCF00" offset="0%"/>\r
+    <stop stop-color="#FFCF00" offset="100%"/>\r
+  </linearGradient>\r
+  <linearGradient id="gradient-state-pressed" x1="0%" y1="0%" x2="0" y2="100%">\r
+    <stop stop-color="#008484" offset="0%"/>\r
+    <stop stop-color="#998484" offset="100%"/>\r
+  </linearGradient>\r
+  <style type="text/css">\r
+    .icon-state-default { fill: url(#gradient-state-default); }\r
+    .icon-state-hover   { fill: url(#gradient-state-hover); }\r
+    .icon-state-pressed { fill: url(#gradient-state-pressed); }\r
+  </style>\r
+</defs>\r
+<use xlink:href="#glyphShape-readerMode-book" class="icon-state-default"/>\r
+<use xlink:href="#glyphShape-readerMode-book" class="icon-state-hover"    transform="translate(16)"/>\r
+<use xlink:href="#glyphShape-readerMode-book" class="icon-state-pressed"  transform="translate(32)"/>\r
+</svg>\r
diff --git a/LCARStrek/browser/readinglist/icons.svg b/LCARStrek/browser/readinglist/icons.svg
new file mode 100644 (file)
index 0000000..d152cd7
--- /dev/null
@@ -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 16 16"
+     xml:space="preserve">
+
+  <defs>
+    <style type="text/css">
+      use:not(:target) {
+        display: none;
+      }
+
+      #addpage, #alreadyadded {
+        fill: #A09090;
+      }
+      #addpage-hover, #alreadyadded-hover {
+        fill: #FFCF00;
+      }
+      #addpage-active, #alreadyadded-active {
+        fill: #008484;
+      }
+    </style>
+
+    <mask id="plus-mask">
+      <rect width="100%" height="100%" fill="white"/>
+      <rect x="4" y="7.5" width="8" height="1"/>
+      <rect x="7.5" y="4" width="1" height="8"/>
+    </mask>
+
+    <mask id="minus-mask">
+      <rect width="100%" height="100%" fill="white"/>
+      <rect x="4" y="7.5" width="8" height="1"/>
+    </mask>
+
+    <g id="addpage-shape">
+      <circle cx="8" cy="8" r="7" mask="url(#plus-mask)"/>
+    </g>
+
+    <g id="removepage-shape">
+      <circle cx="8" cy="8" r="7" 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/LCARStrek/browser/readinglist/readinglist-icon.svg b/LCARStrek/browser/readinglist/readinglist-icon.svg
new file mode 100644 (file)
index 0000000..83e2a66
--- /dev/null
@@ -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="#A09090" width="11.2" height="3.2"/>
+  <rect x="4.8" y="11.2" fill="#A09090" width="11.2" height="3.2"/>
+  <rect x="4.8" y="1.6" fill="#A09090" width="11.2" height="3.2"/>
+  <circle fill="#A09090" cx="1.6" cy="3.2" r="1.6"/>
+  <circle fill="#A09090" cx="1.6" cy="8" r="1.6"/>
+  <circle fill="#A09090" cx="1.6" cy="12.8" r="1.6"/>
+</svg>
diff --git a/LCARStrek/browser/readinglist/sidebar.css b/LCARStrek/browser/readinglist/sidebar.css
new file mode 100644 (file)
index 0000000..b0f8c3b
--- /dev/null
@@ -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);
+}
diff --git a/LCARStrek/global/reader/RM-Add-24x24.svg b/LCARStrek/global/reader/RM-Add-24x24.svg
new file mode 100644 (file)
index 0000000..66551ef
--- /dev/null
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>\r
+<svg version="1.1" id="Icons" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"\r
+     viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve">\r
+<path fill-rule="evenodd" clip-rule="evenodd" fill="#808080" d="M12,2C6.477,2,2,6.477,2,12c0,5.523,4.477,10,10,10s10-4.477,10-10\r
+    C22,6.477,17.523,2,12,2z M17.714,12.714h-5v5h-1.429v-5h-5v-1.429h5v-5h1.429v5h5V12.714z"/>\r
+</svg>\r
diff --git a/LCARStrek/global/reader/RM-Close-24x24.svg b/LCARStrek/global/reader/RM-Close-24x24.svg
new file mode 100644 (file)
index 0000000..b0674b2
--- /dev/null
@@ -0,0 +1,31 @@
+<?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 viewBox="0 0 24 24"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:xlink="http://www.w3.org/1999/xlink">
+  <defs>
+    <style type="text/css">
+      use:not(:target) {
+        display: none;
+      }
+
+      #close {
+        fill: #808080;
+      }
+      #close-hover {
+        fill: #FFFFFF;
+      }
+    </style>
+
+    <g id="close-shape">
+      <polygon points="20.477,6.551 20.477,17.449 11.992,17.449 11.992,20 23,20 23,4 11.992,4 11.992,6.551"/>
+      <polygon points="1,11.981 9.698,19.95 9.698,15.13 18.184,15.13 18.184,8.87 9.698,8.87 9.698,4.011"/>
+    </g>
+  </defs>
+
+  <use id="close"       xlink:href="#close-shape"/>
+  <use id="close-hover" xlink:href="#close-shape"/>
+
+</svg>
\ No newline at end of file
diff --git a/LCARStrek/global/reader/RM-Delete-24x24.svg b/LCARStrek/global/reader/RM-Delete-24x24.svg
new file mode 100644 (file)
index 0000000..6010fbe
--- /dev/null
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>\r
+<svg version="1.1" id="Icons" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"\r
+     viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve">\r
+<path fill-rule="evenodd" clip-rule="evenodd" fill="#808080" d="M12,2C6.477,2,2,6.477,2,12c0,5.523,4.477,10,10,10s10-4.477,10-10\r
+    C22,6.477,17.523,2,12,2z M11.286,6.286 M6.286,12.714v-1.429h11.429v1.429H6.286z"/>\r
+</svg>\r
diff --git a/LCARStrek/global/reader/RM-Minus-24x24.svg b/LCARStrek/global/reader/RM-Minus-24x24.svg
new file mode 100644 (file)
index 0000000..9da7e03
--- /dev/null
@@ -0,0 +1,39 @@
+<?xml version="1.0" encoding="utf-8"?>\r
+<svg version="1.1" id="Icons" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"\r
+     viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve">\r
+<path fill-rule="evenodd" clip-rule="evenodd" fill="#808080" d="M0,13.5v-3h24v3H0z"/>\r
+<g enable-background="new    ">\r
+    <g>\r
+        <defs>\r
+            <rect id="SVGID_2_" x="-269.917" y="-1054" width="22" height="34"/>\r
+        </defs>\r
+        <clipPath id="SVGID_1_">\r
+            <use xlink:href="#SVGID_2_"  overflow="visible"/>\r
+        </clipPath>\r
+        <g clip-path="url(#SVGID_1_)">\r
+            <defs>\r
+                <rect id="SVGID_6_" x="-365.917" y="-1459" width="1080" height="2896"/>\r
+            </defs>\r
+            <clipPath id="SVGID_3_">\r
+                <use xlink:href="#SVGID_6_"  overflow="visible"/>\r
+            </clipPath>\r
+        </g>\r
+        <g clip-path="url(#SVGID_1_)">\r
+            <defs>\r
+                <rect id="SVGID_10_" x="-365.917" y="-1459" width="1080" height="2896"/>\r
+            </defs>\r
+            <clipPath id="SVGID_5_">\r
+                <use xlink:href="#SVGID_10_"  overflow="visible"/>\r
+            </clipPath>\r
+        </g>\r
+        <g clip-path="url(#SVGID_1_)">\r
+            <defs>\r
+                <rect id="SVGID_16_" x="-365.917" y="-1459" width="1080" height="2896"/>\r
+            </defs>\r
+            <clipPath id="SVGID_7_">\r
+                <use xlink:href="#SVGID_16_"  overflow="visible"/>\r
+            </clipPath>\r
+        </g>\r
+    </g>\r
+</g>\r
+</svg>\r
diff --git a/LCARStrek/global/reader/RM-Plus-24x24.svg b/LCARStrek/global/reader/RM-Plus-24x24.svg
new file mode 100644 (file)
index 0000000..249912a
--- /dev/null
@@ -0,0 +1,39 @@
+<?xml version="1.0" encoding="utf-8"?>\r
+<svg version="1.1" id="Icons" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"\r
+     viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve">\r
+<path fill-rule="evenodd" clip-rule="evenodd" fill="#808080" d="M24,13.5H13.5V24h-3V13.5H0v-3h10.5V0h3v10.5H24V13.5z"/>\r
+<g enable-background="new    ">\r
+    <g>\r
+        <defs>\r
+            <rect id="SVGID_2_" x="-233.667" y="-1054" width="22" height="34"/>\r
+        </defs>\r
+        <clipPath id="SVGID_1_">\r
+            <use xlink:href="#SVGID_2_"  overflow="visible"/>\r
+        </clipPath>\r
+        <g clip-path="url(#SVGID_1_)">\r
+            <defs>\r
+                <rect id="SVGID_6_" x="-329.667" y="-1459" width="1080" height="2896"/>\r
+            </defs>\r
+            <clipPath id="SVGID_3_">\r
+                <use xlink:href="#SVGID_6_"  overflow="visible"/>\r
+            </clipPath>\r
+        </g>\r
+        <g clip-path="url(#SVGID_1_)">\r
+            <defs>\r
+                <rect id="SVGID_10_" x="-329.667" y="-1459" width="1080" height="2896"/>\r
+            </defs>\r
+            <clipPath id="SVGID_5_">\r
+                <use xlink:href="#SVGID_10_"  overflow="visible"/>\r
+            </clipPath>\r
+        </g>\r
+        <g clip-path="url(#SVGID_1_)">\r
+            <defs>\r
+                <rect id="SVGID_16_" x="-329.667" y="-1459" width="1080" height="2896"/>\r
+            </defs>\r
+            <clipPath id="SVGID_7_">\r
+                <use xlink:href="#SVGID_16_"  overflow="visible"/>\r
+            </clipPath>\r
+        </g>\r
+    </g>\r
+</g>\r
+</svg>\r
diff --git a/LCARStrek/global/reader/RM-Reading-List-24x24.svg b/LCARStrek/global/reader/RM-Reading-List-24x24.svg
new file mode 100644 (file)
index 0000000..1f21efd
--- /dev/null
@@ -0,0 +1,46 @@
+<?xml version="1.0" encoding="utf-8"?>\r
+<svg version="1.1" id="Icons" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"\r
+     viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve">\r
+<g>\r
+    <rect x="8" y="10" fill-rule="evenodd" clip-rule="evenodd" fill="#808080" width="14" height="4"/>\r
+    <rect x="8" y="16" fill-rule="evenodd" clip-rule="evenodd" fill="#808080" width="14" height="4"/>\r
+    <rect x="8" y="4" fill-rule="evenodd" clip-rule="evenodd" fill="#808080" width="14" height="4"/>\r
+    <circle fill-rule="evenodd" clip-rule="evenodd" fill="#808080" cx="4" cy="6" r="2"/>\r
+    <circle fill-rule="evenodd" clip-rule="evenodd" fill="#808080" cx="4" cy="12" r="2"/>\r
+    <circle fill-rule="evenodd" clip-rule="evenodd" fill="#808080" cx="4" cy="18" r="2"/>\r
+</g>\r
+<g enable-background="new    ">\r
+    <g>\r
+        <defs>\r
+            <rect id="SVGID_2_" x="-197" y="-1054" width="22" height="34"/>\r
+        </defs>\r
+        <clipPath id="SVGID_1_">\r
+            <use xlink:href="#SVGID_2_"  overflow="visible"/>\r
+        </clipPath>\r
+        <g clip-path="url(#SVGID_1_)">\r
+            <defs>\r
+                <rect id="SVGID_6_" x="-293" y="-1459" width="1080" height="2896"/>\r
+            </defs>\r
+            <clipPath id="SVGID_3_">\r
+                <use xlink:href="#SVGID_6_"  overflow="visible"/>\r
+            </clipPath>\r
+        </g>\r
+        <g clip-path="url(#SVGID_1_)">\r
+            <defs>\r
+                <rect id="SVGID_10_" x="-293" y="-1459" width="1080" height="2896"/>\r
+            </defs>\r
+            <clipPath id="SVGID_5_">\r
+                <use xlink:href="#SVGID_10_"  overflow="visible"/>\r
+            </clipPath>\r
+        </g>\r
+        <g clip-path="url(#SVGID_1_)">\r
+            <defs>\r
+                <rect id="SVGID_16_" x="-293" y="-1459" width="1080" height="2896"/>\r
+            </defs>\r
+            <clipPath id="SVGID_7_">\r
+                <use xlink:href="#SVGID_16_"  overflow="visible"/>\r
+            </clipPath>\r
+        </g>\r
+    </g>\r
+</g>\r
+</svg>\r
diff --git a/LCARStrek/global/reader/RM-Type-Controls-24x24.svg b/LCARStrek/global/reader/RM-Type-Controls-24x24.svg
new file mode 100644 (file)
index 0000000..a25429a
--- /dev/null
@@ -0,0 +1,23 @@
+<?xml version="1.0" encoding="utf-8"?>\r
+<svg version="1.1" id="Icons" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"\r
+     viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve">\r
+<g>\r
+    <path fill="#808080" d="M8.23,18.748v-1.016l1.182-0.146c0.065-0.013,0.12-0.055,0.166-0.127s0.052-0.143,0.02-0.215L8.513,14.07\r
+        H4.236l-1.104,3.096c-0.039,0.104-0.02,0.199,0.059,0.283s0.153,0.13,0.225,0.137l1.123,0.146v1.016H0.232v-1.016l1.123-0.166\r
+        L5.837,5.008h2.275l4.443,12.197c0.052,0.124,0.103,0.21,0.151,0.259s0.145,0.089,0.288,0.122l0.762,0.146v1.016H8.23z\r
+         M6.296,8.084l-1.68,4.805h3.398L6.296,8.084z"/>\r
+    <path fill="#808080" d="M20.05,18.748l-0.264-0.996c-0.345,0.234-0.706,0.443-1.083,0.625c-0.331,0.156-0.702,0.298-1.112,0.425\r
+        c-0.409,0.127-0.835,0.19-1.277,0.19c-0.364,0-0.704-0.06-1.02-0.181s-0.592-0.293-0.829-0.518s-0.424-0.497-0.561-0.815\r
+        S13.7,16.801,13.7,16.404c0-0.299,0.024-0.576,0.073-0.83s0.146-0.49,0.293-0.708s0.356-0.426,0.63-0.625s0.637-0.392,1.089-0.581\r
+        s1.008-0.377,1.665-0.566s1.445-0.384,2.363-0.586v-0.244c0-0.098,0.003-0.186,0.01-0.264c0-0.091,0.003-0.182,0.01-0.273\r
+        c0.007-0.189-0.013-0.392-0.059-0.61s-0.137-0.42-0.273-0.605s-0.329-0.338-0.576-0.459s-0.569-0.181-0.967-0.181\r
+        c-0.137,0-0.259,0.003-0.366,0.01s-0.197,0.016-0.269,0.029c-0.085,0.013-0.159,0.026-0.225,0.039v1.895h-2.061\r
+        c-0.169,0.013-0.319-0.003-0.449-0.049c-0.11-0.039-0.213-0.107-0.308-0.205s-0.142-0.25-0.142-0.459\r
+        c0-0.371,0.132-0.703,0.396-0.996c0.263-0.293,0.607-0.542,1.033-0.747s0.904-0.363,1.435-0.474\r
+        c0.529-0.111,1.058-0.166,1.585-0.166c0.572,0,1.096,0.042,1.57,0.127s0.883,0.249,1.224,0.493c0.342,0.244,0.604,0.587,0.79,1.03\r
+        s0.278,1.025,0.278,1.748v5.137c0,0.124,0.042,0.229,0.127,0.317s0.188,0.138,0.312,0.151l0.879,0.059v0.938H20.05z M19.793,13.592\r
+        c-0.645,0.13-1.177,0.264-1.597,0.4s-0.754,0.293-1.001,0.469s-0.42,0.376-0.518,0.601s-0.146,0.487-0.146,0.786\r
+        c0,0.208,0.034,0.402,0.103,0.581s0.166,0.335,0.293,0.469s0.278,0.239,0.454,0.317s0.368,0.117,0.576,0.117\r
+        c0.215,0,0.432-0.023,0.649-0.068s0.415-0.094,0.591-0.146c0.208-0.065,0.407-0.14,0.596-0.225V13.592z"/>\r
+</g>\r
+</svg>\r
diff --git a/LCARStrek/global/reader/RM-Type-Controls-Arrow.svg b/LCARStrek/global/reader/RM-Type-Controls-Arrow.svg
new file mode 100644 (file)
index 0000000..9094d8a
--- /dev/null
@@ -0,0 +1,42 @@
+<?xml version="1.0" encoding="utf-8"?>\r
+<svg version="1.1" id="Icons" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"\r
+     viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve">\r
+<polygon opacity="0.15" fill-rule="evenodd" clip-rule="evenodd" points="16.583,0.015 16.569,0 4.583,12 16.569,24 16.583,23.985\r
+    "/>\r
+<g enable-background="new    ">\r
+    <g>\r
+        <defs>\r
+            <rect id="SVGID_2_" x="-125" y="-1086.667" width="22" height="34"/>\r
+        </defs>\r
+        <clipPath id="SVGID_1_">\r
+            <use xlink:href="#SVGID_2_"  overflow="visible"/>\r
+        </clipPath>\r
+        <g clip-path="url(#SVGID_1_)">\r
+            <defs>\r
+                <rect id="SVGID_6_" x="-221" y="-1491.667" width="1080" height="2896"/>\r
+            </defs>\r
+            <clipPath id="SVGID_3_">\r
+                <use xlink:href="#SVGID_6_"  overflow="visible"/>\r
+            </clipPath>\r
+        </g>\r
+        <g clip-path="url(#SVGID_1_)">\r
+            <defs>\r
+                <rect id="SVGID_10_" x="-221" y="-1491.667" width="1080" height="2896"/>\r
+            </defs>\r
+            <clipPath id="SVGID_5_">\r
+                <use xlink:href="#SVGID_10_"  overflow="visible"/>\r
+            </clipPath>\r
+        </g>\r
+        <g clip-path="url(#SVGID_1_)">\r
+            <defs>\r
+                <rect id="SVGID_16_" x="-221" y="-1491.667" width="1080" height="2896"/>\r
+            </defs>\r
+            <clipPath id="SVGID_7_">\r
+                <use xlink:href="#SVGID_16_"  overflow="visible"/>\r
+            </clipPath>\r
+        </g>\r
+    </g>\r
+</g>\r
+<polygon fill-rule="evenodd" clip-rule="evenodd" fill="#FBFBFB" points="16.575,1.021 16.561,1.008 5.583,12 16.577,23.008\r
+    16.591,22.994 "/>\r
+</svg>\r