forked/shlink-web-client
1
0
Fork 0
mirror of https://github.com/shlinkio/shlink-web-client.git synced 2026-03-01 13:16:42 +00:00
Code Issues Packages Projects Releases Wiki Activity

Updated margin, padding and alignment classes to the new bootstrap 5 approach

Browse Source
This commit is contained in:
Alejandro Celaya
2022-03-05 13:26:28 +01:00
parent ce871fe2a2
commit e5a84b1505
35 changed files with 55 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/visits/TagVisitsHeader.tsx
View File

@@ -15,7 +15,7 @@ const TagVisitsHeader = ({ tagVisits, goBack, colorGenerator }: TagVisitsHeaderP
const visitsStatsTitle = (
<span className="d-flex align-items-center justify-content-center">
<span className="mr-2">Visits for</span>
<span className="me-2">Visits for</span>
<Tag text={tag} colorGenerator={colorGenerator} />
</span>
);

4
src/visits/VisitsHeader.tsx
View File

@@ -17,13 +17,13 @@ const VisitsHeader: FC<VisitsHeaderProps> = ({ visits, goBack, shortUrl, childre
<header>
<Card body>
<h2 className="d-flex justify-content-between align-items-center mb-0">
<Button color="link" size="lg" className="p-0 mr-3" onClick={goBack}>
<Button color="link" size="lg" className="p-0 me-3" onClick={goBack}>
<FontAwesomeIcon icon={faArrowLeft} />
</Button>
<span className="text-center d-none d-sm-block">
<small>{title}</small>
</span>
<span className="badge badge-main ml-3">
<span className="badge badge-main ms-3">
Visits:{' '}
<ShortUrlVisitsCount visitsCount={visits.length} shortUrl={shortUrl} />
</span>

6
src/visits/VisitsStats.tsx
View File

@@ -147,7 +147,7 @@ const VisitsStats: FC<VisitsStatsProps> = ({
{Object.values(sections).map(({ title, icon, subPath }, index) => (
<NavPillItem key={index} to={buildSectionUrl(subPath)} replace>
<FontAwesomeIcon icon={icon} />
<span className="ml-2 d-none d-sm-inline">{title}</span>
<span className="ms-2 d-none d-sm-inline">{title}</span>
</NavPillItem>
))}
</NavPills>
@@ -289,7 +289,7 @@ const VisitsStats: FC<VisitsStatsProps> = ({
/>
</div>
<VisitsFilterDropdown
className="ml-0 ml-md-2 mt-3 mt-md-0"
className="ms-0 ms-md-2 mt-3 mt-md-0"
isOrphanVisits={isOrphanVisits}
botsSupported={botsSupported}
selected={visitsFilter}
@@ -303,7 +303,7 @@ const VisitsStats: FC<VisitsStatsProps> = ({
<Button
outline
disabled={highlightedVisits.length === 0}
className="btn-md-block mr-2"
className="btn-md-block me-2"
onClick={() => setSelectedVisits([])}
>
Clear selection {highlightedVisits.length > 0 && <>({prettify(highlightedVisits.length)})</>}

4
src/visits/charts/LineChartCard.tsx
View File

@@ -232,7 +232,7 @@ const LineChartCard = (
<Card>
<CardHeader>
{title}
<div className="float-right">
<div className="float-end">
<UncontrolledDropdown>
<DropdownToggle caret color="link" className="btn-sm p-0">
Group by
@@ -246,7 +246,7 @@ const LineChartCard = (
</DropdownMenu>
</UncontrolledDropdown>
</div>
<div className="float-right mr-2">
<div className="float-end me-2">
<ToggleSwitch checked={skipNoVisits} onChange={toggleSkipNoVisits}>
<small>Skip dates with no visits</small>
</ToggleSwitch>

8
src/visits/charts/SortableBarChartCard.tsx
View File

@@ -95,7 +95,7 @@ export const SortableBarChartCard: FC<SortableBarChartCardProps> = ({
const computeTitle = () => (
<>
{title}
<div className="float-right">
<div className="float-end">
<OrderingDropdown
isButton={false}
right
@@ -108,9 +108,9 @@ export const SortableBarChartCard: FC<SortableBarChartCardProps> = ({
/>
</div>
{withPagination && Object.keys(stats).length > 50 && (
<div className="float-right">
<div className="float-end">
<PaginationDropdown
toggleClassName="btn-sm p-0 mr-3"
toggleClassName="btn-sm p-0 me-3"
ranges={[ 50, 100, 200, 500 ]}
value={itemsPerPage}
setValue={(itemsPerPage) => {
@@ -121,7 +121,7 @@ export const SortableBarChartCard: FC<SortableBarChartCardProps> = ({
</div>
)}
{extraHeaderContent && (
<div className="float-right">
<div className="float-end">
{extraHeaderContent(pagination ? activeCities : undefined)}
</div>
)}

2
src/visits/helpers/VisitsFilterDropdown.tsx
View File

@@ -26,7 +26,7 @@ export const VisitsFilterDropdown = (
const onBotsClick = () => onChange({ ...selected, excludeBots: !selected?.excludeBots });
return (
<DropdownBtn text="Filters" dropdownClassName={className} className="mr-3" right minWidth={250}>
<DropdownBtn text="Filters" dropdownClassName={className} className="me-3" right minWidth={250}>
{botsSupported && (
<>
<DropdownItem header>Bots:</DropdownItem>