diff --git a/components/common/Favicon.module.css b/components/common/Favicon.module.css index 82c85c42..f8972ad1 100644 --- a/components/common/Favicon.module.css +++ b/components/common/Favicon.module.css @@ -1,3 +1,3 @@ .favicon { - margin-right: 8px; + margin-inline-end: 8px; } diff --git a/components/common/FilterLink.module.css b/components/common/FilterLink.module.css index ce3ffa5f..055b7772 100644 --- a/components/common/FilterLink.module.css +++ b/components/common/FilterLink.module.css @@ -14,7 +14,7 @@ .row .link { display: none; - margin-left: 20px; + margin-inline-start: 20px; } .row .label { diff --git a/components/layout/Grid.module.css b/components/layout/Grid.module.css index 20df43c9..655e4ea2 100644 --- a/components/layout/Grid.module.css +++ b/components/layout/Grid.module.css @@ -10,16 +10,16 @@ } .row > .col { - border-left: 1px solid var(--base300); + border-inline-start: 1px solid var(--base300); } .row > .col:first-child { - border-left: 0; - padding-left: 0; + border-inline-start: 0; + padding-inline-start: 0; } .row > .col:last-child { - padding-right: 0; + padding-inline-end: 0; } @media only screen and (max-width: 992px) { @@ -29,7 +29,7 @@ .row > .col { border-top: 1px solid var(--base300); - border-left: 0; + border-inline-end: 0; padding: 20px 0; } } diff --git a/components/metrics/DataTable.module.css b/components/metrics/DataTable.module.css index 070dca1f..c5b2bd7c 100644 --- a/components/metrics/DataTable.module.css +++ b/components/metrics/DataTable.module.css @@ -68,8 +68,8 @@ .value { width: 50px; - text-align: right; - margin-right: 10px; + text-align: end; + margin-inline-end: 10px; font-weight: 600; cursor: pointer; } @@ -79,7 +79,7 @@ width: 50px; color: var(--base600); border-left: 1px solid var(--base600); - padding-left: 10px; + padding-inline-start: 10px; z-index: 1; } diff --git a/components/metrics/Legend.module.css b/components/metrics/Legend.module.css index 5a005db2..dea515f3 100644 --- a/components/metrics/Legend.module.css +++ b/components/metrics/Legend.module.css @@ -13,7 +13,7 @@ } .label + .label { - margin-left: 20px; + margin-inline-start: 20px; } .hidden { diff --git a/components/pages/dashboard/Dashboard.js b/components/pages/dashboard/Dashboard.js index 6497aba4..26054347 100644 --- a/components/pages/dashboard/Dashboard.js +++ b/components/pages/dashboard/Dashboard.js @@ -10,6 +10,7 @@ import EmptyPlaceholder from 'components/common/EmptyPlaceholder'; import useApi from 'hooks/useApi'; import useDashboard from 'store/dashboard'; import useMessages from 'hooks/useMessages'; +import useLocale from 'hooks/useLocale'; export default function Dashboard({ userId }) { const { formatMessage, labels, messages } = useMessages(); @@ -19,6 +20,7 @@ export default function Dashboard({ userId }) { const { get, useQuery } = useApi(); const { data, isLoading, error } = useQuery(['websites'], () => get('/websites', { userId })); const hasData = data && data.length !== 0; + const { dir } = useLocale(); function handleMore() { setMax(max + limit); @@ -33,7 +35,7 @@ export default function Dashboard({ userId }) {