@mideind/netskrafl-react 3.4.3 → 3.4.4

package/dist/esm/css/netskrafl.css

@@ -2690,7 +2690,7 @@ div.netskrafl-tile.dragging div.letterscore {
     top: 0;
     padding-top: 34px;
     left: 0;
-    height: 464px;
+    height: 474px;
     width: 100%;
     font-size: 16px;
     line-height: 16px;
@@ -3822,12 +3822,13 @@ div.netskrafl-tile.dragging div.letterscore {
     top: 0;
     left: 0;
     width: 100%;
+    /* Total height: 474px */
     height: 450px;
+    padding-top: 12px;
+    padding-bottom: 12px;
     background-color: var(--tab-games-background);
     overflow: auto;
     z-index: 2;
-    padding-top: 12px;
-    padding-bottom: 12px;
     border-radius: 4px 4px 0 0;
 }
 
@@ -4307,7 +4308,7 @@ div.highlight1.netskrafl-blanktile {
     top: 0px;
     left: 0px;
     width: 100%;
-    height: 466px;
+    height: 474px;
     background-color: var(--chat-background);
     z-index: 1;
     border-radius: 4px 4px 0 0;
@@ -6546,9 +6547,14 @@ div.netskrafl-container input[type="checkbox"] {
    ========================================================================== */
 
 @media all and (min-width: 667px) and (max-width: 1023px) and (
-        orientation: landscape
-    ) {
-    /* Mobile screen, landscape mode (width >= 667px AND landscape orientation) */
+        max-height: 667px
+    ) and (orientation: landscape) {
+    /* Mobile screens in landscape (width 667–1023px, max-height 667px, landscape orientation) */
+    .netskrafl-container .ui-helper-reset {
+        /* Controls the height of the tab row; 50px is too tall for limited
+           vertical space in landscape */
+        line-height: 40px;
+    }
     div.netskrafl-container {
         container-type: inline-size;
     }
@@ -6621,8 +6627,10 @@ div.netskrafl-container input[type="checkbox"] {
         top: 8px;
         padding-top: 1px;
         background-color: transparent;
-        transform: scale(0.92);
-        transform: scale(clamp(0.92, calc((100dvh - 16px) / 408px), 1));
+        /* 0.88 is the scale required on an iPhone SE to fit the board
+           vertically */
+        transform: scale(0.88);
+        transform: scale(clamp(0.88, calc((100dvh - 16px) / 408px), 1));
         transform-origin: right top;
     }
     .netskrafl-container div.rightcol {
@@ -6743,15 +6751,29 @@ div.netskrafl-container input[type="checkbox"] {
         left: 90px;
     }
     .netskrafl-container div#own-stats {
-        height: 16px;
+        height: 32px;
+        margin-top: 6px;
+        margin-bottom: 6px;
+    }
+    .netskrafl-container div.stats-fig {
+        margin-top: 0;
+        height: 22px;
+        line-height: 22px;
     }
     .netskrafl-container p#own-best {
         left: auto;
         right: 6px;
         top: 0px;
         text-align: right;
-        font-size: 0.85em;
-        line-height: 1.4em;
+        font-size: 13px;
+        line-height: 17px;
+        margin-top: 8px;
+    }
+    .netskrafl-container div#own-toggler {
+        top: -2px;
+    }
+    .netskrafl-container div.toggler span.glyphicon {
+        top: 2px;
     }
     .netskrafl-container div #chall-sent,
     .netskrafl-container div #chall-received {
@@ -6785,29 +6807,41 @@ div.netskrafl-container input[type="checkbox"] {
     }
     .netskrafl-container div#tabs > div[role="tabpanel"],
     .netskrafl-container div#main-tabs > div[role="tabpanel"] {
-        height: calc(100vh - 152px);
-        height: calc(100dvh - 152px);
-        max-height: 326px;
+        height: calc(100vh - 142px);
+        height: calc(100dvh - 142px);
+        max-height: 336px;
+    }
+    .netskrafl-container div#initials {
+        margin-top: 6px;
+        margin-bottom: 6px;
+        height: 32px;
+    }
+    .netskrafl-container div.user-cat#user-headings {
+        line-height: 28px;
     }
     .netskrafl-container div #userlist,
     .netskrafl-container div #elolist {
-        height: calc(100vh - 204px);
-        height: calc(100dvh - 204px);
-        max-height: 396px;
+        height: calc(100vh - 180px);
+        height: calc(100dvh - 180px);
+        max-height: 420px;
     }
     .netskrafl-container div #gamelist {
-        height: calc(100vh - 150px);
-        height: calc(100dvh - 150px);
-        max-height: 468px;
+        height: calc(100vh - 136px);
+        height: calc(100dvh - 136px);
+        max-height: 482px;
     }
     .netskrafl-container div #recentlist,
     .netskrafl-container div #usr-recent {
-        height: calc(100vh - 204px);
-        height: calc(100dvh - 204px);
-        max-height: 396px;
+        height: calc(100vh - 180px);
+        height: calc(100dvh - 180px);
+        max-height: 420px;
+    }
+    .netskrafl-container span#numgames,
+    .netskrafl-container span#numchallenges {
+        margin-top: 12px;
     }
     .netskrafl-container div#elo-toggler {
-        top: 6px;
+        top: 2px;
     }
     .netskrafl-container div#tabs-1 span.list-ts-short,
     .netskrafl-container div#tabs-1 span.list-manual,