From 2330efb3a6b685754efd148d919b255a73ac678a Mon Sep 17 00:00:00 2001 From: Shaina Nawaz Date: Tue, 5 Nov 2024 22:49:07 +0530 Subject: [PATCH] Text is visible. All text are in readable format in both mode. Co-Authored-By: Sanjay Viswanathan --- Website/css/Org.css | 261 ++++++++++++++++++++++++++++++++++++-- Website/css/moon1img.png | Bin 0 -> 1309 bytes Website/css/sun1img.png | Bin 0 -> 1372 bytes Website/js/script.js | 27 +++- Website/organization.html | 11 +- 5 files changed, 285 insertions(+), 14 deletions(-) create mode 100644 Website/css/moon1img.png create mode 100644 Website/css/sun1img.png diff --git a/Website/css/Org.css b/Website/css/Org.css index 802d8f086..0955c7616 100644 --- a/Website/css/Org.css +++ b/Website/css/Org.css @@ -1,3 +1,9 @@ +/* + +.icon img{ + + +} .dark-mode .intro-section { color: rgb(0, 0, 0); padding: 40px; @@ -67,11 +73,11 @@ .repos-container { display: grid; grid-template-columns: repeat(3, 1fr); /* 3 columns layout */ - gap: 43px; + /* gap: 43px; padding: 20px; -} +} */ -.dark-mode .repo-card { +/* .dark-mode .repo-card { background-color: #ffffff; color: rgb(3, 0, 0); padding: 20px; @@ -120,17 +126,17 @@ @media (max-width: 1024px) { .repos-container { grid-template-columns: repeat(2, 1fr); /* 2 columns layout for medium screens */ - } -} + -@media (max-width: 768px) { + +/* @media (max-width: 768px) { .repos-container { - grid-template-columns: 1fr; /* 1 column layout for small screens */ + grid-template-columns: 1fr; } } -/* Get Involved Section */ + .get-involved-section { display: flex; align-items: center; @@ -172,7 +178,7 @@ max-width: 35%; display: inline-block; perspective: 1000px; - position: relative; + position: relative; } .get-involved-section .svg-container svg { @@ -199,7 +205,7 @@ } /* Responsive Adjustments */ -@media (max-width: 768px) { +/* @media (max-width: 768px) { .get-involved-section { flex-direction: column; text-align: center; @@ -213,6 +219,241 @@ max-width: 100%; margin-top: 20px; } +} */ + + /* Icon styling */ +/* Default light mode styles */ +/* Default light mode styles */ +body { + background-color: #ffffff; + color: #000000; +} +nav { + background-color:rgb(45, 62, 159); /* Dark navigation background for light mode */ + color: grey; /* Light text in nav */ + padding: 10px; +} +nav a { + color: #ffffff; /* Light nav links */ + text-decoration: none; + margin: 0 10px; +} + +nav a:hover { + text-decoration: underline; +} + + +/* Icon Styling */ +.icon img { + cursor: pointer; + width: 28px; + transition: transform 0.3s; +} +.icon{ + margin-bottom: 26px; + margin-right: 28px; +} + +.icon img:hover { + transform: scale(1.1); +} + +/* Intro Section */ +.intro-section { + color: #333333; + padding: 40px; + text-align: center; + margin-bottom: -57px; + margin-top: -65px; } +.intro-section h1 { + font-size: 2.5em; + margin-bottom: 20px; +} + +.intro-section p { + font-size: 1.2em; + line-height: 1.6; + color: black; + margin-bottom: 20px; +} + +.intro-section a { + color: #007bff; + text-decoration: none; + font-weight: bold; +} + +.intro-section a:hover { + text-decoration: underline; +} + +/* Description Section */ +.desp h2 { + color: #007bff; + text-align: center; +} +.desp p{ + color: #000000; + text-align: center; +} + +/* Repository Container */ +.repos-container { + display: grid; + grid-template-columns: repeat(3, 1fr); + gap: 43px; + padding: 20px; +} + +/* Repository Card */ +.repo-card { + background-color: #1e15d1; + + color: #007bff; + padding: 20px; + border-radius: 8px; + font-size: 14px; + box-shadow: 0 4px 11px rgba(0, 0, 0, 0.1); + height: 300px; + transition: transform 0.3s ease; +} + +.repo-card:hover { + transform: scale(1.05); +} + +.repo-card h3 { + margin-top: 0; + font-size: 1.5em; +} + +.repo-card p { + margin: 10px 0; + color: #ffffff; + color: #000000; +} + +.repo-card a { + color: #ffa500; + text-decoration: none; +} +/* Get Involved Section */ +.get-involved-section { + display: flex; + align-items: center; + justify-content: space-between; + padding: 40px 20px; + border-radius: 8px; + margin-top: 40px; + background-color: #1e15d1; + color: #ffffff; +} + +.get-involved-section .content { + max-width: 60%; +} + +.get-involved-section .content h2 { + font-size: 2em; + margin-bottom: 20px; + color: #ff4800; +} + +.get-involved-section .content p { + + color: #000000; +} + +.get-involved-section .btn { + background-color: #ffa500; + color: #ffffff; + padding: 10px 20px; + border-radius: 5px; + text-decoration: none; + transition: background-color 0.3s ease; +} + +.get-involved-section .btn:hover { + background-color: #e68a00; +} + +.get-involved-section .svg-container { + max-width: 35%; + display: inline-block; + perspective: 1000px; + position: relative; +} + +.get-involved-section .svg-container svg { + width: 100%; + height: auto; + transition: transform 0.1s ease; +} + +/* Dark mode styles */ +.dark-mode body { + background-color: #121212; + color: #ffffff; +} + +.dark-mode .intro-section, +.dark-mode .intro-section p, +.dark-mode .desp h2, +.dark-mode .desp p { + color:white; +} + +.dark-mode .repo-card { + background-color: #4084ea; + color: #ffffff; +} + +.dark-mode .repo-card p, +.dark-mode .get-involved-section .content p { + color: #ffffff; +} + +.dark-mode .get-involved-section { + background-color: #4084ea; + color: #ffffff; +} + +.dark-mode .get-involved-section .btn { + background-color: #007bff; + color: #ffffff; +} + +.dark-mode .get-involved-section .btn:hover { + background-color: #0056b3; +} + +/* Responsive Adjustments */ +@media (max-width: 1024px) { + .repos-container { + grid-template-columns: repeat(2, 1fr); + } +} + +@media (max-width: 768px) { + .repos-container { + grid-template-columns: 1fr; + } + + .get-involved-section { + flex-direction: column; + text-align: center; + } + + .get-involved-section .content { + max-width: 100%; + } + + .get-involved-section .svg-container { + max-width: 100%; + margin-top: 20px; + } +} diff --git a/Website/css/moon1img.png b/Website/css/moon1img.png new file mode 100644 index 0000000000000000000000000000000000000000..fd7ea65f1b82082796274557483b3fd233b87712 GIT binary patch literal 1309 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 eq9}?&to#e{You%T`gj%q0000
  • -
    • @@ -54,7 +59,7 @@

    Welcome to Recode Hive!

    explore additional projects.

    -

    Recode Hive Repositories

    +

    Recode Hive Repositories

    Explore our repositories below to find valuable resources, code examples, and tools that can help you in your projects.
    Whether you're a seasoned developer or just starting out, Recode Hive has something for everyone.