mirrors/element-web
1
0
Fork 0
mirror of https://github.com/element-hq/element-web synced 2024-10-24 19:55:54 +03:00
Code Issues Projects Releases Packages Wiki Activity

Merge branch 'develop' into bwindels/lazyroomtilerendering

Browse source
This commit is contained in:
Bruno Windels 2019-02-13 17:13:23 +01:00
commit 9c371111b7
50 changed files with 557 additions and 699 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

49
res/css/_common.scss
View file

@ -50,8 +50,54 @@ a:visited {
color: $accent-color-alt;
}
input[type=text],
input[type=search],
input[type=password] {
padding: 9px;
font-family: $font-family;
font-size: 14px;
font-weight: 600;
min-width: 0;
}
input[type=text].mx_textinput_icon,
input[type=search].mx_textinput_icon {
padding-left: 36px;
background-repeat: no-repeat;
background-position: 10px center;
}
// FIXME THEME - Tint by CSS rather than referencing a duplicate asset
input[type=text].mx_textinput_icon.mx_textinput_search,
input[type=search].mx_textinput_icon.mx_textinput_search {
background-image: url('$(res)/img/feather-icons/search-input.svg');
}
// dont search UI as not all browsers support it,
// we implement it ourselves where needed instead
input[type=search]::-webkit-search-decoration,
input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-results-button,
input[type=search]::-webkit-search-results-decoration {
display: none;
}
.input[type=text]::-webkit-input-placeholder,
.input[type=text]::-moz-placeholder,
.input[type=search]::-webkit-input-placeholder,
.input[type=search]::-moz-placeholder {
color: #a5aab2;
}
// Override Firefox's UA style so we get a consistent look across browsers
input::placeholder,
textarea::placeholder {
opacity: initial;
}
input[type=text], input[type=password], textarea {
background-color: transparent;
color: $primary-fg-color;
}
input[type=text]:focus, input[type=password]:focus, textarea:focus {
@ -62,6 +108,7 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus {
/* Required by Firefox */
textarea {
font-family: $font-family;
color: $primary-fg-color;
}
/* Prevent ugly dotted highlight around selected elements in Firefox */
@ -242,7 +289,7 @@ textarea {
font-weight: 600;
border: 1px solid $accent-color ! important;
color: $accent-color;
background-color: $accent-fg-color;
background-color: $button-secondary-bg-color;
}
.mx_Dialog button:hover, .mx_Dialog input[type="submit"]:hover {

2
res/css/structures/_ContextualMenu.scss
View file

@ -31,7 +31,7 @@ limitations under the License.
.mx_ContextualMenu {
border-radius: 4px;
box-shadow: 4px 4px 12px 0 rgba(118, 131, 156, 0.6);;
box-shadow: 4px 4px 12px 0 $menu-box-shadow-color;
background-color: $menu-bg-color;
color: $primary-fg-color;
position: absolute;

17
res/css/structures/_GroupView.scss
View file

@ -44,13 +44,22 @@ limitations under the License.
}
.mx_GroupHeader_button {
margin-left: 12px;
margin-left: 5px;
margin-right: 5px;
cursor: pointer;
height: 20px;
width: 20px;
background-color: $groupheader-button-color;
mask-repeat: no-repeat;
mask-size: contain;
}
.mx_GroupHeader_button object {
// prevents clicks from being swallowed by svg in 'object' tag
pointer-events: none;
.mx_GroupHeader_editButton {
mask-image: url('$(res)/img/icons-settings-room.svg');
}
.mx_GroupHeader_shareButton {
mask-image: url('$(res)/img/icons-share.svg');
}
.mx_GroupView_editable {

3
res/css/structures/_HeaderButtons.scss
View file

@ -21,7 +21,8 @@ limitations under the License.
.mx_HeaderButtons::before {
content: "";
background-color: $header-divider-color;
margin: 2px 20px 5px 15px ;
opacity: 0.5;
margin: 0 15px;
border-radius: 2px;
width: 2px;
}

53
res/css/structures/_RightPanel.scss
View file

@ -25,9 +25,7 @@ limitations under the License.
.mx_RightPanel_header {
order: 1;
border-bottom: 1px solid $primary-hairline-color;
flex: 0 0 52px;
}
@ -45,20 +43,55 @@ limitations under the License.
cursor: pointer;
flex: 0 0 auto;
vertical-align: top;
margin-top: 4px;
padding-left: 5px;
padding-right: 5px;
margin-left: 5px;
margin-right: 5px;
text-align: center;
position: relative;
border-bottom: 2px solid transparent;
height: 20px;
width: 20px;
position: relative;
}
.mx_RightPanel_headerButton object {
pointer-events: none;
.mx_RightPanel_headerButton::before {
content: '';
position: absolute;
top: 0;
left: 0;
height: 20px;
width: 20px;
background-color: $rightpanel-button-color;
mask-repeat: no-repeat;
mask-size: contain;
}
.mx_RightPanel_headerButton_highlight {
border-color: $button-bg-color;
.mx_RightPanel_membersButton::before {
mask-image: url('$(res)/img/feather-icons/user.svg');
}
.mx_RightPanel_filesButton::before {
mask-image: url('$(res)/img/feather-icons/files.svg');
}
.mx_RightPanel_notifsButton::before {
mask-image: url('$(res)/img/feather-icons/notifications.svg');
}
.mx_RightPanel_groupMembersButton::before {
mask-image: url('$(res)/img/icons-people.svg');
}
.mx_RightPanel_roomsButton::before {
mask-image: url('$(res)/img/icons-room-nobg.svg');
}
.mx_RightPanel_headerButton_highlight::after {
content: '';
position: absolute;
bottom: -6px;
left: 0;
right: 0;
height: 2px;
background-color: $button-bg-color;
}
.mx_RightPanel_headerButton_badge {

2
res/css/structures/_RoomSubList.scss
View file

@ -152,7 +152,7 @@ limitations under the License.
&.mx_IndicatorScrollbar_topOverflow::before {
top: 0;
transition: background-image 0.1s ease-in;
background: linear-gradient(to top, rgba(242,245,248,0), rgba(242,245,248,1));
background: linear-gradient(to top, $panel-gradient);
}
/*

2
res/css/structures/_TagPanelButtons.scss
View file

@ -38,7 +38,7 @@ limitations under the License.
height: 40px;
width: 40px;
border-radius: 20px;
background-color: $roomheader-addroom-color;
background-color: $tagpanel-button-color;
position: relative;
/* overwrite mx_RoleButton inline-block */
display: block !important;

2
res/css/structures/auth/_Login.scss
View file

@ -79,7 +79,7 @@ limitations under the License.
.mx_Login_type_container {
display: flex;
margin-bottom: 14px;
color: $primary-fg-color;
color: $authpage-primary-color;
}
.mx_Login_type_label {

26
res/css/views/auth/_AuthBody.scss
View file

@ -21,19 +21,41 @@ limitations under the License.
padding: 25px 60px;
box-sizing: border-box;
font-size: 12px;
color: $authpage-body-color;
color: $authpage-secondary-color;
}
.mx_AuthBody h2 {
font-size: 24px;
font-weight: 600;
margin-top: 8px;
color: $authpage-primary-color;
}
.mx_AuthBody h3 {
font-size: 14px;
font-weight: 600;
color: $primary-fg-color;
color: $authpage-primary-color;
}
.mx_AuthBody input[type=text],
.mx_AuthBody input[type=password] {
color: $authpage-primary-color;
}
.mx_AuthBody .mx_Field input,
.mx_AuthBody .mx_Field select {
color: $authpage-primary-color;
background-color: $authpage-body-bg-color;
}
.mx_AuthBody .mx_Field label {
color: $authpage-primary-color;
}
.mx_AuthBody .mx_Field input:focus + label,
.mx_AuthBody .mx_Field input:not(:placeholder-shown) + label,
.mx_AuthBody .mx_Field select + label /* Always show a select's label on top to not collide with the value */ {
background-color: $authpage-body-bg-color;
}
.mx_AuthBody_editServerDetails {

4
res/css/views/auth/_ServerTypeSelector.scss
View file

@ -34,7 +34,7 @@ limitations under the License.
.mx_ServerTypeSelector_label {
text-align: center;
font-weight: 600;
color: $primary-fg-color;
color: $authpage-primary-color;
margin: 8px 0;
}
@ -54,7 +54,7 @@ limitations under the License.
height: 18px;
margin-bottom: 12px;
font-weight: 600;
color: $primary-fg-color;
color: $authpage-primary-color;
}
.mx_ServerTypeSelector_logo > div {

3
res/css/views/dialogs/_CreateGroupDialog.scss
View file

@ -43,10 +43,9 @@ limitations under the License.
.mx_CreateGroupDialog_prefix,
.mx_CreateGroupDialog_suffix {
height: 35px;
padding: 0px 5px;
line-height: 37px;
background-color: $input-border-color;
background-color: $input-darker-bg-color;
border: 1px solid $input-border-color;
text-align: center;
}

8
res/css/views/elements/_AccessibleButton.scss
View file

@ -40,8 +40,7 @@ limitations under the License.
}
.mx_AccessibleButton_kind_primary.mx_AccessibleButton_disabled {
color: $button-primary-disabled-fg-color;
background-color: $button-primary-disabled-bg-color;
opacity: 0.4;
}
.mx_AccessibleButton_hasKind.mx_AccessibleButton_kind_primary_sm {
@ -51,8 +50,7 @@ limitations under the License.
}
.mx_AccessibleButton_kind_primary_sm.mx_AccessibleButton_disabled {
color: $button-primary-disabled-fg-color;
background-color: $button-primary-disabled-bg-color;
opacity: 0.4;
}
.mx_AccessibleButton_kind_danger {
@ -74,4 +72,4 @@ limitations under the License.
.mx_AccessibleButton_kind_danger_sm.mx_AccessibleButton_disabled {
color: $button-danger-disabled-fg-color;
background-color: $button-danger-disabled-bg-color;
}
}

3
res/css/views/elements/_Field.scss
View file

@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
/* TODO: Consider unifying with general input styles in _dharma.scss */
/* TODO: Consider unifying with general input styles in _light.scss */
.mx_Field {
position: relative;
@ -31,6 +31,7 @@ limitations under the License.
transition: border-color 0.25s;
border: 1px solid $input-border-color;
padding: 8px 9px;
color: $primary-fg-color;
background-color: $primary-bg-color;
}

43
res/css/views/rooms/_MessageComposer.scss
View file

@ -180,27 +180,36 @@ limitations under the License.
color: $accent-color;
}
.mx_MessageComposer_upload,
.mx_MessageComposer_hangup,
.mx_MessageComposer_voicecall,
.mx_MessageComposer_videocall,
.mx_MessageComposer_apps,
.mx_MessageComposer_stickers {
/*display: table-cell;*/
/*vertical-align: middle;*/
/*padding-left: 10px;*/
padding-right: 12px;
.mx_MessageComposer_button {
margin-right: 12px;
cursor: pointer;
padding-top: 4px;
height: 20px;
width: 20px;
background-color: $composer-button-color;
mask-repeat: no-repeat;
mask-size: contain;
mask-position: center;
}
.mx_MessageComposer_upload object,
.mx_MessageComposer_hangup object,
.mx_MessageComposer_voicecall object,
.mx_MessageComposer_videocall object,
.mx_MessageComposer_apps object,
.mx_MessageComposer_stickers object {
pointer-events: none;
.mx_MessageComposer_upload {
mask-image: url('$(res)/img/feather-icons/paperclip.svg');
}
.mx_MessageComposer_hangup {
mask-image: url('$(res)/img/hangup.svg');
}
.mx_MessageComposer_voicecall {
mask-image: url('$(res)/img/feather-icons/phone.svg');
}
.mx_MessageComposer_videocall {
mask-image: url('$(res)/img/feather-icons/video.svg');
}
.mx_MessageComposer_stickers {
mask-image: url('$(res)/img/feather-icons/face.svg');
}
.mx_MessageComposer_formatting {

2
res/css/views/rooms/_RoomBreadcrumbs.scss
View file

@ -36,7 +36,7 @@ limitations under the License.
top: 0;
right: 0;
height: 100%;
background: linear-gradient(to right, rgba(242,245,248,0), rgba(242,245,248,1));
background: linear-gradient(to right, $panel-gradient);
}
.mx_RoomBreadcrumbs_animate {

33
res/css/views/rooms/_RoomHeader.scss
View file

@ -58,7 +58,6 @@ limitations under the License.
.mx_RoomHeader_buttons {
display: flex;
align-items: center;
background-color: $primary-bg-color;
padding-right: 5px;
}
@ -116,10 +115,6 @@ limitations under the License.
opacity: 0.6;
}
.mx_RoomHeader_settingsButton object {
pointer-events: none;
}
.mx_RoomHeader_name,
.mx_RoomHeader_avatar,
.mx_RoomHeader_avatarPicker,
@ -160,6 +155,7 @@ limitations under the License.
font-weight: 400;
font-size: 13px;
margin: 0 7px;
margin-top: 4px; // to align baseline of topic with room name
overflow: hidden;
text-overflow: ellipsis;
border-bottom: 1px solid transparent;
@ -199,10 +195,32 @@ limitations under the License.
.mx_RoomHeader_button {
margin-left: 10px;
cursor: pointer;
height: 20px;
width: 20px;
background-color: $roomheader-button-color;
mask-repeat: no-repeat;
mask-size: contain;
}
.mx_RoomHeader_button object {
pointer-events: none;
.mx_RoomHeader_settingsButton {
mask-image: url('$(res)/img/feather-icons/settings.svg');
}
.mx_RoomHeader_forgetButton {
mask-image: url('$(res)/img/leave.svg');
width: 26px;
}
.mx_RoomHeader_searchButton {
mask-image: url('$(res)/img/feather-icons/search.svg');
}
.mx_RoomHeader_shareButton {
mask-image: url('$(res)/img/feather-icons/share.svg');
}
.mx_RoomHeader_manageIntegsButton {
mask-image: url('$(res)/img/feather-icons/grid.svg');
}
.mx_RoomHeader_showPanel {
@ -219,6 +237,7 @@ limitations under the License.
.mx_RoomHeader_pinnedButton {
position: relative;
mask-image: url('$(res)/img/icons-pin.svg');
}
.mx_RoomHeader_pinsIndicator {

3
res/css/views/rooms/_RoomTile.scss
View file

@ -154,9 +154,8 @@ limitations under the License.
}
.mx_RoomTile_unread, .mx_RoomTile_highlight {
font-weight: 700 !important;
.mx_RoomTile_name {
// font-weight: 700; // bold is too loud in the end
color: $roomtile-selected-color;
}
}

291
res/themes/dark/css/_dark.scss
View file

@ -1,186 +1,196 @@
// unified palette
// try to use these colors when possible
$bg-color: #181b21;
$base-color: #1b1f25;
$base-text-color: #edf3ff;
$header-panel-bg-color: #22262e;
$header-panel-border-color: #000000;
$header-panel-text-primary-color: #a1b2d1;
$header-panel-text-secondary-color: #c8c8cd;
$text-primary-color: #edf3ff;
$text-secondary-color: #a1b2d1;
$search-bg-color: #181b21;
$search-placeholder-color: #61708b;
$room-highlight-color: #343a46;
// typical text (dark-on-white in light skin)
$primary-fg-color: #212121;
$primary-bg-color: #2d2d2d;
// used for focusing form controls
$focus-bg-color: #101010;
$primary-fg-color: $text-primary-color;
$primary-bg-color: $bg-color;
// used for dialog box text
$light-fg-color: #747474;
$light-fg-color: $header-panel-text-secondary-color;
// button UI (white-on-green in light skin)
$accent-fg-color: $primary-bg-color;
$accent-color: #76CFA6;
$accent-color-alt: $accent-color;
$accent-color-50pct: #76CFA67F;
// used for focusing form controls
$focus-bg-color: $room-highlight-color;
$selection-fg-color: $primary-fg-color;
$mention-user-pill-bg-color: $warning-color;
$other-user-pill-bg-color: $room-highlight-color;
$focus-brightness: 200%;
// informational plinth
$info-plinth-bg-color: $header-panel-bg-color;
$info-plinth-fg-color: #888;
// red warning colour
$warning-color: #ff0064;
$warning-bg-color: #DF2A8B;
$info-bg-color: #2A9EDF;
$preview-bar-bg-color: $header-panel-bg-color;
// groups
$info-plinth-bg-color: #454545;
$other-user-pill-bg-color: rgba(255, 255, 255, 0.1);
$preview-bar-bg-color: #333;
// left-panel style muted accent color
$secondary-accent-color: $primary-bg-color;
$tertiary-accent-color: #454545;
// stop the tinter trying to change the secondary accent color
// by overriding the key to something untintable
// XXX: this is a bit of a hack.
#mx_theme_secondaryAccentColor {
color: #c0ffee ! important;
}
#mx_theme_tertiaryAccentColor {
color: #c0ffee ! important;
}
// used by RoomDirectory permissions
$plinth-bg-color: #474747;
// used by RoomDropTarget
$droptarget-bg-color: rgba(45,45,45,0.5);
$tagpanel-bg-color: $base-color;
// used by AddressSelector
$selected-color: #000000;
$selected-color: $room-highlight-color;
// selected for hoverover & selected event tiles
$event-selected-color: #353535;
$event-selected-color: $search-bg-color;
// used for the hairline dividers in RoomView
$primary-hairline-color: #474747;
$primary-hairline-color: $header-panel-border-color;
// used for the border of input text fields
$input-border-color: #3a3a3a;
$input-border-color: #e7e7e7;
$input-darker-bg-color: $search-bg-color;
$input-darker-fg-color: $search-placeholder-color;
$input-lighter-bg-color: #f2f5f8;
$input-lighter-fg-color: $input-darker-fg-color;
$input-focused-border-color: #238cf5;
$input-valid-border-color: $accent-color;
$input-darker-bg-color: #c1c9d6;
$input-darker-fg-color: #9fa9ba;
$button-bg-color: #7ac9a1;
$button-fg-color: white;
// apart from login forms, which have stronger border
$strong-input-border-color: #656565;
$field-focused-label-bg-color: $bg-color;
// used for UserSettings EditableText
$input-underline-color: $primary-fg-color;
$input-fg-color: $primary-fg-color;
// scrollbars
$scrollbar-thumb-color: rgba(255, 255, 255, 0.2);
$scrollbar-track-color: transparent;
// context menus
$menu-border-color: rgba(187, 187, 187, 0.5);
$menu-bg-color: #373737;
$menu-selected-color: #f5f8fa;
$menu-border-color: $header-panel-border-color;
$menu-bg-color: $header-panel-bg-color;
$menu-box-shadow-color: $bg-color;
$menu-selected-color: $room-highlight-color;
$avatar-initial-color: #2d2d2d;
$avatar-bg-color: #ffffff;
$menu-selected-color: #f5f8fa;
$avatar-initial-color: #ffffff;
$avatar-bg-color: $bg-color;
$h3-color: $primary-fg-color;
$dialog-background-bg-color: #000;
$dialog-background-bg-color: $header-panel-bg-color;
$lightbox-background-bg-color: #000;
$greyed-fg-color: #888;
$neutral-badge-color: #888;
$preview-widget-bar-color: $menu-bg-color;
$preview-widget-fg-color: $greyed-fg-color;
$blockquote-bar-color: #ddd;
$blockquote-fg-color: #777;
$settings-grey-fg-color: #a2a2a2;
$settings-profile-placeholder-bg-color: #e7e7e7;
$settings-profile-overlay-bg-color: #000;
$settings-profile-overlay-placeholder-bg-color: transparent;
$settings-profile-overlay-fg-color: #fff;
$settings-profile-overlay-placeholder-fg-color: #454545;
$settings-subsection-fg-color: $text-secondary-color;
$voip-decline-color: #f48080;
$voip-accept-color: #80f480;
$topleftmenu-color: $text-primary-color;
$roomheader-color: $text-primary-color;
$roomheader-addroom-color: $header-panel-text-primary-color;
$tagpanel-button-color: $header-panel-text-primary-color;
$roomheader-button-color: $header-panel-text-primary-color;
$groupheader-button-color: $header-panel-text-primary-color;
$rightpanel-button-color: $header-panel-text-primary-color;
$composer-button-color: $header-panel-text-primary-color;
$roomtopic-color: $text-secondary-color;
$eventtile-meta-color: $roomtopic-color;
$rte-bg-color: #353535;
$rte-code-bg-color: #000;
$header-divider-color: $header-panel-text-primary-color;
$room-warning-bg-color: #2d2d2d;
$roomtile-name-color: $header-panel-text-primary-color;
$roomtile-selected-color: $text-primary-color;
$roomtile-notified-color: $text-primary-color;
$roomtile-selected-bg-color: $room-highlight-color;
$roomtile-focused-bg-color: $room-highlight-color;
// ********************
$roomtile-transparent-focused-color: rgba(0, 0, 0, 0.1);
$roomtile-name-color: rgba(186, 186, 186, 0.8);
$roomtile-selected-bg-color: #333;
$roomtile-focused-bg-color: rgba(255, 255, 255, 0.2);
$panel-divider-color: $header-panel-border-color;
$username-variant1-color: #1e7ddc;
$username-variant2-color: #a756a8;
$username-variant3-color: #7ac9a1;
$username-variant4-color: #f2809d;
$username-variant5-color: #ffc666;
$username-variant6-color: #76ddd7;
$username-variant7-color: #45529b;
$username-variant8-color: #bfd251;
$roomsublist-background: rgba(0, 0, 0, 0.2);
$roomsublist-label-fg-color: $h3-color;
$roomsublist-label-bg-color: $tertiary-accent-color;
$roomsublist-chevron-color: $accent-color;
$panel-divider-color: rgba(118, 207, 166, 0.2);
// ********************
$widget-menu-bar-bg-color: $tertiary-accent-color;
// ********************
// event tile lifecycle
$event-encrypting-color: rgba(171, 221, 188, 0.4);
$event-sending-color: #888;
$event-notsent-color: #f44;
// event redaction
$event-redacted-fg-color: #606060;
$event-redacted-border-color: #000000;
$widget-menu-bar-bg-color: $search-bg-color;
// event timestamp
$event-timestamp-color: #acacac;
$event-timestamp-color: $text-secondary-color;
$edit-button-url: "$(res)/img/icon_context_message_dark.svg";
$copy-button-url: "$(res)/img/icon_copy_message_dark.svg";
// Tabbed views
$tab-label-fg-color: $text-primary-color;
$tab-label-active-fg-color: $text-primary-color;
$tab-label-bg-color: transparent;
$tab-label-active-bg-color: $accent-color;
$tab-label-icon-bg-color: $text-primary-color;
$tab-label-active-icon-bg-color: $text-primary-color;
// e2e
$e2e-verified-color: #76cfa5; // N.B. *NOT* the same as $accent-color
$e2e-unverified-color: #e8bf37;
$e2e-warning-color: #ba6363;
// Buttons
$button-primary-fg-color: #ffffff;
$button-primary-bg-color: $accent-color;
$button-secondary-bg-color: transparent;
$button-danger-fg-color: #ffffff;
$button-danger-bg-color: $notice-primary-color;
$button-danger-disabled-fg-color: #ffffff;
$button-danger-disabled-bg-color: #f5b6bb; // TODO: Verify color
/*** ImageView ***/
$lightbox-bg-color: #454545;
$lightbox-fg-color: #ffffff;
$lightbox-border-color: #ffffff;
$room-warning-bg-color: $header-panel-bg-color;
$imagebody-giflabel: rgba(1, 1, 1, 0.7);
$imagebody-giflabel-border: rgba(1, 1, 1, 0.2);
$imagebody-giflabel-color: rgba(0, 0, 0, 1);
$panel-gradient: rgba(34, 38, 46, 0), rgba(34, 38, 46, 1);
// unused?
$progressbar-color: #000;
/*** form elements ***/
// .mx_textinput is a container for a text input
// + some other controls like buttons, ...
// it has the appearance of a text box so the controls
// appear to be part of the input
.mx_Dialog, .mx_MatrixChat {
:not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=text],
:not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=search],
.mx_textinput {
background-color: transparent;
color: $input-darker-fg-color;
border: 1px solid #c1c1c1;
}
.mx_textinput {
> input[type=text],
> input[type=search] {
color: $primary-fg-color;
}
input::placeholder {
color: $roomsublist-label-fg-color;
}
}
}
/*** panels ***/
.dark-panel {
background-color: $header-panel-bg-color;
}
.dark-panel {
:not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=text],
:not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=search],
.mx_textinput {
color: $input-darker-fg-color;
background-color: $input-darker-bg-color;
border: none;
}
}
.light-panel {
:not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=text],
:not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=search],
.mx_textinput {
color: $input-lighter-fg-color;
background-color: $input-lighter-bg-color;
border: none;
}
}
// ***** Mixins! *****
// XXX: copypasted from _base in order to pick up the right FG color...
@define-mixin mx_DialogButton {
/* align images in buttons (eg spinners) */
vertical-align: middle;
border: 0px;
border-radius: 36px;
border-radius: 4px;
font-family: $font-family;
font-size: 14px;
color: $accent-fg-color;
background-color: $accent-color;
color: $button-fg-color;
background-color: $button-bg-color;
width: auto;
padding: 7px;
padding-left: 1.5em;
@ -190,12 +200,16 @@ $progressbar-color: #000;
outline: none;
}
@define-mixin mx_DialogButton_danger {
background-color: $accent-color;
}
@define-mixin mx_DialogButton_secondary {
// flip colours for the secondary ones
font-weight: 600;
border: 1px solid $accent-color ! important;
color: $accent-color;
background-color: $accent-fg-color;
background-color: $button-secondary-bg-color;
}
// Nasty hacks to apply a filter to arbitrary monochrome artwork to make it
@ -232,8 +246,3 @@ $progressbar-color: #000;
}
}
}
// Add a line to the right side of the left panel to distinguish it from the middle panel
.mx_LeftPanel {
border-right: 1px solid $tertiary-accent-color;
}

2
res/themes/dark/css/dark.scss
View file

@ -1,5 +1,5 @@
@import "../../light/css/_paths.scss";
@import "../../light/css/_fonts.scss";
@import "../../light/css/_base.scss";
@import "../../light/css/_light.scss";
@import "_dark.scss";
@import "../../../../res/css/_components.scss";

53
res/themes/dharma/css/_fonts.scss
View file

@ -1,53 +0,0 @@
/*
* Nunito.
* Includes extended Latin and Vietnamese character sets
* Current URLs are taken from
* https://github.com/alexeiva/NunitoFont/releases/tag/v3.500
* ...in order to include cyrillic.
*
* Previously, they were
* https://fonts.googleapis.com/css?family=Nunito:400,400i,600,600i,700,700i&subset=latin-ext,vietnamese
*
* We explicitly do not include Nunito's italic variants, as they are not italic enough
* and it's better to rely on the browser's built-in obliquing behaviour.
*/
/* the 'src' links are relative to the bundle.css, which is in a subdirectory.
*/
@font-face {
font-family: 'Nunito';
font-style: normal;
font-weight: 400;
src: url('$(res)/fonts/Nunito/Nunito-Regular.ttf') format('truetype');
}
@font-face {
font-family: 'Nunito';
font-style: normal;
font-weight: 600;
src: url('$(res)/fonts/Nunito/Nunito-SemiBold.ttf') format('truetype');
}
@font-face {
font-family: 'Nunito';
font-style: normal;
font-weight: 700;
src: url('$(res)/fonts/Nunito/Nunito-Bold.ttf') format('truetype');
}
/*
* Fira Mono
* Used for monospace copy, i.e. code
*/
@font-face {
font-family: 'Fira Mono';
src: url('$(res)/fonts/Fira_Mono/FiraMono-Regular.ttf') format('truetype');
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: 'Fira Mono';
src: url('$(res)/fonts/Fira_Mono/FiraMono-Bold.ttf') format('truetype');
font-weight: 700;
font-style: normal;
}

4
res/themes/dharma/css/dharma.scss
View file

@ -1,4 +0,0 @@
@import "../../light/css/_paths.scss";
@import "_fonts.scss";
@import "_dharma.scss";
@import "../../../../res/css/_components.scss";

276
res/themes/light/css/_base.scss
View file

@ -1,276 +0,0 @@
/* Open Sans lacks combining diacritics, so these will fall through
to the next font. Helevetica's diacritics however do not combine
nicely with Open Sans (on OSX, at least) and result in a huge
horizontal mess. Arial empirically gets it right, hence prioritising
Arial here. */
$font-family: 'Open Sans', Arial, Helvetica, Sans-Serif;
// typical text (dark-on-white in light skin)
$primary-fg-color: #454545;
$primary-bg-color: #ffffff;
// used for dialog box text
$light-fg-color: #747474;
// used for focusing form controls
$focus-bg-color: #dddddd;
// button UI (white-on-green in light skin)
$accent-fg-color: #ffffff;
$accent-color: #76CFA6;
$accent-color-alt: $accent-color;
$accent-color-50pct: #76CFA67F;
$selection-fg-color: $primary-bg-color;
$focus-brightness: 125%;
// red warning colour
$warning-color: #ff0064;
// background colour for warnings
$warning-bg-color: #DF2A8B;
$info-bg-color: #2A9EDF;
$mention-user-pill-bg-color: #ff0064;
$other-user-pill-bg-color: rgba(0, 0, 0, 0.1);
// pinned events indicator
$pinned-unread-color: #ff0064; // $warning-color
$pinned-color: #888;
// informational plinth
$info-plinth-bg-color: #f7f7f7;
$info-plinth-fg-color: #888;
$preview-bar-bg-color: #f7f7f7;
// left-panel style muted accent color
$secondary-accent-color: #eaf5f0;
$tertiary-accent-color: #d3efe1;
$tagpanel-bg-color: $tertiary-accent-color;
// used by RoomDirectory permissions
$plinth-bg-color: $secondary-accent-color;
// used by RoomDropTarget
$droptarget-bg-color: rgba(255,255,255,0.5);
// used by AddressSelector
$selected-color: $secondary-accent-color;
// selected for hoverover & selected event tiles
$event-selected-color: #f7f7f7;
// used for the hairline dividers in RoomView
$primary-hairline-color: #e5e5e5;
// used for the border of input text fields
$input-border-color: #f0f0f0;
$input-border-dark-color: #b8b8b8;
$input-darker-bg-color: #c1c9d6;
$input-darker-fg-color: #9fa9ba;
$button-bg-color: #7ac9a1;
$button-fg-color: white;
// apart from login forms, which have stronger border
$strong-input-border-color: #c7c7c7;
$input-focused-border-color: #238cf5;
$input-valid-border-color: #7ac9a1;
$field-focused-label-bg-color: #ffffff;
// used for UserSettings EditableText
$input-underline-color: rgba(151, 151, 151, 0.5);
$input-fg-color: rgba(74, 74, 74, 0.9);
// scrollbars
$scrollbar-thumb-color: rgba(0, 0, 0, 0.2);
$scrollbar-track-color: transparent;
// context menus
$menu-border-color: rgba(187, 187, 187, 0.5);
$menu-bg-color: #f6f6f6;
$menu-selected-color: #f5f8fa;
$avatar-initial-color: #ffffff;
$avatar-bg-color: #ffffff;
$h3-color: #3d3b39;
$dialog-title-fg-color: #454545;
$dialog-backdrop-color: rgba(46, 48, 51, 0.38);
$dialog-shadow-color: rgba(0, 0, 0, 0.48);
$dialog-close-fg-color: #9fa9ba;
$dialog-background-bg-color: #e9e9e9;
$lightbox-background-bg-color: #000;
$greyed-fg-color: #888;
$neutral-badge-color: #dbdbdb;
$preview-widget-bar-color: #ddd;
$preview-widget-fg-color: $greyed-fg-color;
$blockquote-bar-color: #ddd;
$blockquote-fg-color: #777;
$settings-grey-fg-color: #a2a2a2;
$settings-profile-placeholder-bg-color: #e7e7e7;
$settings-profile-overlay-bg-color: #000;
$settings-profile-overlay-placeholder-bg-color: transparent;
$settings-profile-overlay-fg-color: #fff;
$settings-profile-overlay-placeholder-fg-color: #454545;
$settings-subsection-fg-color: #61708b;
$voip-decline-color: #f48080;
$voip-accept-color: #80f480;
$rte-bg-color: #e9e9e9;
$rte-code-bg-color: rgba(0, 0, 0, 0.04);
$rte-room-pill-color: #aaa;
$rte-group-pill-color: #aaa;
$topleftmenu-color: $primary-fg-color;
$roomheader-color: $primary-fg-color;
$roomheader-addroom-color: $primary-bg-color;
$roomtopic-color: $settings-grey-fg-color;
$eventtile-meta-color: $roomtopic-color;
$composer-e2e-icon-color: #c9ced6;
$header-divider-color: #e6eaee;
// ********************
$roomtile-name-color: rgba(69, 69, 69, 0.8);
$roomtile-selected-color: $roomtile-name-color;
$roomtile-notified-color: $roomtile-name-color;
$roomtile-selected-bg-color: rgba(255, 255, 255, 0.8);
$roomtile-focused-bg-color: rgba(255, 255, 255, 0.9);
$username-variant1-color: #1e7ddc;
$username-variant2-color: #a756a8;
$username-variant3-color: #7ac9a1;
$username-variant4-color: #f2809d;
$username-variant5-color: #ffc666;
$username-variant6-color: #76ddd7;
$username-variant7-color: #45529b;
$username-variant8-color: #bfd251;
$roomtile-transparent-focused-color: rgba(0, 0, 0, 0.1);
$roomsublist-background: rgba(0, 0, 0, 0.05);
$roomsublist-label-fg-color: $h3-color;
$roomsublist-label-bg-color: $tertiary-accent-color;
$roomsublist-chevron-color: $accent-color;
$panel-divider-color: rgba(118, 207, 166, 0.2);
// ********************
$widget-menu-bar-bg-color: $tertiary-accent-color;
// ********************
// event tile lifecycle
$event-encrypting-color: #abddbc;
$event-sending-color: #ddd;
$event-notsent-color: #f44;
// event redaction
$event-redacted-fg-color: #e2e2e2;
$event-redacted-border-color: #cccccc;
// event timestamp
$event-timestamp-color: #acacac;
$edit-button-url: "$(res)/img/icon_context_message.svg";
$copy-button-url: "$(res)/img/icon_copy_message.svg";
// e2e
$e2e-verified-color: #76cfa5; // N.B. *NOT* the same as $accent-color
$e2e-unverified-color: #e8bf37;
$e2e-warning-color: #ba6363;
/*** ImageView ***/
$lightbox-bg-color: #454545;
$lightbox-fg-color: #ffffff;
$lightbox-border-color: #ffffff;
$imagebody-giflabel: rgba(0, 0, 0, 0.7);
$imagebody-giflabel-border: rgba(0, 0, 0, 0.2);
$imagebody-giflabel-color: rgba(255, 255, 255, 1);
// Tabbed views
$tab-label-fg-color: #45474a;
$tab-label-active-fg-color: #ffffff;
$tab-label-bg-color: transparent;
$tab-label-active-bg-color: #7ac9a1;
$tab-label-icon-bg-color: #454545;
$tab-label-active-icon-bg-color: #ffffff;
// Buttons
$button-primary-fg-color: #ffffff;
$button-primary-bg-color: #7ac9a1;
$button-primary-disabled-fg-color: #ffffff;
$button-primary-disabled-bg-color: #bce4d0;
$button-danger-fg-color: #ffffff;
$button-danger-bg-color: #f56679;
$button-danger-disabled-fg-color: #ffffff;
$button-danger-disabled-bg-color: #f5b6bb; // TODO: Verify color
// Toggle switch
$togglesw-off-color: #c1c9d6;
$togglesw-on-color: #7ac9a1;
$togglesw-ball-color: #fff;
// unused?
$progressbar-color: #000;
$room-warning-bg-color: #fff8e3;
$memberstatus-placeholder-color: $roomtile-name-color;
$authpage-bg-color: #2e3649;
$authpage-modal-bg-color: rgba(255, 255, 255, 0.59);
$authpage-body-bg-color: #ffffff;
$authpage-lang-color: #4e5054;
$authpage-body-color: #61708b;
// ***** Mixins! *****
@define-mixin mx_DialogButton {
/* align images in buttons (eg spinners) */
vertical-align: middle;
border: 0px;
border-radius: 36px;
font-family: $font-family;
font-size: 14px;
color: $accent-fg-color;
background-color: $accent-color;
width: auto;
padding: 7px;
padding-left: 1.5em;
padding-right: 1.5em;
cursor: pointer;
display: inline-block;
outline: none;
}
@define-mixin mx_DialogButton_danger {
background-color: $warning-color;
}
@define-mixin mx_DialogButton_hover {
}
@define-mixin mx_DialogButton_small {
@mixin mx_DialogButton;
font-size: 15px;
padding: 0px 1.5em 0px 1.5em;
}
@define-mixin mx_DialogButton_secondary {
// flip colours for the secondary ones
font-weight: 600;
border: 1px solid $accent-color ! important;
color: $accent-color;
background-color: $accent-fg-color;
}

60
res/themes/light/css/_fonts.scss
View file

@ -1,50 +1,36 @@
/*
* Open Sans
* Includes extended Latin, Greek, Cyrillic and Vietnamese character sets
* Nunito.
* Includes extended Latin and Vietnamese character sets
* Current URLs are taken from
* https://github.com/alexeiva/NunitoFont/releases/tag/v3.500
* ...in order to include cyrillic.
*
* Previously, they were
* https://fonts.googleapis.com/css?family=Nunito:400,400i,600,600i,700,700i&subset=latin-ext,vietnamese
*
* We explicitly do not include Nunito's italic variants, as they are not italic enough
* and it's better to rely on the browser's built-in obliquing behaviour.
*/
/* the 'src' links are relative to the bundle.css, which is in a subdirectory.
*/
@font-face {
font-family: 'Open Sans';
src: url('$(res)/fonts/Open_Sans/OpenSans-Regular.ttf') format('truetype');
font-weight: 400;
font-style: normal;
font-family: 'Nunito';
font-style: normal;
font-weight: 400;
src: url('$(res)/fonts/Nunito/Nunito-Regular.ttf') format('truetype');
}
@font-face {
font-family: 'Open Sans';
src: url('$(res)/fonts/Open_Sans/OpenSans-Italic.ttf') format('truetype');
font-weight: 400;
font-style: italic;
font-family: 'Nunito';
font-style: normal;
font-weight: 600;
src: url('$(res)/fonts/Nunito/Nunito-SemiBold.ttf') format('truetype');
}
@font-face {
font-family: 'Open Sans';
src: url('$(res)/fonts/Open_Sans/OpenSans-Semibold.ttf') format('truetype');
font-weight: 600;
font-style: normal;
}
@font-face {
font-family: 'Open Sans';
src: url('$(res)/fonts/Open_Sans/OpenSans-SemiboldItalic.ttf') format('truetype');
font-weight: 600;
font-style: italic;
}
@font-face {
font-family: 'Open Sans';
src: url('$(res)/fonts/Open_Sans/OpenSans-Bold.ttf') format('truetype');
font-weight: 700;
font-style: normal;
}
@font-face {
font-family: 'Open Sans';
src: url('$(res)/fonts/Open_Sans/OpenSans-BoldItalic.ttf') format('truetype');
font-weight: 700;
font-style: italic;
font-family: 'Nunito';
font-style: normal;
font-weight: 700;
src: url('$(res)/fonts/Nunito/Nunito-Bold.ttf') format('truetype');
}
/*

78
res/themes/dharma/css/_dharma.scss → res/themes/light/css/_light.scss
View file

@ -6,6 +6,13 @@
Arial here. */
$font-family: 'Nunito', Arial, Helvetica, Sans-Serif;
// unified palette
// try to use these colors when possible
$accent-color: #03b381;
$notice-primary-color: #ff4b55;
$notice-secondary-color: #61708b;
$header-panel-bg-color: #f2f5f8;
// typical text (dark-on-white in light skin)
$primary-fg-color: #454545;
$primary-bg-color: #ffffff;
@ -18,7 +25,6 @@ $focus-bg-color: #dddddd;
// button UI (white-on-green in light skin)
$accent-fg-color: #ffffff;
$accent-color: #7ac9a1;
$accent-color-50pct: #92caad;
$accent-color-alt: #238CF5;
@ -27,7 +33,7 @@ $selection-fg-color: $primary-bg-color;
$focus-brightness: 105%;
// red warning colour
$warning-color: #f56679;
$warning-color: $notice-primary-color;
// background colour for warnings
$warning-bg-color: #DF2A8B;
$info-bg-color: #2A9EDF;
@ -35,8 +41,8 @@ $mention-user-pill-bg-color: $warning-color;
$other-user-pill-bg-color: rgba(0, 0, 0, 0.1);
// pinned events indicator
$pinned-unread-color: #ff0064; // $warning-color
$pinned-color: #888;
$pinned-unread-color: $notice-primary-color;
$pinned-color: $notice-secondary-color;
// informational plinth
$info-plinth-bg-color: #f7f7f7;
@ -72,11 +78,11 @@ $input-darker-fg-color: #9fa9ba;
$input-lighter-bg-color: #f2f5f8;
$input-lighter-fg-color: $input-darker-fg-color;
$input-focused-border-color: #238cf5;
$input-valid-border-color: #7ac9a1;
$input-valid-border-color: $accent-color;
$field-focused-label-bg-color: #ffffff;
$button-bg-color: #7ac9a1;
$button-bg-color: $accent-color;
$button-fg-color: white;
// apart from login forms, which have stronger border
@ -91,6 +97,7 @@ $scrollbar-track-color: transparent;
// context menus
$menu-border-color: #ebedf8;
$menu-bg-color: #fff;
$menu-box-shadow-color: rgba(118, 131, 156, 0.6);
$menu-selected-color: #f5f8fa;
$avatar-initial-color: #ffffff;
@ -139,11 +146,16 @@ $rte-group-pill-color: #aaa;
$topleftmenu-color: #212121;
$roomheader-color: #45474a;
$roomheader-addroom-color: #91A1C0;
$tagpanel-button-color: #91A1C0;
$roomheader-button-color: #91A1C0;
$groupheader-button-color: #91A1C0;
$rightpanel-button-color: #91A1C0;
$composer-button-color: #91A1C0;
$roomtopic-color: #9fa9ba;
$eventtile-meta-color: $roomtopic-color;
$composer-e2e-icon-color: #c9ced6;
$header-divider-color: #e6eaee;
$header-divider-color: #91A1C0;
// ********************
@ -153,14 +165,14 @@ $roomtile-notified-color: #212121;
$roomtile-selected-bg-color: #fff;
$roomtile-focused-bg-color: #fff;
$username-variant1-color: #1e7ddc;
$username-variant2-color: #a756a8;
$username-variant3-color: #7ac9a1;
$username-variant4-color: #f2809d;
$username-variant5-color: #ffc666;
$username-variant6-color: #76ddd7;
$username-variant7-color: #45529b;
$username-variant8-color: #bfd251;
$username-variant1-color: #368bd6;
$username-variant2-color: #ac3ba8;
$username-variant3-color: #03b381;
$username-variant4-color: #e64f7a;
$username-variant5-color: #ff812d;
$username-variant6-color: #2dc2c5;
$username-variant7-color: #5c56f5;
$username-variant8-color: #74d12c;
$roomtile-transparent-focused-color: rgba(0, 0, 0, 0.1);
@ -206,26 +218,24 @@ $lightbox-border-color: #ffffff;
$tab-label-fg-color: #45474a;
$tab-label-active-fg-color: #ffffff;
$tab-label-bg-color: transparent;
$tab-label-active-bg-color: #7ac9a1;
$tab-label-active-bg-color: $accent-color;
$tab-label-icon-bg-color: #454545;
$tab-label-active-icon-bg-color: #ffffff;
// Buttons
$button-primary-fg-color: #ffffff;
$button-primary-bg-color: #7ac9a1;
$button-primary-disabled-fg-color: #ffffff;
$button-primary-disabled-bg-color: #bce4d0;
$button-primary-bg-color: $accent-color;
$button-secondary-bg-color: $accent-fg-color;
$button-danger-fg-color: #ffffff;
$button-danger-bg-color: #f56679;
$button-danger-bg-color: $notice-primary-color;
$button-danger-disabled-fg-color: #ffffff;
$button-danger-disabled-bg-color: #f5b6bb; // TODO: Verify color
// Toggle switch
$togglesw-off-color: #c1c9d6;
$togglesw-on-color: #7ac9a1;
$togglesw-on-color: $accent-color;
$togglesw-ball-color: #fff;
// unused?
$progressbar-color: #000;
$room-warning-bg-color: #fff8e3;
@ -236,7 +246,10 @@ $authpage-bg-color: #2e3649;
$authpage-modal-bg-color: rgba(255, 255, 255, 0.59);
$authpage-body-bg-color: #ffffff;
$authpage-lang-color: #4e5054;
$authpage-body-color: #61708b;
$authpage-primary-color: #454545;
$authpage-secondary-color: #61708b;
$panel-gradient: rgba(242, 245, 248, 0), rgba(242, 245, 248, 1);
/*** form elements ***/
@ -271,23 +284,13 @@ $authpage-body-color: #61708b;
border: none;
flex: 1;
color: $primary-fg-color;
},
}
input::placeholder {
color: $roomsublist-label-fg-color;
color: $roomsublist-label-fg-color;
}
}
}
input[type=text],
input[type=search],
input[type=password] {
padding: 9px;
font-family: $font-family;
font-size: 14px;
font-weight: 600;
min-width: 0;
}
/*** panels ***/
.dark-panel {
background-color: $secondary-accent-color;
@ -320,7 +323,6 @@ input[type=search].mx_textinput_icon {
background-position: 10px center;
}
// FIXME THEME - Tint by CSS rather than referencing a duplicate asset
input[type=text].mx_textinput_icon.mx_textinput_search,
input[type=search].mx_textinput_icon.mx_textinput_search {
@ -333,7 +335,7 @@ input[type=search]::-webkit-search-decoration,
input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-results-button,
input[type=search]::-webkit-search-results-decoration {
display: none;
display: none;
}
.input[type=text]::-webkit-input-placeholder,
@ -387,5 +389,5 @@ textarea::placeholder {
font-weight: 600;
border: 1px solid $accent-color ! important;
color: $accent-color;
background-color: $accent-fg-color;
background-color: $button-secondary-bg-color;
}

2
res/themes/light/css/light.scss
View file

@ -1,4 +1,4 @@
@import "_paths.scss";
@import "_fonts.scss";
@import "_base.scss";
@import "_light.scss";
@import "../../../../res/css/_components.scss";

2
src/MatrixClientPeg.js
View file

@ -177,7 +177,7 @@ class MatrixClientPeg {
userId: creds.userId,
deviceId: creds.deviceId,
timelineSupport: true,
forceTURN: !SettingsStore.getValue('webRtcForcePeerToPeer', false),
forceTURN: !SettingsStore.getValue('webRtcAllowPeerToPeer', false),
verificationMethods: [verificationMethods.SAS]
};

23
src/components/structures/GroupView.js
View file

@ -1157,7 +1157,6 @@ export default React.createClass({
render: function() {
const GroupAvatar = sdk.getComponent("avatars.GroupAvatar");
const Spinner = sdk.getComponent("elements.Spinner");
const TintableSvg = sdk.getComponent("elements.TintableSvg");
const GeminiScrollbarWrapper = sdk.getComponent("elements.GeminiScrollbarWrapper");
if (this.state.summaryLoading && this.state.error === null || this.state.saving) {
@ -1248,13 +1247,17 @@ export default React.createClass({
if (this.state.editing) {
rightButtons.push(
<AccessibleButton className="mx_GroupView_textButton mx_RoomHeader_textButton"
onClick={this._onSaveClick} key="_saveButton"
key="_saveButton"
onClick={this._onSaveClick}
>
{ _t('Save') }
</AccessibleButton>,
);
rightButtons.push(
<AccessibleButton className="mx_RoomHeader_cancelButton" onClick={this._onCancelClick} key="_cancelButton">
<AccessibleButton className="mx_RoomHeader_cancelButton"
key="_cancelButton"
onClick={this._onCancelClick}
>
<img src={require("../../../res/img/cancel.svg")} className="mx_filterFlipColor"
width="18" height="18" alt={_t("Cancel")} />
</AccessibleButton>,
@ -1262,16 +1265,20 @@ export default React.createClass({
} else {
if (summary.user && summary.user.membership === 'join') {
rightButtons.push(
<AccessibleButton className="mx_GroupHeader_button"
onClick={this._onEditClick} title={_t("Community Settings")} key="_editButton"
<AccessibleButton className="mx_GroupHeader_button mx_GroupHeader_editButton"
key="_editButton"
onClick={this._onEditClick}
title={_t("Community Settings")}
>
<TintableSvg src={require("../../../res/img/icons-settings-room.svg")} width="16" height="16" />
</AccessibleButton>,
);
}
rightButtons.push(
<AccessibleButton className="mx_GroupHeader_button" onClick={this._onShareClick} title={_t('Share Community')} key="_shareButton">
<TintableSvg src={require("../../../res/img/icons-share.svg")} width="16" height="16" />
<AccessibleButton className="mx_GroupHeader_button mx_GroupHeader_shareButton"
key="_shareButton"
onClick={this._onShareClick}
title={_t('Share Community')}
>
</AccessibleButton>,
);
}

8
src/components/structures/MatrixChat.js
View file

@ -654,11 +654,9 @@ export default React.createClass({
});
break;
}
// case 'set_theme':
// disable changing the theme for now
// as other themes are not compatible with dharma
// this._onSetTheme(payload.value);
// break;
case 'set_theme':
this._onSetTheme(payload.value);
break;
case 'on_logging_in':
// We are now logging in, so set the state to reflect that
// NB. This does not touch 'ready' since if our dispatches

8
src/components/views/elements/ManageIntegsButton.js
View file

@ -24,7 +24,6 @@ import ScalarMessaging from '../../../ScalarMessaging';
import Modal from "../../../Modal";
import { _t } from '../../../languageHandler';
import AccessibleButton from './AccessibleButton';
import TintableSvg from './TintableSvg';
export default class ManageIntegsButton extends React.Component {
constructor(props) {
@ -76,6 +75,7 @@ export default class ManageIntegsButton extends React.Component {
if (this.scalarClient !== null) {
const integrationsButtonClasses = classNames({
mx_RoomHeader_button: true,
mx_RoomHeader_manageIntegsButton: true,
mx_ManageIntegsButton_error: !!this.state.scalarError,
});
@ -94,8 +94,10 @@ export default class ManageIntegsButton extends React.Component {
}
integrationsButton = (
<AccessibleButton className={integrationsButtonClasses} onClick={this.onManageIntegrations} title={_t('Manage Integrations')}>
<TintableSvg src={require("../../../../res/img/feather-icons/grid.svg")} width="20" height="20" />
<AccessibleButton className={integrationsButtonClasses}
onClick={this.onManageIntegrations}
title={_t('Manage Integrations')}
>
{ integrationsWarningTriangle }
{ integrationsErrorPopup }
</AccessibleButton>

6
src/components/views/right_panel/GroupHeaderButtons.js
View file

@ -65,12 +65,14 @@ export default class GroupHeaderButtons extends HeaderButtons {
];
return [
<HeaderButton key="_groupMembersButton" title={_t('Members')} iconSrc={require("../../../../res/img/icons-people.svg")}
<HeaderButton key="groupMembersButton" name="groupMembersButton"
title={_t('Members')}
isHighlighted={this.isPhase(groupPhases)}
clickPhase={RightPanel.Phase.GroupMemberList}
analytics={['Right Panel', 'Group Member List Button', 'click']}
/>,
<HeaderButton key="_roomsButton" title={_t('Rooms')} iconSrc={require("../../../../res/img/icons-room-nobg.svg")}
<HeaderButton key="roomsButton" name="roomsButton"
title={_t('Rooms')}
isHighlighted={this.isPhase(roomPhases)}
clickPhase={RightPanel.Phase.GroupRoomList}
analytics={['Right Panel', 'Group Room List Button', 'click']}

11
src/components/views/right_panel/HeaderButton.js
View file

@ -23,7 +23,6 @@ import classNames from 'classnames';
import dis from '../../../dispatcher';
import Analytics from '../../../Analytics';
import AccessibleButton from '../elements/AccessibleButton';
import TintableSvg from '../elements/TintableSvg';
export default class HeaderButton extends React.Component {
constructor() {
@ -44,6 +43,7 @@ export default class HeaderButton extends React.Component {
const classes = classNames({
mx_RightPanel_headerButton: true,
mx_RightPanel_headerButton_highlight: this.props.isHighlighted,
[`mx_RightPanel_${this.props.name}`]: true,
});
return <AccessibleButton
@ -51,9 +51,8 @@ export default class HeaderButton extends React.Component {
aria-expanded={this.props.isHighlighted}
title={this.props.title}
className={classes}
onClick={this.onClick} >
<TintableSvg src={this.props.iconSrc} width="20" height="20" />
</AccessibleButton>;
onClick={this.onClick}>
</AccessibleButton>;
}
}
@ -62,14 +61,14 @@ HeaderButton.propTypes = {
isHighlighted: PropTypes.bool.isRequired,
// The phase to swap to when the button is clicked
clickPhase: PropTypes.string.isRequired,
// The source file of the icon to display
iconSrc: PropTypes.string.isRequired,
// The badge to display above the icon
badge: PropTypes.node,
// The parameters to track the click event
analytics: PropTypes.arrayOf(PropTypes.string).isRequired,
// Button name
name: PropTypes.string.isRequired,
// Button title
title: PropTypes.string.isRequired,
};

9
src/components/views/right_panel/RoomHeaderButtons.js
View file

@ -52,17 +52,20 @@ export default class RoomHeaderButtons extends HeaderButtons {
];
return [
<HeaderButton key="_membersButton" title={_t('Members')} iconSrc={require("../../../../res/img/feather-icons/user.svg")}
<HeaderButton key="membersButton" name="membersButton"
title={_t('Members')}
isHighlighted={this.isPhase(membersPhases)}
clickPhase={RightPanel.Phase.RoomMemberList}
analytics={['Right Panel', 'Member List Button', 'click']}
/>,
<HeaderButton key="_filesButton" title={_t('Files')} iconSrc={require("../../../../res/img/feather-icons/files.svg")}
<HeaderButton key="filesButton" name="filesButton"
title={_t('Files')}
isHighlighted={this.isPhase(RightPanel.Phase.FilePanel)}
clickPhase={RightPanel.Phase.FilePanel}
analytics={['Right Panel', 'File List Button', 'click']}
/>,
<HeaderButton key="_notifsButton" title={_t('Notifications')} iconSrc={require("../../../../res/img/feather-icons/notifications.svg")}
<HeaderButton key="notifsButton" name="notifsButton"
title={_t('Notifications')}
isHighlighted={this.isPhase(RightPanel.Phase.NotificationPanel)}
clickPhase={RightPanel.Phase.NotificationPanel}
analytics={['Right Panel', 'Notification List Button', 'click']}

30
src/components/views/rooms/MessageComposer.js
View file

@ -306,7 +306,6 @@ export default class MessageComposer extends React.Component {
render() {
const uploadInputStyle = {display: 'none'};
const MemberStatusMessageAvatar = sdk.getComponent('avatars.MemberStatusMessageAvatar');
const TintableSvg = sdk.getComponent("elements.TintableSvg");
const MessageComposerInput = sdk.getComponent("rooms.MessageComposerInput");
const controls = [];
@ -335,17 +334,26 @@ export default class MessageComposer extends React.Component {
// Call buttons
if (this.props.callState && this.props.callState !== 'ended') {
hangupButton =
<AccessibleButton key="controls_hangup" className="mx_MessageComposer_hangup" onClick={this.onHangupClick}>
<img src={require("../../../../res/img/hangup.svg")} alt={_t('Hangup')} title={_t('Hangup')} width="25" height="25" />
<AccessibleButton className="mx_MessageComposer_button mx_MessageComposer_hangup"
key="controls_hangup"
onClick={this.onHangupClick}
title={_t('Hangup')}
>
</AccessibleButton>;
} else {
callButton =
<AccessibleButton key="controls_call" className="mx_MessageComposer_voicecall" onClick={this.onVoiceCallClick} title={_t('Voice call')}>
<TintableSvg src={require("../../../../res/img/feather-icons/phone.svg")} width="20" height="20" />
<AccessibleButton className="mx_MessageComposer_button mx_MessageComposer_voicecall"
key="controls_call"
onClick={this.onVoiceCallClick}
title={_t('Voice call')}
>
</AccessibleButton>;
videoCallButton =
<AccessibleButton key="controls_videocall" className="mx_MessageComposer_videocall" onClick={this.onCallClick} title={_t('Video call')}>
<TintableSvg src={require("../../../../res/img/feather-icons/video.svg")} width="20" height="20" />
<AccessibleButton className="mx_MessageComposer_button mx_MessageComposer_videocall"
key="controls_videocall"
onClick={this.onCallClick}
title={_t('Video call')}
>
</AccessibleButton>;
}
@ -385,9 +393,11 @@ export default class MessageComposer extends React.Component {
// check separately for whether we can call, but this is slightly
// complex because of conference calls.
const uploadButton = (
<AccessibleButton key="controls_upload" className="mx_MessageComposer_upload"
onClick={this.onUploadClick} title={_t('Upload file')}>
<TintableSvg src={require("../../../../res/img/feather-icons/paperclip.svg")} width="20" height="20" />
<AccessibleButton className="mx_MessageComposer_button mx_MessageComposer_upload"
key="controls_upload"
onClick={this.onUploadClick}
title={_t('Upload file')}
>
<input ref="uploadInput" type="file"
style={uploadInputStyle}
multiple

26
src/components/views/rooms/RoomHeader.js
View file

@ -154,7 +154,6 @@ module.exports = React.createClass({
render: function() {
const RoomAvatar = sdk.getComponent("avatars.RoomAvatar");
const TintableSvg = sdk.getComponent("elements.TintableSvg");
const EmojiText = sdk.getComponent('elements.EmojiText');
let searchStatus = null;
@ -228,8 +227,10 @@ module.exports = React.createClass({
if (this.props.onSettingsClick) {
settingsButton =
<AccessibleButton className="mx_RoomHeader_button" onClick={this.props.onSettingsClick} title={_t("Settings")}>
<TintableSvg src={require("../../../../res/img/feather-icons/settings.svg")} width="20" height="20" />
<AccessibleButton className="mx_RoomHeader_button mx_RoomHeader_settingsButton"
onClick={this.props.onSettingsClick}
title={_t("Settings")}
>
</AccessibleButton>;
}
@ -245,7 +246,6 @@ module.exports = React.createClass({
<AccessibleButton className="mx_RoomHeader_button mx_RoomHeader_pinnedButton"
onClick={this.props.onPinnedClick} title={_t("Pinned Messages")}>
{ pinsIndicator }
<TintableSvg src={require("../../../../res/img/icons-pin.svg")} width="16" height="16" />
</AccessibleButton>;
}
@ -260,24 +260,30 @@ module.exports = React.createClass({
let forgetButton;
if (this.props.onForgetClick) {
forgetButton =
<AccessibleButton className="mx_RoomHeader_button" onClick={this.props.onForgetClick} title={_t("Forget room")}>
<TintableSvg src={require("../../../../res/img/leave.svg")} width="26" height="20" />
<AccessibleButton className="mx_RoomHeader_button mx_RoomHeader_forgetButton"
onClick={this.props.onForgetClick}
title={_t("Forget room")}
>
</AccessibleButton>;
}
let searchButton;
if (this.props.onSearchClick && this.props.inRoom) {
searchButton =
<AccessibleButton className="mx_RoomHeader_button" onClick={this.props.onSearchClick} title={_t("Search")}>
<TintableSvg src={require("../../../../res/img/feather-icons/search.svg")} width="20" height="20" />
<AccessibleButton className="mx_RoomHeader_button mx_RoomHeader_searchButton"
onClick={this.props.onSearchClick}
title={_t("Search")}
>
</AccessibleButton>;
}
let shareRoomButton;
if (this.props.inRoom) {
shareRoomButton =
<AccessibleButton className="mx_RoomHeader_button" onClick={this.onShareRoomClick} title={_t('Share room')}>
<TintableSvg src={require("../../../../res/img/feather-icons/share.svg")} width="20" height="20" />
<AccessibleButton className="mx_RoomHeader_button mx_RoomHeader_shareButton"
onClick={this.onShareRoomClick}
title={_t('Share room')}
>
</AccessibleButton>;
}

13
src/components/views/rooms/Stickerpicker.js
View file

@ -322,7 +322,6 @@ export default class Stickerpicker extends React.Component {
}
render() {
const TintableSvg = sdk.getComponent("elements.TintableSvg");
const ContextualMenu = sdk.getComponent('structures.ContextualMenu');
const GenericElementContextMenu = sdk.getComponent('context_menus.GenericElementContextMenu');
let stickersButton;
@ -348,11 +347,11 @@ export default class Stickerpicker extends React.Component {
<AccessibleButton
id='stickersButton'
key="controls_hide_stickers"
className="mx_MessageComposer_stickers mx_Stickers_hideStickers"
className="mx_MessageComposer_button mx_MessageComposer_stickers mx_Stickers_hideStickers"
onClick={this._onHideStickersClick}
ref='target'
title={_t("Hide Stickers")}>
<TintableSvg src={require("../../../../res/img/feather-icons/face.svg")} width="20" height="20" />
title={_t("Hide Stickers")}
>
</AccessibleButton>;
} else {
// Show show-stickers button
@ -360,10 +359,10 @@ export default class Stickerpicker extends React.Component {
<AccessibleButton
id='stickersButton'
key="controls_show_stickers"
className="mx_MessageComposer_stickers"
className="mx_MessageComposer_button mx_MessageComposer_stickers"
onClick={this._onShowStickersClick}
title={_t("Show Stickers")}>
<TintableSvg src={require("../../../../res/img/feather-icons/face.svg")} width="20" height="20" />
title={_t("Show Stickers")}
>
</AccessibleButton>;
}
return <div>

10
src/components/views/settings/tabs/GeneralUserSettingsTab.js
View file

@ -54,6 +54,7 @@ export default class GeneralUserSettingsTab extends React.Component {
if (this.state.theme === newTheme) return;
SettingsStore.setValue("theme", null, SettingLevel.ACCOUNT, newTheme);
this.setState({theme: newTheme});
dis.dispatch({action: 'set_theme', value: newTheme});
};
@ -138,17 +139,14 @@ export default class GeneralUserSettingsTab extends React.Component {
}
_renderThemeSection() {
// TODO: Re-enable theme selection once the themes actually work
const SettingsFlag = sdk.getComponent("views.elements.SettingsFlag");
return (
<div className="mx_SettingsTab_section mx_GeneralUserSettingsTab_themeSection">
<span className="mx_SettingsTab_subheading">{_t("Theme")}</span>
<Field id="theme" label={_t("Theme")} element="select" disabled={true}
<Field id="theme" label={_t("Theme")} element="select"
value={this.state.theme} onChange={this._onThemeChange}>
<option value="light">{_t("Light theme")}</option>
<option value="light">{_t("Default theme")}</option>
<option value="dark">{_t("Dark theme")}</option>
<option value="dharma">{_t("2018 theme")}</option>
<option value="status">{_t("Status.im theme")}</option>
</Field>
<SettingsFlag name="useCompactLayout" level={SettingLevel.ACCOUNT} />
</div>
@ -164,7 +162,7 @@ export default class GeneralUserSettingsTab extends React.Component {
{_t("Deactivating your account is a permanent action - be careful!")}
</span>
<AccessibleButton onClick={this._onDeactivateClicked} kind="danger">
{_t("Close Account")}
{_t("Deactivate Account")}
</AccessibleButton>
</div>
);

2
src/components/views/settings/tabs/VoiceSettingsTab.js
View file

@ -174,7 +174,7 @@ export default class VoiceSettingsTab extends React.Component {
{microphoneDropdown}
{webcamDropdown}
<SettingsFlag name='VideoView.flipVideoHorizontally' level={SettingLevel.ACCOUNT} />
<SettingsFlag name='webRtcForcePeerToPeer' level={SettingLevel.DEVICE} onChange={this._changeWebRtcMethod} />
<SettingsFlag name='webRtcAllowPeerToPeer' level={SettingLevel.DEVICE} onChange={this._changeWebRtcMethod} />
</div>
</div>
);

2
src/i18n/strings/bg.json
View file

@ -1515,7 +1515,7 @@
"2018 theme": "Тема 2018",
"Account management": "Управление на акаунта",
"Deactivating your account is a permanent action - be careful!": "Деактивирането на акаунта е необратимо действие - внимавайте!",
"Close Account": "Затвори акаунта",
"Deactivate Account": "Затвори акаунта",
"For help with using Riot, click <a>here</a>.": "За помощ при използването на Riot, кликнете <a>тук</a>.",
"For help with using Riot, click <a>here</a> or start a chat with our bot using the button below.": "За помощ при използването на Riot, кликнете <a>тук</a> или започнете чат с бота ни използвайки бутона по-долу.",
"Chat with Riot Bot": "Чати с Riot Bot",

2
src/i18n/strings/de_DE.json
View file

@ -1516,7 +1516,7 @@
"Theme": "Design",
"2018 theme": "2018 Design",
"Account management": "Benutzerkontenverwaltung",
"Close Account": "Benutzerkonto schließen",
"Deactivate Account": "Benutzerkonto schließen",
"For help with using Riot, click <a>here</a>.": "Um Hilfe zur Benutzung von Riot zu erhalten, klicke <a>hier</a>.",
"For help with using Riot, click <a>here</a> or start a chat with our bot using the button below.": "Um Hilfe zur Benutzung von Riot zu erhalten, klicke <a>hier</a> oder beginne einen Chat mit unserem Bot, indem du den unteren Button klickst.",
"Chat with Riot Bot": "Chatte mit dem Riot Bot",

11
src/i18n/strings/en_EN.json
View file

@ -292,7 +292,7 @@
"Automatically replace plain text Emoji": "Automatically replace plain text Emoji",
"Mirror local video feed": "Mirror local video feed",
"Enable Community Filter Panel": "Enable Community Filter Panel",
"Disable Peer-to-Peer for 1:1 calls": "Disable Peer-to-Peer for 1:1 calls",
"Allow Peer-to-Peer for 1:1 calls": "Allow Peer-to-Peer for 1:1 calls",
"Send analytics data": "Send analytics data",
"Never send encrypted messages to unverified devices from this device": "Never send encrypted messages to unverified devices from this device",
"Never send encrypted messages to unverified devices in this room from this device": "Never send encrypted messages to unverified devices in this room from this device",
@ -522,13 +522,11 @@
"Phone numbers": "Phone numbers",
"Language and region": "Language and region",
"Theme": "Theme",
"Light theme": "Light theme",
"Default theme": "Default theme",
"Dark theme": "Dark theme",
"2018 theme": "2018 theme",
"Status.im theme": "Status.im theme",
"Account management": "Account management",
"Deactivating your account is a permanent action - be careful!": "Deactivating your account is a permanent action - be careful!",
"Close Account": "Close Account",
"Deactivate Account": "Deactivate Account",
"Legal": "Legal",
"For help with using Riot, click <a>here</a>.": "For help with using Riot, click <a>here</a>.",
"For help with using Riot, click <a>here</a> or start a chat with our bot using the button below.": "For help with using Riot, click <a>here</a> or start a chat with our bot using the button below.",
@ -1205,6 +1203,7 @@
"Quote": "Quote",
"Source URL": "Source URL",
"Collapse Reply Thread": "Collapse Reply Thread",
"End-to-end encryption information": "End-to-end encryption information",
"Failed to set Direct Message status of room": "Failed to set Direct Message status of room",
"unknown error code": "unknown error code",
"Failed to forget room %(errCode)s": "Failed to forget room %(errCode)s",
@ -1475,7 +1474,6 @@
"unencrypted": "unencrypted",
"Decryption error": "Decryption error",
"Session ID": "Session ID",
"End-to-end encryption information": "End-to-end encryption information",
"Event information": "Event information",
"Sender device information": "Sender device information",
"Passphrases must match": "Passphrases must match",
@ -1536,7 +1534,6 @@
"If you didn't set the new recovery method, an attacker may be trying to access your account. Change your account password and set a new recovery method immediately in Settings.": "If you didn't set the new recovery method, an attacker may be trying to access your account. Change your account password and set a new recovery method immediately in Settings.",
"This device is encrypting history using the new recovery method.": "This device is encrypting history using the new recovery method.",
"Go to Settings": "Go to Settings",
"Setting up Secure Messages on this device will re-encrypt this device's message history with the new recovery method.": "Setting up Secure Messages on this device will re-encrypt this device's message history with the new recovery method.",
"Set up Secure Messages": "Set up Secure Messages",
"Recovery Method Removed": "Recovery Method Removed",
"This device has detected that your recovery passphrase and key for Secure Messages have been removed.": "This device has detected that your recovery passphrase and key for Secure Messages have been removed.",

2
src/i18n/strings/eu.json
View file

@ -1586,7 +1586,7 @@
"2018 theme": "2018ko itxura",
"Account management": "Kontuen kudeaketa",
"Deactivating your account is a permanent action - be careful!": "Kontua desgaitzea behin betiko ekintza bat da, kontuz ibili!",
"Close Account": "Itxi kontua",
"Deactivate Account": "Itxi kontua",
"For help with using Riot, click <a>here</a>.": "Riot erabiltzeko laguntza behar baduzu, egin klik <a>hemen</a>.",
"For help with using Riot, click <a>here</a> or start a chat with our bot using the button below.": "Riot erabiltzeko laguntza behar baduzu, egin klik <a>hemen</a> edo hasi txat bat gure botarekin beheko botoia sakatuz.",
"Chat with Riot Bot": "Txateatu Riot botarekin",

2
src/i18n/strings/fr.json
View file

@ -1526,7 +1526,7 @@
"2018 theme": "Thème 2018",
"Account management": "Gestion du compte",
"Deactivating your account is a permanent action - be careful!": "La désactivation du compte est une action permanente. Soyez prudent !",
"Close Account": "Fermer le compte",
"Deactivate Account": "Fermer le compte",
"For help with using Riot, click <a>here</a>.": "Pour obtenir de l'aide sur l'utilisation de Riot, cliquez <a>ici</a>.",
"For help with using Riot, click <a>here</a> or start a chat with our bot using the button below.": "Pour obtenir de l'aide sur l'utilisation de Riot, cliquez <a>ici</a> ou commencez une discussion avec notre bot en utilisant le bouton ci-dessous.",
"Start a chat with Riot Bot": "Commencer une discussion avec le bot Riot",

2
src/i18n/strings/hu.json
View file

@ -1525,7 +1525,7 @@
"2018 theme": "2018-as téma",
"Account management": "Fiók menedzsment",
"Deactivating your account is a permanent action - be careful!": "A fiók felfüggesztése végleges - légy óvatos!",
"Close Account": "Fiók bezárása",
"Deactivate Account": "Fiók bezárása",
"For help with using Riot, click <a>here</a>.": "A Riot használatában való segítséghez kattints <a>ide</a>.",
"For help with using Riot, click <a>here</a> or start a chat with our bot using the button below.": "A Riot használatában való segítségér kattints <a>ide</a> vagy kezdj beszélgetni a botunkkal az alábbi gombra kattintva.",
"Start a chat with Riot Bot": "Csevegés kezdése a Riot Bottal",

14
src/i18n/strings/ja.json
View file

@ -300,10 +300,10 @@
"Add rooms to the community": "コミュニティに部屋を追加します",
"Room name or alias": "部屋名またはエイリアス",
"Add to community": "コミュニティに追加",
"Failed to invite the following users to %(groupId)s:": "次のユーザーを ％(groupId)s に招待できませんでした:",
"Failed to invite the following users to %(groupId)s:": "次のユーザーを %(groupId)s に招待できませんでした:",
"Failed to invite users to community": "ユーザーをコミュニティに招待できませんでした",
"Failed to invite users to %(groupId)s": "ユーザーを %(groupId)s に招待できませんでした",
"Failed to add the following rooms to %(groupId)s:": "次の部屋を ％(groupId)s に追加できませんでした:",
"Failed to add the following rooms to %(groupId)s:": "次の部屋を %(groupId)s に追加できませんでした:",
"Riot does not have permission to send you notifications - please check your browser settings": "Riotに通知を送信する権限がありません - ブラウザの設定を確認してください",
"Riot was not given permission to send notifications - please try again": "Riotに通知を送信する権限がありませんでした。もう一度お試しください",
"Unable to enable Notifications": "通知を有効にできません",
@ -323,7 +323,7 @@
"Send Invites": "招待状を送る",
"Failed to invite user": "ユーザーを招待できませんでした",
"Failed to invite": "招待できませんでした",
"Failed to invite the following users to the %(roomName)s room:": "次のユーザーを ％(roomName)s の部屋に招待できませんでした:",
"Failed to invite the following users to the %(roomName)s room:": "次のユーザーを %(roomName)s の部屋に招待できませんでした:",
"You need to be logged in.": "ログインする必要があります。",
"You need to be able to invite users to do that.": "それをするためにユーザーを招待できる必要があります。",
"Unable to create widget.": "ウィジェットを作成できません。",
@ -363,9 +363,9 @@
"Unknown (user, device) pair:": "不明な(ユーザー、端末) ペア:",
"Device already verified!": "端末はすでに確認済みです！",
"WARNING: Device already verified, but keys do NOT MATCH!": "警告：端末はすでに検証済みですが、キーは一致しません！",
"WARNING: KEY VERIFICATION FAILED! The signing key for %(userId)s and device %(deviceId)s is \"%(fprint)s\" which does not match the provided key \"%(fingerprint)s\". This could mean your communications are being intercepted!": "警告: キー確認が失敗しました! %(userId)s と端末 ％(deviceId)s の署名鍵は、提供された鍵 \"％(fingerprint)s\" と一致しない \"%(fprint)s\" です。 通信が傍受されている可能性があります!",
"WARNING: KEY VERIFICATION FAILED! The signing key for %(userId)s and device %(deviceId)s is \"%(fprint)s\" which does not match the provided key \"%(fingerprint)s\". This could mean your communications are being intercepted!": "警告: キー確認が失敗しました! %(userId)s と端末 %(deviceId)s の署名鍵は、提供された鍵 \"%(fingerprint)s\" と一致しない \"%(fprint)s\" です。 通信が傍受されている可能性があります!",
"Verified key": "確認済みのキー",
"The signing key you provided matches the signing key you received from %(userId)s's device %(deviceId)s. Device marked as verified.": "指定した署名鍵は、％(userId)s の端末％(deviceId)s から受け取った署名鍵と一致します。端末を検証済みとしてマークしました。",
"The signing key you provided matches the signing key you received from %(userId)s's device %(deviceId)s. Device marked as verified.": "指定した署名鍵は、%(userId)s の端末%(deviceId)s から受け取った署名鍵と一致します。端末を検証済みとしてマークしました。",
"Displays action": "アクションを表示",
"Forces the current outbound group session in an encrypted room to be discarded": "暗号化されたルーム内の現在のアウトバウンドグループセッションを強制的に破棄します",
"Unrecognised command:": "認識できないコマンド:",
@ -609,7 +609,7 @@
"Replying": "返信中",
"Failed to set avatar.": "アバターを設定できませんでした。",
"Save": "保存",
"(~%(count)s results)|other": "(~％(count)s 結果)",
"(~%(count)s results)|other": "(~%(count)s 結果)",
"(~%(count)s results)|one": "(~%(count)s 結果)",
"Join Room": "部屋に入る",
"Remove avatar": "アバターを削除",
@ -641,7 +641,7 @@
"Rejoin": "再参加",
"You have been kicked from %(roomName)s by %(userName)s.": "あなたは %(userName)s により %(roomName)s から追放されました。",
"You have been kicked from this room by %(userName)s.": "あなたは %(userName)s によりこの部屋から追放されました。",
"You have been banned from %(roomName)s by %(userName)s.": "あなたは ％(userName)s により %(roomName)s からブロックされました。",
"You have been banned from %(roomName)s by %(userName)s.": "あなたは %(userName)s により %(roomName)s からブロックされました。",
"You have been banned from this room by %(userName)s.": "あなたは %(userName)s によってこの部屋からブロックされました。",
"This room": "この部屋",
"%(roomName)s does not exist.": "%(roomName)s は存在しません。",

2
src/i18n/strings/ru.json
View file

@ -1393,7 +1393,7 @@
"Developer options": "Параметры разработчика",
"General": "Основной",
"Set a new account password...": "Установить новый пароль учетной записи...",
"Close Account": "Закрыть аккаунт",
"Deactivate Account": "Закрыть аккаунт",
"Legal": "Правовой",
"At this time it is not possible to reply with an emote.": "В настоящее время невозможно ответить с помощью эмоции.",
"Room avatar": "Аватар комнаты",

2
src/i18n/strings/sq.json
View file

@ -1490,7 +1490,7 @@
"2018 theme": "Temë e 2018-s",
"Account management": "Administrim llogarish",
"Deactivating your account is a permanent action - be careful!": "Çaktivizimi i llogarisë tuaj është një veprim i pakthyeshëm - hapni sytë!",
"Close Account": "Mbylleni Llogarinë",
"Deactivate Account": "Mbylleni Llogarinë",
"For help with using Riot, click <a>here</a>.": "Për ndihmë rreth përdorimit të Riot-it, klikoni <a>këtu</a>.",
"For help with using Riot, click <a>here</a> or start a chat with our bot using the button below.": "Për ndihmë rreth përdorimit të Riot-it, klikoni <a>këtu</a>, ose nisni një fjalosje me robotin tonë duke përdorur butonin më poshtë.",
"Help & About": "Ndihmë & Rreth",

2
src/i18n/strings/zh_Hant.json
View file

@ -1524,7 +1524,7 @@
"Account management": "帳號管理",
"2018 theme": "2018 主題",
"Deactivating your account is a permanent action - be careful!": "停用您的帳號是永久動作，請小心！",
"Close Account": "關閉帳號",
"Deactivate Account": "關閉帳號",
"For help with using Riot, click <a>here</a>.": "對於使用 Riot 的說明，點選<a>這裡</a>。",
"For help with using Riot, click <a>here</a> or start a chat with our bot using the button below.": "對於使用 Riot 的說明，點選<a>這裡</a>或是使用下面的按鈕開始與我們的機器人聊天。",
"Chat with Riot Bot": "與 Riot 機器人聊天",

10
src/settings/Settings.js
View file

@ -22,6 +22,7 @@ import {
NotificationsEnabledController,
} from "./controllers/NotificationControllers";
import CustomStatusController from "./controllers/CustomStatusController";
import ThemeController from './controllers/ThemeController';
// These are just a bunch of helper arrays to avoid copy/pasting a bunch of times
const LEVELS_ROOM_SETTINGS = ['device', 'room-device', 'room-account', 'account', 'config'];
@ -231,12 +232,13 @@ export const SETTINGS = {
invertedSettingName: 'TagPanel.disableTagPanel',
},
"theme": {
supportedLevels: ['config'],
default: "dharma",
supportedLevels: LEVELS_ACCOUNT_SETTINGS,
default: "light",
controller: new ThemeController(),
},
"webRtcForcePeerToPeer": {
"webRtcAllowPeerToPeer": {
supportedLevels: LEVELS_DEVICE_ONLY_SETTINGS_WITH_CONFIG,
displayName: _td('Disable Peer-to-Peer for 1:1 calls'),
displayName: _td('Allow Peer-to-Peer for 1:1 calls'),
default: true,
invertedSettingName: 'webRtcForceTURN',
},

33
src/settings/controllers/ThemeController.js Normal file
View file

@ -0,0 +1,33 @@
/*
Copyright 2019 New Vector Ltd
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
import SettingController from "./SettingController";
const SUPPORTED_THEMES = [
"light",
"dark",
];
export default class ThemeController extends SettingController {
getValueOverride(level, roomId, calculatedValue, calculatedAtLevel) {
// Override in case some no longer supported theme is stored here
if (!SUPPORTED_THEMES.includes(calculatedValue)) {
return "light";
}
return null; // no override
}
}

3
src/settings/handlers/ConfigSettingsHandler.js
View file

@ -1,5 +1,6 @@
/*
Copyright 2017 Travis Ralston
Copyright 2019 New Vector Ltd
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
@ -27,7 +28,7 @@ export default class ConfigSettingsHandler extends SettingsHandler {
// Special case themes
if (settingName === "theme") {
return "dharma"; // config["default_theme"];
return config["default_theme"];
}
const settingsConfig = config["settingDefaults"];