mirror of
https://github.com/kremalicious/umami.git
synced 2025-01-02 18:23:12 +01:00
add rtl support
This commit is contained in:
parent
0126154e39
commit
0c13f8d358
@ -1,14 +1,19 @@
|
||||
import React from 'react';
|
||||
import classNames from 'classnames';
|
||||
import { FormattedMessage } from 'react-intl';
|
||||
import { FormattedMessage, useIntl } from 'react-intl';
|
||||
import Link from 'components/common/Link';
|
||||
import styles from './Footer.module.css';
|
||||
import useVersion from 'hooks/useVersion';
|
||||
|
||||
export default function Footer() {
|
||||
const { current } = useVersion();
|
||||
const intl = useIntl();
|
||||
|
||||
return (
|
||||
<footer className="container">
|
||||
<footer
|
||||
className="container"
|
||||
dir={intl.formatMessage({ id: 'metrics.dir', defaultMessage: 'ltr' })}
|
||||
>
|
||||
<div className={classNames(styles.footer, 'row')}>
|
||||
<div className="col-12 col-md-4" />
|
||||
<div className="col-12 col-md-4">
|
||||
|
@ -1,5 +1,5 @@
|
||||
import React, { useState } from 'react';
|
||||
import { FormattedMessage } from 'react-intl';
|
||||
import { FormattedMessage, useIntl } from 'react-intl';
|
||||
import { useSelector } from 'react-redux';
|
||||
import classNames from 'classnames';
|
||||
import Link from 'components/common/Link';
|
||||
@ -14,13 +14,17 @@ import styles from './Header.module.css';
|
||||
export default function Header() {
|
||||
const user = useSelector(state => state.user);
|
||||
const [active, setActive] = useState(false);
|
||||
const intl = useIntl();
|
||||
|
||||
function handleClick() {
|
||||
setActive(state => !state);
|
||||
}
|
||||
|
||||
return (
|
||||
<nav className="container">
|
||||
<nav
|
||||
className="container"
|
||||
dir={intl.formatMessage({ id: 'metrics.dir', defaultMessage: 'ltr' })}
|
||||
>
|
||||
{user?.is_admin && <UpdateNotice />}
|
||||
<div className={classNames(styles.header, 'row align-items-center')}>
|
||||
<div className={styles.nav}>
|
||||
|
@ -2,15 +2,24 @@ import React from 'react';
|
||||
import Head from 'next/head';
|
||||
import Header from 'components/layout/Header';
|
||||
import Footer from 'components/layout/Footer';
|
||||
import { useIntl } from 'react-intl';
|
||||
|
||||
export default function Layout({ title, children, header = true, footer = true }) {
|
||||
const intl = useIntl();
|
||||
|
||||
return (
|
||||
<>
|
||||
<Head>
|
||||
<Head dir={intl.formatMessage({ id: 'metrics.dir', defaultMessage: 'ltr' })}>
|
||||
<title>umami{title && ` - ${title}`}</title>
|
||||
</Head>
|
||||
|
||||
{header && <Header />}
|
||||
<main className="container">{children}</main>
|
||||
<main
|
||||
className="container"
|
||||
dir={intl.formatMessage({ id: 'metrics.dir', defaultMessage: 'ltr' })}
|
||||
>
|
||||
{children}
|
||||
</main>
|
||||
{footer && <Footer />}
|
||||
<div id="__modals" />
|
||||
</>
|
||||
|
@ -96,5 +96,6 @@
|
||||
"metrics.referrers": "التحويلات",
|
||||
"metrics.unique-visitors": "زائرون فريدون",
|
||||
"metrics.views": "مشاهدات",
|
||||
"metrics.visitors": "زوار"
|
||||
"metrics.visitors": "زوار",
|
||||
"metrics.dir": "rtl"
|
||||
}
|
||||
|
@ -119,6 +119,7 @@
|
||||
"postcss-flexbugs-fixes": "^5.0.2",
|
||||
"postcss-import": "^13.0.0",
|
||||
"postcss-preset-env": "^6.7.0",
|
||||
"postcss-rtlcss": "^3.3.2",
|
||||
"prettier": "^2.2.1",
|
||||
"prettier-eslint": "^12.0.0",
|
||||
"prisma": "2.21.2",
|
||||
|
@ -1,5 +1,6 @@
|
||||
module.exports = {
|
||||
plugins: [
|
||||
'postcss-rtlcss',
|
||||
'postcss-flexbugs-fixes',
|
||||
[
|
||||
'postcss-preset-env',
|
||||
|
Loading…
Reference in New Issue
Block a user