Unverified Commit 5b0e9faf authored by Kyriakos Z's avatar Kyriakos Z Committed by GitHub
Browse files

MM-40447: fixes minor styling issues in suggestions (#9496)

* MM-40447: fixes minor styling issues in suggestions

- Avatar in user auto complete has no space from text.
- Channel icon and name are not center aligned.
- Hovering a date and selected date are not circles but ellipses.
parent dbc14b39
......@@ -20,16 +20,36 @@
}
.DayPicker-Day {
position: relative;
z-index: 1;
min-width: 32px;
height: 32px;
padding: 0;
border-radius: 100%;
font-weight: 600;
&:hover {
background: var(--center-channel-bg) !important;
}
&::before {
position: absolute;
z-index: -1;
top: 0;
left: 15px;
width: 32px;
height: 32px;
border-radius: 32px;
content: " ";
}
}
.DayPicker-Day--today {
background: rgba(var(--button-bg-rgb), 0.08);
color: var(--button-bg);
&::before {
background: rgba(var(--button-bg-rgb), 0.08);
}
}
.DayPicker-wrapper {
......
......@@ -207,6 +207,7 @@
.suggestion-list__icon {
display: inline-flex;
flex: 0 0 1.6rem;
align-items: center;
justify-content: center;
fill: v(center-channel-color);
opacity: 0.56;
......@@ -255,10 +256,6 @@
display: block;
margin-right: 12px;
text-align: center;
&.Avatar-sm {
margin: 0;
}
}
.status-wrapper {
......@@ -267,8 +264,12 @@
margin-top: 4px;
margin-right: 12px;
.Avatar.Avatar-sm {
margin: 0;
}
.status {
right: -2px;
right: -4px;
bottom: -4px;
svg {
......
......@@ -523,7 +523,7 @@ export function applyTheme(theme) {
}
if (theme.buttonBg) {
changeCss('.app__body .modal .settings-modal .profile-img__remove:hover, .app__body .DayPicker:not(.DayPicker--interactionDisabled) .DayPicker-Day:not(.DayPicker-Day--disabled):not(.DayPicker-Day--selected):not(.DayPicker-Day--outside):hover, .app__body .modal .settings-modal .team-img__remove:hover, .app__body .btn.btn-transparent:hover, .app__body .btn.btn-transparent:active, .app__body .post-image__details .post-image__download svg:hover, .app__body .file-view--single .file__download:hover, .app__body .new-messages__button div, .app__body .btn.btn-primary, .app__body .tutorial__circles .circle.active', 'background:' + theme.buttonBg);
changeCss('.app__body .modal .settings-modal .profile-img__remove:hover, .app__body .DayPicker:not(.DayPicker--interactionDisabled) .DayPicker-Day:not(.DayPicker-Day--disabled):not(.DayPicker-Day--selected):not(.DayPicker-Day--outside):hover:before, .app__body .modal .settings-modal .team-img__remove:hover, .app__body .btn.btn-transparent:hover, .app__body .btn.btn-transparent:active, .app__body .post-image__details .post-image__download svg:hover, .app__body .file-view--single .file__download:hover, .app__body .new-messages__button div, .app__body .btn.btn-primary, .app__body .tutorial__circles .circle.active', 'background:' + theme.buttonBg);
changeCss('.app__body .system-notice__logo svg', 'fill:' + theme.buttonBg);
changeCss('.app__body .post-image__details .post-image__download svg:hover', 'border-color:' + theme.buttonBg);
changeCss('.app__body .btn.btn-primary:hover, .app__body .btn.btn-primary:active, .app__body .btn.btn-primary:focus', 'background:' + changeColor(theme.buttonBg, -0.15));
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment