LBRYCommunity/lbry-desktop
1
0
Fork 0
Code Issues 596 Pull requests 6 Projects Releases 238 Packages Wiki Activity

Convert Menu styles to CSS

Browse source
This commit is contained in:
Alex Liebowitz 2017-01-09 03:03:13 -05:00
parent 9f743700b7
commit 0560f13ec4
2 changed files with 13 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
js/component/menu.js
View file

@ -2,11 +2,6 @@ import React from 'react';
import ReactDOM from 'react-dom'; import ReactDOM from 'react-dom';
import {Icon} from './common.js'; import {Icon} from './common.js';
// Generic menu styles
export let menuStyle = {
whiteSpace: 'nowrap'
};
export let Menu = React.createClass({ export let Menu = React.createClass({
propTypes: { propTypes: {
onClickOut: React.PropTypes.func.isRequired, onClickOut: React.PropTypes.func.isRequired,
@ -34,9 +29,6 @@ export let Menu = React.createClass({
} }
}); });
export let menuItemStyle = {
display: 'block',
};
export let MenuItem = React.createClass({ export let MenuItem = React.createClass({
propTypes: { propTypes: {
href: React.PropTypes.string, href: React.PropTypes.string,
@ -53,7 +45,7 @@ export let MenuItem = React.createClass({
var icon = (this.props.icon ? <Icon icon={this.props.icon} fixed /> : null); var icon = (this.props.icon ? <Icon icon={this.props.icon} fixed /> : null);
return ( return (
<a style={menuItemStyle} className="button-text no-underline" onClick={this.props.onClick} <a className="button-text menu__menu-item" onClick={this.props.onClick}
href={this.props.href || 'javascript:'} label={this.props.label}> href={this.props.href || 'javascript:'} label={this.props.label}>
{this.props.iconPosition == 'left' ? icon : null} {this.props.iconPosition == 'left' ? icon : null}
{this.props.label} {this.props.label}

12
scss/_gui.scss
View file

@ -397,6 +397,18 @@ input[type="text"], input[type="search"]
word-break: break-all; word-break: break-all;
} }
.menu {
white-space: nowrap;
}
.menu__menu-item {
display: block;
text-decoration: none !important;
&:hover {
text-decoration: underline !important;
}
}
.file-tile--compact { .file-tile--compact {
height: 180px; height: 180px;