diff --git a/public/icons/bell-white.svg b/public/icons/bell-white.svg index 7897223c..edc6fc3b 100644 --- a/public/icons/bell-white.svg +++ b/public/icons/bell-white.svg @@ -1,3 +1,4 @@ - - + + diff --git a/public/icons/inbox-white.svg b/public/icons/inbox-white.svg index da9ae69e..6643ea6e 100644 --- a/public/icons/inbox-white.svg +++ b/public/icons/inbox-white.svg @@ -1,3 +1,4 @@ - - + + diff --git a/public/icons/search.svg b/public/icons/search.svg index 3b4f989f..eca3eaee 100644 --- a/public/icons/search.svg +++ b/public/icons/search.svg @@ -1,3 +1,4 @@ - - + + diff --git a/public/icons/user-default.svg b/public/icons/user-default.svg index b51449e1..201334d8 100644 --- a/public/icons/user-default.svg +++ b/public/icons/user-default.svg @@ -1 +1,4 @@ - \ No newline at end of file + + + diff --git a/src/components/Author/Userpic.module.scss b/src/components/Author/Userpic.module.scss index 18855e50..1095b6d0 100644 --- a/src/components/Author/Userpic.module.scss +++ b/src/components/Author/Userpic.module.scss @@ -1,6 +1,9 @@ .circlewrap { + align-items: center; border-radius: 100%; + display: flex; height: 32px; + justify-content: center; margin-right: 1.2rem; min-width: 32px; max-width: 32px; @@ -24,7 +27,9 @@ } .anonymous { + height: 17px !important; object-fit: contain; + width: 20px !important; } a { diff --git a/src/components/Author/Userpic.tsx b/src/components/Author/Userpic.tsx index fdb0cee9..88496640 100644 --- a/src/components/Author/Userpic.tsx +++ b/src/components/Author/Userpic.tsx @@ -34,7 +34,7 @@ export default (props: UserpicProps) => { {props.user.name } > @@ -50,7 +50,7 @@ export default (props: UserpicProps) => { {props.user.name } diff --git a/src/components/Nav/Header.module.scss b/src/components/Nav/Header.module.scss index 21e337e1..a2a47713 100644 --- a/src/components/Nav/Header.module.scss +++ b/src/components/Nav/Header.module.scss @@ -1,5 +1,6 @@ .mainHeader { background: #fff; + font-size: 1.4rem; margin-bottom: 2.2rem; position: absolute; width: 100%; @@ -12,17 +13,6 @@ padding: 0 divide($container-padding-x, 2); } } - - .icon { - height: 1em; - width: 1em; - } - - a:hover { - .icon { - filter: invert(1); - } - } } .mainHeaderInner { @@ -77,7 +67,6 @@ height: 56px; padding: 0; position: relative; - transition: height 0.2s; text-align: center; z-index: 9; @@ -85,14 +74,6 @@ padding: 0 6rem 0 0; } - @include media-breakpoint-up(md) { - height: 70px; - } - - @include media-breakpoint-up(lg) { - height: 80px; - } - img { height: 20px; object-fit: contain; @@ -100,14 +81,6 @@ transition: height 0.2s; vertical-align: middle; width: 100px; - - @include media-breakpoint-up(md) { - height: 32px; - } - - @include media-breakpoint-up(lg) { - width: 175px; - } } a, @@ -158,8 +131,10 @@ } .mainNavigation { + font-size: 1.4rem !important; margin: 0 !important; opacity: 1; + text-transform: capitalize; transition: opacity 0.3s; li { @@ -331,16 +306,12 @@ transform: translateY(-50%); width: 100%; - @include media-breakpoint-up(sm) { - right: 6rem; - } - @include media-breakpoint-up(md) { - right: 1.5rem; + right: 0; } - @include media-breakpoint-up(lg) { - right: 1.5rem; + @include media-breakpoint-up(xl) { + right: 2rem; } .control { @@ -378,6 +349,7 @@ .userControl { align-items: center; display: flex; + justify-content: flex-end; opacity: 1; transition: opacity 0.3s; z-index: 1; @@ -388,10 +360,6 @@ z-index: -1; } - @include font-size(1.7rem); - - justify-content: flex-end; - @include media-breakpoint-down(md) { padding: divide($container-padding-x, 2); } @@ -412,7 +380,7 @@ display: flex; height: 2.4em; justify-content: center; - margin-left: 0.5em; + margin-left: 0.3rem; position: relative; transition: margin-left 0.3s; width: 2.4em; @@ -472,8 +440,9 @@ .icon { img { - height: 20px; - width: auto; + height: 17px; + max-width: none; + width: 20px; } } diff --git a/src/components/Nav/Header.tsx b/src/components/Nav/Header.tsx index 4f52d735..4884437d 100644 --- a/src/components/Nav/Header.tsx +++ b/src/components/Nav/Header.tsx @@ -107,7 +107,7 @@ export const Header = (props: Props) => { {t('Discours')} -
+
{props.title}
 @@ -119,17 +119,11 @@ export const Header = (props: Props) => { )} -
  • - - - {t('Search')} - -
    • -
    +
    {
    +
    + + + +
    +
    - +
    @@ -180,7 +190,7 @@ export const HeaderAuth = (props: HeaderAuthProps) => { {/*FIXME: replace with route*/}
    - +
    diff --git a/src/components/Nav/Snackbar.module.scss b/src/components/Nav/Snackbar.module.scss index ae76b39a..7d2c56ae 100644 --- a/src/components/Nav/Snackbar.module.scss +++ b/src/components/Nav/Snackbar.module.scss @@ -1,5 +1,5 @@ .snackbar { - min-height: 4px; + min-height: 2px; background-color: #141414; color: #fff; transition: background-color 0.3s;