diff --git a/resources/base.scss b/resources/base.scss index 30b104a..3ec3602 100644 --- a/resources/base.scss +++ b/resources/base.scss @@ -182,6 +182,9 @@ header { cursor: pointer; padding: 3.5px; } + img { + border-radius: 50%; + } } #nav-shadow { @@ -229,6 +232,12 @@ nav { text-transform: uppercase; position: relative; + &.home-nav-element { + display: flex; + align-items: center; + margin-right: 1em; + } + &.home-nav-element a { padding: 0; height: 44px; @@ -533,7 +542,11 @@ math { @media (max-width: 799px) { #navigation { - height: 36px; + height: $navbar_height_mobile; + } + + #content { + margin-top: $navbar_height_mobile; } #navicon { @@ -631,11 +644,11 @@ math { } #chat-icon { - color: $theme_color; + color: darkgreen; } #chat-icon:hover { - color: green; + color: $theme_color; } #nav-lang-icon { diff --git a/resources/chatbox.scss b/resources/chatbox.scss index 89fef60..3f1a47b 100644 --- a/resources/chatbox.scss +++ b/resources/chatbox.scss @@ -52,11 +52,15 @@ border-bottom-left-radius: 0; border-bottom-right-radius: 0; flex-grow: 1; + padding-left: 0.5em; } #chat-input { color: black; - border: 2px solid #e4a81c; + border: 2px solid black; +} +#chat-input::placeholder { + color: grey; } #chat-online-content { padding: 0; @@ -74,14 +78,14 @@ #chat-container { display: flex; width: 100%; - height: calc(100vh - 3em); + height: calc(100vh - $navbar_height); border: 1px solid #ccc; /*border-radius: 0 4px 0 0;*/ border-bottom: 0; } #chat-online { margin: 0; - width: 35%; + width: 30%; } #chat-area { flex-grow: 1; @@ -91,12 +95,12 @@ font-family: "Noto Sans", Arial, "Lucida Grande", sans-serif; } .info-pic { - height: 100%; + height: 95%; } .info-name { margin-left: 10px; - font-size: 2em; + font-size: 1.8em; font-weight: bold !important; display: flex; align-items: center; @@ -111,21 +115,6 @@ position: relative; z-index: 100; } -#refresh-button { - padding: 0; - margin-left: auto; - margin-right: 0.3em; - background: transparent; - border: none; - height: 1.5em; - width: 1.5em; -} -#refresh-button:hover { - background: lightgreen; - -webkit-transform: rotate(360deg); - transform: rotate(360deg); - transition: 1.5s ease-in-out; -} .status-pic { height: 32px; width: 32px; @@ -135,6 +124,7 @@ position: relative; display: inline-flex; flex: 0 0 auto; + align-items: center; } .status-circle { position: absolute; @@ -166,11 +156,11 @@ } .message-text { padding: 0.4em 0.6em 0.5em; - border-radius: 15px; + border-radius: 20px; max-width: 70%; width: fit-content; - font-size: 1.05rem; - line-height: 1.3; + font-size: 1rem; + line-height: 1.2; } .message-text-other { background: #eeeeee; @@ -181,10 +171,11 @@ color: white; } .chat-input-icon { - color: $theme_color; + color: white; + background-color: #3c8262; } .chat-input-icon:hover { - background: lightgray; + background: #57b28b; } .chat { .active-span { @@ -193,12 +184,16 @@ } .unread-count { - float: right; color: white; background-color: darkcyan; - border-radius: 2px; - padding: 0 0.5em; - align-self: flex-end; + border-radius: 50%; + align-self: center; + flex: 0 0 1.25rem; + height: 1.25rem; + font-size: smaller; + display: flex; + align-items: center; + justify-content: center; } #setting-content { display: none; @@ -224,6 +219,7 @@ @media (max-width: 799px) { #chat-area { - height: calc(100vh - 120px); + height: calc(100vh - $navbar_height_mobile); + max-height: -webkit-fill-available; } } diff --git a/resources/common.js b/resources/common.js index 65fb8b3..d34e259 100644 --- a/resources/common.js +++ b/resources/common.js @@ -386,6 +386,11 @@ function onWindowReady() { }); }); $('a').click(function() { + var href = $(this).attr('href'); + if (href === '#' || href.startsWith("javascript")) { + return; + } + $("#loading-bar").show(); $("#loading-bar").animate({ width: "100%" }, 2000, function() { $(this).hide().css({ width: 0}); diff --git a/resources/contest.scss b/resources/contest.scss index 2bc2ab1..cfdd478 100644 --- a/resources/contest.scss +++ b/resources/contest.scss @@ -1,7 +1,7 @@ @import "vars"; .list-contest { - box-shadow: 0px 4px 8px rgba(4, 83, 67, 0.2), 0px 6px 20px rgba(4, 83, 67, 0.19); + box-shadow: 0px 1px 2px lightgrey, 0px 1px 5px lightgrey; border-radius: 15px; padding: 20px; margin-bottom: 20px; diff --git a/resources/darkmode.css b/resources/darkmode.css index 36a4304..4947452 100644 --- a/resources/darkmode.css +++ b/resources/darkmode.css @@ -1712,10 +1712,10 @@ noscript #noscript { color: rgb(178, 171, 161); } #chat-icon { - color: rgb(249, 146, 97); + color: rgb(200, 196, 189); } #chat-icon:hover { - color: rgb(114, 255, 114); + color: rgb(249, 146, 97); } #nav-lang-icon { color: rgb(51, 125, 255); @@ -2922,8 +2922,8 @@ a.voted { color: rgb(152, 143, 129); } .list-contest { - box-shadow: rgba(3, 66, 54, 0.2) 0px 4px 8px, - rgba(3, 66, 54, 0.19) 0px 6px 20px; + box-shadow: rgb(49, 53, 55) 0px 1px 2px, + rgb(49, 53, 55) 0px 1px 5px; } #contest-calendar th { border-bottom-color: rgb(62, 68, 70); @@ -3058,7 +3058,13 @@ a.voted { } #chat-input { color: rgb(232, 230, 227); - border-color: rgb(159, 117, 19); + border-color: rgb(140, 130, 115); +} +#chat-input::-webkit-input-placeholder { + color: rgb(152, 143, 129); +} +#chat-input::placeholder { + color: rgb(152, 143, 129); } .selected-status-row { background-color: rgb(49, 53, 55); @@ -3077,15 +3083,6 @@ a.voted { #chat-info { box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 3px; } -#refresh-button { - background-image: initial; - background-color: transparent; - border-color: initial; -} -#refresh-button:hover { - background-image: initial; - background-color: rgb(40, 111, 17); -} .status-circle { stroke: rgb(232, 230, 227); } @@ -3104,11 +3101,12 @@ a.voted { color: rgb(232, 230, 227); } .chat-input-icon { - color: rgb(249, 146, 97); + color: rgb(232, 230, 227); + background-color: rgb(48, 104, 78); } .chat-input-icon:hover { background-image: initial; - background-color: rgb(49, 53, 55); + background-color: rgb(62, 136, 112); } .chat .active-span { color: rgb(169, 162, 151); @@ -3873,64 +3871,11 @@ mjx-assistive-mml { mjx-stretchy-v > mjx-ext { border-color: transparent; } -.noUi-target, -.noUi-target * { - -webkit-tap-highlight-color: transparent; +.recently-attempted ul { + list-style-image: initial; } -.noUi-target { - background-image: initial; - background-color: rgb(27, 29, 30); - border-color: rgb(60, 65, 68); - box-shadow: rgb(32, 35, 37) 0px 1px 1px inset, - rgb(62, 68, 70) 0px 3px 6px -5px; -} -.noUi-connect { - background-image: initial; - background-color: rgb(50, 147, 140); - box-shadow: rgba(38, 42, 43, 0.45) 0px 0px 3px inset; -} -.noUi-handle { - border-color: rgb(59, 64, 66); - background-image: initial; - background-color: rgb(24, 26, 27); - box-shadow: rgb(24, 26, 27) 0px 0px 1px inset, - rgb(35, 38, 40) 0px 1px 7px inset, - rgb(62, 68, 70) 0px 3px 6px -3px; -} -.noUi-active { - box-shadow: rgb(24, 26, 27) 0px 0px 1px inset, - rgb(43, 47, 49) 0px 1px 7px inset, - rgb(62, 68, 70) 0px 3px 6px -3px; -} -.noUi-handle::after, -.noUi-handle::before { - background-image: initial; - background-color: rgb(38, 41, 42); -} -[disabled] .noUi-connect { - background-image: initial; - background-color: rgb(64, 69, 72); -} -.noUi-pips { - color: rgb(168, 160, 149); -} -.noUi-value-sub { - color: rgb(200, 195, 188); -} -.noUi-marker { - background-image: initial; - background-color: rgb(53, 57, 59); -} -.noUi-marker-large, -.noUi-marker-sub { - background-image: initial; - background-color: rgb(72, 78, 81); -} -.noUi-tooltip { - border-color: rgb(59, 64, 66); - background-image: initial; - background-color: rgb(24, 26, 27); - color: rgb(232, 230, 227); +.organization-row:last-child { + border-bottom-color: initial; } /* Override Style */ diff --git a/resources/vars.scss b/resources/vars.scss index ba1c0bf..70c30a6 100644 --- a/resources/vars.scss +++ b/resources/vars.scss @@ -12,3 +12,4 @@ $table_header_rounding: 6px; $monospace-fonts: Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace; $navbar_height: 50px; +$navbar_height_mobile: 36px; diff --git a/templates/base.html b/templates/base.html index 2140eb6..e595387 100644 --- a/templates/base.html +++ b/templates/base.html @@ -213,7 +213,7 @@ - - {{user.unread_count if user.unread_count}} - + {% if user.unread_count and user.unread_count > 0 %} + + {{user.unread_count}} + + {% endif %} {% endfor %} diff --git a/templates/chat/user_online_status.html b/templates/chat/user_online_status.html index 51ffa38..370d261 100644 --- a/templates/chat/user_online_status.html +++ b/templates/chat/user_online_status.html @@ -1,11 +1,18 @@ +
+ +
{% if other_user %} -
+
+{% else %} +
+ +
{% endif %} {% if other_user %} @@ -21,9 +28,9 @@ {% if other_user %} - +
  • diff --git a/templates/comments/list.html b/templates/comments/list.html index d561210..fc0df78 100644 --- a/templates/comments/list.html +++ b/templates/comments/list.html @@ -3,7 +3,7 @@

    {{ _('Comments') }} {% if can_comment %} - {{ _('Write comment') }} + {{ _('Write comment') }} {% endif %}

    {% if can_comment %} diff --git a/templates/comments/media-js.html b/templates/comments/media-js.html index ccae804..608385c 100644 --- a/templates/comments/media-js.html +++ b/templates/comments/media-js.html @@ -186,6 +186,7 @@ var $comment = $("#comment-" + id + "-children"); $comment.append(data); } + MathJax.typeset($('#comments')[0]); } }) }