Replaced double quotes with single quotes in sass imports

This commit is contained in:
Alejandro Celaya 2018-08-05 10:01:17 +02:00
parent b25cb6c170
commit ce8888ce5d
14 changed files with 25 additions and 27 deletions

View file

@ -1,4 +1,4 @@
@import "./utils/base"; @import './utils/base';
.app { .app {
padding-top: $headerHeight; padding-top: $headerHeight;

View file

@ -1,4 +1,4 @@
@import "../utils/base"; @import '../utils/base';
.aside-menu { .aside-menu {
background-color: #f7f7f7; background-color: #f7f7f7;

View file

@ -1,4 +1,4 @@
@import "../utils/mixins/vertical-align"; @import '../utils/mixins/vertical-align';
.date-input-container { .date-input-container {
position: relative; position: relative;

View file

@ -1,4 +1,4 @@
@import "../utils/base"; @import '../utils/base';
.home-container { .home-container {
text-align: center; text-align: center;

View file

@ -1,4 +1,4 @@
@import "../utils/base"; @import '../utils/base';
.main-header.main-header { .main-header.main-header {
background-color: $mainColor !important; background-color: $mainColor !important;

View file

@ -1,4 +1,4 @@
@import "./utils/base"; @import './utils/base';
* { * {
outline: none !important; outline: none !important;

View file

@ -1,4 +1,4 @@
@import "../utils/base"; @import '../utils/base';
.create-server { .create-server {
padding: 40px 20px; padding: 40px 20px;

View file

@ -1,6 +1,6 @@
@import "../../node_modules/react-tag-autocomplete/example/styles.css"; @import '../../node_modules/react-tag-autocomplete/example/styles.css';
@import "../utils/mixins/box-shadow"; @import '../utils/mixins/box-shadow';
@import "../utils/mixins/border-radius"; @import '../utils/mixins/border-radius';
.create-short-url__btn:not(:first-child) { .create-short-url__btn:not(:first-child) {
margin-left: 5px; margin-left: 5px;

View file

@ -1,4 +1,4 @@
@import "../utils/mixins/vertical-align"; @import '../utils/mixins/vertical-align';
.search-bar { .search-bar {
position: relative; position: relative;

View file

@ -1,4 +1,4 @@
@import "../utils/base"; @import '../utils/base';
.short-urls-list__header { .short-urls-list__header {
@media (max-width: $smMax) { @media (max-width: $smMax) {

View file

@ -1,4 +1,4 @@
@import "../../utils/mixins/horizontal-align"; @import '../../utils/mixins/horizontal-align';
.preview-modal__img { .preview-modal__img {
max-width: 100%; max-width: 100%;

View file

@ -6,7 +6,7 @@ import './ShortUrlsRow.scss';
import { ShortUrlsRowMenu } from './ShortUrlsRowMenu'; import { ShortUrlsRowMenu } from './ShortUrlsRowMenu';
export class ShortUrlsRow extends React.Component { export class ShortUrlsRow extends React.Component {
state = { displayMenu: false, copiedToClipboard: false }; state = { copiedToClipboard: false };
renderTags(tags) { renderTags(tags) {
if (isEmpty(tags)) { if (isEmpty(tags)) {
@ -25,11 +25,7 @@ export class ShortUrlsRow extends React.Component {
const completeShortUrl = !selectedServer ? shortUrl.shortCode : `${selectedServer.url}/${shortUrl.shortCode}`; const completeShortUrl = !selectedServer ? shortUrl.shortCode : `${selectedServer.url}/${shortUrl.shortCode}`;
return ( return (
<tr <tr className="short-urls-row">
className="short-urls-row"
onMouseEnter={() => this.setState({displayMenu: true})}
onMouseLeave={() => this.setState({displayMenu: false})}
>
<td className="nowrap short-urls-row__cell" data-th="Created at: "> <td className="nowrap short-urls-row__cell" data-th="Created at: ">
<Moment format="YYYY-MM-DD HH:mm">{shortUrl.dateCreated}</Moment> <Moment format="YYYY-MM-DD HH:mm">{shortUrl.dateCreated}</Moment>
</td> </td>
@ -49,7 +45,6 @@ export class ShortUrlsRow extends React.Component {
Copied short URL! Copied short URL!
</small> </small>
<ShortUrlsRowMenu <ShortUrlsRowMenu
display={this.state.displayMenu}
shortUrl={completeShortUrl} shortUrl={completeShortUrl}
selectedServer={selectedServer} selectedServer={selectedServer}
shortCode={shortUrl.shortCode} shortCode={shortUrl.shortCode}

View file

@ -1,11 +1,12 @@
@import "../../utils/base"; @import '../../utils/base';
@import "../../utils/mixins/vertical-align"; @import '../../utils/mixins/vertical-align';
.short-urls-row { .short-urls-row {
@media (max-width: $smMax) { @media (max-width: $smMax) {
display: block; display: block;
margin-bottom: 10px; margin-bottom: 10px;
border-bottom: 1px solid $lightGrey; border-bottom: 1px solid $lightGrey;
position: relative;
} }
} }
@ -25,7 +26,11 @@
} }
&:last-child { &:last-child {
display: none; position: absolute;
top: 3px;
right: .5rem;
width: auto;
padding: 0;
} }
} }
} }

View file

@ -17,16 +17,14 @@ export class ShortUrlsRowMenu extends React.Component {
toggle = () => this.setState({ isOpen: !this.state.isOpen }); toggle = () => this.setState({ isOpen: !this.state.isOpen });
render() { render() {
const { display, shortUrl, onCopyToClipboard, selectedServer, shortCode } = this.props; const { shortUrl, onCopyToClipboard, selectedServer, shortCode } = this.props;
const serverId = selectedServer ? selectedServer.id : ''; const serverId = selectedServer ? selectedServer.id : '';
const baseClass = 'short-urls-row-menu__dropdown-toggle';
const toggleClass = !display ? `${baseClass} short-urls-row-menu__dropdown-toggle--hidden` : baseClass;
const toggleQrCode = () => this.setState({isQrModalOpen: !this.state.isQrModalOpen}); const toggleQrCode = () => this.setState({isQrModalOpen: !this.state.isQrModalOpen});
const togglePreview = () => this.setState({isPreviewOpen: !this.state.isPreviewOpen}); const togglePreview = () => this.setState({isPreviewOpen: !this.state.isPreviewOpen});
return ( return (
<ButtonDropdown toggle={this.toggle} isOpen={this.state.isOpen} direction="left"> <ButtonDropdown toggle={this.toggle} isOpen={this.state.isOpen} direction="left">
<DropdownToggle color="white" size="sm" caret className={toggleClass}> <DropdownToggle color="white" size="sm" caret className="short-urls-row-menu__dropdown-toggle">
&nbsp;<FontAwesomeIcon icon={menuIcon}/>&nbsp; &nbsp;<FontAwesomeIcon icon={menuIcon}/>&nbsp;
</DropdownToggle> </DropdownToggle>
<DropdownMenu> <DropdownMenu>