diff --git a/src/assets/Logo/RistekLogo-dark.svg b/src/assets/Logo/RistekLogo-dark.svg new file mode 100644 index 0000000..0bfabcc --- /dev/null +++ b/src/assets/Logo/RistekLogo-dark.svg @@ -0,0 +1,52 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/assets/Logo/RistekLogo-light.svg b/src/assets/Logo/RistekLogo-light.svg new file mode 100644 index 0000000..e310f7e --- /dev/null +++ b/src/assets/Logo/RistekLogo-light.svg @@ -0,0 +1,32 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/containers/Admin/Feedbacks/index.js b/src/containers/Admin/Feedbacks/index.js index 2eed4dc..adfed95 100644 --- a/src/containers/Admin/Feedbacks/index.js +++ b/src/containers/Admin/Feedbacks/index.js @@ -2,7 +2,6 @@ import React, { useState } from 'react'; import { Box, Text, - Image, Flex, Table, Thead, @@ -11,15 +10,12 @@ import { Th, Td, Select, - useColorModeValue, HStack, - Link, + useColorModeValue, } from '@chakra-ui/react'; import { Helmet } from 'react-helmet'; -import { NavLink } from 'react-router-dom'; import { ChevronLeftIcon, ChevronRightIcon, StarIcon, ArrowUpIcon, ArrowDownIcon } from '@chakra-ui/icons'; import styled from 'styled-components'; -import LogoSunjad from 'assets/Beta/LogoSunjad-light.svg'; import { dummyFeedbacks, feedbackStats } from './feedback'; const AdminFeedbacks = () => { @@ -30,8 +26,6 @@ const AdminFeedbacks = () => { const totalPages = Math.ceil(dummyFeedbacks.length / feedbacksPerPage); const sortedFeedbacks = [...dummyFeedbacks]; - - const sortedData = () => { if (sortConfig.key !== null) { sortedFeedbacks.sort((a, b) => { @@ -118,20 +112,16 @@ const AdminFeedbacks = () => { return sortConfig.direction === 'asc' ? : ; }; + const tableBg = useColorModeValue('primary.White', 'dark.LightBlack'); + const tableTextColor = useColorModeValue('secondary.MineShaft', 'dark.White'); + const selectBg = useColorModeValue('primary.White', 'dark.LightBlack'); + const borderColor = useColorModeValue('gray.200', 'gray.700'); + return ( - + - - - - logo - - Sign Out - - - - + Rating & Ulasan User @@ -146,7 +136,7 @@ const AdminFeedbacks = () => { .map((_, i) => ( @@ -170,7 +160,7 @@ const AdminFeedbacks = () => { - + @@ -213,7 +203,7 @@ const AdminFeedbacks = () => {
{feedback.feedback} {feedback.time} - @@ -244,6 +234,7 @@ const AdminFeedbacks = () => { value={feedbacksPerPage} onChange={e => setFeedbacksPerPage(parseInt(e.target.value, 10))} ml={2} + bg={selectBg} > @@ -255,34 +246,6 @@ const AdminFeedbacks = () => { ); }; -const Container = props => ( - -); - -export const SignOutLink = styled(NavLink)` - font-size: 18px; - white-space: nowrap; - color: var(--chakra-colors-state-Error) !important; - @media only screen and (max-width: 900px) { - font-size: 14px; - line-height: 3rem; - } -`; - const PaginationButton = styled.button` background: transparent; color: var(--chakra-colors-primary-Purple); diff --git a/src/containers/Admin/Login/index.js b/src/containers/Admin/Login/index.js index 38463ff..bca2669 100644 --- a/src/containers/Admin/Login/index.js +++ b/src/containers/Admin/Login/index.js @@ -11,7 +11,6 @@ import { InputGroup, InputRightElement, IconButton, - useColorModeValue, Image, } from '@chakra-ui/react'; import { Helmet } from 'react-helmet'; @@ -53,12 +52,11 @@ const AdminLogin = () => { return ( diff --git a/src/containers/BetaLanding/index.js b/src/containers/BetaLanding/index.js index ebe2ab0..44c7d9c 100644 --- a/src/containers/BetaLanding/index.js +++ b/src/containers/BetaLanding/index.js @@ -23,7 +23,7 @@ import { import { FAQS } from "./data"; import BauhausMobile from "assets/Beta/bauhaus-sm.svg"; -import RistekBetaLogo from "assets/Beta/Beta_Logo_Light.svg"; +import RistekBetaLogo from "assets/Logo/RistekLogo-light.svg"; import SunjadBetaLogo from "assets/Beta/Sunjad_Beta.svg"; import BetaAssetA from "assets/Beta/beta-landing-asset-1.svg"; import BetaAssetB from "assets/Beta/beta-landing-asset-2.svg"; diff --git a/src/containers/Footer/SocialCointainer.js b/src/containers/Footer/SocialCointainer.js index 5b655b1..7d32811 100644 --- a/src/containers/Footer/SocialCointainer.js +++ b/src/containers/Footer/SocialCointainer.js @@ -6,25 +6,28 @@ import { StyledIconWrapper } from "./styles"; const SocialContainer = () => { const [listOfIcons, setListOfIcons] = useState([]); const theme = useColorModeValue("light", "dark"); + + const importAll = (r) => { + return r.keys().map(r); + }; + useEffect(() => { - const dir = - theme === "light" - ? importAll(require.context("assets/Beta/icons", false, /\.(svg)$/)) - : importAll( - require.context("assets/Beta/icons/icon-dark", false, /\.(svg)$/), - ); - - let list = dir; - list = list.map((img, idx) => ({ - image: img, - link: ListIcon[idx].url, + let dir = []; + + if (theme === "light") { + dir = importAll(require.context("assets/Beta/icons", false, /\.(svg)$/)); + } else { + dir = importAll(require.context("assets/Beta/icons/icon-dark", false, /\.(svg)$/)); + } + + const list = dir.map((img, idx) => ({ + image: img.default, + link: ListIcon[idx]?.url || "#", })); + setListOfIcons(list); }, [theme]); - const importAll = (r) => { - return r.keys().map(r); - }; return ( {listOfIcons.map((item, id) => ( diff --git a/src/containers/Footer/index.js b/src/containers/Footer/index.js index 38611c9..71dfe35 100644 --- a/src/containers/Footer/index.js +++ b/src/containers/Footer/index.js @@ -25,15 +25,15 @@ import HackDarkLogo from "assets/Beta/HackPlus-dark.svg"; import MapPoint from "assets/Beta/MapPoint.svg"; import MapPointDark from "assets/Beta/MapPoint-dark.svg"; -import RistekBetaLogoLight from "assets/Beta/Beta_Logo_Light.svg"; -import RistekBetaLogoDark from "assets/Beta/Beta_Logo_Dark.svg"; +import RistekLogoLight from "assets/Logo/RistekLogo-light.svg"; +import RistekLogoDark from "assets/Logo/RistekLogo-dark.svg"; import SocialContainer from "./SocialCointainer"; const Footer = () => { const location = useLocation(); const theme = useColorModeValue("light", "dark"); - if (location.pathname === "/susun") return null; + if (["/susun", "/admin", "/feedback-recap"].includes(location.pathname)) return null; return ( @@ -43,7 +43,7 @@ const Footer = () => { textAlign={{ base: "center", lg: "left" }} > { const theme = useColorModeValue("light", "dark"); return ( - {LINKS.map(({ to, label }) => ( - - {label} - - ))} + {pathname !== "/feedback-recap" && + LINKS.map(({ to, label }) => ( + + {label} + + )) + } Sign Out ); diff --git a/src/containers/Login/index.js b/src/containers/Login/index.js index 47c6236..2894009 100644 --- a/src/containers/Login/index.js +++ b/src/containers/Login/index.js @@ -49,7 +49,7 @@ import { import { FlexBox } from "containers/BetaLanding/styles"; -import RistekLogo from "assets/Beta/Beta_Logo_Light.svg"; +import RistekLogo from "assets/Logo/RistekLogo-light.svg"; import ChevronDown from "assets/Beta/chevron-down.svg"; import ChevronUp from "assets/Beta/chevron-up.svg"; diff --git a/src/containers/ViewSchedule/FeedbackModal.js b/src/containers/ViewSchedule/FeedbackModal.js index 1ba59da..8ffb7e6 100644 --- a/src/containers/ViewSchedule/FeedbackModal.js +++ b/src/containers/ViewSchedule/FeedbackModal.js @@ -65,7 +65,7 @@ const FeedbackModal = ({ isOpen, onClose }) => { { Berikan kami Ulasan! - + Bagaimana pengalaman Anda dalam menggunakan SusunJadwal? diff --git a/src/containers/ViewSchedule/GoogleCalendarModal.js b/src/containers/ViewSchedule/GoogleCalendarModal.js index 666aff7..b3b3222 100644 --- a/src/containers/ViewSchedule/GoogleCalendarModal.js +++ b/src/containers/ViewSchedule/GoogleCalendarModal.js @@ -74,7 +74,6 @@ const steps = [ const GoogleCalendarModal = () => { const { isOpen, onOpen, onClose } = useDisclosure(); const [isWidgetVisible, setIsWidgetVisible] = useState(true); - const [isMinimized, setIsMinimized] = useState(false); const [isClosed, setIsClosed] = useState(false); const [step, setStep] = useState(0); const theme = useColorModeValue("light", "dark"); @@ -85,17 +84,10 @@ const GoogleCalendarModal = () => { }; const handleMinimizeModal = () => { - setIsMinimized(true); onClose(); setIsWidgetVisible(true); }; - const handleMaximizeModal = () => { - setIsMinimized(false); - onOpen(); - setIsWidgetVisible(false); - }; - const handleCloseModal = () => { setIsClosed(true); onClose(); @@ -168,16 +160,16 @@ const GoogleCalendarModal = () => { {step === 0 ? ( - + Integrasikan Jadwalmu dengan Google Calendar - + ) : ( - + Integrasikan Jadwalmu dengan Google Calendar = 4 ? "30px 30px 0 30px" : "0"}> @@ -301,21 +293,9 @@ const StyledImage = styled(Image)` width: ${props => props.size}; height: ${props => props.height || "auto"}; object-fit: cover; -`; - -const MinimizedButton = styled(Button)` - z-index: 1000; - position: fixed; - bottom: 20px; - right: 20px; - background-color: #5038bc; - color: white; - padding: 10px; - border-radius: 8px; - box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); - - &:hover { - background-color: #674de0; + @media (max-width: 768px) { + scale: 1.2; + padding: 8px; } `; diff --git a/src/containers/ViewSchedule/ProgressBar.js b/src/containers/ViewSchedule/ProgressBar.js index d004c84..6787a05 100644 --- a/src/containers/ViewSchedule/ProgressBar.js +++ b/src/containers/ViewSchedule/ProgressBar.js @@ -18,7 +18,7 @@ const ProgressBar = ({ steps, currentStep }) => { state.appState.isAnnouncement); const isMobile = useSelector((state) => state.appState.isMobile); - const location = useLocation(); const paddingTopLargeScreen = isAnnouncement ? "162px" : "120px"; - const isAdminRoute = ADMIN_ROUTES.some(route => location.pathname.startsWith(route.path)); return ( - {isAdminRoute ? ( - - ) : ( <>