innocuous-symmetry/cat-reddit
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fixed title, responsive design

Browse Source
This commit is contained in:
Mikayla Dobson
2022-01-30 16:36:45 -06:00
parent 5e674e8cf5
commit 63205cd560
2 changed files with 10 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
src/App.css
View File

@@ -31,7 +31,7 @@
height: 100vh; height: 100vh;
} }
.mobile-title { .nav-title-mobile {
display: none; display: none;
} }
@@ -50,7 +50,7 @@
z-index: 9; z-index: 9;
} }
.nav-title { .nav-title-desktop {
display: inline-flex; display: inline-flex;
color: orchid; color: orchid;
padding-left: 1.5rem; padding-left: 1.5rem;
@@ -234,17 +234,20 @@
position: static; position: static;
} }
.desktop-title { .nav-title-desktop {
display: none; display: none;
} }
.mobile-title { .nav-title-mobile {
display: inline-flex; display: inline-flex;
color: orchid;
padding-left: 1.5rem;
font-family: 'Open Sans', sans-serif;
} }
.nav-searchbar { .nav-searchbar {
width: 12rem; width: 12rem;
right: 12rem; right: 7rem;
} }
.sidebar-button { .sidebar-button {

4
src/features/navbar/Navbar.js
View File

@@ -12,8 +12,8 @@ export default function Navbar() {
return ( return (
<> <>
<div className="navbar"> <div className="navbar">
<h1 className="nav-title desktop-title">Reddit, but it's all cats</h1> <h1 className="nav-title-desktop">Reddit, but it's all cats</h1>
<h1 className="nav-title mobile-title">Cat Reddit</h1> <h1 className="nav-title-mobile">Cat Reddit</h1>
<SearchBar /> <SearchBar />
<button className="sidebar-button" onClick={handleCollapse}>Sidebar</button> <button className="sidebar-button" onClick={handleCollapse}>Sidebar</button>
</div> </div>