Apply 50% opacity to the checkmark when there is no status

pull/21833/head
Travis Ralston 2018-12-14 13:49:35 -07:00
parent 7efd82f713
commit 7b0766a303
3 changed files with 12 additions and 3 deletions

View File

@ -28,6 +28,10 @@ limitations under the License.
display: inline-block; display: inline-block;
} }
.mx_StatusMessageContextMenu_submitFaded {
opacity: 0.5;
}
.mx_StatusMessageContextMenu_submit img { .mx_StatusMessageContextMenu_submit img {
vertical-align: middle; vertical-align: middle;
margin-left: 8px; margin-left: 8px;

View File

@ -48,11 +48,16 @@ export default class StatusMessageContextMenu extends React.Component {
} }
render() { render() {
const formSubmitClasses = classNames({
"mx_StatusMessageContextMenu_submit": true,
"mx_StatusMessageContextMenu_submitFaded": !this.state.message, // no message == faded
});
const form = <form className="mx_StatusMessageContextMenu_form" onSubmit={this._onSubmit} autoComplete="off"> const form = <form className="mx_StatusMessageContextMenu_form" onSubmit={this._onSubmit} autoComplete="off">
<input type="text" key="message" placeholder={_t("Set a new status...")} autoFocus={true} <input type="text" key="message" placeholder={_t("Set a new status...")} autoFocus={true}
className="mx_StatusMessageContextMenu_message" className="mx_StatusMessageContextMenu_message"
value={this.state.message} onChange={this._onStatusChange} maxLength="60" /> value={this.state.message} onChange={this._onStatusChange} maxLength="60" />
<AccessibleButton onClick={this._onSubmit} element="div" className="mx_StatusMessageContextMenu_submit"> <AccessibleButton onClick={this._onSubmit} element="div" className={formSubmitClasses}>
<img src="img/icons-checkmark.svg" width="22" height="22" /> <img src="img/icons-checkmark.svg" width="22" height="22" />
</AccessibleButton> </AccessibleButton>
</form>; </form>;

View File

@ -1053,9 +1053,9 @@
"Forget": "Forget", "Forget": "Forget",
"Low Priority": "Low Priority", "Low Priority": "Low Priority",
"Direct Chat": "Direct Chat", "Direct Chat": "Direct Chat",
"View Community": "View Community",
"Clear status": "Clear status",
"Set a new status...": "Set a new status...", "Set a new status...": "Set a new status...",
"Clear status": "Clear status",
"View Community": "View Community",
"Sorry, your browser is <b>not</b> able to run Riot.": "Sorry, your browser is <b>not</b> able to run Riot.", "Sorry, your browser is <b>not</b> able to run Riot.": "Sorry, your browser is <b>not</b> able to run Riot.",
"Riot uses many advanced browser features, some of which are not available or experimental in your current browser.": "Riot uses many advanced browser features, some of which are not available or experimental in your current browser.", "Riot uses many advanced browser features, some of which are not available or experimental in your current browser.": "Riot uses many advanced browser features, some of which are not available or experimental in your current browser.",
"Please install <chromeLink>Chrome</chromeLink> or <firefoxLink>Firefox</firefoxLink> for the best experience.": "Please install <chromeLink>Chrome</chromeLink> or <firefoxLink>Firefox</firefoxLink> for the best experience.", "Please install <chromeLink>Chrome</chromeLink> or <firefoxLink>Firefox</firefoxLink> for the best experience.": "Please install <chromeLink>Chrome</chromeLink> or <firefoxLink>Firefox</firefoxLink> for the best experience.",