Skip to content

Commit

Permalink
even better hovers
Browse files Browse the repository at this point in the history
  • Loading branch information
lnxfsf committed Jan 14, 2024
1 parent bfd2342 commit 5c1b6c4
Show file tree
Hide file tree
Showing 12 changed files with 78 additions and 31 deletions.
Binary file modified backend/db.sqlite3
Binary file not shown.
2 changes: 1 addition & 1 deletion frontend/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/BabyBananya.png" />
<link rel="icon" type="image/svg+xml" href="/doggy.png" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>AniManga Verse</title>

Expand Down
Binary file removed frontend/public/BabyBananya.png
Binary file not shown.
Binary file added frontend/public/doggy.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added frontend/public/login/bunny_register.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file removed frontend/public/login/bunny_register.png
Binary file not shown.
11 changes: 2 additions & 9 deletions frontend/src/components/BrowseHome.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -20,15 +20,8 @@ const BrowseHome = () => {
<>


{/* for testing, auth */}
{/* This page should only be visible to users who are logged in, but for now, we'll hardcode an isAuthenticated value for demonstration purposes only */}


{user ? (
<p>You are logged in to the homepage!</p>
) : (
<p>You are not logged in, redirecting...</p>
)}





Expand Down
28 changes: 14 additions & 14 deletions frontend/src/components/Footer.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -11,38 +11,38 @@ const Footer = () => {
<div className="flex justify-start gap-4 flex-col">
<div className="small_header">
{/* check index.css, for global use, vertical rectangle.. */}
<h3 className="secondary-left-line">Contacts:</h3>
<h3 className="secondary-left-line non_clickable">Contacts:</h3>
</div>

<p>support@animelist.me</p>
<p>020-XXX-XXX</p>
<p className="non_clickable" >support@animelist.me</p>
<p className="non_clickable">020-XXX-XXX</p>

<div className="social flex flex-row gap-4">
<img src="/assets/social/ig.svg"></img>
<img src="/assets/social/fb.svg"></img>
<img src="/assets/social/threads.svg"></img>
<img src="/assets/social/x.svg"></img>
<img className="clickable" src="/assets/social/ig.svg"></img>
<img className="clickable" src="/assets/social/fb.svg"></img>
<img className="clickable" src="/assets/social/threads.svg"></img>
<img className="clickable" src="/assets/social/x.svg"></img>
</div>
</div>

<div>
<div className="small_header">
{/* check index.css, for global use, vertical rectangle.. */}
<h3 className="secondary-left-line">Navigation:</h3>
<h3 className="secondary-left-line non_clickable">Navigation:</h3>
</div>

<ul>
<li>
<Link to="/">Home</Link>
<Link to="/" className="nav_btns">Home</Link>
</li>
<li>
<Link to="/anime">Anime</Link>
<Link to="/anime" className="nav_btns">Anime</Link>
</li>
<li>
<Link to="/manga">Manga</Link>
<Link to="/manga" className="nav_btns">Manga</Link>
</li>
<li>
<Link to="/explore">Explore</Link>
<Link to="/explore" className="nav_btns">Explore</Link>
</li>
</ul>
</div>
Expand All @@ -53,7 +53,7 @@ const Footer = () => {
<div className="small_header mb-3.5">
{/* check index.css, for global use, vertical rectangle.. */}

<div className="secondary-left-line">
<div className="secondary-left-line non_clickable">
<h3>Like what you see ?</h3>
<p>Consider signing up</p>
</div>
Expand All @@ -63,7 +63,7 @@ const Footer = () => {

<div className="small_header " style={{ marginBottom: "0.8em" }}>
{/* check index.css, for global use, vertical rectangle.. */}
<p className="secondary-left-line">Or if you already have an account</p>
<p className="secondary-left-line non_clickable">Or if you already have an account</p>
</div>

<button className="btn">LogIn</button>
Expand Down
12 changes: 6 additions & 6 deletions frontend/src/components/Navbar.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -28,18 +28,18 @@ const Navbar = () => {
<nav className="grid grid-cols-2 justify-center">
<div className="flex flex-cols-2 justify-start items-center gap-6 ml-16">
<Link className="first_img " to="/">
<img src="BabyBananya.png" />
<img src="doggy.png" />
</Link>
<Link className="first_h2 " to="/">
<Link className="first_h2 nav_btns" to="/">
AniManga Verse
</Link>
</div>

<div className="second flex flex-cols-5 justify-center items-center gap-8 ">
<Link to="/">Home</Link>
<Link to="/anime">Anime</Link>
<Link to="/manga">Manga</Link>
<Link to="/explore">Explore</Link>
<Link to="/" className="nav_btns">Home</Link>
<Link to="/anime" className="nav_btns">Anime</Link>
<Link to="/manga" className="nav_btns">Manga</Link>
<Link to="/explore" className="nav_btns">Explore</Link>

{/*in index.html, boxicons, imported as css. use it as 'Font' */}

Expand Down
2 changes: 1 addition & 1 deletion frontend/src/pages/Login.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -133,7 +133,7 @@ const Login = () => {
Sign in
</button>
</div>
<img src="login/bunny_register.png" className="image" alt="" />
<img src="login/bunny_register.gif" className="image" alt="" />
</div>
</div>
</div>
Expand Down
37 changes: 37 additions & 0 deletions frontend/src/styles/footer.scoped.scss
Original file line number Diff line number Diff line change
Expand Up @@ -45,13 +45,27 @@ p {
background: rgba(247, 155, 211, 0.502);

margin-bottom: 15px;


transition: background-color 0.5s ease-out;

}


.btn:hover {

background: #ea1179;
}

.social > img {
width: 32px;
height: 32px;

}




ul > li {
font-family: Inter;
font-size: 20px;
Expand All @@ -61,3 +75,26 @@ ul > li {
margin-bottom: 10px;
padding: 0;
}





.nav_btns:hover{
transition: color 0.2s ease-in; /* Combine transitions */
color: #e7358b;
}


.clickable {

cursor: pointer;

}



.non_clickable {
user-select: none;

}
17 changes: 17 additions & 0 deletions frontend/src/styles/navbar.scoped.scss
Original file line number Diff line number Diff line change
Expand Up @@ -55,4 +55,21 @@ nav {

/*TODO breakpoint font-size */
font-size: 1.2vw;



transition: background-color 0.5s ease-out;
}

.login:hover{
background: #ea1179;


}



.nav_btns:hover{
transition: color 0.2s ease-in; /* Combine transitions */
color: #e7358b;
}

0 comments on commit 5c1b6c4

Please sign in to comment.