themify group panel

This commit is contained in:
Audric Ackermann 2020-08-25 12:13:43 +10:00
parent 9cbf21547b
commit 031e19df63
No known key found for this signature in database
GPG Key ID: 999F434D76324AD4
3 changed files with 58 additions and 32 deletions

View File

@ -1587,15 +1587,10 @@
.module-media-gallery__tab {
width: 100%;
background-color: $color-light-02;
padding: 20px;
text-align: center;
}
.module-media-gallery__tab--active {
border-bottom: 2px solid $color-signal-blue;
}
.module-media-gallery__content {
display: flex;
flex-grow: 1;

View File

@ -346,7 +346,6 @@ textarea {
}
}
$session-separator-element-border: 1px solid $session-shade-6;
$session-element-border-green: 4px solid $session-color-green;
/* CONVERSATION AND MESSAGES */
@ -809,8 +808,17 @@ label {
height: 50px;
padding: 0px $session-margin-md;
font-size: $session-font-sm;
color: $session-color-white;
background-color: $session-shade-1;
@include themify($themes) {
color: themed('textColor');
background: themed('cellBackground');
}
&:hover {
@include themify($themes) {
background: themed('clickableHovered');
}
}
.session-icon {
opacity: 0.6;
@ -838,21 +846,29 @@ label {
justify-content: center;
height: 35px;
padding: 0 $session-margin-md;
color: $session-color-white;
background-color: $session-shade-1;
@include themify($themes) {
background: themed('cellBackground');
color: themed('textColor');
}
font-size: 0.8rem;
width: -webkit-fill-available;
transition: $session-transition-duration;
&:first-child {
border-top: $session-separator-element-border;
@include themify($themes) {
border-top: themed('borderActionPanel');
}
}
&:last-child {
border-bottom: $session-separator-element-border;
@include themify($themes) {
border-top: themed('borderActionPanel');
}
}
&:hover {
@include session-dark-background-hover;
@include themify($themes) {
background: themed('clickableHovered');
}
}
.session-icon {
@ -864,7 +880,9 @@ label {
&.active,
&:hover {
background-color: $session-shade-7;
@include themify($themes) {
background: themed('clickableHovered');
}
}
&.danger {
@ -873,6 +891,9 @@ label {
}
&:hover {
@include themify($themes) {
background: themed('clickableHovered');
}
.session-icon {
opacity: 1;
}
@ -1409,7 +1430,9 @@ input {
.dark-theme .invite-friends-dialog .member-item {
height: 64px;
background-color: $session-shade-4;
border: $session-separator-element-border;
@include themify($themes) {
border: themed('borderActionPanel');
}
display: flex;
align-items: center;
transition: $session-transition-duration;
@ -1428,10 +1451,6 @@ input {
}
}
.dark-theme .modal .content {
background-color: $session-shade-4;
}
.loki-dialog button {
border: none;
}

View File

@ -10,8 +10,10 @@
height: 100vh;
width: 22vw;
flex-shrink: 0;
border: $session-separator-element-border;
background-color: $session-shade-4;
@include themify($themes) {
background: themed('leftpaneOverlayBackground');
border-left: themed('borderActionPanel');
}
align-items: center;
&-header {
@ -37,11 +39,13 @@
.description {
margin: $session-margin-md 0;
border: $session-separator-element-border;
background-color: $session-shade-1;
min-height: 4rem;
width: inherit;
color: $session-color-white;
@include themify($themes) {
color: themed('textColor');
background: themed('cellBackground');
border: themed('borderActionPanel');
}
text-align: center;
display: none;
}
@ -49,19 +53,23 @@
&-item {
display: flex;
align-items: center;
background-color: $session-shade-1;
min-height: 3rem;
font-size: 0.8rem;
color: $session-color-white;
@include themify($themes) {
color: themed('textColor');
background: themed('cellBackground');
border-top: themed('borderActionPanel');
border-bottom: themed('borderActionPanel');
}
width: -webkit-fill-available;
padding: 0 $session-margin-md;
border-bottom: $session-separator-element-border;
border-top: $session-separator-element-border;
transition: $session-transition-duration;
cursor: pointer;
&:hover {
@include session-dark-background-hover;
@include themify($themes) {
background: themed('clickableHovered');
}
}
}
@ -74,11 +82,13 @@
.session-button.square-outline.danger {
margin-top: auto;
width: 100%;
border: none;
height: 3.5rem;
background-color: black;
flex-shrink: 0;
align-items: center;
@include themify($themes) {
border: none;
border-top: themed('borderActionPanel');
}
}
.module-empty-state {
@ -104,7 +114,9 @@
}
&__tab {
color: white;
@include themify($themes) {
color: themed('textColor');
}
font-weight: bold;
font-size: 0.9rem;
padding: 0.6rem;