forked/shlink-web-client
1
0
Fork 0
mirror of https://github.com/shlinkio/shlink-web-client.git synced 2026-03-14 11:33:51 +00:00
Code Issues Packages Projects Releases Wiki Activity

Moved style to the proper scope

Browse Source
This commit is contained in:
Alejandro Celaya
2020-01-12 12:08:26 +01:00
parent f507a3628c
commit 124441238b
4 changed files with 12 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/index.scss
View File

@@ -59,3 +59,7 @@ body,
.paddingless { .paddingless {
padding: 0; padding: 0;
} }
.indivisible {
white-space: nowrap;
}

5
src/short-urls/helpers/ShortUrlVisitsCount.js
View File

@@ -3,6 +3,7 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faInfoCircle as infoIcon } from '@fortawesome/free-solid-svg-icons'; import { faInfoCircle as infoIcon } from '@fortawesome/free-solid-svg-icons';
import { UncontrolledTooltip } from 'reactstrap'; import { UncontrolledTooltip } from 'reactstrap';
import { shortUrlType } from '../reducers/shortUrlsList'; import { shortUrlType } from '../reducers/shortUrlsList';
import './ShortUrlVisitsCount.scss';
const propTypes = { const propTypes = {
shortUrl: shortUrlType, shortUrl: shortUrlType,
@@ -18,9 +19,9 @@ const ShortUrlVisitsCount = ({ shortUrl }) => {
return ( return (
<React.Fragment> <React.Fragment>
<span> <span className="indivisible">
{visitsCount} {visitsCount}
<small id="maxVisitsControl" className="short-urls-row__max-visits-control"> <small id="maxVisitsControl" className="short-urls-visits-count__max-visits-control">
{' '}/ {maxVisits}{' '} {' '}/ {maxVisits}{' '}
<sup> <sup>
<FontAwesomeIcon icon={infoIcon} /> <FontAwesomeIcon icon={infoIcon} />

3
src/short-urls/helpers/ShortUrlVisitsCount.scss Normal file
View File

@@ -0,0 +1,3 @@
.short-urls-visits-count__max-visits-control {
cursor: help;
}

4
test/short-urls/helpers/ShortUrlVisitsCount.test.js
View File

@@ -17,7 +17,7 @@ describe('<ShortUrlVisitsCount />', () => {
it('just returns visits when no maxVisits is provided', () => { it('just returns visits when no maxVisits is provided', () => {
const visitsCount = 45; const visitsCount = 45;
const wrapper = createWrapper({ visitsCount }); const wrapper = createWrapper({ visitsCount });
const maxVisitsHelper = wrapper.find('.short-urls-row__max-visits-control'); const maxVisitsHelper = wrapper.find('.short-urls-visits-count__max-visits-control');
const maxVisitsTooltip = wrapper.find(UncontrolledTooltip); const maxVisitsTooltip = wrapper.find(UncontrolledTooltip);
expect(wrapper.html()).toEqual(`<span>${visitsCount}</span>`); expect(wrapper.html()).toEqual(`<span>${visitsCount}</span>`);
@@ -30,7 +30,7 @@ describe('<ShortUrlVisitsCount />', () => {
const maxVisits = 500; const maxVisits = 500;
const meta = { maxVisits }; const meta = { maxVisits };
const wrapper = createWrapper({ visitsCount, meta }); const wrapper = createWrapper({ visitsCount, meta });
const maxVisitsHelper = wrapper.find('.short-urls-row__max-visits-control'); const maxVisitsHelper = wrapper.find('.short-urls-visits-count__max-visits-control');
const maxVisitsTooltip = wrapper.find(UncontrolledTooltip); const maxVisitsTooltip = wrapper.find(UncontrolledTooltip);
expect(wrapper.html()).toContain(`/ ${maxVisits}`); expect(wrapper.html()).toContain(`/ ${maxVisits}`);