diff --git a/css/style.scss b/css/style.scss index b767dfe8521..7c53de7fe5c 100644 --- a/css/style.scss +++ b/css/style.scss @@ -802,32 +802,40 @@ video { /* START: move padding fixes and icons-for-tabs capability into core */ .tabHeaders { + display: flex; margin-top: 0; + margin-bottom: 10px; + min-height: 44px; } .tabHeaders .tabHeader { + flex-basis: 50%; + flex-grow: 0; padding: 12px; - padding-left: 32px; - background-position: 12px; - background-repeat: no-repeat; - opacity: .5; -} - -.tabHeaders .tabHeader a { - color: $color-main-text; + text-align: center; + border-bottom: 1px solid $color-border; + margin-bottom: 0; + + a { + padding-left: 32px; + background-position: 12px; + background-repeat: no-repeat; + color: $color-main-text; + opacity: .5; + } } -.tabHeaders .tabHeader.selected, -.tabHeaders .tabHeader:hover, -.tabHeaders .tabHeader:focus { +.tabHeaders .tabHeader.selected a, +.tabHeaders .tabHeader:hover a, +.tabHeaders .tabHeader:focus a { opacity: 1; } -#tabHeaderChat { +#tabHeaderChat a { background-image: url('../../../core/img/actions/comment.svg?v=1'); } -#tabHeaderParticipants { +#tabHeaderParticipants a { background-image: url('../../../core/img/places/contacts-dark.svg?v=1'); } /* END: move padding fixes and icons-for-tabs capability into core */