Bootcamp
Study group
Collaborate with peers in your dedicated #study-group channel.
Code reviews
Submit projects for review using the /review command in your #code-reviews channel
<!DOCTYPE html>
<html>
<head>
<title>Moody</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Cabin:wght@400;500;600;700&family=Calistoga&display=swap" rel="stylesheet">
<link rel="stylesheet" href="index.css">
</head>
<body>
<section id="logged-out-view">
<div class="container">
<h1 class="app-title">Moody</h1>
<div class="provider-buttons">
<button id="sign-in-with-google-btn" class="provider-btn">
<img src="assets/providers/google.png" class="google-btn-logo">
Sign in with Google
</button>
</div>
<div class="auth-fields-and-buttons">
<input id="email-input" type="email" placeholder="Email">
<input id="password-input" type="password" placeholder="Password">
<button id="sign-in-btn" class="primary-btn">Sign in</button>
<button id="create-account-btn" class="secondary-btn">Create Account</button>
</div>
</div>
</section>
<section id="logged-in-view">
<div class="container">
<nav>
<button id="sign-out-btn" class="icon-btn">
<img src="assets/icons/icon-sign-out.svg" class="icon-img-btn">
</button>
</nav>
<div class="app-container">
<div class="user-section">
<img id="user-profile-picture">
<h2 id="user-greeting"></h2>
</div>
<div class="mood-emojis">
<button id="mood-1" class="mood-emoji-btn">
<img src="assets/emojis/1.png">
Awful
</button>
<button id="mood-2" class="mood-emoji-btn">
<img src="assets/emojis/2.png">
Bad
</button>
<button id="mood-3" class="mood-emoji-btn">
<img src="assets/emojis/3.png">
Meh
</button>
<button id="mood-4" class="mood-emoji-btn">
<img src="assets/emojis/4.png">
Good
</button>
<button id="mood-5" class="mood-emoji-btn">
<img src="assets/emojis/5.png">
Amazing
</button>
</div>
<div class="post-section">
<textarea id="post-input" placeholder="Write down how you're feeling..."></textarea>
<button id="post-btn" class="primary-btn">Post</button>
</div>
<div class="filters-and-posts-section">
<div class="filters-section">
<button id="today-filter-btn" class="filter-btn">Today</button>
<button id="week-filter-btn" class="filter-btn">Week</button>
<button id="month-filter-btn" class="filter-btn">Month</button>
<button id="all-filter-btn" class="filter-btn">All</button>
</div>
<div id="posts" class="posts-section">
</div>
</div>
</div>
</div>
</section>
<script src="index.js" type="module"></script>
</body>
</html>
