From 53fa6123d098d5fa97f6bc758fdb6d61c919d823 Mon Sep 17 00:00:00 2001 From: romanmyko Date: Thu, 26 Sep 2024 16:52:48 +0300 Subject: [PATCH 01/18] add flex in profiles --- FrontEnd/src/global.css | 2 + .../customProfileTooltipThemes.js | 11 ++ .../ProfileList/ProfileListPage.module.css | 1 + .../pages/ProfilePage/ProfilePage.module.css | 9 +- .../ProfilePageComponents/ProfileContent.jsx | 133 +++++++++--------- .../ProfileContent.module.css | 29 ++-- .../ProfileFormButton.module.css | 4 +- 7 files changed, 101 insertions(+), 88 deletions(-) create mode 100644 FrontEnd/src/pages/CustomThemes/customProfileTooltipThemes.js diff --git a/FrontEnd/src/global.css b/FrontEnd/src/global.css index 614e00176..77b8292c2 100644 --- a/FrontEnd/src/global.css +++ b/FrontEnd/src/global.css @@ -108,4 +108,6 @@ --main-black-90: #292e32; --primary-green-80: #1f9a7c; --character-title-85: rgba(0, 0, 0, 0.85); + + --wf-base-white: #FFF; } diff --git a/FrontEnd/src/pages/CustomThemes/customProfileTooltipThemes.js b/FrontEnd/src/pages/CustomThemes/customProfileTooltipThemes.js new file mode 100644 index 000000000..9ec6d6a4d --- /dev/null +++ b/FrontEnd/src/pages/CustomThemes/customProfileTooltipThemes.js @@ -0,0 +1,11 @@ +const tooltipInnerContentStyles = { + display: 'flex', + borderRadius: '2px', + background: 'var(--main-grey-90, #25292C)', + color: 'var(--main-white, #FFF)', + fontFeatureSettings: 'calt', + fontFamily: 'Inter', + letterSpacing: '-0.14px', +}; + +export default tooltipInnerContentStyles; diff --git a/FrontEnd/src/pages/ProfileList/ProfileListPage.module.css b/FrontEnd/src/pages/ProfileList/ProfileListPage.module.css index 816922a4c..dae96ee5a 100644 --- a/FrontEnd/src/pages/ProfileList/ProfileListPage.module.css +++ b/FrontEnd/src/pages/ProfileList/ProfileListPage.module.css @@ -2,6 +2,7 @@ min-height: 470px; border-radius: 8px; background: var(--wf-base-white, #fff); + flex-grow: 1; } .page-content { diff --git a/FrontEnd/src/pages/ProfilePage/ProfilePage.module.css b/FrontEnd/src/pages/ProfilePage/ProfilePage.module.css index 37ed7b71d..f3efec9c7 100644 --- a/FrontEnd/src/pages/ProfilePage/ProfilePage.module.css +++ b/FrontEnd/src/pages/ProfilePage/ProfilePage.module.css @@ -1,8 +1,7 @@ .container { - word-wrap: break-word; - width: var(--main-block-size); - margin-top: 32px; - margin-right: 488px; + display: flex; + flex-direction: column; + padding-top: 32px; left: 192px; - gap: 40px; + flex-grow: 1; } diff --git a/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/ProfileContent.jsx b/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/ProfileContent.jsx index ff66ae8a8..6c18fb108 100644 --- a/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/ProfileContent.jsx +++ b/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/ProfileContent.jsx @@ -2,7 +2,7 @@ import { Tooltip } from 'antd'; import { PropTypes } from 'prop-types'; import { Link, NavLink, Route, Routes, useBlocker } from 'react-router-dom'; import { useEffect, useState } from 'react'; -import { DirtyFormContext } from '../../../context/DirtyFormContext'; +import { DirtyFormContext } from '../../../context/DirtyFormContext'; import AdditionalInfo from '../FormComponents/AdditionalInfo'; import ContactsInfo from '../FormComponents/ContactsInfo'; import DeleteProfilePage from '../FormComponents/DeleteProfileComponent/DeleteProfilePage'; @@ -15,6 +15,7 @@ import MyModal from '../UI/MyModal/MyModal'; import WarnUnsavedDataModal from '../FormComponents/WarnUnsavedDataModal'; import ChangePassword from '../FormComponents/ChangePassword'; import css from './ProfileContent.module.css'; +import tooltipInnerContentStyles from '../../CustomThemes/customProfileTooltipThemes'; const INFOLINKS = [ @@ -59,24 +60,13 @@ const FORM_NAMES = [ ]; const ProfileContent = (props) => { - - const tooltipInnerContentStyles = { - display: 'flex', - borderRadius: '2px', - background: 'var(--main-grey-90, #25292C)', - color: 'var(--main-white, #FFF)', - fontFeatureSettings: 'calt', - fontFamily: 'Inter', - letterSpacing: '-0.14px', - }; - const [modal, setModal] = useState(false); const [formIsDirty, setFormIsDirty] = useState(false); const blocker = useBlocker( ({ currentLocation, nextLocation }) => - formIsDirty && - currentLocation.pathname !== nextLocation.pathname - ); + formIsDirty && + currentLocation.pathname !== nextLocation.pathname + ); useEffect(() => { if (blocker.state === 'blocked') { @@ -90,79 +80,76 @@ const ProfileContent = (props) => { setFormIsDirty(false); blocker.proceed(); setModal(false); - }; + }; const cancelNavigation = () => { blocker.reset(); setModal(false); - }; + }; - useEffect (() => { + useEffect(() => { const onBeforeUnload = (e) => { if (formIsDirty) { - e.preventDefault(); - e.returnValue = ''; + e.preventDefault(); + e.returnValue = ''; } - }; - window.addEventListener('beforeunload', onBeforeUnload); - return () => { + }; + window.addEventListener('beforeunload', onBeforeUnload); + return () => { window.removeEventListener('beforeunload', onBeforeUnload); - }; - }, [formIsDirty]); + }; + }, [formIsDirty]); return ( -
-
-
- {INFOLINKS.map((element) => { - const isLinkEnabled = - (props.profile.is_registered && props.profile.is_startup) || - (props.profile.is_registered && element.title !== 'Стартап') || - (props.profile.is_startup && element.title !== 'Інформація про товари/ послуги' && element.title !== 'Додаткова інформація'); - return isLinkEnabled ? ( - (`${css['infolink']} ${isActive && css['infolink__active']}`)} - to={`/profile${element.link}`} - key={element.title} - > - {element.title} - - ) : ( - +
+
+
+ {INFOLINKS.map((element) => { + const isLinkEnabled = + (props.profile.is_registered && props.profile.is_startup) || + (props.profile.is_registered && element.title !== 'Стартап') || + (props.profile.is_startup && element.title !== 'Інформація про товари/ послуги' + && element.title !== 'Додаткова інформація'); + return isLinkEnabled ? ( + + (`${css['profile__infolink']} ${isActive && css['profile__infolink-active']}`)} + to={`/profile${element.link}`} + key={element.title} + > + {element.title} + + ) : ( + {element.title} - - ); - })} -
+ + ); + })} +
+ className={`${css['profile__infolink']}`}> Змінити пароль + className={`${css['profile__infolink']} ${css['profile__delete']}`}> Видалити профіль
- } /> { profile={props.profile} currentFormNameHandler={props.currentFormNameHandler} curForm={FORM_NAMES[5]} />} /> + } /> {
- - {props.formName !== 'Delete' && } - - {blocker.state === 'blocked' && - ( - - - ) - } - +
+
+ {props.formName !== 'Delete' && } + + {blocker.state === 'blocked' && + ( + + + ) + } +
); }; diff --git a/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/ProfileContent.module.css b/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/ProfileContent.module.css index b71f2cab5..95cb99595 100644 --- a/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/ProfileContent.module.css +++ b/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/ProfileContent.module.css @@ -1,19 +1,19 @@ -.content__container { +.profile__main { margin-top: 40px; display: flex; align-items: flex-start; - gap: 80px; flex-direction: column; + box-sizing: border-box; } -.content { +.profile__content { padding-left: 192px; display: flex; align-items: flex-start; gap: 16px; } -.info-links-profile { +.profile__info-links { display: flex; flex-direction: column; align-items: flex-start; @@ -22,7 +22,7 @@ gap: 12px; } -.infolink { +.profile__infolink { color: #4F585F; font-family: var(--font-main); font-size: 14px; @@ -33,14 +33,14 @@ text-decoration: none; } -.infolink__active { +.profile__infolink-active { font-family: var(--font-main); font-weight: 600; color: #000000; text-decoration: none; } -.infolink__disabled { +.profile__infolink-disabled { color: var(--main-grey-50, #8D959C); font-feature-settings: 'calt' off; font-family: var(--font-main); @@ -50,12 +50,21 @@ line-height: 22px; letter-spacing: -0.14px; } +.profile__elastic { + padding-top: 100px; + height: 100%; +} -.delete { +.profile__delete { color: #F15831; } -.divider { +.profile__divider { width: 222px; border-bottom: 1px #E2E5EB solid; -} \ No newline at end of file +} + +.profile__button{ + display: flex; + padding-top: 40px; +} diff --git a/FrontEnd/src/pages/ProfilePage/UI/ProfileFormButton/ProfileFormButton.module.css b/FrontEnd/src/pages/ProfilePage/UI/ProfileFormButton/ProfileFormButton.module.css index 37bfb9dbc..dc4dcdd59 100644 --- a/FrontEnd/src/pages/ProfilePage/UI/ProfileFormButton/ProfileFormButton.module.css +++ b/FrontEnd/src/pages/ProfilePage/UI/ProfileFormButton/ProfileFormButton.module.css @@ -3,8 +3,6 @@ align-items: flex-start; padding: 6px 0px; background: #EFFFF6; - margin-top: 140px; - width: var(--main-block-size); } .sign-up__button { @@ -36,4 +34,4 @@ .sign-up__button:active { transform: translateY(2px); -} \ No newline at end of file +} From bc3c0b4d6e477f9d8fc6a27d48fd0d7684c9a9ca Mon Sep 17 00:00:00 2001 From: romanmyko Date: Sat, 28 Sep 2024 12:31:12 +0300 Subject: [PATCH 02/18] Extracting the text from the code --- .../pages/ProfilePage/ProfilePage.module.css | 1 - .../ProfilePageComponents/ProfileContent.jsx | 45 ++----------------- .../ProfileContent.module.css | 5 +-- .../ProfilePageComponents/TextFormNames.js | 12 +++++ .../ProfilePageComponents/TextInfoLinks.js | 31 +++++++++++++ 5 files changed, 48 insertions(+), 46 deletions(-) create mode 100644 FrontEnd/src/pages/ProfilePage/ProfilePageComponents/TextFormNames.js create mode 100644 FrontEnd/src/pages/ProfilePage/ProfilePageComponents/TextInfoLinks.js diff --git a/FrontEnd/src/pages/ProfilePage/ProfilePage.module.css b/FrontEnd/src/pages/ProfilePage/ProfilePage.module.css index f3efec9c7..5fc31f3e5 100644 --- a/FrontEnd/src/pages/ProfilePage/ProfilePage.module.css +++ b/FrontEnd/src/pages/ProfilePage/ProfilePage.module.css @@ -3,5 +3,4 @@ flex-direction: column; padding-top: 32px; left: 192px; - flex-grow: 1; } diff --git a/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/ProfileContent.jsx b/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/ProfileContent.jsx index 6c18fb108..9b4af9e0f 100644 --- a/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/ProfileContent.jsx +++ b/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/ProfileContent.jsx @@ -16,49 +16,10 @@ import WarnUnsavedDataModal from '../FormComponents/WarnUnsavedDataModal'; import ChangePassword from '../FormComponents/ChangePassword'; import css from './ProfileContent.module.css'; import tooltipInnerContentStyles from '../../CustomThemes/customProfileTooltipThemes'; +import INFOLINKS from './TextInfoLinks'; +import FORM_NAMES from './TextFormNames'; -const INFOLINKS = [ - { - title: 'Інформація про користувача', - link: '/user-info', - }, - { - title: 'Загальна інформація', - link: '/general-info', - }, - { - title: 'Контакти', - link: '/contacts', - }, - { - title: 'Інформація про товари/ послуги', - link: '/products-service-info', - tooltipText: 'Цей розділ доступний, коли обрано опцію "Зареєстрована компанія" у розділі Загальна інформація' - }, - { - title: 'Додаткова інформація', - link: '/additional-info', - tooltipText: 'Цей розділ доступний, коли обрано опцію "Зареєстрована компанія" у розділі Загальна інформація' - }, - { - title: 'Стартап', - link: '/startup', - tooltipText: 'Цей розділ доступний, коли обрано опцію "Стартап проект" у розділі Загальна інформація' - }, -]; - -const FORM_NAMES = [ - 'UserInfo', - 'GeneralInfo', - 'ContactsInfo', - 'ProductServiceInfo', - 'AdditionalInfo', - 'StartupInfo', - 'Delete', - 'ChangePassword' -]; - const ProfileContent = (props) => { const [modal, setModal] = useState(false); const [formIsDirty, setFormIsDirty] = useState(false); @@ -199,7 +160,7 @@ const ProfileContent = (props) => {
-
+ {/*
*/}
{props.formName !== 'Delete' && } diff --git a/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/ProfileContent.module.css b/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/ProfileContent.module.css index 95cb99595..d97f52e81 100644 --- a/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/ProfileContent.module.css +++ b/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/ProfileContent.module.css @@ -9,7 +9,6 @@ .profile__content { padding-left: 192px; display: flex; - align-items: flex-start; gap: 16px; } @@ -50,10 +49,10 @@ line-height: 22px; letter-spacing: -0.14px; } -.profile__elastic { +/* .profile__elastic { padding-top: 100px; height: 100%; -} +} */ .profile__delete { color: #F15831; diff --git a/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/TextFormNames.js b/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/TextFormNames.js new file mode 100644 index 000000000..6431a433b --- /dev/null +++ b/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/TextFormNames.js @@ -0,0 +1,12 @@ +const FORM_NAMES = [ + 'UserInfo', + 'GeneralInfo', + 'ContactsInfo', + 'ProductServiceInfo', + 'AdditionalInfo', + 'StartupInfo', + 'Delete', + 'ChangePassword' +]; + +export default FORM_NAMES; \ No newline at end of file diff --git a/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/TextInfoLinks.js b/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/TextInfoLinks.js new file mode 100644 index 000000000..f5ec2a511 --- /dev/null +++ b/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/TextInfoLinks.js @@ -0,0 +1,31 @@ +const INFOLINKS = [ + { + title: 'Інформація про користувача', + link: '/user-info', + }, + { + title: 'Загальна інформація', + link: '/general-info', + }, + { + title: 'Контакти', + link: '/contacts', + }, + { + title: 'Інформація про товари/ послуги', + link: '/products-service-info', + tooltipText: 'Цей розділ доступний, коли обрано опцію "Зареєстрована компанія" у розділі Загальна інформація' + }, + { + title: 'Додаткова інформація', + link: '/additional-info', + tooltipText: 'Цей розділ доступний, коли обрано опцію "Зареєстрована компанія" у розділі Загальна інформація' + }, + { + title: 'Стартап', + link: '/startup', + tooltipText: 'Цей розділ доступний, коли обрано опцію "Стартап проект" у розділі Загальна інформація' + }, +]; + +export default INFOLINKS; \ No newline at end of file From d55480304de7d4c14b7aa1a6ae86e8e2195f9559 Mon Sep 17 00:00:00 2001 From: romanmyko Date: Sat, 28 Sep 2024 16:39:50 +0300 Subject: [PATCH 03/18] add profile global min block size --- FrontEnd/src/global.css | 1 + .../ProfilePageComponents/ProfileContent.jsx | 3 +-- .../ProfilePageComponents/ProfileContent.module.css | 11 +++-------- .../UI/ProfileFormButton/ProfileFormButton.module.css | 1 + 4 files changed, 6 insertions(+), 10 deletions(-) diff --git a/FrontEnd/src/global.css b/FrontEnd/src/global.css index 77b8292c2..a699a9c5f 100644 --- a/FrontEnd/src/global.css +++ b/FrontEnd/src/global.css @@ -110,4 +110,5 @@ --character-title-85: rgba(0, 0, 0, 0.85); --wf-base-white: #FFF; + --profile-min-height-block: calc(100vh - 565px); } diff --git a/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/ProfileContent.jsx b/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/ProfileContent.jsx index 9b4af9e0f..9883fd9d5 100644 --- a/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/ProfileContent.jsx +++ b/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/ProfileContent.jsx @@ -160,7 +160,6 @@ const ProfileContent = (props) => {
- {/*
*/}
{props.formName !== 'Delete' && } @@ -203,4 +202,4 @@ ProfileContent.propTypes = { }).isRequired, currentFormNameHandler: PropTypes.func, formName: PropTypes.string, - }; \ No newline at end of file +}; \ No newline at end of file diff --git a/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/ProfileContent.module.css b/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/ProfileContent.module.css index d97f52e81..04d089f5b 100644 --- a/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/ProfileContent.module.css +++ b/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/ProfileContent.module.css @@ -3,13 +3,14 @@ display: flex; align-items: flex-start; flex-direction: column; - box-sizing: border-box; } .profile__content { padding-left: 192px; + min-height: var(--profile-min-height-block); display: flex; gap: 16px; + } .profile__info-links { @@ -17,7 +18,6 @@ flex-direction: column; align-items: flex-start; width: 222px; - height: 240px; gap: 12px; } @@ -49,10 +49,6 @@ line-height: 22px; letter-spacing: -0.14px; } -/* .profile__elastic { - padding-top: 100px; - height: 100%; -} */ .profile__delete { color: #F15831; @@ -63,7 +59,6 @@ border-bottom: 1px #E2E5EB solid; } -.profile__button{ - display: flex; +.profile__button { padding-top: 40px; } diff --git a/FrontEnd/src/pages/ProfilePage/UI/ProfileFormButton/ProfileFormButton.module.css b/FrontEnd/src/pages/ProfilePage/UI/ProfileFormButton/ProfileFormButton.module.css index dc4dcdd59..a30e8a64a 100644 --- a/FrontEnd/src/pages/ProfilePage/UI/ProfileFormButton/ProfileFormButton.module.css +++ b/FrontEnd/src/pages/ProfilePage/UI/ProfileFormButton/ProfileFormButton.module.css @@ -3,6 +3,7 @@ align-items: flex-start; padding: 6px 0px; background: #EFFFF6; + width: var(--main-block-size); } .sign-up__button { From 8baf5cd6c1a371a2da8c966dda6216ea4fc495de Mon Sep 17 00:00:00 2001 From: romanmyko Date: Mon, 30 Sep 2024 15:57:21 +0300 Subject: [PATCH 04/18] dropdown-menu position --- FrontEnd/src/components/Header/Navbar/DropdownMenu.module.css | 4 ++-- FrontEnd/src/components/Header/Navbar/Navbar.module.css | 1 + FrontEnd/src/global.css | 1 + 3 files changed, 4 insertions(+), 2 deletions(-) diff --git a/FrontEnd/src/components/Header/Navbar/DropdownMenu.module.css b/FrontEnd/src/components/Header/Navbar/DropdownMenu.module.css index 038086a3a..a88ba8037 100644 --- a/FrontEnd/src/components/Header/Navbar/DropdownMenu.module.css +++ b/FrontEnd/src/components/Header/Navbar/DropdownMenu.module.css @@ -29,8 +29,8 @@ position: absolute; z-index: 1; - top: 44px; - left: 1321px; + top: calc(var(--navbar-content-height) + 20px); + left: 1140px; border-radius: 2px; background: var(--conditional-pop-over, #fff); box-shadow: 0px 9px 28px 8px rgba(0, 0, 0, 0.05), diff --git a/FrontEnd/src/components/Header/Navbar/Navbar.module.css b/FrontEnd/src/components/Header/Navbar/Navbar.module.css index 8c983b0d9..2a44534c1 100644 --- a/FrontEnd/src/components/Header/Navbar/Navbar.module.css +++ b/FrontEnd/src/components/Header/Navbar/Navbar.module.css @@ -3,6 +3,7 @@ padding: 8px 104px; align-items: center; justify-content: space-between; + height: var(--navbar-content-height); } .navbar-logo__text{ diff --git a/FrontEnd/src/global.css b/FrontEnd/src/global.css index a699a9c5f..19d0e0a55 100644 --- a/FrontEnd/src/global.css +++ b/FrontEnd/src/global.css @@ -69,6 +69,7 @@ --toastify-custom-close-button: rgba(0, 0, 0, 0.85); /* Header */ + --navbar-content-height: 32px; /* Footer */ --footer-backround: #3C4044; From 596ec9f90ae193da73a3800f11f2e19a0566a6f1 Mon Sep 17 00:00:00 2001 From: romanmyko Date: Tue, 1 Oct 2024 09:59:54 +0300 Subject: [PATCH 05/18] css button v2 --- .../DeleteProfileComponent/DeleteProfileModal.module.css | 2 +- .../DeleteProfileComponent/DeleteProfilePage.jsx | 2 +- .../DeleteProfileComponent/DeleteProfilePage.module.css | 6 +++++- .../ProfilePage/ProfilePageComponents/ProfileContent.jsx | 4 +--- .../ProfilePageComponents/ProfileContent.module.css | 8 ++------ 5 files changed, 10 insertions(+), 12 deletions(-) diff --git a/FrontEnd/src/pages/ProfilePage/FormComponents/DeleteProfileComponent/DeleteProfileModal.module.css b/FrontEnd/src/pages/ProfilePage/FormComponents/DeleteProfileComponent/DeleteProfileModal.module.css index 2c001fbef..8d59d822d 100644 --- a/FrontEnd/src/pages/ProfilePage/FormComponents/DeleteProfileComponent/DeleteProfileModal.module.css +++ b/FrontEnd/src/pages/ProfilePage/FormComponents/DeleteProfileComponent/DeleteProfileModal.module.css @@ -163,4 +163,4 @@ font-style: normal; font-weight: 400; line-height: 22px; -} \ No newline at end of file +} diff --git a/FrontEnd/src/pages/ProfilePage/FormComponents/DeleteProfileComponent/DeleteProfilePage.jsx b/FrontEnd/src/pages/ProfilePage/FormComponents/DeleteProfileComponent/DeleteProfilePage.jsx index 58b8da18f..eef063fa3 100644 --- a/FrontEnd/src/pages/ProfilePage/FormComponents/DeleteProfileComponent/DeleteProfilePage.jsx +++ b/FrontEnd/src/pages/ProfilePage/FormComponents/DeleteProfileComponent/DeleteProfilePage.jsx @@ -14,7 +14,7 @@ const DeleteProfilePage = (props) => { setModal(false); }; return ( -
+
Видалити акаунт
-
{props.formName !== 'Delete' && } {blocker.state === 'blocked' && @@ -169,7 +168,6 @@ const ProfileContent = (props) => { ) } -
); }; @@ -202,4 +200,4 @@ ProfileContent.propTypes = { }).isRequired, currentFormNameHandler: PropTypes.func, formName: PropTypes.string, -}; \ No newline at end of file +}; diff --git a/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/ProfileContent.module.css b/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/ProfileContent.module.css index 04d089f5b..a0b3b80a5 100644 --- a/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/ProfileContent.module.css +++ b/FrontEnd/src/pages/ProfilePage/ProfilePageComponents/ProfileContent.module.css @@ -6,11 +6,11 @@ } .profile__content { - padding-left: 192px; min-height: var(--profile-min-height-block); display: flex; + padding-bottom: 45px; + padding-left: 192px; gap: 16px; - } .profile__info-links { @@ -58,7 +58,3 @@ width: 222px; border-bottom: 1px #E2E5EB solid; } - -.profile__button { - padding-top: 40px; -} From f985353d6b9e4edf64cf9e33d8c2190d4e9d41ba Mon Sep 17 00:00:00 2001 From: romanmyko Date: Wed, 2 Oct 2024 19:25:56 +0300 Subject: [PATCH 06/18] profile-detail and loader css -react in router --- FrontEnd/src/components/Loader/Loader.jsx | 2 +- .../src/components/Loader/Loader.module.css | 8 ++--- .../pages/ProfileDetail/ProfileDetailPage.jsx | 8 ++--- .../ProfileDetailPage.module.css | 31 +++++++++---------- FrontEnd/src/routes/Router.js | 3 +- 5 files changed, 25 insertions(+), 27 deletions(-) diff --git a/FrontEnd/src/components/Loader/Loader.jsx b/FrontEnd/src/components/Loader/Loader.jsx index 0532a6522..1d1952465 100644 --- a/FrontEnd/src/components/Loader/Loader.jsx +++ b/FrontEnd/src/components/Loader/Loader.jsx @@ -3,7 +3,7 @@ import css from './Loader.module.css'; export default function Loader() { return ( -
+
diff --git a/FrontEnd/src/components/Loader/Loader.module.css b/FrontEnd/src/components/Loader/Loader.module.css index d5a82319a..1cabf803b 100644 --- a/FrontEnd/src/components/Loader/Loader.module.css +++ b/FrontEnd/src/components/Loader/Loader.module.css @@ -1,4 +1,4 @@ -.container { - padding: 190px; - max-width: 1132px; -} \ No newline at end of file +.loader__container { + padding-top: 30%; + min-height: 100vh; +} diff --git a/FrontEnd/src/pages/ProfileDetail/ProfileDetailPage.jsx b/FrontEnd/src/pages/ProfileDetail/ProfileDetailPage.jsx index 3760e220b..997aa6a3e 100644 --- a/FrontEnd/src/pages/ProfileDetail/ProfileDetailPage.jsx +++ b/FrontEnd/src/pages/ProfileDetail/ProfileDetailPage.jsx @@ -35,22 +35,22 @@ function ProfileDetailPage({ isAuthorized }) { return (error && error.status !== 401) ? ( ) : ( -
+
{isLoading ? ( ) : ( -
+
-
+
-
+
Date: Wed, 2 Oct 2024 19:40:05 +0300 Subject: [PATCH 07/18] error 404 css --- .../src/pages/ErrorPages/ErrorPage404.jsx | 16 ++++++++-------- .../pages/ErrorPages/ErrorPage404.module.css | 19 ++++++++++--------- 2 files changed, 18 insertions(+), 17 deletions(-) diff --git a/FrontEnd/src/pages/ErrorPages/ErrorPage404.jsx b/FrontEnd/src/pages/ErrorPages/ErrorPage404.jsx index 08a498686..3be512e1c 100644 --- a/FrontEnd/src/pages/ErrorPages/ErrorPage404.jsx +++ b/FrontEnd/src/pages/ErrorPages/ErrorPage404.jsx @@ -4,19 +4,19 @@ import { Button } from 'antd'; export default function ErrorPage404() { return ( -
-
-
404
-
-
-

Щось пішло не так

-

+

+
+
404
+
+
+

Щось пішло не так

+

Схоже, це неправильна адреса, ця сторінка видалена, перейменована або тимчасово недоступна.

diff --git a/FrontEnd/src/pages/ErrorPages/ErrorPage404.module.css b/FrontEnd/src/pages/ErrorPages/ErrorPage404.module.css index b36b6dcd7..6fde13efc 100644 --- a/FrontEnd/src/pages/ErrorPages/ErrorPage404.module.css +++ b/FrontEnd/src/pages/ErrorPages/ErrorPage404.module.css @@ -1,11 +1,12 @@ -.page { - height: 800px; +.ErrorPage404__page { + height: calc(100vh - 305px); display: flex; justify-content: center; background: var(--primary-green-80, #1f9a7c); + } -.container { +.ErrorPage404__container { display: flex; align-items: center; gap: 80px; @@ -15,7 +16,7 @@ font-style: normal; } -.text404 { +.ErrorPage404__text404 { display: flex; height: 178px; flex-direction: column; @@ -26,28 +27,28 @@ letter-spacing: -2px; } -.block { +.ErrorPage404__block { display: flex; flex-direction: column; align-items: flex-start; gap: 36px; } -.explanation { +.ErrorPage404__explanation { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; } -.main-text { +.ErrorPage404__main-text { font-size: 48px; font-weight: 700; line-height: 120%; letter-spacing: 0.48px; } -.details { +.ErrorPage404__details { width: 548px; font-size: 16px; font-weight: 400; @@ -55,6 +56,6 @@ letter-spacing: -0.16px; } -.button-text { +.ErrorPage404__button-text { font-family: var(--font-main); } From 50a6f23b15620dfda1b6138c92227b1e3201c00a Mon Sep 17 00:00:00 2001 From: romanmyko Date: Wed, 2 Oct 2024 19:46:12 +0300 Subject: [PATCH 08/18] error 404 css V2 --- FrontEnd/src/pages/ErrorPages/ErrorPage404.module.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/FrontEnd/src/pages/ErrorPages/ErrorPage404.module.css b/FrontEnd/src/pages/ErrorPages/ErrorPage404.module.css index 6fde13efc..57ccfda71 100644 --- a/FrontEnd/src/pages/ErrorPages/ErrorPage404.module.css +++ b/FrontEnd/src/pages/ErrorPages/ErrorPage404.module.css @@ -1,5 +1,5 @@ .ErrorPage404__page { - height: calc(100vh - 305px); + min-height: calc(100vh - 305px); display: flex; justify-content: center; background: var(--primary-green-80, #1f9a7c); From 9916914c6d0c61962b44c504d9b70ebdb7944155 Mon Sep 17 00:00:00 2001 From: romanmyko Date: Thu, 3 Oct 2024 15:03:58 +0300 Subject: [PATCH 09/18] deleted React in ClientRouter --- FrontEnd/src/routes/ClientRouter.jsx | 1 - 1 file changed, 1 deletion(-) diff --git a/FrontEnd/src/routes/ClientRouter.jsx b/FrontEnd/src/routes/ClientRouter.jsx index b8c14c1ed..4598d5854 100644 --- a/FrontEnd/src/routes/ClientRouter.jsx +++ b/FrontEnd/src/routes/ClientRouter.jsx @@ -1,4 +1,3 @@ -import React from 'react'; import { ToastContainer } from 'react-toastify'; import { Route, Routes, Navigate } from 'react-router-dom'; import { ConfigProvider } from 'antd'; From 17dd5bf29e386c3fd3f7f1650caa780473adb354 Mon Sep 17 00:00:00 2001 From: romanmyko Date: Thu, 3 Oct 2024 16:53:50 +0300 Subject: [PATCH 10/18] profileDetailPages css , add global value body sizes --- .../src/components/Loader/Loader.module.css | 2 +- FrontEnd/src/global.css | 1 + .../pages/ErrorPages/ErrorPage404.module.css | 2 +- .../pages/ProfileDetail/ProfileDetailPage.jsx | 52 +++++++++++-------- .../ProfileDetailPage.module.css | 10 ++-- 5 files changed, 40 insertions(+), 27 deletions(-) diff --git a/FrontEnd/src/components/Loader/Loader.module.css b/FrontEnd/src/components/Loader/Loader.module.css index 1cabf803b..d7c3a6917 100644 --- a/FrontEnd/src/components/Loader/Loader.module.css +++ b/FrontEnd/src/components/Loader/Loader.module.css @@ -1,4 +1,4 @@ .loader__container { padding-top: 30%; - min-height: 100vh; + min-height: var(--min-height-body-main); } diff --git a/FrontEnd/src/global.css b/FrontEnd/src/global.css index 19d0e0a55..6d9bc8dee 100644 --- a/FrontEnd/src/global.css +++ b/FrontEnd/src/global.css @@ -112,4 +112,5 @@ --wf-base-white: #FFF; --profile-min-height-block: calc(100vh - 565px); + --min-height-body-main: calc(100vh - 305px); } diff --git a/FrontEnd/src/pages/ErrorPages/ErrorPage404.module.css b/FrontEnd/src/pages/ErrorPages/ErrorPage404.module.css index 57ccfda71..3b41875df 100644 --- a/FrontEnd/src/pages/ErrorPages/ErrorPage404.module.css +++ b/FrontEnd/src/pages/ErrorPages/ErrorPage404.module.css @@ -1,5 +1,5 @@ .ErrorPage404__page { - min-height: calc(100vh - 305px); + min-height: var(--min-height-body-main); display: flex; justify-content: center; background: var(--primary-green-80, #1f9a7c); diff --git a/FrontEnd/src/pages/ProfileDetail/ProfileDetailPage.jsx b/FrontEnd/src/pages/ProfileDetail/ProfileDetailPage.jsx index 997aa6a3e..4d1b6d3da 100644 --- a/FrontEnd/src/pages/ProfileDetail/ProfileDetailPage.jsx +++ b/FrontEnd/src/pages/ProfileDetail/ProfileDetailPage.jsx @@ -29,37 +29,45 @@ function ProfileDetailPage({ isAuthorized }) { isLoading, } = useSWR(urlProfile, fetcher); - const notRequiredData = ['address', 'banner', 'logo', 'common_info', 'edrpou', 'rnokpp', 'founded', 'official_name', 'product_info', 'service_info', 'startup_idea', 'logistics', 'cooperation']; - const containsNotRequiredData = fetchedProfile ? Object.keys(fetchedProfile).some(key => notRequiredData.includes(key) && fetchedProfile[key] !== '' && fetchedProfile[key] !== null) : false; + const notRequiredData = [ + 'address', 'banner', 'logo', 'common_info', 'edrpou', + 'rnokpp', 'founded', 'official_name', 'product_info', + 'service_info', 'startup_idea', 'logistics', 'cooperation' + ]; + + const containsNotRequiredData = fetchedProfile ? + Object.keys(fetchedProfile).some(key => notRequiredData.includes(key) && + fetchedProfile[key] !== '' && + fetchedProfile[key] !== null) : false; return (error && error.status !== 401) ? ( ) : ( -
+
{isLoading ? ( ) : ( - -
+ +
+
+ +
+ +
+
- -
- -
- -
- -
- + +
+ )}
); diff --git a/FrontEnd/src/pages/ProfileDetail/ProfileDetailPage.module.css b/FrontEnd/src/pages/ProfileDetail/ProfileDetailPage.module.css index 104dabfba..fe552e09d 100644 --- a/FrontEnd/src/pages/ProfileDetail/ProfileDetailPage.module.css +++ b/FrontEnd/src/pages/ProfileDetail/ProfileDetailPage.module.css @@ -1,6 +1,12 @@ +.profile-detail__main { + display: flex; + flex-direction: column; + min-height: var(--min-height-body-main); + align-content: center; +} + .profile-detail__loader-content { display: flex; - width: auto; } .profile-detail__banner-tooltip { @@ -15,8 +21,6 @@ flex-direction: column; align-items: center; gap: 16px; - min-height: calc(100vh - 504px); - margin-left: 104px; } .profile-detail__logo-tooltip { From 0368794c66d099fd68f6e89d2f8b6e7994e5269d Mon Sep 17 00:00:00 2001 From: romanmyko Date: Thu, 3 Oct 2024 22:10:31 +0300 Subject: [PATCH 11/18] profileDetailPages css , add global value body sizes --- FrontEnd/src/components/Loader/Loader.module.css | 2 +- FrontEnd/src/global.css | 4 +++- FrontEnd/src/pages/ErrorPages/ErrorPage404.module.css | 2 +- FrontEnd/src/pages/ProfileDetail/ProfileDetailPage.module.css | 2 +- 4 files changed, 6 insertions(+), 4 deletions(-) diff --git a/FrontEnd/src/components/Loader/Loader.module.css b/FrontEnd/src/components/Loader/Loader.module.css index d7c3a6917..c24dedb7a 100644 --- a/FrontEnd/src/components/Loader/Loader.module.css +++ b/FrontEnd/src/components/Loader/Loader.module.css @@ -1,4 +1,4 @@ .loader__container { padding-top: 30%; - min-height: var(--min-height-body-main); + min-height: var(--min-height-block-main); } diff --git a/FrontEnd/src/global.css b/FrontEnd/src/global.css index 6d9bc8dee..39020ac14 100644 --- a/FrontEnd/src/global.css +++ b/FrontEnd/src/global.css @@ -112,5 +112,7 @@ --wf-base-white: #FFF; --profile-min-height-block: calc(100vh - 565px); - --min-height-body-main: calc(100vh - 305px); + --min-height-block-main: calc(100vh - 305px); + + } diff --git a/FrontEnd/src/pages/ErrorPages/ErrorPage404.module.css b/FrontEnd/src/pages/ErrorPages/ErrorPage404.module.css index 3b41875df..22aac1b6d 100644 --- a/FrontEnd/src/pages/ErrorPages/ErrorPage404.module.css +++ b/FrontEnd/src/pages/ErrorPages/ErrorPage404.module.css @@ -1,5 +1,5 @@ .ErrorPage404__page { - min-height: var(--min-height-body-main); + min-height: var(--min-height-block-main); display: flex; justify-content: center; background: var(--primary-green-80, #1f9a7c); diff --git a/FrontEnd/src/pages/ProfileDetail/ProfileDetailPage.module.css b/FrontEnd/src/pages/ProfileDetail/ProfileDetailPage.module.css index fe552e09d..a5a3bdbb7 100644 --- a/FrontEnd/src/pages/ProfileDetail/ProfileDetailPage.module.css +++ b/FrontEnd/src/pages/ProfileDetail/ProfileDetailPage.module.css @@ -1,7 +1,7 @@ .profile-detail__main { display: flex; flex-direction: column; - min-height: var(--min-height-body-main); + min-height: var(--min-height-block-main); align-content: center; } From d87f7a7fd701d3a3b39a27c78d05fe60f61b4ac5 Mon Sep 17 00:00:00 2001 From: romanmyko Date: Thu, 3 Oct 2024 22:30:15 +0300 Subject: [PATCH 12/18] format global --- FrontEnd/src/global.css | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/FrontEnd/src/global.css b/FrontEnd/src/global.css index 39020ac14..299d22746 100644 --- a/FrontEnd/src/global.css +++ b/FrontEnd/src/global.css @@ -111,8 +111,7 @@ --character-title-85: rgba(0, 0, 0, 0.85); --wf-base-white: #FFF; + --profile-min-height-block: calc(100vh - 565px); --min-height-block-main: calc(100vh - 305px); - - } From 08869a096b0718f39cb8ec33aab286ca6fb6a18a Mon Sep 17 00:00:00 2001 From: romanmyko Date: Fri, 4 Oct 2024 15:02:12 +0300 Subject: [PATCH 13/18] login pages --- FrontEnd/src/pages/Authorization/AuthorizationPage.module.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/FrontEnd/src/pages/Authorization/AuthorizationPage.module.css b/FrontEnd/src/pages/Authorization/AuthorizationPage.module.css index ef68583ba..c7788d9ce 100644 --- a/FrontEnd/src/pages/Authorization/AuthorizationPage.module.css +++ b/FrontEnd/src/pages/Authorization/AuthorizationPage.module.css @@ -1,7 +1,7 @@ .auth-page { display: flex; width: var(--main-block-size); - height: 725px; + min-height: var(--min-height-block-main); flex-shrink: 0; background: #f1fff7; } From 6d4ba2b18d04f22738710d405de2ce987db9d61e Mon Sep 17 00:00:00 2001 From: romanmyko Date: Mon, 7 Oct 2024 21:00:14 +0300 Subject: [PATCH 14/18] search min hight and global fonts --- FrontEnd/src/pages/SearchPage/Search.jsx | 2 +- FrontEnd/src/pages/SearchPage/search.module.css | 8 ++++---- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/FrontEnd/src/pages/SearchPage/Search.jsx b/FrontEnd/src/pages/SearchPage/Search.jsx index 61bfb7ccb..df6b29c32 100644 --- a/FrontEnd/src/pages/SearchPage/Search.jsx +++ b/FrontEnd/src/pages/SearchPage/Search.jsx @@ -107,7 +107,7 @@ export function Search({ isAuthorized }) {

Пошук не дав результатів: компанії з іменем - + {` ${searchTerm} `} не було виявлено на даний момент diff --git a/FrontEnd/src/pages/SearchPage/search.module.css b/FrontEnd/src/pages/SearchPage/search.module.css index 3eed4c45e..0f569ece0 100644 --- a/FrontEnd/src/pages/SearchPage/search.module.css +++ b/FrontEnd/src/pages/SearchPage/search.module.css @@ -1,6 +1,6 @@ .main_block_outer { padding-top: 10px; - width: var(--main-block-size); + min-height: var(--min-height-block-main); } .new-companies-main { @@ -20,20 +20,20 @@ .search_field_entered_value { color: #0b6c61; - font: normal normal normal 20px/2 Inter; + font: normal normal normal 20px/2 var(--font-main); font-weight: 600; font-style: italic; } .search_results_text { - font: Inter; + font: var(--font-main); font-weight: 700; } .search_result_error { font-weight: 600; color: var(--search-text-color); - font: normal normal bold 20px/2 Inter; + font: normal normal bold 20px/2 var(--font-main); margin: 145px; } From d1e74a0ddacbb3bb8d69604e8218000f2ba402a3 Mon Sep 17 00:00:00 2001 From: romanmyko Date: Tue, 8 Oct 2024 08:33:18 +0300 Subject: [PATCH 15/18] add flex styles search v1.0.1 --- FrontEnd/src/pages/SearchPage/Search.jsx | 5 ++--- .../SearchField/SearchResulys.module.css | 6 +++--- .../src/pages/SearchPage/search.module.css | 20 +++++++++++++++++-- 3 files changed, 23 insertions(+), 8 deletions(-) diff --git a/FrontEnd/src/pages/SearchPage/Search.jsx b/FrontEnd/src/pages/SearchPage/Search.jsx index df6b29c32..fe9466a94 100644 --- a/FrontEnd/src/pages/SearchPage/Search.jsx +++ b/FrontEnd/src/pages/SearchPage/Search.jsx @@ -103,11 +103,10 @@ export function Search({ isAuthorized }) {
) : ( -

-
+

Пошук не дав результатів: компанії з іменем - + {` ${searchTerm} `} не було виявлено на даний момент diff --git a/FrontEnd/src/pages/SearchPage/SearchField/SearchResulys.module.css b/FrontEnd/src/pages/SearchPage/SearchField/SearchResulys.module.css index cd7c350c7..d500267f0 100644 --- a/FrontEnd/src/pages/SearchPage/SearchField/SearchResulys.module.css +++ b/FrontEnd/src/pages/SearchPage/SearchField/SearchResulys.module.css @@ -11,10 +11,10 @@ display: grid; grid-template-columns: 1fr 1fr 1fr; justify-content: space-between; - margin: -10px; /* spacess beetwen ecompanies */ + margin: -10px; } .col-md-4 { - flex-basis: calc(33, 3% - 80px); /* 3 companies per row */ - margin: 10px; /* spacess beetwen ecompanies */ + flex-basis: calc(33, 3% - 80px); + margin: 10px; } diff --git a/FrontEnd/src/pages/SearchPage/search.module.css b/FrontEnd/src/pages/SearchPage/search.module.css index 0f569ece0..1967daacc 100644 --- a/FrontEnd/src/pages/SearchPage/search.module.css +++ b/FrontEnd/src/pages/SearchPage/search.module.css @@ -7,6 +7,12 @@ background-color: var(--search-new-companies-main); } +.new-companies-main__error { + display: flex; + min-height: 539px; + align-content: center; +} + .main_block { position: relative; } @@ -31,10 +37,19 @@ } .search_result_error { + margin-left: 140px; + margin-top: 15%; + width: 80%; + flex-direction: row; font-weight: 600; color: var(--search-text-color); font: normal normal bold 20px/2 var(--font-main); - margin: 145px; +} + +.search_result_error_color { + color: #0b6c61; + font: normal normal normal 20px/2 var(--font-main); + font-weight: 600; } .dot-img-right { @@ -44,7 +59,8 @@ flex-direction: column; align-items: flex-start; gap: 24px; - margin: 0px 354px 473px 1330px; + margin-top: 1%; + margin-left: 87%; position: absolute; } From f6476136870fb338adf24eb4c20f00aab9ac9add Mon Sep 17 00:00:00 2001 From: romanmyko Date: Tue, 8 Oct 2024 09:52:01 +0300 Subject: [PATCH 16/18] search add z-index and css v1.0.2 --- FrontEnd/src/global.css | 1 + FrontEnd/src/pages/SearchPage/Search.jsx | 9 +++------ .../SearchPage/SearchField/SearchResulys.module.css | 13 +++++++++---- FrontEnd/src/pages/SearchPage/search.module.css | 2 ++ 4 files changed, 15 insertions(+), 10 deletions(-) diff --git a/FrontEnd/src/global.css b/FrontEnd/src/global.css index 299d22746..fb39c0861 100644 --- a/FrontEnd/src/global.css +++ b/FrontEnd/src/global.css @@ -114,4 +114,5 @@ --profile-min-height-block: calc(100vh - 565px); --min-height-block-main: calc(100vh - 305px); + --main_light-color: #F1FFF7; } diff --git a/FrontEnd/src/pages/SearchPage/Search.jsx b/FrontEnd/src/pages/SearchPage/Search.jsx index fe9466a94..54267ee87 100644 --- a/FrontEnd/src/pages/SearchPage/Search.jsx +++ b/FrontEnd/src/pages/SearchPage/Search.jsx @@ -72,9 +72,9 @@ export function Search({ isAuthorized }) {

- dots_7x6.png + dots_7x6.png
{searchResults && (
@@ -85,10 +85,8 @@ export function Search({ isAuthorized }) { : {searchResults.length > 0 ? searchResults.length : 0} -
)} -
{!error && searchResults.length > 0 ? ( @@ -100,7 +98,6 @@ export function Search({ isAuthorized }) { isAuthorized={isAuthorized} changeCompanies={changeCompanies} /> -
) : (
diff --git a/FrontEnd/src/pages/SearchPage/SearchField/SearchResulys.module.css b/FrontEnd/src/pages/SearchPage/SearchField/SearchResulys.module.css index d500267f0..169ede0ee 100644 --- a/FrontEnd/src/pages/SearchPage/SearchField/SearchResulys.module.css +++ b/FrontEnd/src/pages/SearchPage/SearchField/SearchResulys.module.css @@ -1,6 +1,6 @@ .new-companies-block { display: flex; - width: 1412px; + margin-top: 3%; padding: 16px 8px; flex-direction: column; align-items: center; @@ -11,10 +11,15 @@ display: grid; grid-template-columns: 1fr 1fr 1fr; justify-content: space-between; - margin: -10px; + margin: 20px; + position: relative; + z-index: 100; } .col-md-4 { - flex-basis: calc(33, 3% - 80px); - margin: 10px; + flex-basis: calc(33.3% - 80px); + margin: 20px; + z-index: 1000; + position: relative; + z-index: 100; } diff --git a/FrontEnd/src/pages/SearchPage/search.module.css b/FrontEnd/src/pages/SearchPage/search.module.css index 1967daacc..ef6d251f2 100644 --- a/FrontEnd/src/pages/SearchPage/search.module.css +++ b/FrontEnd/src/pages/SearchPage/search.module.css @@ -10,6 +10,7 @@ .new-companies-main__error { display: flex; min-height: 539px; + margin-top: 3%; align-content: center; } @@ -62,6 +63,7 @@ margin-top: 1%; margin-left: 87%; position: absolute; + z-index: 10; } .new-companies-result_pages { From cd9ca404defeb1d5fddcb4b8c0a58d6d7821db85 Mon Sep 17 00:00:00 2001 From: romanmyko Date: Tue, 8 Oct 2024 16:33:41 +0300 Subject: [PATCH 17/18] pagination styles search css v1.0.4 --- .../src/components/CompanyCard/CompanyCard.module.css | 10 +++++----- FrontEnd/src/global.css | 2 +- FrontEnd/src/pages/SearchPage/Search.jsx | 2 +- .../src/pages/SearchPage/SearchField/SearchResults.jsx | 2 +- ...archResulys.module.css => SearchResults.module.css} | 0 FrontEnd/src/pages/SearchPage/search.module.css | 5 ++--- 6 files changed, 10 insertions(+), 11 deletions(-) rename FrontEnd/src/pages/SearchPage/SearchField/{SearchResulys.module.css => SearchResults.module.css} (100%) diff --git a/FrontEnd/src/components/CompanyCard/CompanyCard.module.css b/FrontEnd/src/components/CompanyCard/CompanyCard.module.css index 1bfb82efb..d2725ec9c 100644 --- a/FrontEnd/src/components/CompanyCard/CompanyCard.module.css +++ b/FrontEnd/src/components/CompanyCard/CompanyCard.module.css @@ -55,7 +55,7 @@ align-items: flex-start; gap: 16px; border-radius: 0 0 12px 12px; - background: var(--main_light-color); + background: var(--company-card-color); } .company-card__text-block__header { @@ -125,7 +125,7 @@ } .company-card__badge-text { - color: var(--main_light-color); + color: var(--company-card-color); text-align: center; font-feature-settings: 'calt' off; font-family: var(--font-main); @@ -148,7 +148,7 @@ width: 64px; height: 64px; flex-shrink: 0; - background: var(--main_light-color); + background: var(--company-card-color); left: 0; top: 0; border-radius: 9999px; @@ -160,7 +160,7 @@ height: 54px; flex-shrink: 0; border-radius: 26px; - background: var(--main_light-color); + background: var(--company-card-color); left: 5px; top: 5px; position: absolute; @@ -170,7 +170,7 @@ .company-card__buttons { color: var(--companies-card-button); border: none; - background-color: var(--main_light-color); + background-color: var(--company-card-color); } .company-card__buttons:hover { diff --git a/FrontEnd/src/global.css b/FrontEnd/src/global.css index fb39c0861..f58329ffa 100644 --- a/FrontEnd/src/global.css +++ b/FrontEnd/src/global.css @@ -114,5 +114,5 @@ --profile-min-height-block: calc(100vh - 565px); --min-height-block-main: calc(100vh - 305px); - --main_light-color: #F1FFF7; + --company-card-color: #F1FFF7; } diff --git a/FrontEnd/src/pages/SearchPage/Search.jsx b/FrontEnd/src/pages/SearchPage/Search.jsx index 54267ee87..5fa418371 100644 --- a/FrontEnd/src/pages/SearchPage/Search.jsx +++ b/FrontEnd/src/pages/SearchPage/Search.jsx @@ -137,7 +137,7 @@ export function Search({ isAuthorized }) { diff --git a/FrontEnd/src/pages/SearchPage/SearchField/SearchResults.jsx b/FrontEnd/src/pages/SearchPage/SearchField/SearchResults.jsx index 32e0a9835..531812b65 100644 --- a/FrontEnd/src/pages/SearchPage/SearchField/SearchResults.jsx +++ b/FrontEnd/src/pages/SearchPage/SearchField/SearchResults.jsx @@ -1,5 +1,5 @@ import CompanyCard from '../../../components/CompanyCard/CompanyCard'; -import styles from './SearchResulys.module.css'; +import styles from './SearchResults.module.css'; import PropTypes from 'prop-types'; const SearchResults = ({ diff --git a/FrontEnd/src/pages/SearchPage/SearchField/SearchResulys.module.css b/FrontEnd/src/pages/SearchPage/SearchField/SearchResults.module.css similarity index 100% rename from FrontEnd/src/pages/SearchPage/SearchField/SearchResulys.module.css rename to FrontEnd/src/pages/SearchPage/SearchField/SearchResults.module.css diff --git a/FrontEnd/src/pages/SearchPage/search.module.css b/FrontEnd/src/pages/SearchPage/search.module.css index ef6d251f2..e2c7e6e04 100644 --- a/FrontEnd/src/pages/SearchPage/search.module.css +++ b/FrontEnd/src/pages/SearchPage/search.module.css @@ -71,7 +71,6 @@ } .pagination { - background-color: var(--main_light-color); display: flex; justify-content: center; align-items: center; @@ -80,7 +79,7 @@ .pagination button { all: unset; - border: none; + /* border: none; */ font-size: 16px; font-weight: 500; padding: 8px 16px; @@ -89,7 +88,7 @@ } .pagination button.active { - background-color: none; + background-color: transparent; color: var(--search-pagination-style-color); border: 1px solid var(--search-pagination-style-color); border-radius: 5px; From 958be4a34bb7d9bfc047e406ebb47ba197fabae2 Mon Sep 17 00:00:00 2001 From: romanmyko Date: Tue, 8 Oct 2024 18:46:30 +0300 Subject: [PATCH 18/18] global color cards company FFF --- FrontEnd/src/global.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/FrontEnd/src/global.css b/FrontEnd/src/global.css index f58329ffa..18708495a 100644 --- a/FrontEnd/src/global.css +++ b/FrontEnd/src/global.css @@ -114,5 +114,5 @@ --profile-min-height-block: calc(100vh - 565px); --min-height-block-main: calc(100vh - 305px); - --company-card-color: #F1FFF7; + --company-card-color: #FFF; }