[openmeetings] branch master updated: [OPENMEETINGS-2709] room sidebar tab text should look better

[solomax]

This is an automated email from the ASF dual-hosted git repository.

solomax pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/openmeetings.git


The following commit(s) were added to refs/heads/master by this push:
     new b54676a  [OPENMEETINGS-2709] room sidebar tab text should look better
b54676a is described below

commit b54676ae50f5273ebe682fce4452fea1dd80ee80
Author: Maxim Solodovnik <solomax...@gmail.com>
AuthorDate: Mon Nov 22 12:33:58 2021 +0700

    [OPENMEETINGS-2709] room sidebar tab text should look better
---
 openmeetings-web/src/main/webapp/css/raw-room.css | 42 +++++++++++++----------
 1 file changed, 23 insertions(+), 19 deletions(-)

diff --git a/openmeetings-web/src/main/webapp/css/raw-room.css 
b/openmeetings-web/src/main/webapp/css/raw-room.css
index f8c8932..8e44a4a 100644
--- a/openmeetings-web/src/main/webapp/css/raw-room.css
+++ b/openmeetings-web/src/main/webapp/css/raw-room.css
@@ -34,13 +34,36 @@
 .room-block .sb-wb .sidebar #room-sidebar-tabs {
        height: calc(100% - var(--activities-height));
 }
+.room-block .sb-wb .sidebar #room-sidebar-tabs .nav.nav-tabs {
+       flex-wrap: nowrap;
+       padding-inline-end: 40px;
+       gap: 5px;
+}
+.room-block .sb-wb .sidebar #room-sidebar-tabs .nav.nav-tabs .nav-item {
+       flex-direction: column;
+       flex-grow: 1;
+}
 .room-block .sb-wb .sidebar .tab {
        padding: 5px 0 0 0;
+       width: 100%;
+       overflow: hidden;
 }
 .room-block .sb-wb .sidebar .tab i {
        font-size: 2.0em;
        vertical-align: top;
 }
+.room-block .sb-wb .sidebar .tab .label {
+       width: calc((var(--sidebar-width) - 50px) / 2 - 40px);
+       display: inline-block;
+       overflow: hidden;
+       text-overflow: ellipsis;
+}
+.room-block .sb-wb .sidebar .tab.user {
+       padding-inline-end: 15px;
+}
+.room-block .sb-wb .sidebar .tab.user .label {
+       width: calc((var(--sidebar-width) - 50px) / 2 - 60px);
+}
 html[dir="rtl"] .room-block .sb-wb .sidebar {
        right: 0;
        left: auto;
@@ -364,10 +387,7 @@ html[dir="rtl"] .room-block .sb-wb .sidebar {
 }
 .room-block .sb-wb .sidebar .tab.om-icon.big {
        line-height: 30px;
-       width: auto;
        padding-left: 10px;
-       min-width: 100px;
-       max-width: 120px;
        position: relative;
 }
 .room-block .sb-wb .sidebar .tab .badge {
@@ -375,23 +395,10 @@ html[dir="rtl"] .room-block .sb-wb .sidebar {
        bottom: 0;
        right: 2px;
 }
-.room-block .sb-wb .sidebar .tab.om-icon.big .label {
-       max-width: 60px;
-       display: inline-block;
-       text-overflow: ellipsis;
-       overflow: hidden;
-       white-space: nowrap;
-}
 .room-block.narrow .sidebar .tab.om-icon.big {
-       max-width: 40px;
-       min-width: auto;
-       width: 40px;
        padding-left: 6px;
        padding-right: 0;
 }
-.room-block.narrow .sidebar .tab.om-icon.big .label {
-       display: none;
-}
 .room-block .wait-moder {
        position: fixed;
        bottom: 30px;
@@ -775,9 +782,6 @@ html[dir="rtl"] .room-block .sb-wb .sidebar {
        .room-block .sb-wb .sidebar .tab.om-icon.big {
                padding-right: 0;
        }
-       .room-block.big .sb-wb .sidebar .tab.om-icon.big {
-               max-width: 80px;
-       }
        .room-block .sb-wb .sidebar .user-list .user.name {
                display: none;
        }