Discource-C
/
discourse
mirror of https://github.com/discourse/discourse.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

FIX: emoji-picker works with dark theme

This commit is contained in:
Joffrey JAFFEUX 2017-07-19 22:32:29 +02:00
parent f32950a475
commit 0112b9aa43
1 changed files with 11 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
app/assets/stylesheets/common/base/emoji.scss
View File

@ -1,25 +1,24 @@
.emoji-picker {
background-color: #fff;
border: 1px solid #e9e9e9;
box-shadow: 0 1px 5px rgba(0,0,0,0.4);
background-clip: padding-box;
z-index: 10000;
position: fixed;
background-color: dark-light-choose(#dadada, blend-primary-secondary(5%));
display: none;
flex-direction: row;
height: 300px;
border-radius: 3px;
color: dark-light-choose(darken($primary, 40%), blend-primary-secondary(90%));
background-color: $secondary;
border: 1px solid dark-light-diff($primary, $secondary, 90%, -60%);
}
.emoji-picker .categories-column {
display: flex;
flex-direction: column;
background: white;
flex: 1;
align-items: center;
justify-content: space-between;
border-right: 1px solid #e9e9e9;
border-right: 1px solid dark-light-diff($primary, $secondary, 90%, -60%);
min-width: 36px;
}
@ -38,7 +37,6 @@
.emoji-picker .main-column {
display: flex;
flex-direction: column;
background: white;
flex: 20;
}
@ -58,13 +56,14 @@
padding: 8px;
margin-bottom: 4px;
padding-bottom: 4px;
border-bottom: 1px solid #e9e9e9;
border-bottom: 1px solid dark-light-diff($primary, $secondary, 90%, -60%);
justify-content: space-between;
display: flex;
align-items: center;
}
.emoji-picker .section-header .title {
color: $primary;
}
.emoji-picker .section-header .clear-recent .fa{
@ -83,14 +82,14 @@
display: inline-block;
vertical-align: top;
border-radius: 50%;
background-color: #d1f0ff;
background-color: lighten($tertiary, 30%);
}
.emoji-picker .footer {
align-items: center;
display: flex;
justify-content: space-between;
border-top: 1px solid #e9e9e9;
border-top: 1px solid dark-light-diff($primary, $secondary, 90%, -60%);
}
.emoji-picker .info {
@ -164,7 +163,7 @@ body img.emoji {
.emoji-picker .filter {
background-color: none;
border-bottom: 1px solid #e9e9e9;
border-bottom: 1px solid dark-light-diff($primary, $secondary, 90%, -60%);
padding: 5px;
display: flex;
position: relative;
@ -186,6 +185,8 @@ body img.emoji {
box-shadow: none;
padding-right: 24px;
outline: none;
color: $primary;
background: $secondary;
&:focus {
border: none;