Auction: posting styling and fixed multiple image upload

src/const.rb

@@ -47,7 +47,7 @@ MAX_TITLE_LEN = 32
 MIN_DESC_LEN = 0
 MAX_DESC_LEN = 512
 
-MIN_DELTA_TIME = 60*60 # 1 hour
+MIN_DELTA_TIME = 3600 # 1 hour
 
 # User constants
 AVATAR_SIZE = 1024 # width & height

src/views/auction/index.slim

@@ -20,4 +20,5 @@
       ul
       - auctions.each do |auction|
         li
-          | #{auction["title"]}
+          a href="/auctions/#{auction["id"]}"
+            | #{auction["title"]}

src/views/auction/new.slim

@@ -1,8 +1,9 @@
 .content-container
   h1 Post Auction
-  .form-container#auction_new
-    form action="/auctions" method="post" enctype="multipart/form-data"
-      input type="file" name="image" accept="image"
+  .form-container
+    form#auction_new action="/auctions" method="post" enctype="multipart/form-data"
+      label Select images
+      input type="file" name="image" accept="image" multiple="multiple"
 
       label Title
       input type="text" name="title" placeholder="Title" pattern="#{TITLE_REGEX_STR}" 
@@ -11,12 +12,15 @@
       input type="number" name="init_price" value="#{MIN_INIT_PRICE}" min="#{MIN_INIT_PRICE}"
 
       label Auction duration (hours)
-      input type="number" name="delta_time" value="1" min="1"
+      input type="number" name="delta_time" value="#{MIN_DELTA_TIME/3600}" min="#{MIN_DELTA_TIME/3600}"
 
-      textarea name="description" cols="20" rows="5" title="Content length must be between #{MIN_DESC_LEN} and #{MAX_DESC_LEN} characters" pattern="#{DESC_REGEX_STR}" maxlength="#{MAX_DESC_LEN}" placeholder="Description"
+      label Description
+      textarea name="description" cols="20" rows="5" title="Content length must be between #{MIN_DESC_LEN} and #{MAX_DESC_LEN} characters" pattern="#{DESC_REGEX_STR}" maxlength="#{MAX_DESC_LEN}" placeholder="Tell us about what you're selling!"
 
       label Categories
       - Category.get_all.each do |category|
-        input type="checkbox" name="category-#{category.id}" value="#{category.id}" = category.name
+        .checkbox-container
+          input type="checkbox" name="category-#{category.id}" value="#{category.id}" 
+          label style="color: #{category.color};" = "#{category.name}"
 
       input type="submit" value="Post"

src/views/stylesheets/style.sass

@@ -156,8 +156,6 @@ a.button:hover
   font-size: 1rem
   font-weight: bold
   animation: fade-in .9s ease-in alternate
-  border-radius: $border_radius
-  background: $bg_clr
   transition: .1s opacity 
   overflow: hidden
 
@@ -167,12 +165,16 @@ a.button:hover
   &-error
     color: $fg_error
     padding: 8px
-    border: $border_size solid $green_clr
+    border: $border_size solid $red_clr
+    border-radius: $border_radius
+    background: $bg_clr
 
   &-success
     color: $green_clr
     padding: 8px
     border: $border_size solid $green_clr
+    border-radius: $border_radius
+    background: $bg_clr
 
 .flash:hover
   cursor: pointer
@@ -242,9 +244,6 @@ ul.list-container
     display: flex
 
 .form-container
-  display: flex
-  justify-content: center
-
   form
     display: flex
     flex-direction: column
@@ -255,6 +254,10 @@ ul.list-container
     max-width: 400px
     border-radius: .2rem
 
+    .checkbox-container
+      input[type=checkbox]
+        margin: 0 .5rem
+
     textarea
       background-color: $bg_dark_clr
       font-size: 1rem
@@ -408,13 +411,8 @@ ul.list-container
 
 
 #settings
-  .form-container
-    .error_msg
-      margin-bottom: .8rem
-      color: $red_clr
     form
       background-color: $bg_alt_clr
-      //border: $border_size solid $border_clr
 
       input[type=text]
         padding: 0 .2rem
@@ -440,6 +438,9 @@ ul.list-container
           margin-left: 1rem
 
 // Auctions
+#auctions_new
+  display: grid
+
 #auctions
   display: flex
   flex-direction: column