diff --git a/src/app/get-involved/donate-blood/TabSection/data.ts b/src/app/get-involved/donate-blood/TabSection/data.ts index d7f3bd1..1a2814f 100644 --- a/src/app/get-involved/donate-blood/TabSection/data.ts +++ b/src/app/get-involved/donate-blood/TabSection/data.ts @@ -8,51 +8,307 @@ const whereToDonate: WhereToDonate[] = [ { id: '1', title: 'Sunday', - description: `Dirghayu Hospital, Chabahil, Kathmandu - Every Wednestitle, 11 AM to 3 PM - Organizer: Lions Club Of Kathmandu City - Location`, + description: `#### 1. NRCS Central Blood Bank, Bhrikuti Mandap, Kathmandu +- Every day(Sunday-Saturday), 7 AM to 7 PM +- Organizer: Nepal Red Cross Society +- [Location](https://goo.gl/maps/97d2GukQwyjsfJxU8) + +#### 2. Charumati Bihar, Chabahil, Kathmandu +- Every Sunday, 11:30 AM to 3:30 PM +- Organizer: NRCS Chabahil Pashupati Sub-Chapter +- [Location](https://goo.gl/maps/qfjQjrVzmqWw3Nx7A) + +#### 3. Bhugol Park, New Road, Kathmandu +- Every Sunday, 11 AM to 03 PM +- Organizer: Dev Corner Sewa Samiti +- [Location](https://goo.gl/maps/AHYpprpgeLp7RMMF9) +`, }, { id: '2', title: 'Monday', - description: `Dirghayu Hospital, Chabahil, Kathmandu - Every Wednestitle, 11 AM to 3 PM - Organizer: Lions Club Of Kathmandu City - Location`, + description: `#### 1. NRCS Central Blood Bank, Bhrikuti Mandap, Kathmandu +- Every day(Sunday-Saturday), 7 AM to 7 PM +- Organizer: Nepal Red Cross Society +- [Location](https://goo.gl/maps/97d2GukQwyjsfJxU8) +`, }, { id: '3', title: 'Tuesday', - description: `Dirghayu Hospital, Chabahil, Kathmandu - Every Wednestitle, 11 AM to 3 PM - Organizer: Lions Club Of Kathmandu City - Location`, + description: `#### 1. NRCS Central Blood Bank, Bhrikuti Mandap, Kathmandu +- Every day(Sunday-Saturday), 7 AM to 7 PM +- Organizer: Nepal Red Cross Society +- [Location](https://goo.gl/maps/97d2GukQwyjsfJxU8) + +#### 2. Lampokhari, Chabahil, Kathmandu +- Every Tuesday, 10 AM to 2 PM +- Organizer: Lions Club of Kathmandu Chabahil +- [Location](https://goo.gl/maps/6HYkVZuhpGjBmvZXA) +`, }, { id: '4', title: 'Wednesday', - description: `Dirghayu Hospital, Chabahil, Kathmandu - Every Wednestitle, 11 AM to 3 PM - Organizer: Lions Club Of Kathmandu City - Location`, + description: `#### 1. NRCS Central Blood Bank, Bhrikuti Mandap, Kathmandu +- Every day(Sunday-Saturday), 7 AM to 7 PM +- Organizer: Nepal Red Cross Society +- [Location](https://goo.gl/maps/97d2GukQwyjsfJxU8) + +#### 2. Dirghayu Hospital, Chabahil, Kathmandu +- Every Wednesday, 11 AM to 3 PM +- Organizer: Lions Club Of Kathmandu City +- [Location](https://goo.gl/maps/gVMzVjrbMimwQ4Zv7) +`, }, { id: '5', title: 'Thursday', - description: `Dirghayu Hospital, Chabahil, Kathmandu - Every Wednestitle, 11 AM to 3 PM - Organizer: Lions Club Of Kathmandu City - Location`, + description: `#### 1. NRCS Central Blood Bank, Bhrikuti Mandap, Kathmandu +- Every day(Sunday-Saturday), 7 AM to 7 PM +- Organizer: Nepal Red Cross Society +- [Location](https://goo.gl/maps/97d2GukQwyjsfJxU8) + +#### 2. Bhugol Park, New Road, Kathmandu +- Every Thursday and Friday, 11 AM to 03 PM +- Organizer: Pashupati Marwadi Sewa Sangh +- [Location](https://goo.gl/maps/AHYpprpgeLp7RMMF9) + +#### 3. Ason, near Ratna Park, Kathmandu +- Every Sunday to Friday, 11 AM to 3 PM +- Organizer: Sewa Samiti and Lions Club of Laliguras +- [Location](https://goo.gl/maps/RH6ox4aaH98P7iDh7) +`, }, { id: '6', title: 'Friday', - description: `Dirghayu Hospital, Chabahil, Kathmandu - Every Wednestitle, 11 AM to 3 PM - Organizer: Lions Club Of Kathmandu City - Location`, + description: `#### 1. NRCS Central Blood Bank, Bhrikuti Mandap, Kathmandu +- Every day(Sunday-Saturday), 7 AM to 7 PM +- Organizer: Nepal Red Cross Society +- [Location](https://goo.gl/maps/97d2GukQwyjsfJxU8) + +#### 2. Chhakku Bakku Park New Baneshwor, Kathmandu +- Every Thursday and Friday, 11:30 AM to 3:30 PM +- Organizer: Arthamani Multipurpose Co-operative Ltd. + +#### 3. Dillibazar, Pipalbot, Kathmandu +- Every Friday, 12 AM to 4 PM +- Organizer: Shanti Gyan Satsang Bhajan Mandal +`, + }, + { + id: '7', + title: 'Saturday', + description: `#### 1. NRCS Central Blood Bank, Bhrikuti Mandap, Kathmandu +- Every day(Sunday-Saturday), 7 AM to 7 PM +- Organizer: Nepal Red Cross Society +- [Location](https://goo.gl/maps/97d2GukQwyjsfJxU8) + +#### 2. Pashupati Temple Premises +- Every Monday and Saturday, 08 AM to 12 AM +- Organizer: Ganeshman Singh Adhyayan Pratisthan +- [Location](https://goo.gl/maps/vyKU2g7xix43zQeN9) + +#### 3. Bouddha Stupa +- Every Saturday 11:00 AM to 3:00 PM +- Organizer: Sweta Blood Donation Campaign + +#### 4. Tebahal, New Road, Kathmandu +- Every Saturday 7AM to 12 PM +- Organizer: Sankata Club (SBSC) +`, + }, +]; + +export interface OutsideValleyTable { + id: number; + bloodCenter: string; + focalPerson: string; + contactNo: string; + district: string; +} + +export const outsideValleyTable: OutsideValleyTable[] = [ + { + id: 1, + bloodCenter: 'Baglung', + focalPerson: 'Gurudatta Sharma', + contactNo: '068-520273', + district: 'Baglung', + }, + { + id: 2, + bloodCenter: 'Banepa', + focalPerson: 'Radha Thapa', + contactNo: '011-661431', + district: 'Kavre', + }, + { + id: 3, + bloodCenter: 'Bhadrapur', + focalPerson: 'Torna Bikram Karki', + contactNo: '023-520814', + district: 'Jhapa', + }, + { + id: 4, + bloodCenter: 'Bhaktapur', + focalPerson: 'Uttam Kusma', + contactNo: '01-6612266', + district: 'Bhaktapur', + }, + { + id: 5, + bloodCenter: 'Bharatpur', + focalPerson: 'Ramesh Kanta Poudel', + contactNo: '065-520880', + district: 'Chitwan', + }, + { + id: 6, + bloodCenter: 'Birgunj', + focalPerson: 'Saurab', + contactNo: '051-522504', + district: 'Parsa', + }, + { + id: 7, + bloodCenter: 'Butawal', + focalPerson: 'Jogbahadur Gurung', + contactNo: '071-541004', + district: 'Butawal', + }, + { + id: 8, + bloodCenter: 'Damak', + focalPerson: 'Sidhartha Dahal', + contactNo: '023-582101', + district: 'Jhapa', + }, + { + id: 9, + bloodCenter: 'Dhangadi', + focalPerson: 'Dharani Prasad Pant', + contactNo: '091-521600', + district: 'Kailali', + }, + { + id: 10, + bloodCenter: 'Dhankuta', + focalPerson: 'Niranjan Aale', + contactNo: '026-520135', + district: 'Dhankuta', + }, + { + id: 11, + bloodCenter: 'Dharan', + focalPerson: 'Subash Chandra Singh', + contactNo: '025-520968', + district: 'Dharan', + }, + { + id: 12, + bloodCenter: 'Ghorahi', + focalPerson: 'Dilip Kumar Neupane', + contactNo: '082-61460', + district: 'Dang', + }, + { + id: 13, + bloodCenter: 'Hetauda', + focalPerson: 'Tanka Prasad Dahal', + contactNo: '057-522977', + district: 'Makawanpur', + }, + { + id: 14, + bloodCenter: 'Janakpur', + focalPerson: 'Narayan Neupane', + contactNo: '41520870', + district: 'Dhanusha', + }, + { + id: 15, + bloodCenter: 'Mahendranagar', + focalPerson: 'Labdev Joshi', + contactNo: '091-523983', + district: 'Kanchanpur', + }, + { + id: 16, + bloodCenter: 'Myanglung', + focalPerson: 'Pradip Hanglimbu', + contactNo: '026-460101', + district: 'Terhathum', + }, + { + id: 17, + bloodCenter: 'Nepalgunj', + focalPerson: 'Upendra Regmi', + contactNo: '071-520174', + district: 'Banke', + }, + { + id: 18, + bloodCenter: 'Pokhara', + focalPerson: 'DhurbaMani Lamichhane', + contactNo: '061-521091', + district: 'Kaski', + }, + { + id: 19, + bloodCenter: 'Rajbiraj', + focalPerson: 'Nabin Kumar Jha', + contactNo: '031-521121', + district: 'Saptari', + }, + { + id: 20, + bloodCenter: 'Siraha', + focalPerson: 'Pradip Kumar Yadav', + contactNo: '033-560975', + district: 'Lahan', + }, + { + id: 21, + bloodCenter: 'Surkhet', + focalPerson: 'Prakash Shrestha', + contactNo: '083-520310', + district: 'Surkhet', + }, + { + id: 22, + bloodCenter: 'NRCS Kawasoti SubChapter, Nawalparasi', + focalPerson: 'Saraswoti Bhusal', + contactNo: '078-540418', + district: 'Nawalpur, Bardaghat Susta east', }, ]; +export const canIDonate = `Blood donation is open for almost everyone with only a few limitations based on the medical conditions of the blood donor. + +You can donate blood once in every three months. + +## Donating person has to apply: +- Be 18 to 60 years old +- Weight above 45 kg +- Have hemoglobin above 12 gm/dl +- Have blood pressure 110-160 / 70-96 mmHg +- Not to be pregnant, breastfeeding, and have at least 8 days since the start of the recent menstruation +- Not having recent use of drugs or strong medicines (people who take strong medicine for a short period will not able to donate blood from one week up to 2 years) +- Not to had a medical surgery for 2 years +- If you have had one of these conditions, you are unfortunately restricted to donating blood but recommended to encourage your family members, friends and loved ones to donate: + +**Cancer, Heart diseases, HIV/AIDS, Hepatitis B or C, Hemophilia and Thalassemia, Diabetes, Liver diseases, Polycythemia Vera, Asthma, An Endocrine Disorder or A Hormonal disorder** +`; + +export const donateBloodOrganization = `## Donation event for an organization or company +We are visiting companies and organizations daily to collect blood. It is a great activity for team building and recreational days, and social responsibility events. + +Arrange a regular or one-time blood donation at your company or organization by contacting Mr. Sandesh Thapa via email, + +The earlier we set the date, the easier we can plan the efficient blood supply management. But if needed, we can deploy our blood collection team with even short notice! Never think it is too late or too early – today is just the perfect time to start planning the blood donation event in your community or company! +`; + export default whereToDonate; diff --git a/src/app/get-involved/donate-blood/TabSection/index.tsx b/src/app/get-involved/donate-blood/TabSection/index.tsx index 4f79615..d6c49c3 100644 --- a/src/app/get-involved/donate-blood/TabSection/index.tsx +++ b/src/app/get-involved/donate-blood/TabSection/index.tsx @@ -3,7 +3,9 @@ import { useState } from 'react'; import Accordion from '#components/Accordion'; +import ArticleBody from '#components/ArticleBody'; import Heading from '#components/Heading'; +import Table, { type Column } from '#components/Table'; import { Tab, TabList, @@ -11,12 +13,41 @@ import { Tabs, } from '#components/Tabs'; -import whereToDonate from './data'; +import whereToDonate, { + canIDonate, + donateBloodOrganization, + type OutsideValleyTable, + outsideValleyTable, +} from './data'; import styles from './styles.module.css'; export default function TabSection() { const [value, setValue] = useState('where'); + + const column: Column[] = [ + { + id: 'bloodCenter', + title: 'Blood Center', + cellRenderer: (item) => item.bloodCenter, + }, + { + id: 'focalPerson', + title: 'Focal Person', + cellRenderer: (item) => item.focalPerson, + }, + { + id: 'contactNo', + title: 'Contact', + cellRenderer: (item) => item.contactNo, + }, + { + id: 'district', + title: 'District', + cellRenderer: (item) => item.district, + }, + ]; + return ( + item.id} + /> - - Donating person has to apply: - -

- - be 18 to 60 years old - - weight above 45 kg - - have hemoglobin above 12 gm/dl - - have blood pressure 110-160 / 70-96 mmHg - - not to be pregnant, breastfeeding, and have at least - 8 days since the start of the recent menstruation - - not having recent use of drugs or strong medicines - (people who take strong medicine for a short period will - not able to donate blood from one week up to 2 years) - - not to had a medical surgery for 2 years - If you have had one of these conditions, you are - unfortunately restricted to donating blood but - recommended to encourage your family members, friends and loved ones to donate: - - cancer, heart diseases, HIV/AIDS, hepatitis B or C, - hemophilia and thalassemia, diabetes, liver diseases, - Polycythemia Vera, asthma, an endocrine disorder or a hormonal disorder -

+ - - Donation event for an organization or company - -

- - We are visiting daily in companies and organizations to collect blood. - It is a great activity for team building and recreational days, - and social responsibility events. - - Arrange a regular or one-time blood donation at your company or - organization by contacting Mr. Ram Bahadur Shrestha via email, - ram.shrestha@nrcs.org, or phone, 9841398605. - - The earlier we set the date, the easier we can plan the - efficient blood supply management. But if needed, we can - deploy our blood collection team with even short notice! - Never think it is too late or too early – today is just - the perfect time to start planning the blood donation event in - your community or company! -

+ ); diff --git a/src/app/get-involved/donate-blood/TabSection/styles.module.css b/src/app/get-involved/donate-blood/TabSection/styles.module.css index f284654..e1cc935 100644 --- a/src/app/get-involved/donate-blood/TabSection/styles.module.css +++ b/src/app/get-involved/donate-blood/TabSection/styles.module.css @@ -8,4 +8,9 @@ flex-direction: column; gap: var(--spacing-medium); } + + .list { + padding-left: var(--spacing-large); + line-height: 1.5; + } } diff --git a/src/components/Accordion/index.tsx b/src/components/Accordion/index.tsx index 3e92211..d88070c 100644 --- a/src/components/Accordion/index.tsx +++ b/src/components/Accordion/index.tsx @@ -7,12 +7,14 @@ import { import Button from '#components/Button'; +import ArticleBody from '../ArticleBody'; + import styles from './styles.module.css'; interface AccordionItem { id: string; - title: React.ReactNode; - description: React.ReactNode; + title: string; + description: string; } interface Props { items: AccordionItem[]; @@ -67,7 +69,9 @@ function Accordion(props: Props) {
- {item.description} +
)} diff --git a/src/components/ArticleBody/index.tsx b/src/components/ArticleBody/index.tsx index 5b587a3..5691a36 100644 --- a/src/components/ArticleBody/index.tsx +++ b/src/components/ArticleBody/index.tsx @@ -10,16 +10,16 @@ interface Props { content?: string; } -export default async function ArticleBody(props: Props) { +export default function ArticleBody(props: Props) { const { className, content = '', } = props; - const processedContent = await remark() + const processedContent = remark() .use(html, { sanitize: false }) .use(remarkGfm) - .process(content); + .processSync(content); const contentHtml = processedContent.toString(); return ( diff --git a/src/components/ArticleBody/styles.module.css b/src/components/ArticleBody/styles.module.css index 3c5449e..d186d7f 100644 --- a/src/components/ArticleBody/styles.module.css +++ b/src/components/ArticleBody/styles.module.css @@ -7,7 +7,7 @@ h1, h2, h3, h4, h5, h6 { max-width: 60rem; color: var(--color-heading)!important; - font-weight: var(--font-weight-bold); + font-weight: var(--font-weight-extra-bold); margin: var(--spacing-small) 0; } @@ -44,7 +44,7 @@ a { max-width: clamp(100%, 60rem, 100%); word-break: break-word; - color: var(--color-link); + color: var(--color-text-link); font-size: var(--font-size-medium); &:hover { diff --git a/src/components/Tabs/styles.module.css b/src/components/Tabs/styles.module.css index 6f7676c..8e4b209 100644 --- a/src/components/Tabs/styles.module.css +++ b/src/components/Tabs/styles.module.css @@ -1,3 +1,6 @@ +.tab { + width: 33%; +} .active { padding: var(--spacing-extra-small) var(--spacing-small); color: var(--color-text-on-dark);