mirrors/element-web
1
0
Fork 0
mirror of https://github.com/element-hq/element-web synced 2024-10-25 20:26:51 +03:00
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #651 from matrix-org/rav/roomheader_theming_fix

Browse source 
Fix dark theme styling of roomheader cancel button
This commit is contained in:
David Baker 2017-01-25 17:02:07 +00:00 committed by GitHub
commit 12642bdf2b
2 changed files with 22 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -27,6 +27,7 @@ var linkify = require('linkifyjs');
var linkifyElement = require('linkifyjs/element');
var linkifyMatrix = require('../../../linkify-matrix');
import AccessibleButton from '../elements/AccessibleButton';
import {CancelButton} from './SimpleRoomHeader';
linkifyMatrix(linkify);
@ -184,7 +185,7 @@ module.exports = React.createClass({
);
save_button = <AccessibleButton className="mx_RoomHeader_textButton" onClick={this.props.onSaveClick}>Save</AccessibleButton>;
cancel_button = <AccessibleButton className="mx_RoomHeader_cancelButton" onClick={this.props.onCancelClick}><img src="img/cancel.svg" width="18" height="18" alt="Cancel"/> </AccessibleButton>;
cancel_button = <CancelButton onClick={this.props.onCancelClick}/>;
}
if (this.props.saving) {

29
src/components/views/rooms/SimpleRoomHeader.js
View file

@ -16,16 +16,27 @@ limitations under the License.
'use strict';
var React = require('react');
var sdk = require('../../../index');
var dis = require("../../../dispatcher");
import React from 'react';
import dis from '../../../dispatcher';
import AccessibleButton from '../elements/AccessibleButton';
// cancel button which is shared between room header and simple room header
export function CancelButton(props) {
const {onClick} = props;
return (
<AccessibleButton className='mx_RoomHeader_cancelButton' onClick={onClick}>
<img src="img/cancel.svg" className='mx_filterFlipColor'
width="18" height="18" alt="Cancel"/>
</AccessibleButton>
);
}
/*
* A stripped-down room header used for things like the user settings
* and room directory.
*/
module.exports = React.createClass({
export default React.createClass({
displayName: 'SimpleRoomHeader',
propTypes: {
@ -41,15 +52,15 @@ module.exports = React.createClass({
},
render: function() {
var TintableSvg = sdk.getComponent("elements.TintableSvg");
var cancelButton;
let cancelButton;
if (this.props.onCancelClick) {
cancelButton = <AccessibleButton className="mx_RoomHeader_cancelButton" onClick={this.props.onCancelClick}><img src="img/cancel.svg" width="18" height="18" alt="Cancel"/> </AccessibleButton>;
cancelButton = <CancelButton onClick={this.props.onCancelClick} />;
}
var showRhsButton;
let showRhsButton;
/* // don't bother cluttering things up with this for now.
const TintableSvg = sdk.getComponent("elements.TintableSvg");
if (this.props.collapsedRhs) {
showRhsButton =
<div className="mx_RoomHeader_button" style={{ float: 'right' }} onClick={this.onShowRhsClick} title=">">