X-Git-Url: https://git-public.kairo.at/?a=blobdiff_plain;f=LCARStrek%2Fglobal%2FaboutReaderControls.css;h=f70b0a06e4591b218093f72e5313cf93d6c1de45;hb=64960b56683c0846f4eb0117fa3dfa531ace0929;hp=7ed447494e62413cb9a9827b160953d9995601da;hpb=7729765cff651b4f095a18d7b76fa5b112150216;p=themes.git

diff --git a/LCARStrek/global/aboutReaderControls.css b/LCARStrek/global/aboutReaderControls.css
index 7ed44749..f70b0a06 100644
--- a/LCARStrek/global/aboutReaderControls.css
+++ b/LCARStrek/global/aboutReaderControls.css
@@ -82,6 +82,7 @@
   background-color: #fbfbfb;
   -moz-user-select: none;
   border-right: 1px solid #b5b5b5;
+  z-index: 1;
 }
 
 .button {
@@ -162,7 +163,9 @@
 
 #font-type-buttons,
 #font-size-buttons,
-#color-scheme-buttons {
+#color-scheme-buttons,
+#content-width-buttons,
+#line-height-buttons {
   display: flex;
   flex-direction: row;
 }
@@ -182,13 +185,17 @@
 
 #font-type-buttons > button,
 #font-size-buttons > button,
-#color-scheme-buttons > button {
+#color-scheme-buttons > button,
+#content-width-buttons > button,
+#line-height-buttons > button {
   text-align: center;
   border: 0;
 }
 
 #font-type-buttons > button,
-#font-size-buttons > button {
+#font-size-buttons > button,
+#content-width-buttons > button,
+#line-height-buttons > button {
   width: 50%;
   background-color: transparent;
   border-left: 1px solid #B5B5B5;
@@ -206,7 +213,9 @@
 }
 
 #font-type-buttons > button:first-child,
-#font-size-buttons > button:first-child {
+#font-size-buttons > button:first-child,
+#content-width-buttons > button:first-child,
+#line-height-buttons > button:first-child {
   border-left: 0;
 }
 
@@ -217,7 +226,9 @@
 }
 
 #font-size-buttons > button,
-#color-scheme-buttons > button {
+#color-scheme-buttons > button,
+#content-width-buttons > button,
+#line-height-buttons > button {
   height: 60px;
 }
 
@@ -241,19 +252,6 @@
 }
 
 /* Font sizes are different per-platform, so we need custom CSS to line them up. */
-%ifdef XP_MACOSX
-#font-type-buttons > .sans-serif-button > .name {
-  margin-top: 10px;
-}
-
-#font-type-buttons > .sans-serif-button > .description {
-  margin-top: -4px;
-}
-
-#font-type-buttons > .serif-button > .name {
-  font-size: 63px;
-}
-%elifdef XP_WIN
 #font-type-buttons > .sans-serif-button > .name {
   margin-top: 2px;
 }
@@ -265,30 +263,23 @@
 #font-type-buttons > .serif-button > .name {
   font-size: 63px;
 }
-%else
-#font-type-buttons > .sans-serif-button > .name {
-  margin-top: 5px;
-}
-
-#font-type-buttons > .sans-serif-button > .description {
-  margin-top: -8px;
-}
-
-#font-type-buttons > .serif-button > .name {
-  font-size: 70px;
-}
-%endif
 
 .button:hover,
 #font-size-buttons > button:hover,
-#font-type-buttons > button:hover {
+#font-type-buttons > button:hover,
+#content-width-buttons > button:hover,
+#line-height-buttons > button:hover {
   background-color: #ebebeb;
 }
 
 .dropdown.open,
 .button:active,
 #font-size-buttons > button:active,
-#font-size-buttons > button.selected {
+#font-size-buttons > button.selected,
+#content-width-buttons > button:active,
+#content-width-buttons > button.selected,
+#line-height-buttons > button:active,
+#line-height-buttons > button.selected {
   background-color: #dadada;
 }
 
@@ -298,7 +289,11 @@
 }
 
 .minus-button,
-.plus-button {
+.plus-button,
+.content-width-minus-button,
+.content-width-plus-button,
+.line-height-minus-button,
+.line-height-plus-button {
   background-color: transparent;
   border: 0;
   background-size: 18px 18px;
@@ -340,6 +335,26 @@
   background-image: url("chrome://global/skin/reader/RM-Plus-24x24.svg");
 }
 
+.content-width-minus-button {
+  background-size: 42px 16px;
+  background-image: url("chrome://global/skin/reader/RM-Content-Width-Minus-42x16.svg");
+}
+
+.content-width-plus-button {
+  background-size: 44px 16px;
+  background-image: url("chrome://global/skin/reader/RM-Content-Width-Plus-44x16.svg");
+}
+
+.line-height-minus-button {
+  background-size: 34px 14px;
+  background-image: url("chrome://global/skin/reader/RM-Line-Height-Minus-38x14.svg");
+}
+
+.line-height-plus-button {
+  background-size: 34px 24px;
+  background-image: url("chrome://global/skin/reader/RM-Line-Height-Plus-38x24.svg");
+}
+
 @media print {
   .toolbar {
     display: none !important;