X-Git-Url: https://git-public.kairo.at/?a=blobdiff_plain;f=style%2Flantea.css;h=832b5bf06d8459ae354aaec0e523ded1d4b6c19c;hb=4565aed86972b40bcd65e55453bb16afc628db55;hp=975fe4cd19e1e527a68a2b414f304d4112d28f95;hpb=6d5072d8c56d9dbcbcdf3c54c28ab94b7246d64f;p=lantea.git

diff --git a/style/lantea.css b/style/lantea.css
index 975fe4c..832b5bf 100644
--- a/style/lantea.css
+++ b/style/lantea.css
@@ -74,6 +74,8 @@ h1 {
   background-image: radial-gradient(circle 1.5em, #FFFFFF, transparent);
   color: #0000FF;
   border: none;
+  padding: 0;
+  margin: 0;
 }
 
 #zoomArea > input[type="button"] {
@@ -141,10 +143,19 @@ h1 {
   display: block;
 }
 
+/* non-standard touch screen detection for Mozilla browsers */
 .overlayArea:-moz-system-metric(touch-enabled),
 .menuDrawer:-moz-system-metric(touch-enabled) {
+  font-size: 3mm;
   font-size: 3mozmm;
 }
+/* Standard, Media Queries Level 4 touch screen detection */
+@media (pointer:coarse) {
+  .overlayArea,
+  .menuDrawer {
+    font-size: 16px;
+  }
+}
 
 .overlayArea input[type="button"],
 .overlayArea button,
@@ -181,7 +192,7 @@ h1 {
 
 @media screen and (max-width: 330px) {
   .menuDrawer {
-    left: calc(-300px - 1ch); /* account for padding */
+    transform: translateX(calc(-300px - 1ch)); /* account for padding */
     width: 300px;
   }
 }
@@ -217,11 +228,6 @@ h1 {
   font-size: .75em;
 }
 
-.dialogTitle {
-  margin: 0 0 .5em;
-  font-weight: bold;
-}
-
 .dialogHelp {
   margin: .5em 0;
   font-size: .8em;
@@ -413,12 +419,34 @@ h1 {
   color: #FFFFFF;
 }
 
-/* dialog area - only used for loading error */
+.overlayArea .minorbutton {
+  font-size: 75%;
+  border: none !important;
+  padding: 0 2px;
+}
+.overlayArea .minorbutton:not(:disabled):active {
+  padding: 0 1px 0 3px;
+}
+.overlayArea .statusmsg {
+  font-size: 75%;
+}
+.overlayArea .statusmsg.error {
+  color: #FF8080;
+}
+
+#loginerror {
+  color: red;
+  font-weight: bold;
+  padding: .5em;
+}
+
+/* dialog area - for loading error and welcome messages */
 #dialogArea {
+  position: absolute;
   top: 20%;
   right: 0;
   left: 0;
-  width: 30ch;
+  width: 50ch;
   max-width: 92%;
   z-index: 10;
   background-color: rgba(255, 255, 255, .8);
@@ -429,10 +457,19 @@ h1 {
 }
 
 #dialogArea.hidden {
-  top: -100%;
+  top: -1000%;
   display: block;
 }
 
+.dialogTitle {
+  margin: 0 0 .5em;
+  font-weight: bold;
+}
+
+.dialogButtonLine {
+  text-align: center;
+}
+
 /* full screen overlay - library, etc. */
 .fullScreenOverlay {
   position: absolute;
@@ -449,7 +486,7 @@ h1 {
 }
 
 .fullScreenOverlay.hidden {
-  top: -100%;
+  top: -1000%;
   bottom: auto;
   height: 90%;
   display: block;
@@ -469,6 +506,26 @@ h1 {
 }
 */
 
+.fullScreenOverlay p {
+  margin: 0.5em 0;
+}
+
+.fullScreenOverlay > p:first-child {
+  margin-top: 0;
+  /* leave space for close button */
+  margin-right: 1.5em;
+}
+
+#libTrackList {
+  overflow: auto;
+  /* 2em is top/bottom margin, and one line is shown above and below, with .5em margin each */
+  height: calc(100% - 5em);
+}
+
+#libTrackPages {
+  margin-bottom: 0;
+}
+
 /* small screen media adaptations */
 @media screen and (max-width: 500px),
        screen and (max-height: 500px) {