CSS added for all pages

amh4 · Jan 20, 2023 · 97fe200 · 97fe200
1 parent 4eb6317
commit 97fe200
Show file tree

Hide file tree

Showing 9 changed files with 267 additions and 72 deletions.
diff --git a/public/account.css b/public/account.css
@@ -0,0 +1,52 @@
+body {
+  background-color: lightblue;
+  font-family: 'Courier New', Courier, monospace;
+  text-align: center;
+}
+
+.container{
+  border: 4px solid white;
+  border-radius: 25px;
+  padding: 30px;
+  margin-top: 50px;
+  margin-left: 100px;
+  margin-right: 100px;
+}
+
+.approve_button{
+  display: inline-block;
+}
+
+.reject_button{
+  display: inline-block;
+}
+
+ul{  
+  padding:0;  
+  background:white;  
+  font-family: 'Courier New', Courier, monospace;
+  font-size:15px;  
+  text-transform:uppercase;
+  text-align: right;
+}
+
+li{  
+  display:inline-block;
+}
+
+a{  
+  display:block;  
+  padding:10px;  
+  color:black;  
+  text-decoration:none;
+}
+
+h1 {
+  color: white;
+  text-align: center;
+}
+
+h2 {
+  color: white;
+  text-align: center;
+}
diff --git a/public/addaspace.css b/public/addaspace.css
@@ -0,0 +1,43 @@
+
+body {
+  background-color: lightblue;
+  font-family: 'Courier New', Courier, monospace;
+  text-align: center;
+}
+
+.addform{
+  border: 4px solid white;
+  border-radius: 25px;
+  padding: 30px;
+  margin: 20px
+}
+
+ul{  
+  padding:0;  
+  background:white;  
+  font-family: 'Courier New', Courier, monospace;
+  font-size:15px;  
+  text-transform:uppercase;
+  text-align: right;
+}
+
+li{  
+  display:inline-block;
+}
+
+a{  
+  display:block;  
+  padding:10px;  
+  color:black;  
+  text-decoration:none;
+}
+
+h1 {
+  color: white;
+  text-align: center;
+}
+
+h2 {
+  color: white;
+  text-align: center;
+}
diff --git a/public/addavail.css b/public/addavail.css
@@ -0,0 +1,53 @@
+body {
+  background-color: lightblue;
+  font-family: 'Courier New', Courier, monospace;
+  text-align: center;
+}
+
+.add_avail_form{
+  border: 4px solid white;
+  border-radius: 25px;
+  padding: 30px;
+  margin-top: 50px;
+  margin-left: 100px;
+  margin-right: 100px;
+}
+
+.add_another_space{
+  border: 4px solid white;
+  border-radius: 25px;
+  margin-top: 10px;
+  margin-bottom: 10px;
+  padding-bottom: 20px;
+  display: inline-block;
+}
+
+ul{  
+  padding:0;  
+  background:white;  
+  font-family: 'Courier New', Courier, monospace;
+  font-size:15px;  
+  text-transform:uppercase;
+  text-align: right;
+}
+
+li{  
+  display:inline-block;
+}
+
+a{  
+  display:block;  
+  padding:10px;  
+  color:black;  
+  text-decoration:none;
+}
+
+h1 {
+  color: white;
+  text-align: center;
+}
+
+h2 {
+  color: white;
+  text-align: center;
+}
diff --git a/public/bookings.css b/public/bookings.css
@@ -0,0 +1,45 @@
+body {
+  background-color: lightblue;
+  font-family: 'Courier New', Courier, monospace;
+  text-align: center;
+}
+
+.container{
+  border: 4px solid white;
+  border-radius: 25px;
+  padding: 30px;
+  margin-top: 50px;
+  margin-left: 100px;
+  margin-right: 100px;
+}
+
+
+ul{  
+  padding:0;  
+  background:white;  
+  font-family: 'Courier New', Courier, monospace;
+  font-size:15px;  
+  text-transform:uppercase;
+  text-align: right;
+}
+
+li{  
+  display:inline-block;
+}
+
+a{  
+  display:block;  
+  padding:10px;  
+  color:black;  
+  text-decoration:none;
+}
+
+h1 {
+  color: white;
+  text-align: center;
+}
+
+h2 {
+  color: white;
+  text-align: center;
+}
diff --git a/views/account_page.erb b/views/account_page.erb
@@ -1,39 +1,40 @@
 <html>
   <head>
-    <link rel="stylesheet" type="text/css" href="<%= url("/style.css")%>">
+    <link rel="stylesheet" type="text/css" href="<%= url("/account.css")%>">
   </head>
   <body>
       <div class="navigation">
         <ul>
           <li><a href="/">Home</a></li>
-          <li><a href="/log-out">Logout</a></li>
+          <li><a href="/bookings">Your Bookings</a></li>
           <li><a href="/account">Manage Account</a></li>
-
+          <li><a href="/log-out">Logout</a></li>
         </ul>
-        </div>
-    <h1>Account Management</h1>
-
-<div class="float-container">
-      <div class="float-child">
-        <a href="/bookings">Your Bookings</a><br>
       </div>
 
-    <div class="float-child">
-      <% @requests.each do |request| %>
-      <%= request.title %>
-      <%= request.description %>
-      $<%= request.daily_rate %> per day
+    <h1>Account Management</h1>
 
+  <% @requests.each do |request| %>
+    <div class="container">
+    <%= request.title %>
+    <%= request.description %>
+    $<%= request.daily_rate %> per day
+    <br>
+    <br>
+    <div class="approve_button">
       <form action="/approve-reject/<%= request.id %>&<%= true %>" method="post">
         <label>Approve</label>
         <input type="submit" name="approve" value="Approve">
       </form>
-       <form action="/approve-reject/<%= request.id %>&<%= false %>" method="post">
-        <label>Reject</label>
-        <input type="submit" name="reject" value="Reject">
-      </form>
-      <% end %>
+      </div>
+
+      <div class="reject_button">
+        <form action="/approve-reject/<%= request.id %>&<%= false %>" method="post">
+          <label>Reject</label>
+          <input type="submit" name="reject" value="Reject">
+        </form>
+      </div>
     </div>
-  </div>
+    <% end %>
   </body>
 </html>
diff --git a/views/add_a_space.erb b/views/add_a_space.erb
@@ -1,6 +1,6 @@
 <html>
   <head>
-    <link rel="stylesheet" type="text/css" href="<%= url("/style.css")%>">
+    <link rel="stylesheet" type="text/css" href="<%= url("/addaspace.css")%>">
   </head>
   <body>
 
@@ -15,33 +15,33 @@
     <h1>Add your space</h1>
     <br>
     <br>
-<form action="/add-a-space" method="POST">
-  <label for="title">Property name:</label>
-  <input type="text" name="title" />
-
-  <label for="address">Address:</label>
-  <input type="text" name="address" />
-
-  <label for="description">Property description:</label>
-  <input type="text" name="description" />
-
-  <label for="daily_rate">Daily rate:</label>
-  <input type="number" name="daily_rate" />
-  <br>
-  <br>
-  <br>
-  <label for="first_available">Available from:</label>
-  <input type="date" name="first_available" />
-
-  <label for="last_available">Available to:</label>
-  <input type="date" name="last_available" />
-  <br>
-  <br>
-  <br>
-  <input type="submit" value="Add Your Space" />
-
-</form>
-
 
+    <div class="addform"">
+      <form action="/add-a-space" method="POST">
+        <label for="title">Property name:</label>
+        <input type="text" name="title" />
+
+        <label for="address">Address:</label>
+        <input type="text" name="address" />
+
+        <label for="description">Property description:</label>
+        <input type="text" name="description" />
+
+        <label for="daily_rate">Daily rate:</label>
+        <input type="number" name="daily_rate" />
+        <br>
+        <br>
+        <br>
+        <label for="first_available">Available from:</label>
+        <input type="date" name="first_available" />
+
+        <label for="last_available">Available to:</label>
+        <input type="date" name="last_available" />
+        <br>
+        <br>
+        <br>
+        <input type="submit" value="Add Your Space" />
+      </form>
+    </div>
   </body>
 </html>
diff --git a/views/add_availability.erb b/views/add_availability.erb
@@ -1,11 +1,11 @@
 <html>
-  <head><link rel="stylesheet" type="text/css" href="<%= url("/style.css")%>"></head>
+  <head><link rel="stylesheet" type="text/css" href="<%= url("/addavail.css")%>"></head>
   <body>
     <div class="navigation">
       <ul>
         <li><a href="/">Homepage</a></li>
         <li><a href="/log-out">Logout</a></li>
-        <li><a href="/your-bookings">View bookings</a></li>
+        <li><a href="/bookings">View bookings</a></li>
       </ul>
     </div>
 
@@ -15,17 +15,21 @@
     Property description: <%= @p.description %>
     Property address: <%= @p.address %>
 
-    <form action="/add-availability/<%= @p.id %>" method="POST">
+      <div class="add_avail_form">
+        <form action="/add-availability/<%= @p.id %>" method="POST">
 
-      <label for="first_available">Available from:</label>
-      <input type="date" name="first_available" />
+        <label for="first_available">Available from:</label>
+        <input type="date" name="first_available" />
 
-      <label for="last_available">Available to:</label>
-      <input type="date" name="last_available" />
+        <label for="last_available">Available to:</label>
+        <input type="date" name="last_available" />
+        <br>
+        <br>
+        <input type="submit" value="Add Availability" />
+      </div>
 
-      <input type="submit" value="Submit the form" />
-      <div class="add-another-space">
-      <br><li ><a href="/add-a-space">Add another space</a></li>
+      <div class="add_another_space">
+        <br><a href="/add-a-space">Add another space</a>
       </div>
     </form>
   </body>