Skip to content

Dark theme fixes #1451

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
nickvergessen merged 7 commits into from
Jan 17, 2019
Merged

Dark theme fixes #1451

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
10cb92d
Fix Chat sidebar in Files for Dark theme
jancborchardt Jan 17, 2019
aa2bfb9
Dark theme: Fix border color in app navigation
jancborchardt Jan 17, 2019
2bade2e
Dark theme: Fix tab header text color
jancborchardt Jan 17, 2019
f36c34d
Remove non-standard background from counter, also emphasizes personal…
jancborchardt Jan 17, 2019
95e69a3
Invert the non-avatar icons so they are visible on dark theme mode
nickvergessen Jan 17, 2019
15a37bd
Fix duplicated double quote
nickvergessen Jan 17, 2019
54b6e88
Add the color for now, so the regex can replace it with white for the…
nickvergessen Jan 17, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 5 additions & 4 deletions css/chatview.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -241,8 +241,8 @@ body:not(#body-public) #chatView .comment .authorRow:not(.currentUser):not(.gues

#chatView .comment.showDate {
margin-top: 40px;
border-top: 1px solid #dbdbdb;
padding-top: 10px;
border-top: 1px solid var(--color-border);
padding-top: 20px;
}

#chatView .comment.showDate:before {
Expand All @@ -255,9 +255,10 @@ body:not(#body-public) #chatView .comment .authorRow:not(.currentUser):not(.gues
padding: 0 7px 0 7px;

text-align: center;
white-space: nowrap;

color: #878787;
background-color: #fff;
color: var(--color-text-maxcontrast);
background-color: var(--color-main-background);
}

#chatView .comment.showDate .authorRow {
Expand Down
28 changes: 17 additions & 11 deletions css/style.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -56,12 +56,12 @@
}

#oca-spreedme-add-room {
border-bottom: 1px solid $color-border;
border-bottom: 1px solid var(--color-border);
}

.oca-spreedme-add-person {
border: 1px solid $color-border;
border-radius: $border-radius;
border: 1px solid var(--color-border);
border-radius: var(--border-radius);
}

.contactsmenu-popover li > a > img {
Expand Down Expand Up @@ -155,9 +155,7 @@ input[type="password"] {
}

.participantWithList .avatar,
#app-navigation .avatar,
#app-navigation .icon-contacts-dark,
#app-navigation .app-navigation-entry-link .icon-public {
#app-navigation .app-navigation-entry-link > .avatar {
position: absolute;
left: 6px;
top: 6px;
Expand All @@ -170,8 +168,8 @@ input[type="password"] {
margin: 0 !important;
}

.select2-result .icon-contacts.avatar,
.select2-result .icon-public-white.avatar,
.select2-result .icon-contacts-dark.avatar,
.select2-result .icon-public.avatar,
.select2-result .icon-mail.avatar,
#app-navigation .app-navigation-entry-link .avatar.icon {
border-radius: 50%;
Expand Down Expand Up @@ -210,7 +208,6 @@ input[type="password"] {
span {
padding: 2px 5px;
border-radius: 10px;
background-color: nc-lighten($color-main-text, 90%);
font-weight: bold;
}

Expand Down Expand Up @@ -596,11 +593,11 @@ input[type="password"] {
flex-grow: 0;
padding: 12px;
text-align: center;
border-bottom: 1px solid $color-border;
border-bottom: 1px solid var(--color-border);
margin-bottom: 0;

.icon, a {
color: $color-main-text;
color: var(--color-main-text);
opacity: .5;
}
}
Expand Down Expand Up @@ -1071,3 +1068,12 @@ input[type="password"] {
#app-sidebar #participantsTabView .participant:last-child {
margin-bottom: 15px;
}

/**
* Dark-Theme fixes
*/
#app-navigation > ul > li > a:first-child {
img {
filter: none !important;
}
}
2 changes: 1 addition & 1 deletion img/no-password.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
4 changes: 2 additions & 2 deletions js/app.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -153,11 +153,11 @@
},
formatResult: function (element) {
if (element.type === "createPublicRoom") {
return '<span><div class="avatar icon-public-white"></div>' + escapeHTML(element.displayName) + '</span>';
return '<span><div class="avatar icon-public"></div>' + escapeHTML(element.displayName) + '</span>';
}

if (element.type === "createGroupRoom" || element.type === 'group') {
return '<span><div class="avatar icon-contacts"></div>' + escapeHTML(element.displayName) + '</span>';
return '<span><div class="avatar icon-contacts-dark"></div>' + escapeHTML(element.displayName) + '</span>';
}

return '<span><div class="avatar" data-user="' + escapeHTML(element.id) + '" data-user-display-name="' + escapeHTML(element.displayName) + '"></div>' + escapeHTML(element.displayName) + '</span>';
Expand Down
4 changes: 2 additions & 2 deletions js/views/callinfoview.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,11 +48,11 @@
' {{#if isPublic}}' +
' <div class="clipboard-button"><span class="button icon-clippy"></span></div>' +
' <div class="password-button">' +
' <span class="button {{#if hasPassword}}icon-password"{{else}}icon-no-password{{/if}}"></span>' +
' <span class="button {{#if hasPassword}}icon-password{{else}}icon-no-password{{/if}}"></span>' +
' <div class="popovermenu password-menu menu-right">' +
' <ul>' +
' <li>' +
' <span class="menuitem {{#if hasPassword}}icon-password"{{else}}icon-no-password{{/if}} password-option">' +
' <span class="menuitem {{#if hasPassword}}icon-password{{else}}icon-no-password{{/if}} password-option">' +
' <form class="password-form">' +
' <input class="password-input" required maxlength="200" type="password"' +
' placeholder="{{#if hasPassword}}' + t('spreed', 'Change password') + '{{else}}' + t('spreed', 'Set password') + '{{/if}}">'+
Expand Down
2 changes: 1 addition & 1 deletion js/views/participantview.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -148,7 +148,7 @@
if (element.type === 'emails') {
return '<span><div class="avatar icon-mail"></div>' + escapeHTML(element.displayName) + '</span>';
} else if (element.type === 'groups') {
return '<span><div class="avatar icon-contacts"></div>' + escapeHTML(element.displayName) + '</span>';
return '<span><div class="avatar icon-contacts-dark"></div>' + escapeHTML(element.displayName) + '</span>';
}

return '<span><div class="avatar" data-user="' + escapeHTML(element.id) + '" data-user-display-name="' + escapeHTML(element.displayName) + '"></div>' + escapeHTML(element.displayName) + '</span>';
Expand Down
8 changes: 4 additions & 4 deletions js/views/roomlistview.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -156,13 +156,13 @@
templateContext: function() {
var icon = '';
if (this.model.get('objectType') === 'file') {
icon = 'icon icon-file-white';
icon = 'icon icon-file';
} else if (this.model.get('objectType') === 'share:password') {
icon = 'icon icon-password-white';
icon = 'icon icon-password';
} else if (this.model.get('type') === OCA.SpreedMe.app.ROOM_TYPE_GROUP) {
icon = 'icon icon-contacts';
icon = 'icon icon-contacts-dark';
} else if (this.model.get('type') === OCA.SpreedMe.app.ROOM_TYPE_PUBLIC) {
icon = 'icon icon-public-white';
icon = 'icon icon-public';
}

// If a room is a one2one room it can not be removed from the list, only be deleted for both participants.
Expand Down