Merge pull request #31 from Imamul5641/main

Updated Issue_Notice
td1128 · Jul 20, 2024 · 52e7d66 · 52e7d66
2 parents 38b6e5e + a681a81
commit 52e7d66
Show file tree

Hide file tree

Showing 23 changed files with 570 additions and 912 deletions.
diff --git a/public/404.html b/public/404.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
 <html>
   <head>
     <meta charset="utf-8" />
@@ -24,4 +24,4 @@
     </script>
   </head>
   <body></body>
-</html>
+</html>
diff --git a/src/App.jsx b/src/App.jsx
@@ -1,27 +1,25 @@
-import { Provider } from 'react-redux'
-import { store } from './app/store'
-import { BrowserRouter } from 'react-router-dom'
-import Routers from './routes/Routers'
-import { LocalizationProvider } from '@mui/x-date-pickers'
-import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'
-import 'dayjs/locale/de'
-import './App.css'
-import 'bootstrap/dist/css/bootstrap.min.css'
-import { Toaster } from 'react-hot-toast'
-
-function App() {
-  return (
-    <>
-      <Provider store={store}>
-        <LocalizationProvider dateAdapter={AdapterDayjs}>
-          <BrowserRouter basename="/Library_Management_System">
-            <Routers />
-          </BrowserRouter>
-        </LocalizationProvider>
-      </Provider>
-      <Toaster />
-    </>
-  )
-}
-
-export default App
+import { Provider } from 'react-redux'
+import { store } from './app/store'
+import { BrowserRouter } from 'react-router-dom'
+import Routers from './routes/Routers'
+import './App.css'
+import 'bootstrap/dist/css/bootstrap.min.css'
+import { Toaster } from 'react-hot-toast';
+
+
+import Books from './pages/user/Books_catalog/Books'
+
+function App() {
+  return (
+    <>
+      <Provider store={store}>
+        <BrowserRouter basename="/Library_Management_System">
+          <Routers />
+        </BrowserRouter>
+      </Provider>
+      <Toaster/>
+   </>
+  )
+}
+
+export default App
diff --git a/src/common_components/IssueNoticeCards/Cards.jsx b/src/common_components/IssueNoticeCards/Cards.jsx
@@ -0,0 +1,51 @@
+import React from 'react';
+import Tooltip from '@mui/material/Tooltip'
+import './cardsStyle.css';
+
+const Cards = ({ notice, onDelete }) => {
+  const monthname = {
+    '01': 'January',
+    '02': 'February',
+    '03': 'March',
+    '04': 'April',
+    '05': 'May',
+    '06': 'June',
+    '07': 'July',
+    '08': 'August',
+    '09': 'September',
+    '10': 'October',
+    '11': 'November',
+    '12': 'December',
+  };
+
+  const formatDate = (dateString) => {
+    // Split the date string and construct a new Date object
+    const [day, month, year] = dateString.split('-');
+    const date = new Date(`${year}-${month}-${day}`);
+
+    // Extract day and add ordinal suffix
+    const dayWithSuffix = (day) => {
+      const suffixes = ["th", "st", "nd", "rd"];
+      const mod100 = day % 100;
+      return day + (suffixes[(mod100 - 20) % 10] || suffixes[mod100] || suffixes[0]);
+    };
+
+    const dayFormatted = dayWithSuffix(date.getDate());
+    return `Date of Issue: ${dayFormatted} ${monthname[month]}, ${year}`;
+  };
+
+  return (
+    <div className='box'>
+      <Tooltip title={notice.heading} arrow>
+        <p className='subject'>{notice.heading}</p>
+      </Tooltip>
+      <p className='issue'>{formatDate(notice.issue_date)}</p>
+      <p>Status: Active</p>
+      <div className='Mark'>
+        <button onClick={() => onDelete(notice.id)}>Mark Inactive</button>
+      </div>
+    </div>
+  );
+};
+
+export default Cards;
diff --git a/src/common_components/IssueNoticeCards/cardsStyle.css b/src/common_components/IssueNoticeCards/cardsStyle.css
@@ -0,0 +1,29 @@
+.box{
+    margin: 1vw 0.5vw;
+    padding: 0vw 1vw;
+    /* height: 8vw; */
+    width: 23vw;
+    border: 2px solid;
+    font-size: 1.1vw;
+    border-radius: 1vw;
+}
+
+.subject{
+    padding: 0.7vw 0vw 0.2vw;
+    font-size: 1.5vw;
+    color: #b24068;
+    width: 20.7vw;
+    overflow: hidden;
+}
+
+.issue{
+    line-height: 2;
+}
+.Mark{
+    border: 2px solid #b24068;
+    width: fit-content;
+    color: #b24068;
+    margin: 1vw auto 0.5vw;
+    padding: 0.4vw 1.2vw;
+    border-radius: 0.6vw;
+}
diff --git a/src/common_components/Navbar/NavbarStyles.js b/src/common_components/Navbar/NavbarStyles.js
@@ -1,109 +1,109 @@
-const navstyles = {
-  root_open: {
-    width: 230,
-    transition: 'width 0.3s',
-    overflowX: 'hidden',
-    bgcolor: '#4F0C24',
-    overflow: 'hidden',
-    color: 'white',
-  },
-  root_closed: {
-    width: 80,
-    transition: 'width 0.3s',
-    overflowX: 'hidden',
-    bgcolor: '#4F0C24',
-    overflow: 'visible',
-    color: 'white',
-  },
-  list: { height: '100%', display: 'flex', flexDirection: 'column' },
-  titlebox: {
-    paddingX: 0,
-    paddingBottom: 4,
-    marginTop: 2,
-    marginBottom: 1,
-    justifyContent: 'center',
-    alignItems: 'center',
-    gap: 1,
-  },
-  title: {
-    width: '100%',
-    display: 'flex',
-    justifyContent: 'center',
-    alignItems: 'center',
-  },
-  icon: {
-    display: 'flex',
-    justifyContent: 'center',
-    width: 48,
-    height: 48,
-  },
-  arrow: { justifyContent: 'right', marginBottom: 6, marginTop: 'auto' },
-  option: {
-    display: 'flex',
-    flexDirection: 'column',
-    alignItems: 'center',
-    justifyContent: 'center',
-    paddingX: 0,
-    paddingY: 0,
-    borderBottom: '1px solid #FFFFFF',
-    borderTop: '1px solid #FFFFFF',
-  },
-  pathbox: {
-    width: '100%',
-    display: 'flex',
-    justifyContent: 'space-between',
-    alignItems: 'center',
-    bgcolor: '#761236',
-    borderBottom: '1px solid #FFFFFF',
-    paddingRight: 0.5,
-  },
-  pathtitle: {
-    bgcolor: '#761236',
-    color: '#FFFFFF',
-    textDecoration: 'none',
-    width: '100%',
-    display: 'flex',
-    paddingLeft: 1,
-    paddingY: 1,
-  },
-  pathtitle_hover: {
-    bgcolor: '#761236',
-    color: '#999999',
-    textDecoration: 'none',
-    width: '100%',
-    display: 'flex',
-    paddingLeft: 1,
-    paddingY: 1,
-  },
-  pathicon: {
-    display: 'flex',
-    marginRight: 1,
-    justifyContent: 'center',
-    alignItems: 'center',
-  },
-  subpath: {
-    display: 'flex',
-    justifyContent: 'center',
-    color: '#FFFFFF',
-    textDecoration: 'none',
-    paddingY: 1.5,
-    '&:hover': {
-      color: '#999999',
-    },
-    marginX: 'auto',
-    width: '90%',
-  },
-  overlay: {
-    elevation: 1,
-    position: 'absolute',
-    left: '100%',
-    zIndex: 1,
-    paddingTop: 1,
-    paddingX: 2,
-    boxShadow: 3,
-    bgcolor: '#4F0C24',
-    color: 'white',
-  },
-}
-
-export default navstyles
+const navstyles = {
+  root_open: {
+    width: 230,
+    transition: 'width 0.3s',
+    overflowX: 'hidden',
+    bgcolor: '#4F0C24',
+    overflow: 'hidden',
+    color: 'white',
+  },
+  root_closed: {
+    width: 80,
+    transition: 'width 0.3s',
+    overflowX: 'hidden',
+    bgcolor: '#4F0C24',
+    overflow: 'visible',
+    color: 'white',
+  },
+  list: { height: '100%', display: 'flex', flexDirection: 'column' },
+  titlebox: {
+    paddingX: 0,
+    paddingBottom: 4,
+    marginTop: 2,
+    marginBottom: 1,
+    justifyContent: 'center',
+    alignItems: 'center',
+    gap: 1,
+  },
+  title: {
+    width: '100%',
+    display: 'flex',
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+  icon: {
+    display: 'flex',
+    justifyContent: 'center',
+    width: 48,
+    height: 48,
+  },
+  arrow: { justifyContent: 'right', marginBottom: 6, marginTop: 'auto' },
+  option: {
+    display: 'flex',
+    flexDirection: 'column',
+    alignItems: 'center',
+    justifyContent: 'center',
+    paddingX: 0,
+    paddingY: 0,
+    borderBottom: '1px solid #FFFFFF',
+    borderTop: '1px solid #FFFFFF',
+  },
+  pathbox: {
+    width: '100%',
+    display: 'flex',
+    justifyContent: 'space-between',
+    alignItems: 'center',
+    bgcolor: '#761236',
+    borderBottom: '1px solid #FFFFFF',
+    paddingRight: 0.5,
+  },
+  pathtitle: {
+    bgcolor: '#761236',
+    color: '#FFFFFF',
+    textDecoration: 'none',
+    width: '100%',
+    display: 'flex',
+    paddingLeft: 1,
+    paddingY: 1,
+  },
+  pathtitle_hover: {
+    bgcolor: '#761236',
+    color: '#999999',
+    textDecoration: 'none',
+    width: '100%',
+    display: 'flex',
+    paddingLeft: 1,
+    paddingY: 1,
+  },
+  pathicon: {
+    display: 'flex',
+    marginRight: 1,
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+  subpath: {
+    display: 'flex',
+    justifyContent: 'center',
+    color: '#FFFFFF',
+    textDecoration: 'none',
+    paddingY: 1.5,
+    '&:hover': {
+      color: '#999999',
+    },
+    marginX: 'auto',
+    width: '90%',
+  },
+  overlay: {
+    elevation: 1,
+    position: 'absolute',
+    left: '100%',
+    zIndex: 0,
+    paddingTop: 1,
+    paddingX: 2,
+    boxShadow: 3,
+    bgcolor: '#4F0C24',
+    color: 'white',
+  },
+}
+
+export default navstyles