diff --git a/src/Api/members.json b/src/Api/members.json index e089aa3..0805a54 100644 --- a/src/Api/members.json +++ b/src/Api/members.json @@ -1506,5 +1506,18 @@ "forhand": "Справа", "backhand": "Дворучний", "joinTennisYear": 2023 + }, + { + "id": "117", + "name": "Саламаха Ірина", + "birthDate": "1975-02-14", + "avatar": "https://raw.githubusercontent.com/M-Farmaha/100-club/main/src/components/MembersList/avatars/117.jpg", + "sex": "female", + "hometown": "Львів", + "type": "Аматор", + "category": null, + "forhand": "Справа", + "backhand": "Дворучний", + "joinTennisYear": 1984 } ] diff --git a/src/components/AppBar/AppBar-styled.jsx b/src/components/AppBar/AppBar-styled.jsx index 672cdd8..6ee83fe 100644 --- a/src/components/AppBar/AppBar-styled.jsx +++ b/src/components/AppBar/AppBar-styled.jsx @@ -93,7 +93,6 @@ export const NavList = styled.ul` gap: 20px; @media screen and (max-width: 576px) { - transform: translateX(100%); position: fixed; z-index: 1000; @@ -115,6 +114,10 @@ export const NavList = styled.ul` transform: ${({ isMobileMenuOpen }) => isMobileMenuOpen ? "translateX(0%)" : "translateX(100%)"}; } + + @media screen and (min-width: 577px) { + + } `; export const NavItem = styled.li` @@ -216,6 +219,10 @@ export const MobileMenuButton = styled.button` border: none; background-color: transparent; + display: flex; + justify-content: center; + align-items: center; + color: var(--primary-white-color); transition: var(--main-transition); @@ -229,10 +236,20 @@ export const MobileMenuButton = styled.button` } `; -export const BurgerIconSvg = styled.svg` - width: ${({ isMobileMenuOpen }) => (isMobileMenuOpen ? "24px" : "30px")}; - height: ${({ isMobileMenuOpen }) => (isMobileMenuOpen ? "24px" : "30px")}; - fill: currentColor; +// export const BurgerIconSvg = styled.svg` +// width: ${({ isMobileMenuOpen }) => (isMobileMenuOpen ? "24px" : "30px")}; +// height: ${({ isMobileMenuOpen }) => (isMobileMenuOpen ? "24px" : "30px")}; +// fill: currentColor; + +// transition: var(--main-transition); +// `; - /* transition: var(--main-transition); */ +export const BurgerStick = styled.div` + position: absolute; + width: 30px; + height: 4px; + background-color: currentColor; + border-radius: 30px; + + transition: var(--main-transition); `; diff --git a/src/components/AppBar/AppBar.jsx b/src/components/AppBar/AppBar.jsx index c68be2a..61131bc 100644 --- a/src/components/AppBar/AppBar.jsx +++ b/src/components/AppBar/AppBar.jsx @@ -13,7 +13,7 @@ import { HeaderBaseBG, MobileBackdrop, MobileMenuButton, - BurgerIconSvg, + BurgerStick, } from "./AppBar-styled"; import sprite from "../../sprite.svg"; @@ -92,13 +92,39 @@ export const AppBar = () => { type="button" onClick={isMobileMenuOpen ? closeMobileMenu : openMobileMenu} > - + {/* - + */} + + + + + + { - Останнє оновлення: 22.06.2024 + Останнє оновлення: 19.07.2024 diff --git a/src/components/MembersList/avatars/117.jpg b/src/components/MembersList/avatars/117.jpg new file mode 100644 index 0000000..541dace Binary files /dev/null and b/src/components/MembersList/avatars/117.jpg differ