ui: auto compact scoreboard

packages/ui-default/pages/contest.page.styl

@@ -154,44 +154,6 @@ $highlight-button-color = #F6DF45
     .col--lang
       border-right: 1px solid $table-border-color
 
-
-.page--contest_scoreboard
-  .main
-    .row
-      max-width: 100vw !important;
-
-  .col--rank
-    width: rem(60px)
-    text-align: center
-    border-right: 1px solid $table-border-color
-
-  .col--user
-    min-width: rem(150px)
-
-  .col--solved, .col--time
-    width: rem(70px)
-    text-align: center
-
-  .col--total_score
-    width: rem(100px)
-    text-align: center
-
-  .col--problem
-    width: rem(100px)
-    border-left: 1px solid $table-border-color
-    text-align: center
-
-  .scoreboard--acm
-    .col--problem
-      width: rem(70px) !important
-
-  +mobile()
-    .col--user
-      width: auto
-
-    .col--problem
-      display: none
-
 .page--contest_user
   .col--uid
     width: rem(100px)

packages/ui-default/pages/scoreboard.page.styl

@@ -1,4 +1,4 @@
-.page--homework_scoreboard
+.page--contest_scoreboard,.page--homework_scoreboard
   .main
     .row
       max-width: 100vw !important;
@@ -11,7 +11,14 @@
   .col--user
     min-width: rem(150px)
 
-  .col--total_score, .col--time
+    &.compact
+      width: rem(150px) !important
+
+  .col--solved, .col--time
+    width: rem(70px)
+    text-align: center
+
+  .col--total_score
     width: rem(100px)
     text-align: center
 
@@ -20,6 +27,13 @@
     border-left: 1px solid $table-border-color
     text-align: center
 
+  .scoreboard--acm, .scoreboard--compact
+    .col--problem
+      width: rem(70px) !important
+
   +mobile()
+    .col--user
+      width: auto
+
     .col--problem, .col--record
-      display: none
+      display: none

packages/ui-default/pages/scoreboard.page.ts

@@ -1,7 +1,16 @@
 import $ from 'jquery';
 import { NamedPage } from 'vj/misc/Page';
 
-const page = new NamedPage('contest_scoreboard', () => {
+function compactScoreboard(tdoc) {
+  if (!$('.scoreboard--compact,.scoreboard--acm').length && $('.data-table').width() > window.innerWidth) {
+    $(`.scoreboard--${tdoc.rule}`).addClass('scoreboard--compact');
+  }
+  if (!$('th.col--user').width()) {
+    $('.col--user').addClass('compact');
+  }
+}
+
+const page = new NamedPage(['contest_scoreboard', 'homework_scoreboard'], () => {
   const { tdoc } = UiContext;
   const key = `scoreboard-star/${tdoc.domainId}/${tdoc.docId}`;
   const read = () => JSON.parse(localStorage.getItem(key) || '[]');
@@ -34,6 +43,9 @@ const page = new NamedPage('contest_scoreboard', () => {
       $('.rank--unrank').closest('tr').hide();
     }
   });
+
+  compactScoreboard(tdoc);
+  $(window).on('resize', () => compactScoreboard(tdoc));
 });
 
 export default page;