From 0d4a1ee7d70b7dfab2a0399025a19eedb0917bea Mon Sep 17 00:00:00 2001 From: "E. Almqvist" Date: Sat, 23 Apr 2022 18:02:27 +0200 Subject: [PATCH] Auction index refactor layout --- src/lib/db_models.rb | 4 +-- src/routes/auction.rb | 4 +-- src/views/auction/index.slim | 25 ++++++++------- src/views/auction/view.slim | 2 +- src/views/stylesheets/style.sass | 53 +++++++++++++++++++++++++++++--- 5 files changed, 67 insertions(+), 21 deletions(-) diff --git a/src/lib/db_models.rb b/src/lib/db_models.rb index 93dc43a..827878a 100644 --- a/src/lib/db_models.rb +++ b/src/lib/db_models.rb @@ -322,10 +322,10 @@ class Auction < EntityModel def self.compose_query_filters(title=nil, categories=nil, price_rng=nil, expired=nil) querystr = "SELECT * FROM Auction " - querystr += "WHERE " if title or categories or price_rng or expired + querystr += "WHERE " if (title and title.length != 0) or categories or price_rng or expired filters = [] - filters << "LIKE '%#{title}%'" if title + filters << "title LIKE '%#{title}%'" if title and title.length != 0 filters << "price BETWEEN #{price_rng[0]} AND #{price_rng[1]}" if price_rng && price_rng.length == 2 filters << "end_time < #{Time.now.to_i}" if !expired.nil? diff --git a/src/routes/auction.rb b/src/routes/auction.rb index 7776aee..ab40b20 100644 --- a/src/routes/auction.rb +++ b/src/routes/auction.rb @@ -4,12 +4,10 @@ get "/auctions" do #categories = (params[:categories].split ",").map {|id| id.to_i} #price_rng = (params[:price_rng].split "-").map {|p| p.to_i} expired = params[:expired] - p "#####" - p expired - p "#####" # TODO FIX THIS auctions = Auction.search title #, categories, price_rng, expired + p auctions serve :"auction/index", {auctions: auctions} end diff --git a/src/views/auction/index.slim b/src/views/auction/index.slim index 3b6e3e9..f927ad2 100644 --- a/src/views/auction/index.slim +++ b/src/views/auction/index.slim @@ -1,6 +1,6 @@ .content-container #auctions - aside + aside.card h2 Search Filters .form-container form action="/auctions" method="get" @@ -15,14 +15,17 @@ label Expired? input type="submit" value="Search" - article - h2 Results + a.button href="/auctions" = "Clear Filters" - ul - - auctions.each do |auction| - li - a href="/auctions/#{auction.id}" - | #{auction.title} - - if auction.end_time and auction.end_time - Time.now.to_i <= 0 - span.red - | [Expired] + article.card + h2 Results + ul.list-container + - auctions.each do |auction| + li + a href="/auctions/#{auction.id}" + div style="background-image: url(#{auction.images[0].url})" + h3 + | #{auction.title} + - if auction.end_time and auction.end_time - Time.now.to_i <= 0 + span.red + | [Expired] diff --git a/src/views/auction/view.slim b/src/views/auction/view.slim index 028115d..4b466fc 100644 --- a/src/views/auction/view.slim +++ b/src/views/auction/view.slim @@ -51,7 +51,7 @@ input type="submit" value="Bid" #auctionbid-container - h2 Bid History + h2.tcenter Bid History - if auction.bids.length >= 1 ul.list-container.card-container - auction.bids.reverse_each do |bid| diff --git a/src/views/stylesheets/style.sass b/src/views/stylesheets/style.sass index 478d4c9..41ec7fa 100644 --- a/src/views/stylesheets/style.sass +++ b/src/views/stylesheets/style.sass @@ -330,7 +330,7 @@ ul.list-container width: inherit h2 text-align: left - padding: 0 .8rem + //padding: 0 .8rem margin: 0 border-bottom: $border_size solid $shadow_clr font-size: 1rem @@ -447,12 +447,57 @@ ul.list-container margin-left: 1rem // Auctions +#auctions + display: flex + flex-direction: row + justify-content: center + height: inherit + width: 80% + padding: 2rem + + a.button + border: $border_size solid $shadow_clr + border-radius: $border_radius + + article + height: 90% + ul + height: 100% + + li:hover + border: $border_size solid $special_clr + cursor: pointer + + li + margin-top: 1.2rem + padding: 2px + border: $border_size solid $border_clr + border-radius: $border_radius + transition: .2s border + a + display: flex + text-decoration: none + color: $fg_clr + flex-direction: row + div + border-radius: $border_radius + width: 12rem + height: 8rem + background-repeat: no-repeat + background-position: center + background-size: cover + + aside + width: 40rem + margin-right: 4rem + .form-container + form + padding: 0 + width: inherit + #auctions_new display: grid -#auctions - display: flex - flex-direction: column #auction-view display: grid