diff --git a/client/css/style.css b/client/css/style.css index ae1fc124..9a4c1f36 100644 --- a/client/css/style.css +++ b/client/css/style.css @@ -475,7 +475,7 @@ kbd { } #sidebar .networks { - padding: 20px 30px 0; + padding-top: 20px; touch-action: pan-y; } @@ -498,17 +498,9 @@ kbd { #sidebar .chan, #sidebar .chan-placeholder { display: block; - margin: 1px -10px; - padding: 6px 10px 8px 36px; - position: relative; - text-align: left; + padding: 8px 25px; transition: color 0.2s; - width: 180px; - left: auto !important; /* Fix for drag'n'drop not recalculating left position */ -} - -#sidebar .chan-placeholder { - padding-bottom: 10px; + width: 100%; } #sidebar .chan:first-child { @@ -524,16 +516,12 @@ kbd { #sidebar .chan::before, #chat .title::before { - float: left; - margin-top: 3px; margin-right: 12px; - text-align: center; } #sidebar .chan::before { - position: absolute; - top: 4px; - left: 10px; + float: left; + line-height: 18px; } #chat .title::before { @@ -559,19 +547,27 @@ kbd { content: " "; } +#sidebar .badge, +#sidebar .close { + float: right; + margin-left: 5px; + margin-right: -5px; +} + #sidebar .badge { background: rgba(255, 255, 255, 0.06); border-radius: 3px; color: #afb6c0; font-size: 10px; margin-top: 1px; - margin-right: -5px; - margin-left: 5px; padding: 3px 6px; - float: right; transition: opacity 0.2s, background-color 0.2s, color 0.2s; } +#sidebar .badge:empty { + display: none; +} + #sidebar .badge.highlight { background: #fff; color: #49505a; @@ -584,22 +580,18 @@ kbd { #sidebar .close { border-radius: 3px; - margin-right: 5px; + width: 18px; + height: 18px; visibility: hidden; opacity: 0; - position: absolute; - z-index: 2; - right: 0; transition: opacity 0.2s, background-color 0.2s; } #sidebar .close::before { - font-size: 18px; + font-size: 20px; font-weight: normal; display: inline-block; - line-height: 18px; - width: 18px; - height: 18px; + line-height: 16px; text-align: center; content: "×"; color: #fff;