From b795b51831fc634c8d9775bcc5563a445dcff00a Mon Sep 17 00:00:00 2001 From: Rishav Chapagain Date: Fri, 13 Sep 2024 23:44:05 +0545 Subject: [PATCH 1/5] Responsiveness in banners --- css/input.css | 15 +- css/output.css | 162 ++++++++++++++---- data/schedule.json | 242 +++++++++++++------------- gallery.json | 42 ++--- index.html | 53 +++--- js/faqs.js | 28 ++-- js/footer.js | 3 +- js/schedule.js | 33 ++-- pages/itinerary.html | 391 +++++++++++++++++++++---------------------- 9 files changed, 524 insertions(+), 445 deletions(-) diff --git a/css/input.css b/css/input.css index 484c893..9fd5e13 100644 --- a/css/input.css +++ b/css/input.css @@ -2,7 +2,6 @@ @tailwind components; @tailwind utilities; - @layer components { .bg-grid { background-color: #f6f6ff; @@ -11,7 +10,6 @@ rgba(0, 0, 0, 0.1) 1px, transparent 1px ), - linear-gradient(180deg, rgba(0, 0, 0, 0.1) 1px, transparent 1px); background-size: 50px 50px; @@ -23,16 +21,15 @@ grid-template-rows: repeat(1, (0, 55%)); } - /* For FAQ page */ - .faq-item{ - @apply border bg-white border-gray-300 shadow-md rounded-md pt-4 px-4 my-5; + .faq-item { + @apply my-5 rounded-md border border-gray-300 bg-white px-4 pt-4 shadow-md; } - .faq-question{ - @apply w-full text-left flex justify-between gap-4 items-center; + .faq-question { + @apply flex w-full items-center justify-between gap-4 text-left; } - .faq-answer{ - @apply my-2 text-gray-500 overflow-hidden transition-all duration-500 max-h-0; + .faq-answer { + @apply my-2 max-h-0 overflow-hidden text-gray-500 transition-all duration-500; } } diff --git a/css/output.css b/css/output.css index 90a3011..5fe88a4 100644 --- a/css/output.css +++ b/css/output.css @@ -595,7 +595,6 @@ video { rgba(0, 0, 0, 0.1) 1px, transparent 1px ), - linear-gradient(180deg, rgba(0, 0, 0, 0.1) 1px, transparent 1px); background-size: 50px 50px; } @@ -832,10 +831,6 @@ video { height: 3.5rem; } -.h-2\/3 { - height: 66.666667%; -} - .h-24 { height: 6rem; } @@ -940,10 +935,6 @@ video { width: 0.25rem; } -.w-1\/3 { - width: 33.333333%; -} - .w-12 { width: 3rem; } @@ -960,10 +951,6 @@ video { width: 0.75rem; } -.w-3\/4 { - width: 75%; -} - .w-4 { width: 1rem; } @@ -1036,14 +1023,14 @@ video { max-width: 48rem; } -.max-w-5xl { - max-width: 64rem; -} - .max-w-6xl { max-width: 72rem; } +.max-w-7xl { + max-width: 80rem; +} + .max-w-\[100vw\] { max-width: 100vw; } @@ -1052,10 +1039,6 @@ video { max-width: 100%; } -.max-w-7xl { - max-width: 80rem; -} - .-rotate-180 { --tw-rotate: -180deg; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); @@ -1125,6 +1108,10 @@ video { justify-content: space-between; } +.justify-around { + justify-content: space-around; +} + .justify-items-center { justify-items: center; } @@ -1222,8 +1209,8 @@ video { border-width: 8px; } -.border-r-2 { - border-right-width: 2px; +.border-r { + border-right-width: 1px; } .border-r-4 { @@ -1294,11 +1281,6 @@ video { background-color: rgb(218 165 32 / var(--tw-bg-opacity)); } -.bg-\[\#FFCD29\] { - --tw-bg-opacity: 1; - background-color: rgb(255 205 41 / var(--tw-bg-opacity)); -} - .bg-\[\#FFDD50\] { --tw-bg-opacity: 1; background-color: rgb(255 221 80 / var(--tw-bg-opacity)); @@ -1319,6 +1301,11 @@ video { background-color: rgb(255 255 255 / var(--tw-bg-opacity)); } +.bg-yellow-400 { + --tw-bg-opacity: 1; + background-color: rgb(250 204 21 / var(--tw-bg-opacity)); +} + .bg-opacity-60 { --tw-bg-opacity: 0.6; } @@ -1387,6 +1374,11 @@ video { padding-right: 2rem; } +.px-\[8px\] { + padding-left: 8px; + padding-right: 8px; +} + .py-1 { padding-top: 0.25rem; padding-bottom: 0.25rem; @@ -1407,15 +1399,38 @@ video { padding-bottom: 1rem; } +.py-6 { + padding-top: 1.5rem; + padding-bottom: 1.5rem; +} + .py-8 { padding-top: 2rem; padding-bottom: 2rem; } +.px-6 { + padding-left: 1.5rem; + padding-right: 1.5rem; +} + +.px-2 { + padding-left: 0.5rem; + padding-right: 0.5rem; +} + +.pr-\[4px\] { + padding-right: 4px; +} + .pt-6 { padding-top: 1.5rem; } +.text-left { + text-align: left; +} + .text-center { text-align: center; } @@ -1444,15 +1459,14 @@ video { line-height: 1; } -.text-8xl { - font-size: 6rem; - line-height: 1; -} - .text-\[16px\] { font-size: 16px; } +.text-\[17px\] { + font-size: 17px; +} + .text-\[44px\] { font-size: 44px; } @@ -1465,6 +1479,10 @@ video { font-size: 64px; } +.text-\[8px\] { + font-size: 8px; +} + .text-base { font-size: 1rem; line-height: 1.5rem; @@ -1490,6 +1508,18 @@ video { line-height: 1rem; } +.text-\[10px\] { + font-size: 10px; +} + +.text-\[33px\] { + font-size: 33px; +} + +.text-\[26px\] { + font-size: 26px; +} + .font-bold { font-weight: 700; } @@ -1518,6 +1548,10 @@ video { line-height: 1rem; } +.leading-\[0\.5rem\] { + line-height: 0.5rem; +} + .text-\[\#009042\] { --tw-text-opacity: 1; color: rgb(0 144 66 / var(--tw-text-opacity)); @@ -1726,15 +1760,37 @@ video { grid-template-columns: repeat(2, minmax(0, 1fr)); } + .sm\:px-6 { + padding-left: 1.5rem; + padding-right: 1.5rem; + } + .sm\:text-3xl { font-size: 1.875rem; line-height: 2.25rem; } + .sm\:text-5xl { + font-size: 3rem; + line-height: 1; + } + .sm\:text-base { font-size: 1rem; line-height: 1.5rem; } + + .sm\:text-\[10px\] { + font-size: 10px; + } + + .sm\:text-\[33px\] { + font-size: 33px; + } + + .sm\:leading-4 { + line-height: 1rem; + } } @media (min-width: 768px) { @@ -1830,6 +1886,10 @@ video { gap: 2rem; } + .md\:p-\[10px\] { + padding: 10px; + } + .md\:px-0 { padding-left: 0px; padding-right: 0px; @@ -1845,6 +1905,14 @@ video { line-height: 1; } + .md\:text-\[11\.5px\] { + font-size: 11.5px; + } + + .md\:text-\[39px\] { + font-size: 39px; + } + .md\:text-base { font-size: 1rem; line-height: 1.5rem; @@ -1971,6 +2039,10 @@ video { padding: 0px; } + .lg\:p-4 { + padding: 1rem; + } + .lg\:px-4 { padding-left: 1rem; padding-right: 1rem; @@ -1998,6 +2070,20 @@ video { text-align: start; } + .lg\:text-7xl { + font-size: 4.5rem; + line-height: 1; + } + + .lg\:text-\[3\.8rem\] { + font-size: 3.8rem; + } + + .lg\:text-base { + font-size: 1rem; + line-height: 1.5rem; + } + .lg\:text-sm { font-size: 0.875rem; line-height: 1.25rem; @@ -2090,6 +2176,16 @@ video { font-size: 3rem; line-height: 1; } + + .xl\:text-7xl { + font-size: 4.5rem; + line-height: 1; + } + + .xl\:text-xl { + font-size: 1.25rem; + line-height: 1.75rem; + } } @media (min-width: 1536px) { diff --git a/data/schedule.json b/data/schedule.json index 3359c0a..103037e 100644 --- a/data/schedule.json +++ b/data/schedule.json @@ -1,134 +1,134 @@ [ - { - "time": "09:00 - 09:30", - "title": "Opening Remarks", - "speaker": { - "name": "Er. Niranjan Khakurel", - "title": "Principal, NCIT & NOSK Well-Wisher", - "image": "https://via.placeholder.com/50" - }, - "date": "Opening", - "link": "https://example.com/introduction-hello" + { + "time": "09:00 - 09:30", + "title": "Opening Remarks", + "speaker": { + "name": "Er. Niranjan Khakurel", + "title": "Principal, NCIT & NOSK Well-Wisher", + "image": "https://via.placeholder.com/50" }, - { - "time": "09:30 - 10:30", - "title": "Keynote Speaker", - "speaker": { - "name": "Mr. Hempal Shrestha", - "title": "Founding Member, FOSS NEPAL", - "image": "https://via.placeholder.com/50" - }, - "date": "Keynote", - "link": "https://example.com/keynote-speaker" + "date": "Opening", + "link": "https://example.com/introduction-hello" + }, + { + "time": "09:30 - 10:30", + "title": "Keynote Speaker", + "speaker": { + "name": "Mr. Hempal Shrestha", + "title": "Founding Member, FOSS NEPAL", + "image": "https://via.placeholder.com/50" }, - { - "time": "10:30 - 11:30", - "title": "Capture the Flag (CTF) Competition", - "speaker": { - "name": "Bikram Kharal, Rajan Kshedal", - "title": "Cybersecurity Enthusiasts", - "image": "https://via.placeholder.com/50" - }, - "date": "Competition", - "link": "https://example.com/capture-the-flag" + "date": "Keynote", + "link": "https://example.com/keynote-speaker" + }, + { + "time": "10:30 - 11:30", + "title": "Capture the Flag (CTF) Competition", + "speaker": { + "name": "Bikram Kharal, Rajan Kshedal", + "title": "Cybersecurity Enthusiasts", + "image": "https://via.placeholder.com/50" }, - { - "time": "11:30 - 12:30", - "title": "Linux Distro & Open Source Projects Demo", - "speaker": { - "name": "NOSK & Open Source Contributors", - "title": "Linux & Open Source Specialists", - "image": "https://via.placeholder.com/50" - }, - "date": "Demo", - "link": "https://example.com/distro-demo" + "date": "Competition", + "link": "https://example.com/capture-the-flag" + }, + { + "time": "11:30 - 12:30", + "title": "Linux Distro & Open Source Projects Demo", + "speaker": { + "name": "NOSK & Open Source Contributors", + "title": "Linux & Open Source Specialists", + "image": "https://via.placeholder.com/50" }, - { - "time": "12:30 - 13:00", - "title": "Lunch Break", - "speaker": { - "name": "Break Time", - "title": "", - "image": "" - }, - "date": "Break", - "link": "N/A" + "date": "Demo", + "link": "https://example.com/distro-demo" + }, + { + "time": "12:30 - 13:00", + "title": "Lunch Break", + "speaker": { + "name": "Break Time", + "title": "", + "image": "" }, - { - "time": "13:00 - 14:30", - "title": "Open Source Project Exhibition", - "speaker": { - "name": "Various Exhibitors", - "title": "Open Source Contributors", - "image": "https://via.placeholder.com/50" - }, - "date": "Exhibition", - "link": "https://example.com/open-source-exhibition" + "date": "Break", + "link": "N/A" + }, + { + "time": "13:00 - 14:30", + "title": "Open Source Project Exhibition", + "speaker": { + "name": "Various Exhibitors", + "title": "Open Source Contributors", + "image": "https://via.placeholder.com/50" }, - { - "time": "14:30 - 15:30", - "title": "NOSKODE 5.0", - "speaker": { - "name": "Bishal Poudel, Abhilekh Gautam", - "title": "NOSKODE Host, NOSK Contributors", - "image": "https://via.placeholder.com/50" - }, - "date": "Competition", - "link": "https://example.com/noskode" + "date": "Exhibition", + "link": "https://example.com/open-source-exhibition" + }, + { + "time": "14:30 - 15:30", + "title": "NOSKODE 5.0", + "speaker": { + "name": "Bishal Poudel, Abhilekh Gautam", + "title": "NOSKODE Host, NOSK Contributors", + "image": "https://via.placeholder.com/50" }, - { - "time": "15:30 - 16:15", - "title": "Breakout / Discussion Rooms", - "speaker": { - "name": "Various Moderators", - "title": "Discussion Leaders", - "image": "https://via.placeholder.com/50" - }, - "date": "Talks", - "link": "https://example.com/breakout-discussion" + "date": "Competition", + "link": "https://example.com/noskode" + }, + { + "time": "15:30 - 16:15", + "title": "Breakout / Discussion Rooms", + "speaker": { + "name": "Various Moderators", + "title": "Discussion Leaders", + "image": "https://via.placeholder.com/50" }, - { - "time": "16:15 - 17:00", - "title": "Photo and Memory Shoot", - "speaker": { - "name": "Event Team", - "title": "Event Coordinators", - "image": "https://via.placeholder.com/50" - }, - "date": "PhotoShoot", - "link": "N/A" + "date": "Talks", + "link": "https://example.com/breakout-discussion" + }, + { + "time": "16:15 - 17:00", + "title": "Photo and Memory Shoot", + "speaker": { + "name": "Event Team", + "title": "Event Coordinators", + "image": "https://via.placeholder.com/50" }, - { - "time": "17:00 - 17:45", - "title": "Opensource and ChitChats / Open Floor Discussion", - "speaker": { - "name": "Community Leaders", - "title": "Open Floor Moderators", - "image": "https://via.placeholder.com/50" - }, - "date": "Open-Floor", - "link": "https://example.com/opensource-chitchats" + "date": "PhotoShoot", + "link": "N/A" + }, + { + "time": "17:00 - 17:45", + "title": "Opensource and ChitChats / Open Floor Discussion", + "speaker": { + "name": "Community Leaders", + "title": "Open Floor Moderators", + "image": "https://via.placeholder.com/50" }, - { - "time": "17:45 - 18:15", - "title": "Alumni Meetup and Cake Cutting", - "speaker": { - "name": "NOSK Alumns", - "title": "Open Source Enthusiasts", - "image": "https://via.placeholder.com/50" - }, - "date": "Celebration", - "link": "https://example.com/alumni-meetup-cake-cutting" + "date": "Open-Floor", + "link": "https://example.com/opensource-chitchats" + }, + { + "time": "17:45 - 18:15", + "title": "Alumni Meetup and Cake Cutting", + "speaker": { + "name": "NOSK Alumns", + "title": "Open Source Enthusiasts", + "image": "https://via.placeholder.com/50" }, - { - "time": "18:15 - 18:45", - "title": "Candle Light Celebration & Good Night!", - "speaker": { - "name": "Event Team & Alumns", - "title": "Event Facilitators and NOSK Alumns", - "image": "https://via.placeholder.com/50" - }, - "date": "Celebration", - "link": "https://example.com/candle-light-celebration" - } + "date": "Celebration", + "link": "https://example.com/alumni-meetup-cake-cutting" + }, + { + "time": "18:15 - 18:45", + "title": "Candle Light Celebration & Good Night!", + "speaker": { + "name": "Event Team & Alumns", + "title": "Event Facilitators and NOSK Alumns", + "image": "https://via.placeholder.com/50" + }, + "date": "Celebration", + "link": "https://example.com/candle-light-celebration" + } ] diff --git a/gallery.json b/gallery.json index 5ac1a7a..6963648 100644 --- a/gallery.json +++ b/gallery.json @@ -1,22 +1,22 @@ [ - { - "image": "image1.png", - "date": "9 Sep", - "description": "Pre Event Meetup" - }, - { - "image": "image2.png", - "date": "10 Sep", - "description": "Event Planning" - }, - { - "image": "path/to/your/image3.png", - "date": "11 Sep", - "description": "Sponsor Outreach" - }, - { - "image": "path/to/your/image3.png", - "date": "11 Sep", - "description": "Sponsor Outreach" - } -] \ No newline at end of file + { + "image": "image1.png", + "date": "9 Sep", + "description": "Pre Event Meetup" + }, + { + "image": "image2.png", + "date": "10 Sep", + "description": "Event Planning" + }, + { + "image": "path/to/your/image3.png", + "date": "11 Sep", + "description": "Sponsor Outreach" + }, + { + "image": "path/to/your/image3.png", + "date": "11 Sep", + "description": "Sponsor Outreach" + } +] diff --git a/index.html b/index.html index 2101006..d1b02f1 100644 --- a/index.html +++ b/index.html @@ -9,7 +9,7 @@ -
+ -
Be a Part of The Celebration
Mark your Calenders
 @@ -219,39 +219,32 @@
-
+
--> -
-
-
- +20 Years of
Advocating
Freedom -
-
- +2100 Open Source
Entusiasts
Reached -
-
- +500 Events
Conducted -
+
+ + +
+

+20

+

Years of Advocating for Software Freedom

-
+ +
+

+2100

+

Open Source Enthusiasts Reached

+
+ +
+

+500

+

Events Conducted

+
+ +
-

Learn - Enjoy - Discover

+

Learn - Enjoy - Discover

diff --git a/js/faqs.js b/js/faqs.js index edb137c..ad2e85d 100644 --- a/js/faqs.js +++ b/js/faqs.js @@ -1,18 +1,18 @@ -document.addEventListener('DOMContentLoaded', () => { - const faqItems = document.querySelectorAll('.faq-item'); +document.addEventListener("DOMContentLoaded", () => { + const faqItems = document.querySelectorAll(".faq-item"); - faqItems.forEach(item => { - const question = item.querySelector('.faq-question'); - const answer = item.querySelector('.faq-answer'); + faqItems.forEach((item) => { + const question = item.querySelector(".faq-question"); + const answer = item.querySelector(".faq-answer"); - question.addEventListener('click', () => { - if (answer.style.maxHeight && answer.style.maxHeight !== "0px") { - answer.style.maxHeight = "0px"; - question.querySelector('span.text-gray-900').textContent = '+'; - } else { - answer.style.maxHeight = answer.scrollHeight + "px"; - question.querySelector('span.text-gray-900').textContent = '-'; - } - }); + question.addEventListener("click", () => { + if (answer.style.maxHeight && answer.style.maxHeight !== "0px") { + answer.style.maxHeight = "0px"; + question.querySelector("span.text-gray-900").textContent = "+"; + } else { + answer.style.maxHeight = answer.scrollHeight + "px"; + question.querySelector("span.text-gray-900").textContent = "-"; + } + }); }); }); diff --git a/js/footer.js b/js/footer.js index 561140f..9ec03b1 100644 --- a/js/footer.js +++ b/js/footer.js @@ -49,11 +49,10 @@ const footerCode = `
{ // Get the first
element const footer = document.getElementsByTagName("footer")[0].innerHTML; // Insert the footer content along with the existing footer content document.querySelector("footer").innerHTML = footerCode + footer; }); - diff --git a/js/schedule.js b/js/schedule.js index a41051d..707e666 100644 --- a/js/schedule.js +++ b/js/schedule.js @@ -1,14 +1,14 @@ document.addEventListener("DOMContentLoaded", () => { - fetch('../data/schedule.json') - .then(response => response.json()) - .then(data => { - const scheduleSection = document.getElementById('schedule'); - scheduleSection.innerHTML = ''; + fetch("../data/schedule.json") + .then((response) => response.json()) + .then((data) => { + const scheduleSection = document.getElementById("schedule"); + scheduleSection.innerHTML = ""; - data.forEach((event, index) => { - // Create HTML structure for each event - let eventHTML = ` -
+ data.forEach((event, index) => { + // Create HTML structure for each event + let eventHTML = ` +

${event.time}

${event.title}

@@ -22,8 +22,8 @@ document.addEventListener("DOMContentLoaded", () => {
`; - // Insert the timeline indicator with dark yellow color - let timelineHTML = ` + // Insert the timeline indicator with dark yellow color + let timelineHTML = `
@@ -32,13 +32,14 @@ document.addEventListener("DOMContentLoaded", () => {
`; - // Combine and insert into the schedule section - scheduleSection.innerHTML += ` -
+ // Combine and insert into the schedule section + scheduleSection.innerHTML += ` +
${index % 2 === 0 ? eventHTML : timelineHTML} ${index % 2 === 0 ? timelineHTML : eventHTML}
`; - }); - }).catch(error => console.error('Error fetching the events:', error)); + }); + }) + .catch((error) => console.error("Error fetching the events:", error)); }); diff --git a/pages/itinerary.html b/pages/itinerary.html index 131e2d9..3fb0eaf 100644 --- a/pages/itinerary.html +++ b/pages/itinerary.html @@ -1,210 +1,204 @@ - + - - - - + + + NOSK SFD 2024 Event Schedule - - - + +
-
-

Itinerary

-
- - - -
+
+

Itinerary

+
+ + +
+
- -
- -
- +
+ +
@@ -212,6 +206,5 @@

Itinerary

- - + From 4ed0d141dfd5ed9e261c52a2955940b81233bd39 Mon Sep 17 00:00:00 2001 From: Rishav Chapagain Date: Fri, 13 Sep 2024 23:57:52 +0545 Subject: [PATCH 2/5] Saved Changes --- index.html | 30 +++++++++++++++--------------- 1 file changed, 15 insertions(+), 15 deletions(-) diff --git a/index.html b/index.html index d1b02f1..9482dab 100644 --- a/index.html +++ b/index.html @@ -46,9 +46,9 @@ Candle Ceremony NOSK
-
--> + --> - -
-
+
+
@@ -134,10 +134,10 @@
Nosk Vertical Logo
-
-
-
+
+ + -
+ -
+ +

+20

Years of Advocating for Software Freedom

- +

+2100

Open Source Enthusiasts Reached

- +

+500

Events Conducted

@@ -245,7 +245,7 @@ class="mt-7 flex h-[11.25rem] w-full flex-col items-center justify-center bg-[#009042]" >

Learn - Enjoy - Discover

-
+
-->
From 5adbdfdc30408322fbfd57f5a6151140cb94bf1e Mon Sep 17 00:00:00 2001 From: Rishav Chapagain Date: Sat, 14 Sep 2024 13:09:35 +0545 Subject: [PATCH 3/5] Responsiveness in Homepage --- css/output.css | 231 +++++++++++++++++++++++++++++++++---------------- index.html | 196 +++++++++++++++++++---------------------- 2 files changed, 247 insertions(+), 180 deletions(-) diff --git a/css/output.css b/css/output.css index 5fe88a4..380a1f6 100644 --- a/css/output.css +++ b/css/output.css @@ -875,6 +875,10 @@ video { height: 11.25rem; } +.h-\[17rem\] { + height: 17rem; +} + .h-\[26rem\] { height: 26rem; } @@ -883,22 +887,10 @@ video { height: 35px; } -.h-\[37rem\] { - height: 37rem; -} - -.h-\[38rem\] { - height: 38rem; -} - .h-\[40px\] { height: 40px; } -.h-\[40rem\] { - height: 40rem; -} - .h-\[460px\] { height: 460px; } @@ -927,6 +919,10 @@ video { height: 100vh; } +.h-\[13rem\] { + height: 13rem; +} + .max-h-screen { max-height: 100vh; } @@ -935,6 +931,10 @@ video { width: 0.25rem; } +.w-1\/5 { + width: 20%; +} + .w-12 { width: 3rem; } @@ -959,10 +959,6 @@ video { width: 10rem; } -.w-44 { - width: 11rem; -} - .w-6 { width: 1.5rem; } @@ -979,12 +975,16 @@ video { width: 20rem; } -.w-\[220px\] { - width: 220px; +.w-\[11\.5rem\] { + width: 11.5rem; +} + +.w-\[20rem\] { + width: 20rem; } -.w-\[32rem\] { - width: 32rem; +.w-\[220px\] { + width: 220px; } .w-\[35px\] { @@ -995,22 +995,10 @@ video { width: 40px; } -.w-\[48\%\] { - width: 48%; -} - -.w-\[52\%\] { - width: 52%; -} - .w-\[60vw\] { width: 60vw; } -.w-\[66rem\] { - width: 66rem; -} - .w-auto { width: auto; } @@ -1116,10 +1104,6 @@ video { justify-items: center; } -.gap-16 { - gap: 4rem; -} - .gap-2 { gap: 0.5rem; } @@ -1344,6 +1328,10 @@ video { padding: 0px; } +.p-10 { + padding: 2.5rem; +} + .p-2 { padding: 0.5rem; } @@ -1364,6 +1352,11 @@ video { padding: 2rem; } +.px-2 { + padding-left: 0.5rem; + padding-right: 0.5rem; +} + .px-4 { padding-left: 1rem; padding-right: 1rem; @@ -1374,11 +1367,6 @@ video { padding-right: 2rem; } -.px-\[8px\] { - padding-left: 8px; - padding-right: 8px; -} - .py-1 { padding-top: 0.25rem; padding-bottom: 0.25rem; @@ -1409,16 +1397,6 @@ video { padding-bottom: 2rem; } -.px-6 { - padding-left: 1.5rem; - padding-right: 1.5rem; -} - -.px-2 { - padding-left: 0.5rem; - padding-right: 0.5rem; -} - .pr-\[4px\] { padding-right: 4px; } @@ -1463,18 +1441,14 @@ video { font-size: 16px; } -.text-\[17px\] { - font-size: 17px; +.text-\[26px\] { + font-size: 26px; } .text-\[44px\] { font-size: 44px; } -.text-\[48px\] { - font-size: 48px; -} - .text-\[64px\] { font-size: 64px; } @@ -1508,18 +1482,6 @@ video { line-height: 1rem; } -.text-\[10px\] { - font-size: 10px; -} - -.text-\[33px\] { - font-size: 33px; -} - -.text-\[26px\] { - font-size: 26px; -} - .font-bold { font-weight: 700; } @@ -1775,11 +1737,6 @@ video { line-height: 1; } - .sm\:text-base { - font-size: 1rem; - line-height: 1.5rem; - } - .sm\:text-\[10px\] { font-size: 10px; } @@ -1788,6 +1745,11 @@ video { font-size: 33px; } + .sm\:text-base { + font-size: 1rem; + line-height: 1.5rem; + } + .sm\:leading-4 { line-height: 1rem; } @@ -1854,6 +1816,10 @@ video { width: 50%; } + .md\:w-32 { + width: 8rem; + } + .md\:w-\[13\.75rem\] { width: 13.75rem; } @@ -1870,6 +1836,10 @@ video { width: auto; } + .md\:w-\[9rem\] { + width: 9rem; + } + .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } @@ -1922,6 +1892,10 @@ video { font-size: 1.25rem; line-height: 1.75rem; } + + .md\:leading-8 { + line-height: 2rem; + } } @media (min-width: 1024px) { @@ -1962,6 +1936,14 @@ video { height: 4rem; } + .lg\:h-\[25rem\] { + height: 25rem; + } + + .lg\:h-\[37rem\] { + height: 37rem; + } + .lg\:h-\[4\.75rem\] { height: 4.75rem; } @@ -1978,14 +1960,30 @@ video { min-height: 24rem; } + .lg\:w-4\/5 { + width: 80%; + } + .lg\:w-44 { width: 11rem; } + .lg\:w-\[32rem\] { + width: 32rem; + } + + .lg\:w-\[48\%\] { + width: 48%; + } + .lg\:w-\[50px\] { width: 50px; } + .lg\:w-\[52\%\] { + width: 52%; + } + .lg\:w-\[66px\] { width: 66px; } @@ -2002,6 +2000,10 @@ video { flex-direction: row; } + .lg\:items-start { + align-items: flex-start; + } + .lg\:items-center { align-items: center; } @@ -2010,6 +2012,10 @@ video { justify-content: flex-start; } + .lg\:justify-center { + justify-content: center; + } + .lg\:gap-6 { gap: 1.5rem; } @@ -2039,6 +2045,10 @@ video { padding: 0px; } + .lg\:p-20 { + padding: 5rem; + } + .lg\:p-4 { padding: 1rem; } @@ -2066,6 +2076,10 @@ video { padding-right: 1rem; } + .lg\:text-left { + text-align: left; + } + .lg\:text-start { text-align: start; } @@ -2075,10 +2089,26 @@ video { line-height: 1; } + .lg\:text-\[14px\] { + font-size: 14px; + } + + .lg\:text-\[25px\] { + font-size: 25px; + } + .lg\:text-\[3\.8rem\] { font-size: 3.8rem; } + .lg\:text-\[31px\] { + font-size: 31px; + } + + .lg\:text-\[45px\] { + font-size: 45px; + } + .lg\:text-base { font-size: 1rem; line-height: 1.5rem; @@ -2094,10 +2124,26 @@ video { line-height: 1.75rem; } + .lg\:text-\[30px\] { + font-size: 30px; + } + + .lg\:text-\[22px\] { + font-size: 22px; + } + + .lg\:text-\[33px\] { + font-size: 33px; + } + .lg\:font-semibold { font-weight: 600; } + .lg\:leading-9 { + line-height: 2.25rem; + } + .lg\:shadow { --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color); @@ -2163,15 +2209,28 @@ video { width: 40vw; } + .xl\:justify-start { + justify-content: flex-start; + } + .xl\:gap-10 { gap: 2.5rem; } + .xl\:gap-8 { + gap: 2rem; + } + .xl\:px-\[10\%\] { padding-left: 10%; padding-right: 10%; } + .xl\:text-4xl { + font-size: 2.25rem; + line-height: 2.5rem; + } + .xl\:text-5xl { font-size: 3rem; line-height: 1; @@ -2182,10 +2241,34 @@ video { line-height: 1; } + .xl\:text-\[18px\] { + font-size: 18px; + } + + .xl\:text-\[21px\] { + font-size: 21px; + } + + .xl\:text-\[31px\] { + font-size: 31px; + } + + .xl\:text-\[46px\] { + font-size: 46px; + } + + .xl\:text-\[64px\] { + font-size: 64px; + } + .xl\:text-xl { font-size: 1.25rem; line-height: 1.75rem; } + + .xl\:text-\[45px\] { + font-size: 45px; + } } @media (min-width: 1536px) { diff --git a/index.html b/index.html index 9482dab..40edd05 100644 --- a/index.html +++ b/index.html @@ -9,7 +9,7 @@ - +
- + -
+
-
-
-
-

- About The Event
Software Freedom Day - 2024
- "A celebration of innovation and open - collaboration!" - -

-
-
- - - -
-
-
- Software Freedom Day (SFD) is an annual global celebration dedicated to promoting the - benefits and principles of Free and Open Source Software (FOSS). SFD is celebrated on the third Saturday of - September each year and is marked by events, workshops, and conferences held by FOSS communities, tech - enthusiasts, and organizations across the world. -

- In Nepal, the celebration of SFD has been actively hosted and organized by the Nepal Open Source Klub (NOSK) - for over 20 years. NOSK has been at the forefront of promoting free software. -

- In 2024, NOSK is returning with an even grander edition of Software Freedom Day, This year's event promises - to be the largest yet, where developers and enthusiasts can showcase their love for open source. +
+
+
+

+ + About The Event
+ Software Freedom Day + 2024 +
+ "A celebration of innovation and open collaboration!" + +

-
- +
-
- Nosk Vertical Logo +
+ Software Freedom Day (SFD) is an annual global celebration dedicated to promoting the benefits and principles of Free and Open Source Software (FOSS). SFD is celebrated on the third Saturday of September each year and is marked by events, workshops, and conferences held by FOSS communities, tech enthusiasts, and organizations across the world. +

+ In Nepal, the celebration of SFD has been actively hosted and organized by the Nepal Open Source Klub (NOSK) for over 20 years. NOSK has been at the forefront of promoting free software. +

+ In 2024, NOSK is returning with an even grander edition of Software Freedom Day. This year's event promises to be the largest yet, where developers and enthusiasts can showcase their love for open source.
- +
+ +
+
+ +
+ Nosk Vertical Logo +
+
+ - +
+ + +
+ + +
+ Nosk Vertical Logo +
+ - + +
+ + - + From a693b624fafeb6581d64c1f009490dd1749878ac Mon Sep 17 00:00:00 2001 From: Rishav Chapagain Date: Sat, 14 Sep 2024 20:43:47 +0545 Subject: [PATCH 4/5] Conflict resolved --- css/output.css | 124 ++++++++++++++++++++++++------------------------- 1 file changed, 60 insertions(+), 64 deletions(-) diff --git a/css/output.css b/css/output.css index 170140f..f3ef841 100644 --- a/css/output.css +++ b/css/output.css @@ -867,6 +867,10 @@ video { height: 11.25rem; } +.h-\[13rem\] { + height: 13rem; +} + .h-\[17rem\] { height: 17rem; } @@ -911,10 +915,6 @@ video { height: 100vh; } -.h-\[13rem\] { - height: 13rem; -} - .max-h-screen { max-height: 100vh; } @@ -975,10 +975,6 @@ video { width: 20rem; } -.w-\[220px\] { - width: 220px; -} - .w-\[35px\] { width: 35px; } @@ -1320,10 +1316,6 @@ video { object-fit: cover; } -.p-0 { - padding: 0px; -} - .p-10 { padding: 2.5rem; } @@ -1348,6 +1340,10 @@ video { padding: 2rem; } +.p-\[20px\] { + padding: 20px; +} + .px-2 { padding-left: 0.5rem; padding-right: 0.5rem; @@ -1441,14 +1437,6 @@ video { font-size: 26px; } -.text-\[44px\] { - font-size: 44px; -} - -.text-\[64px\] { - font-size: 64px; -} - .text-\[8px\] { font-size: 8px; } @@ -1463,12 +1451,27 @@ video { line-height: 1.75rem; } +.text-sm { + font-size: 0.875rem; + line-height: 1.25rem; +} + +.text-sml { + font-size: 30px; +} + .text-sml2 { font-size: 25px; } -.text-\[60px\] { - font-size: 60px; +.text-xl { + font-size: 1.25rem; + line-height: 1.75rem; +} + +.text-xs { + font-size: 0.75rem; + line-height: 1rem; } .font-bold { @@ -1593,10 +1596,6 @@ video { color: rgb(255 255 255 / var(--tw-text-opacity)); } -.text-\[\] { - color: ; -} - .underline { text-decoration-line: underline; } @@ -1743,6 +1742,14 @@ video { line-height: 1.5rem; } + .sm\:text-mid1 { + font-size: 52px; + } + + .sm\:text-mid2 { + font-size: 35px; + } + .sm\:leading-4 { line-height: 1rem; } @@ -1777,10 +1784,6 @@ video { margin-right: auto; } - .md\:flex { - display: flex; - } - .md\:contents { display: contents; } @@ -1821,6 +1824,10 @@ video { width: 13.75rem; } + .md\:w-\[220px\] { + width: 220px; + } + .md\:w-\[42px\] { width: 42px; } @@ -1833,10 +1840,6 @@ video { width: auto; } - .md\:w-\[9rem\] { - width: 9rem; - } - .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } @@ -1853,6 +1856,10 @@ video { gap: 2rem; } + .md\:p-0 { + padding: 0px; + } + .md\:p-\[10px\] { padding: 10px; } @@ -1862,14 +1869,11 @@ video { padding-right: 0px; } - .md\:text-big { - font-size: 64px; + .md\:text-4xl { + font-size: 2.25rem; + line-height: 2.5rem; } - .md\:text-big2 { - font-size: 44px; - } - .md\:text-5xl { font-size: 3rem; line-height: 1; @@ -1888,6 +1892,14 @@ video { line-height: 1.5rem; } + .md\:text-big { + font-size: 64px; + } + + .md\:text-big2 { + font-size: 44px; + } + .md\:text-xl { font-size: 1.25rem; line-height: 1.75rem; @@ -2093,6 +2105,10 @@ video { font-size: 14px; } + .lg\:text-\[22px\] { + font-size: 22px; + } + .lg\:text-\[25px\] { font-size: 25px; } @@ -2101,8 +2117,8 @@ video { font-size: 3.8rem; } - .lg\:text-\[31px\] { - font-size: 31px; + .lg\:text-\[33px\] { + font-size: 33px; } .lg\:text-\[45px\] { @@ -2124,18 +2140,6 @@ video { line-height: 1.75rem; } - .lg\:text-\[30px\] { - font-size: 30px; - } - - .lg\:text-\[22px\] { - font-size: 22px; - } - - .lg\:text-\[33px\] { - font-size: 33px; - } - .lg\:font-semibold { font-weight: 600; } @@ -2249,12 +2253,8 @@ video { font-size: 21px; } - .xl\:text-\[31px\] { - font-size: 31px; - } - - .xl\:text-\[46px\] { - font-size: 46px; + .xl\:text-\[45px\] { + font-size: 45px; } .xl\:text-\[64px\] { @@ -2265,10 +2265,6 @@ video { font-size: 1.25rem; line-height: 1.75rem; } - - .xl\:text-\[45px\] { - font-size: 45px; - } } @media (min-width: 1536px) { From 2fe5573494ad530d96595b875ce8556e6a4e22e0 Mon Sep 17 00:00:00 2001 From: Rishav Chapagain Date: Sat, 14 Sep 2024 21:18:07 +0545 Subject: [PATCH 5/5] Responsiveness --- css/output.css | 117 +++++++++++++++++++++++++++++++++++-------------- index.html | 12 ++--- 2 files changed, 89 insertions(+), 40 deletions(-) diff --git a/css/output.css b/css/output.css index 380a1f6..f456217 100644 --- a/css/output.css +++ b/css/output.css @@ -875,6 +875,10 @@ video { height: 11.25rem; } +.h-\[13rem\] { + height: 13rem; +} + .h-\[17rem\] { height: 17rem; } @@ -919,8 +923,8 @@ video { height: 100vh; } -.h-\[13rem\] { - height: 13rem; +.h-\[37px\] { + height: 37px; } .max-h-screen { @@ -1007,6 +1011,14 @@ video { width: 100%; } +.w-\[168px\] { + width: 168px; +} + +.w-\[145px\] { + width: 145px; +} + .max-w-3xl { max-width: 48rem; } @@ -1445,14 +1457,6 @@ video { font-size: 26px; } -.text-\[44px\] { - font-size: 44px; -} - -.text-\[64px\] { - font-size: 64px; -} - .text-\[8px\] { font-size: 8px; } @@ -1482,6 +1486,26 @@ video { line-height: 1rem; } +.text-\[18px\] { + font-size: 18px; +} + +.text-\[15px\] { + font-size: 15px; +} + +.text-\[32px\] { + font-size: 32px; +} + +.text-\[23px\] { + font-size: 23px; +} + +.text-\[17px\] { + font-size: 17px; +} + .font-bold { font-weight: 700; } @@ -1714,6 +1738,14 @@ video { } @media (min-width: 640px) { + .sm\:h-\[60px\] { + height: 60px; + } + + .sm\:w-\[168px\] { + width: 168px; + } + .sm\:grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); } @@ -1750,6 +1782,19 @@ video { line-height: 1.5rem; } + .sm\:text-\[39px\] { + font-size: 39px; + } + + .sm\:text-\[25px\] { + font-size: 25px; + } + + .sm\:text-xl { + font-size: 1.25rem; + line-height: 1.75rem; + } + .sm\:leading-4 { line-height: 1rem; } @@ -1836,10 +1881,6 @@ video { width: auto; } - .md\:w-\[9rem\] { - width: 9rem; - } - .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } @@ -1893,6 +1934,14 @@ video { line-height: 1.75rem; } + .md\:text-\[45px\] { + font-size: 45px; + } + + .md\:text-\[30px\] { + font-size: 30px; + } + .md\:leading-8 { line-height: 2rem; } @@ -1992,6 +2041,10 @@ video { width: auto; } + .lg\:w-\[220px\] { + width: 220px; + } + .lg\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } @@ -2093,6 +2146,10 @@ video { font-size: 14px; } + .lg\:text-\[22px\] { + font-size: 22px; + } + .lg\:text-\[25px\] { font-size: 25px; } @@ -2101,14 +2158,18 @@ video { font-size: 3.8rem; } - .lg\:text-\[31px\] { - font-size: 31px; + .lg\:text-\[33px\] { + font-size: 33px; } .lg\:text-\[45px\] { font-size: 45px; } + .lg\:text-\[56px\] { + font-size: 56px; + } + .lg\:text-base { font-size: 1rem; line-height: 1.5rem; @@ -2124,16 +2185,8 @@ video { line-height: 1.75rem; } - .lg\:text-\[30px\] { - font-size: 30px; - } - - .lg\:text-\[22px\] { - font-size: 22px; - } - - .lg\:text-\[33px\] { - font-size: 33px; + .lg\:text-\[40px\] { + font-size: 40px; } .lg\:font-semibold { @@ -2249,12 +2302,12 @@ video { font-size: 21px; } - .xl\:text-\[31px\] { - font-size: 31px; + .xl\:text-\[44px\] { + font-size: 44px; } - .xl\:text-\[46px\] { - font-size: 46px; + .xl\:text-\[45px\] { + font-size: 45px; } .xl\:text-\[64px\] { @@ -2265,10 +2318,6 @@ video { font-size: 1.25rem; line-height: 1.75rem; } - - .xl\:text-\[45px\] { - font-size: 45px; - } } @media (min-width: 1536px) { diff --git a/index.html b/index.html index 40edd05..6bcf6b7 100644 --- a/index.html +++ b/index.html @@ -137,17 +137,17 @@
-

Got Open +

Got Open Source Project? We Got you!

-

Present them at Software Freedom +

Present them at Software Freedom Day 2024

+ class="sm:w-[168px] lg:w-[220px] h-[37px] w-[145px] sm:h-[60px] bg-[#FFDD50] rounded-[27.5px] text-xl hover:border-2 hover:border-solid hover:border-[#FFDD50] hover:bg-transparent group">LEARN MORE