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,
@media screen and (max-width: 330px) {
.menuDrawer {
- left: calc(-300px - 1ch); /* account for padding */
+ transform: translateX(calc(-300px - 1ch)); /* account for padding */
width: 300px;
}
}
font-size: .75em;
}
-.dialogTitle {
- margin: 0 0 .5em;
- font-weight: bold;
-}
-
.dialogHelp {
margin: .5em 0;
font-size: .8em;
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);
}
#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;