Matrix/element-web-Github
1
0
Fork 0
mirror of https://github.com/vector-im/element-web.git synced 2024-11-18 06:35:35 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix a bunch of dark-theme buttons

Browse Source
This commit is contained in:
Matthew Hodgson 2017-01-20 21:00:22 +00:00
parent 0c5762b91d
commit 937f13d578
5 changed files with 20 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/components/structures/UserSettings.js
View File

@ -607,8 +607,8 @@ module.exports = React.createClass({
<div className="mx_UserSettings_profileInputCell"> <div className="mx_UserSettings_profileInputCell">
<input type="text" key={val.address} id={id} value={val.address} disabled /> <input type="text" key={val.address} id={id} value={val.address} disabled />
</div> </div>
<div className="mx_UserSettings_threepidButton"> <div className="mx_UserSettings_threepidButton mx_filterFlipColor">
<img src="img/icon_context_delete.svg" width="14" height="14" alt="Remove" onClick={this.onRemoveThreepidClicked.bind(this, val)} /> <img src="img/cancel-small.svg" width="14" height="14" alt="Remove" onClick={this.onRemoveThreepidClicked.bind(this, val)} />
</div> </div>
</div> </div>
); );
@ -630,7 +630,7 @@ module.exports = React.createClass({
blurToCancel={ false } blurToCancel={ false }
onValueChanged={ this.onAddThreepidClicked } /> onValueChanged={ this.onAddThreepidClicked } />
</div> </div>
<div className="mx_UserSettings_threepidButton"> <div className="mx_UserSettings_threepidButton mx_filterFlipColor">
<img src="img/plus.svg" width="14" height="14" alt="Add" onClick={ this.onAddThreepidClicked.bind(this, undefined, true) }/> <img src="img/plus.svg" width="14" height="14" alt="Add" onClick={ this.onAddThreepidClicked.bind(this, undefined, true) }/>
</div> </div>
</div> </div>
@ -711,7 +711,7 @@ module.exports = React.createClass({
</div> </div>
<div className="mx_UserSettings_avatarPicker_edit"> <div className="mx_UserSettings_avatarPicker_edit">
<label htmlFor="avatarInput" ref="file_label"> <label htmlFor="avatarInput" ref="file_label">
<img src="img/camera.svg" <img src="img/camera.svg" className="mx_filterFlipColor"
alt="Upload avatar" title="Upload avatar" alt="Upload avatar" title="Upload avatar"
width="17" height="15" /> width="17" height="15" />
</label> </label>

4
src/components/views/room_settings/AliasSettings.js
View File

@ -281,7 +281,7 @@ module.exports = React.createClass({
onValueChanged={ self.onAliasChanged.bind(self, localDomain, i) } onValueChanged={ self.onAliasChanged.bind(self, localDomain, i) }
editable={ self.props.canSetAliases } editable={ self.props.canSetAliases }
initialValue={ alias } /> initialValue={ alias } />
<div className="mx_RoomSettings_deleteAlias"> <div className="mx_RoomSettings_deleteAlias mx_filterFlipColor">
{ deleteButton } { deleteButton }
</div> </div>
</div> </div>
@ -297,7 +297,7 @@ module.exports = React.createClass({
placeholder={ "New address (e.g. #foo:" + localDomain + ")" } placeholder={ "New address (e.g. #foo:" + localDomain + ")" }
blurToCancel={ false } blurToCancel={ false }
onValueChanged={ self.onAliasAdded } /> onValueChanged={ self.onAliasAdded } />
<div className="mx_RoomSettings_addAlias"> <div className="mx_RoomSettings_addAlias mx_filterFlipColor">
<img src="img/plus.svg" width="14" height="14" alt="Add" <img src="img/plus.svg" width="14" height="14" alt="Add"
onClick={ self.onAliasAdded.bind(self, undefined) }/> onClick={ self.onAliasAdded.bind(self, undefined) }/>
</div> </div>

21
src/components/views/rooms/MessageComposer.js
View File

@ -222,20 +222,22 @@ export default class MessageComposer extends React.Component {
</div> </div>
); );
let e2eimg, e2etitle; let e2eImg, e2eTitle, e2eClass;
if (MatrixClientPeg.get().isRoomEncrypted(this.props.room.roomId)) { if (MatrixClientPeg.get().isRoomEncrypted(this.props.room.roomId)) {
// FIXME: show a /!\ if there are untrusted devices in the room... // FIXME: show a /!\ if there are untrusted devices in the room...
e2eimg = 'img/e2e-verified.svg'; e2eImg = 'img/e2e-verified.svg';
e2etitle = 'Encrypted room'; e2eTitle = 'Encrypted room';
e2eClass = 'mx_MessageComposer_e2eIcon';
} else { } else {
e2eimg = 'img/e2e-unencrypted.svg'; e2eImg = 'img/e2e-unencrypted.svg';
e2etitle = 'Unencrypted room'; e2eTitle = 'Unencrypted room';
e2eClass = 'mx_MessageComposer_e2eIcon mx_filterFlipColor';
} }
controls.push( controls.push(
<img key="e2eIcon" className="mx_MessageComposer_e2eIcon" src={e2eimg} width="12" height="12" <img key="e2eIcon" className={e2eClass} src={e2eImg} width="12" height="12"
alt={e2etitle} title={e2etitle} alt={e2eTitle} title={e2eTitle}
/> />
); );
var callButton, videoCallButton, hangupButton; var callButton, videoCallButton, hangupButton;
@ -331,6 +333,7 @@ export default class MessageComposer extends React.Component {
const disabled = !this.state.inputState.isRichtextEnabled && 'underline' === name; const disabled = !this.state.inputState.isRichtextEnabled && 'underline' === name;
const className = classNames("mx_MessageComposer_format_button", { const className = classNames("mx_MessageComposer_format_button", {
mx_MessageComposer_format_button_disabled: disabled, mx_MessageComposer_format_button_disabled: disabled,
mx_filterFlipColor: true,
}); });
return <img className={className} return <img className={className}
title={name} title={name}
@ -355,11 +358,11 @@ export default class MessageComposer extends React.Component {
<div style={{flex: 1}}></div> <div style={{flex: 1}}></div>
<img title={`Turn Markdown ${this.state.inputState.isRichtextEnabled ? 'on' : 'off'}`} <img title={`Turn Markdown ${this.state.inputState.isRichtextEnabled ? 'on' : 'off'}`}
onMouseDown={this.onToggleMarkdownClicked} onMouseDown={this.onToggleMarkdownClicked}
className="mx_MessageComposer_formatbar_markdown" className="mx_MessageComposer_formatbar_markdown mx_filterFlipColor"
src={`img/button-md-${!this.state.inputState.isRichtextEnabled}.png`} /> src={`img/button-md-${!this.state.inputState.isRichtextEnabled}.png`} />
<img title="Hide Text Formatting Toolbar" <img title="Hide Text Formatting Toolbar"
onClick={this.onToggleFormattingClicked} onClick={this.onToggleFormattingClicked}
className="mx_MessageComposer_formatbar_cancel" className="mx_MessageComposer_formatbar_cancel mx_filterFlipColor"
src="img/icon-text-cancel.svg" /> src="img/icon-text-cancel.svg" />
</div> </div>
</div>: null </div>: null

2
src/components/views/rooms/MessageComposerInput.js
View File

@ -719,7 +719,7 @@ export default class MessageComposerInput extends React.Component {
selection={selection} /> selection={selection} />
</div> </div>
<div className={className}> <div className={className}>
<img className="mx_MessageComposer_input_markdownIndicator" <img className="mx_MessageComposer_input_markdownIndicator mx_filterFlipColor"
onMouseDown={this.onMarkdownToggleClicked} onMouseDown={this.onMarkdownToggleClicked}
title={`Markdown is ${this.state.isRichtextEnabled ? 'disabled' : 'enabled'}`} title={`Markdown is ${this.state.isRichtextEnabled ? 'disabled' : 'enabled'}`}
src={`img/button-md-${!this.state.isRichtextEnabled}.png`} /> src={`img/button-md-${!this.state.isRichtextEnabled}.png`} />

2
src/components/views/rooms/RoomHeader.js
View File

@ -183,7 +183,7 @@ module.exports = React.createClass({
); );
save_button = <div className="mx_RoomHeader_textButton" onClick={this.props.onSaveClick}>Save</div>; save_button = <div className="mx_RoomHeader_textButton" onClick={this.props.onSaveClick}>Save</div>;
cancel_button = <div className="mx_RoomHeader_cancelButton" onClick={this.props.onCancelClick}><img src="img/cancel.svg" width="18" height="18" alt="Cancel"/> </div>; cancel_button = <div className="mx_RoomHeader_cancelButton mx_filterFlipColor" onClick={this.props.onCancelClick}><img src="img/cancel.svg" width="18" height="18" alt="Cancel"/> </div>;
} }
if (this.props.saving) { if (this.props.saving) {