Skip to content

Commit

Permalink
Merge pull request #401 from anamika7153/master
Browse files Browse the repository at this point in the history
fixed navbar and footer for darkmode and lightmode
  • Loading branch information
swapnilsparsh authored Aug 5, 2023
2 parents 1d076f4 + 8d554df commit 4ad8a3f
Show file tree
Hide file tree
Showing 2 changed files with 30 additions and 24 deletions.
22 changes: 11 additions & 11 deletions components/Footer.js
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ const Footer = () => {
<div className="footer" role="footer" >
<footer className="copyright">
<div className="footer-question">
<h2>
<h2 style={{color:"var(--navbar-links)"}}>
<span>👑</span>DevEmpire
</h2>
<br />
Expand Down Expand Up @@ -60,42 +60,42 @@ const Footer = () => {
<div className="footer-details">
<div className="column1">
<Column1>
<Heading1>Support</Heading1>
<FooterLink target="_blank" href="https://github.com/swapnilsparsh/DevEmpire" aria-label="Visit us on Github" rel="noopener noreferrer">
<Heading1 style={{color:"var(--navbar-links)"}}>Support</Heading1>
<FooterLink style={{color:"var(--navbar-links)"}} target="_blank" href="https://github.com/swapnilsparsh/DevEmpire" aria-label="Visit us on Github" rel="noopener noreferrer">
<FontAwesomeIcon icon={faGithub} />
<span>GitHub</span>
</FooterLink>
<FooterLink target="blank" href="https://www.producthunt.com/products/developer-empire?utm_source=badge-featured&utm_medium=badge#developer-empire" aria-label="Our product on Product Hunt" rel="noopener noreferrer">
<FooterLink style={{color:"var(--navbar-links)"}} target="blank" href="https://www.producthunt.com/products/developer-empire?utm_source=badge-featured&utm_medium=badge#developer-empire" aria-label="Our product on Product Hunt" rel="noopener noreferrer">
<FontAwesomeIcon icon={faProductHunt} />
<span>Product Hunt</span>
</FooterLink>
<FooterLink target="blank" href="https://twitter.com/intent/tweet?text=Check%20out%20this%20awesome%20website%20having%20a%20collection%20of%20all%20the%20campus%20ambassador%20and%20fellowship%20programs&url=https://devempire.netlify.app&via=swapnilsparsh" aria-label="Visit us on Twitter" rel="noopener noreferrer">
<FooterLink style={{color:"var(--navbar-links)"}} target="blank" href="https://twitter.com/intent/tweet?text=Check%20out%20this%20awesome%20website%20having%20a%20collection%20of%20all%20the%20campus%20ambassador%20and%20fellowship%20programs&url=https://devempire.netlify.app&via=swapnilsparsh" aria-label="Visit us on Twitter" rel="noopener noreferrer">
<FontAwesomeIcon icon={faTwitter} />
<span>Twitter</span>
</FooterLink>
<FooterLink href="#" aria-label="Our Newsletter" rel="noopener noreferrer">
<FooterLink style={{color:"var(--navbar-links)"}} href="#" aria-label="Our Newsletter" rel="noopener noreferrer">
<FontAwesomeIcon icon={faEnvelope} />
<span>Newsletter</span>
</FooterLink>
</Column1>
</div>
<div className="column2">
<Column2>
<Heading2 className="explore">Explore</Heading2>
<Heading2 className="explore" style={{color:"var(--navbar-links)"}}>Explore</Heading2>
<Link href="/ambassador">
<FooterLink aria-label="Ambassador Page"><FontAwesomeIcon icon={faMedal} />
<FooterLink style={{color:"var(--navbar-links)"}} aria-label="Ambassador Page"><FontAwesomeIcon icon={faMedal} />
<span>Ambassador</span></FooterLink>
</Link>
<Link href="/programs">
<FooterLink aria-label="Programs Page"><FontAwesomeIcon icon={faCalendar} />
<FooterLink style={{color:"var(--navbar-links)"}} aria-label="Programs Page"><FontAwesomeIcon icon={faCalendar} />
<span>Programs</span></FooterLink>
</Link>
<Link href="/webdev">
<FooterLink aria-label="WebDev Page"><FontAwesomeIcon icon={faGlobe} />
<FooterLink style={{color:"var(--navbar-links)"}} aria-label="WebDev Page"><FontAwesomeIcon icon={faGlobe} />
<span>WebDev</span></FooterLink>
</Link>
<Link href="/games">
<FooterLink aria-label="Games Page"><FontAwesomeIcon icon={faGamepad} />
<FooterLink style={{color:"var(--navbar-links)"}} aria-label="Games Page"><FontAwesomeIcon icon={faGamepad} />
<span>Games</span></FooterLink>
</Link>
</Column2>
Expand Down
32 changes: 19 additions & 13 deletions styles/globals.css
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,9 @@ body[data-theme="light"] {
background-size: 300vh;
font-family: "open-sans";
--logo-color: brightness(0) invert(1);
--navbar-links: #ffffff;
--footer-links: #000;
--navbar-color: #0093ED;
}

body[data-theme="dark"] {
Expand All @@ -40,6 +43,9 @@ body[data-theme="dark"] {
--extra4: var(--accent-10);
background: var(--accent-10);
--logo-color: brightness(0) invert(0);
--navbar-links: #03a4ff;
--footer-links: #fff;
--navbar-color: #001B2B;
}

.nav-version {
Expand Down Expand Up @@ -120,7 +126,7 @@ body[data-theme="dark"] {
}

nav {
background-color: var(--primary);
background-color: var(--navbar-color);
overflow: hidden;
position: sticky;
top: 0;
Expand All @@ -145,7 +151,7 @@ nav .links-container {
}

.logo-containter > p {
color: var(--native1);
color: var(--navbar-links);
font-size: 1.5em;
font-weight: 700;
cursor: pointer;
Expand All @@ -156,11 +162,11 @@ nav .links-container {
}

nav .links-container a {
color: var(--native1);
color: var(--navbar-links);
}

nav .links-container a > i {
color: var(--native1);
color: var(--navbar-links);
}

nav .navWide {
Expand Down Expand Up @@ -229,13 +235,13 @@ nav .navWide .wideDiv a {

nav .navNarrow-Bar i {
cursor: pointer;
color: var(--native1);
color: var(--navbar-links);
position: relative;
}

.current-nav-link {
display: flex;
color: var(--native1);
color: var(--navbar-links);
width: max-content;
}

Expand Down Expand Up @@ -1113,7 +1119,7 @@ replaced by just the links.*/
/* Searching No Results End*/
/*Start footer*/
.footer {
background-color: var(--secondary);
background-color: var(--navbar-color);
background-repeat: no-repeat;
background-size: 100%;
padding: 2rem 0rem 2rem 0rem;
Expand All @@ -1129,14 +1135,14 @@ replaced by just the links.*/
}

.footer-question h4 {
color: var(--native2);
color: var(--navbar-links);
letter-spacing: 0.06em;
}

.footer-question a {
font-weight: 600;
text-decoration: none;
color: var(--native1);
color: var(--footer-links);
border-bottom: 1px dotted var(--accent-30);
}

Expand Down Expand Up @@ -1503,7 +1509,7 @@ replaced by just the links.*/
/* footer */

.footer {
background-color: #0093ed;
background-color: var(--navbar-color);
}

.footer-details {
Expand Down Expand Up @@ -1671,7 +1677,7 @@ replaced by just the links.*/
}

.search-container .search-icon {
color: var(--native1);
color: var(--navbar-links);
font-size: 20px;
position: absolute;
left: 1.1rem;
Expand Down Expand Up @@ -1814,11 +1820,11 @@ replaced by just the links.*/
}

.search-container-navNarrow.open .search-icon {
color: #03a4ff;
color: var(--navbar-links);
}

.search-container-navNarrow .search-icon {
color: var(--native1);
color: var(--navbar-links);
font-size: 20px;
position: absolute;
left: 0.5rem;
Expand Down

0 comments on commit 4ad8a3f

Please sign in to comment.