Skip to content

Commit

Permalink
completed CSS
Browse files Browse the repository at this point in the history
  • Loading branch information
@joehannis
joehannis committed Aug 9, 2023
1 parent 7d3bf10 commit 67777aa
Show file tree
Hide file tree
Showing 9 changed files with 145 additions and 60 deletions.
11 changes: 6 additions & 5 deletions app.rb
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,11 +29,12 @@ class Application < Sinatra::Base
end

post '/account_page' do
current_time = Time.now + 1 * 60 * 60 # Get the current time with GMT offset
Post.create_post(current_time, params[:message], session[:user_id])
current_time = Time.now + 1 * 60 * 60
formatted_time = current_time.strftime("%d/%m/%Y %H:%M")
Post.create_post(formatted_time, params[:message], session[:user_id])

# Append the new post to the class variable
@@posts.unshift("#{current_time} #{User.find(session[:user_id]).name} #{User.find(session[:user_id]).username} #{params[:message]}")

@@posts.unshift("#{formatted_time} #{User.find(session[:user_id]).username} #{params[:message]}")

redirect '/account_page'
end
Expand Down Expand Up @@ -102,4 +103,4 @@ class Application < Sinatra::Base
get '/success' do
erb(:success)
end
end
end
2 changes: 1 addition & 1 deletion lib/post.rb
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,4 +18,4 @@ def self.create_post(time, message, user_id)
post
end

end
end
79 changes: 74 additions & 5 deletions public/style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -55,7 +55,7 @@ header {
justify-content: space-around;
}

.button {
.header-button {
width: 150px;
height: 40px;
background-color: rgb(255, 255, 255);
Expand All @@ -74,7 +74,7 @@ header {
margin-right: 5px;
}

.button:hover {
.header-button:hover {
background-color: rgb(255, 221, 0);
cursor: pointer;
}
Expand All @@ -90,11 +90,9 @@ header {
}

.post {
align-items: center;
border: 1px solid rgb(41, 94, 163);
display: flex;
flex-flow: column;
justify-content: center;
justify-content: space-between;
gap: 50px;
margin: 20px;
width: 100%;
Expand All @@ -110,6 +108,77 @@ header {
justify-content: center;
gap: 20px;
width: 100%;
max-width: 600px; /* Set the maximum width */
margin-top: 50px;
}

#input-form .username,
#input-form .password {
width: 100%;
height: 45px; /* Adjust the height as needed */
padding: 8px; /* Adjust the padding as needed */
font-size: 16px; /* Adjust the font size as needed */
border: 1px solid rgb(41, 94, 163);
border-radius: 6px;
}

.login-button {
width: 150px;
height: 40px;
background-color: rgb(255, 255, 255);
border: none;
color: rgb(41, 94, 163);
border-radius: 6px;
font-size: 15px;
text-align: center;
transition-duration: 0.2s;
font-weight: 600;
text-decoration: none;
display: flex;
align-items: center;
justify-content: center;
margin-left: 115px;
margin-top: 30px;
}

.login-button:hover {
background-color: rgb(255, 221, 0);
cursor: pointer;
}

.post-button {
width: 150px;
height: 40px;
background-color: rgb(255, 255, 255);
border-style: solid;
color: rgb(41, 94, 163);
border-radius: 6px;
font-size: 15px;
text-align: center;
transition-duration: 0.2s;
font-weight: 600;
text-decoration: none;
display: flex;
align-items: center;
justify-content: center;
margin-left: 230px;
margin-top: 30px;
}

.post-button:hover {
background-color: rgb(255, 221, 0);
cursor: pointer;
}

.input-post-box {
width: 600px;
height: auto; /* Adjust the height as needed */
padding: 8px; /* Adjust the padding as needed */
font-size: 16px; /* Adjust the font size as needed */
border: 1px solid rgb(41, 94, 163);
border-radius: 6px;
resize: vertical;
margin-top: 15px;
}

#location-list a {
Expand Down
30 changes: 17 additions & 13 deletions views/account.erb
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,22 +7,26 @@
<body>
<header id="header">
<div class="icon">
<img id="icon" src="icon.png">
<a href="http://localhost:9292/"><img id="icon" src="icon.png" alt="Icon"></a>
</div>
<div class="text">Chitter</div>
<div class="buttons-container">
<div class="header-button"><a href="http://localhost:9292/logout">Logout</a></div>
</div>
</header>
<div></div>
<div id="input-form">What would you like to say?<form action="/account_page" method="POST">
<input type="text" name="message">
<input type="submit" value="Post a message!">
</form> <div id="container" >
<% @@posts.each do |post| %>
<div class="post">
<%= post %><br>
<div id="container">
<div id="input-form">What would you like to say?<form action="/account_page" method="POST">
<textarea class="input-post-box" name="message" placeholder="Enter your post"></textarea>
<button class="post-button" type="submit">Post a message</button>
</form>
<div class="posts-container">
<% @@posts.each do |post| %>
<div class="post">
<%= post %><br>
</div>
<% end %>
</div>
<% end %>
</div>
</div>
<a href="http://localhost:9292/logout">Logout</a>

</div>
</body>
</html>
17 changes: 9 additions & 8 deletions views/index.erb
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,21 +12,22 @@
<div class="text">Chitter </div>

<div class="buttons-container">
<div class="button">
<div class="header-button">
<a href="http://localhost:9292/signup">Signup</a>
</div>
<div class="button">
<div class="header-button">
<a href="http://localhost:9292/login">Login</a>
</div>
</div>
</header>
<div id="container" >
<% @@posts.each do |post| %>
<div class="post">
<%= post %><br>
</div>
<% end %>
</div>
<div class="posts-container">
<% @@posts.each do |post| %>
<div class="post">
<%= post %><br>
</div>
<% end %>
</div>
</div>
</body>
</html>
22 changes: 13 additions & 9 deletions views/login.erb
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,17 +6,21 @@
<body>
<header id="header">
<div class="icon">
<img id="icon" src="icon.png">
<a href="http://localhost:9292/"><img id="icon" src="icon.png" alt="Icon"></a>
</div>
<div class="text">Chitter</div>
</header>
<h1>Welcome to Chitter!</h1>
<div>Please log in below</div>
<div><form action="/login" method="POST">
<div>Username</div>
<input type="text" name="username">
<div>Password</div>
<input type="password" name="password">
<input type="submit" value="Login">
<div id="container">
<div id="input-form">
<h1>Welcome to Chitter!</h1>
<div>Please log in below</div>
<div><form action="/login" method="POST">
<input class="username" type="text" name="username" placeholder="Username">
<input class ="password" type="password" name="password" placeholder="Password">
<button class="login-button" type="submit">Login</button>
</form></div>
<div>Don't have an account? <a href="/signup">Sign up here</a></div>
</div>
</div>
</body>
</html>
8 changes: 5 additions & 3 deletions views/login_failure.erb
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,11 +6,13 @@
<body>
<header id="header">
<div class="icon">
<img id="icon" src="icon.png">
<a href="http://localhost:9292/"><img id="icon" src="icon.png" alt="Icon"></a>
</div>
<div class="text">Chitter</div>
</header>
<h1>Login failure</h1>
<div><a href="http://localhost:9292/login">click here to try again</a></div>
<div id="container">
<h1>Login failure</h1>
<div><a href="http://localhost:9292/login">click here to try again</a></div>
</div>
</body>
</html>
28 changes: 15 additions & 13 deletions views/signup.erb
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,21 +6,23 @@
<body>
<header id="header">
<div class="icon">
<img id="icon" src="icon.png">
<a href="http://localhost:9292/"><img id="icon" src="icon.png" alt="Icon"></a>
</div>
<div class="text">Chitter</div>
</header>
<h1>Welcome to Chitter!</h1>
<div>Please register your details below</div>
<div><form action="/signup" method="POST">
<div>Name</div>
<input type="text" name="name">
<div>Username</div>
<input type="text" name="username">
<div>Password</div>
<input type="password" name="password">
<div>Email</div>
<input type="text" name="email">
<input type="submit" value="Signup">
<div id="container">
<div id="input-form">
<h1>Welcome to Chitter!</h1>
<div>Please register your details below</div>
<div><form action="/signup" method="POST">
<input class=username type="text" name="name" placeholder="name">
<input class=username type="text" name="username" placeholder="username">
<input class=username type="password" name="password" placeholder="password">
<input class="username" type="text" name="email" placeholder="email">
<button class="post-button" type="submit">Submit</button>
</form></div>
<div>Already have an account? <a href="/login">Login here</a></div>
</div>
</div>
</body>
</html>
8 changes: 5 additions & 3 deletions views/success.erb
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,11 +6,13 @@
<body>
<header id="header">
<div class="icon">
<img id="icon" src="icon.png">
<a href="http://localhost:9292/"><img id="icon" src="icon.png" alt="Icon"></a>
</div>
<div class="text">Chitter</div>
</header>
<h1>Success!</h1>
<div><a href="http://localhost:9292/">click here to return to the homepage</a></div>
<div id="container">
<h1>Success!</h1>
<div><a href="http://localhost:9292/">click here to return to the homepage</a></div>
</div>
</body>
</html>

0 comments on commit 67777aa

Please sign in to comment.