mirrors/shlink-web-client
1
0
Fork 0
mirror of https://github.com/shlinkio/shlink-web-client.git synced 2025-01-10 18:27:25 +03:00
Code Issues Projects Releases Packages Wiki Activity

Reduced and standardized overall vertical spacing

Browse source
This commit is contained in:
Alejandro Celaya 2021-03-29 21:08:48 +02:00
parent c3d6c83ec4
commit 7f61825768
5 changed files with 22 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/servers/CreateServer.tsx
View file

@ -42,7 +42,7 @@ const CreateServer = (ImportServersBtn: FC<ImportServersBtnProps>, useStateFlagT
</ServerForm>
{(serversImported || errorImporting) && (
<div className="mt-4">
<div className="mt-3">
{serversImported && <ImportResult type="success" />}
{errorImporting && <ImportResult type="error" />}
</div>

16
src/servers/Overview.tsx
View file

@ -1,5 +1,5 @@
import { FC, useEffect } from 'react';
import { Card, CardBody, CardHeader, CardText, CardTitle } from 'reactstrap';
import { Card, CardBody, CardHeader, CardText, CardTitle, Row } from 'reactstrap';
import { Link, useHistory } from 'react-router-dom';
import { ShortUrlsListParams } from '../short-urls/reducers/shortUrlsListParams';
import { ShortUrlsList as ShortUrlsListState } from '../short-urls/reducers/shortUrlsList';
@ -51,9 +51,9 @@ export const Overview = (
return (
<>
<div className="row mb-3">
<Row>
<div className="col-md-6 col-xl-3">
<Card className="overview__card mb-2" body>
<Card className="overview__card mb-3" body>
<CardTitle tag="h5" className="overview__card-title">Visits</CardTitle>
<CardText tag="h2">
<ForServerVersion minVersion="2.2.0">
@ -66,7 +66,7 @@ export const Overview = (
</Card>
</div>
<div className="col-md-6 col-xl-3">
<Card className="overview__card mb-2" body tag={Link} to={`/server/${serverId}/orphan-visits`}>
<Card className="overview__card mb-3" body tag={Link} to={`/server/${serverId}/orphan-visits`}>
<CardTitle tag="h5" className="overview__card-title">Orphan visits</CardTitle>
<CardText tag="h2">
<ForServerVersion minVersion="2.6.0">
@ -79,7 +79,7 @@ export const Overview = (
</Card>
</div>
<div className="col-md-6 col-xl-3">
<Card className="overview__card mb-2" body tag={Link} to={`/server/${serverId}/list-short-urls/1`}>
<Card className="overview__card mb-3" body tag={Link} to={`/server/${serverId}/list-short-urls/1`}>
<CardTitle tag="h5" className="overview__card-title">Short URLs</CardTitle>
<CardText tag="h2">
{loading ? 'Loading...' : prettify(shortUrls?.pagination.totalItems ?? 0)}
@ -87,13 +87,13 @@ export const Overview = (
</Card>
</div>
<div className="col-md-6 col-xl-3">
<Card className="overview__card mb-2" body tag={Link} to={`/server/${serverId}/manage-tags`}>
<Card className="overview__card mb-3" body tag={Link} to={`/server/${serverId}/manage-tags`}>
<CardTitle tag="h5" className="overview__card-title">Tags</CardTitle>
<CardText tag="h2">{loadingTags ? 'Loading...' : prettify(tagsList.tags.length)}</CardText>
</Card>
</div>
</div>
<Card className="mb-4">
</Row>
<Card className="mb-3">
<CardHeader>
<span className="d-sm-none">Create a short URL</span>
<h5 className="d-none d-sm-inline">Create a short URL</h5>

2
src/servers/helpers/ServerForm.tsx
View file

@ -25,7 +25,7 @@ export const ServerForm: FC<ServerFormProps> = ({ onSubmit, initialValues, child
return (
<form className="server-form" onSubmit={handleSubmit}>
<SimpleCard className="mb-4" title={title}>
<SimpleCard className="mb-3" title={title}>
<FormGroupContainer value={name} onChange={setName}>Name</FormGroupContainer>
<FormGroupContainer type="url" value={url} onChange={setUrl}>URL</FormGroupContainer>
<FormGroupContainer value={apiKey} onChange={setApiKey}>API key</FormGroupContainer>

2
src/settings/Settings.tsx
View file

@ -7,7 +7,7 @@ const SettingsSections: FC<{ items: ReactNode[][] }> = ({ items }) => (
{items.map((child, index) => (
<Row key={index}>
{child.map((subChild, subIndex) => (
<div key={subIndex} className="col-lg-6 mb-3 mb-md-4">
<div key={subIndex} className="col-lg-6 mb-3">
{subChild}
</div>
))}

22
src/visits/VisitsStats.tsx
View file

@ -154,7 +154,7 @@ const VisitsStats: FC<VisitsStatsProps> = (
<Row>
<Switch>
<Route exact path={baseUrl}>
<div className="col-12 mt-4">
<div className="col-12 mt-3">
<LineChartCard
title="Visits during time"
visits={normalizedVisits}
@ -166,13 +166,13 @@ const VisitsStats: FC<VisitsStatsProps> = (
</Route>
<Route exact path={`${baseUrl}${sections.byContext.subPath}`}>
<div className={classNames('mt-4 col-lg-6', { 'col-xl-4': !isOrphanVisits })}>
<div className={classNames('mt-3 col-lg-6', { 'col-xl-4': !isOrphanVisits })}>
<GraphCard title="Operating systems" stats={os} />
</div>
<div className={classNames('mt-4 col-lg-6', { 'col-xl-4': !isOrphanVisits })}>
<div className={classNames('mt-3 col-lg-6', { 'col-xl-4': !isOrphanVisits })}>
<GraphCard title="Browsers" stats={browsers} />
</div>
<div className={classNames('mt-4', { 'col-xl-4': !isOrphanVisits, 'col-lg-6': isOrphanVisits })}>
<div className={classNames('mt-3', { 'col-xl-4': !isOrphanVisits, 'col-lg-6': isOrphanVisits })}>
<SortableBarGraph
title="Referrers"
stats={referrers}
@ -187,7 +187,7 @@ const VisitsStats: FC<VisitsStatsProps> = (
/>
</div>
{isOrphanVisits && (
<div className="mt-4 col-lg-6">
<div className="mt-3 col-lg-6">
<SortableBarGraph
title="Visited URLs"
stats={visitedUrls}
@ -204,7 +204,7 @@ const VisitsStats: FC<VisitsStatsProps> = (
</Route>
<Route exact path={`${baseUrl}${sections.byLocation.subPath}`}>
<div className="col-lg-6 mt-4">
<div className="col-lg-6 mt-3">
<SortableBarGraph
title="Countries"
stats={countries}
@ -217,7 +217,7 @@ const VisitsStats: FC<VisitsStatsProps> = (
onClick={highlightVisitsForProp('country')}
/>
</div>
<div className="col-lg-6 mt-4">
<div className="col-lg-6 mt-3">
<SortableBarGraph
title="Cities"
stats={cities}
@ -258,7 +258,7 @@ const VisitsStats: FC<VisitsStatsProps> = (
<>
{children}
<section className="mt-4">
<section className="mt-3">
<div className="row flex-md-row-reverse">
<div className="col-lg-7 col-xl-6">
<div className="d-md-flex">
@ -273,7 +273,7 @@ const VisitsStats: FC<VisitsStatsProps> = (
{isOrphanVisits && (
<OrphanVisitTypeDropdown
text="Filter by type"
className="ml-0 ml-md-2 mt-4 mt-md-0"
className="ml-0 ml-md-2 mt-3 mt-md-0"
selected={orphanVisitType}
onChange={setOrphanVisitType}
/>
@ -281,7 +281,7 @@ const VisitsStats: FC<VisitsStatsProps> = (
</div>
</div>
{visits.length > 0 && (
<div className="col-lg-5 col-xl-6 mt-4 mt-lg-0">
<div className="col-lg-5 col-xl-6 mt-3 mt-lg-0">
<div className="d-flex">
<Button
outline
@ -305,7 +305,7 @@ const VisitsStats: FC<VisitsStatsProps> = (
</div>
</section>
<section className="mt-4">
<section className="mt-3">
{renderVisitsContent()}
</section>
</>