Restyling

This commit is contained in:
Christoph Haas 2018-06-27 18:43:08 +02:00
parent 9d6baa20e5
commit 06b8f92963
21 changed files with 492 additions and 493 deletions

View file

@ -1,14 +1,14 @@
// Modal upload window
#upload-modal.reveal data-reveal=true role='dialog'
h1 Upload new screenshots
.row
.small-4.columns
.grid-x
.small-4.cell
= form_for :screenshot, url: upload_image_path, html: { multipart: true } do |f|
/ = image_tag("/images/dummy/upload.svg", style: "width: 100%", id: 'upload-image')
a.button.round id='upload-image' Start uploading
= f.file_field :image, id: 'fileupload', multiple: true, style: 'display: none'
.small-8.columns
.small-8.cell
.bigpanel
p Thanks for uploading more screenshots. Please note:
ul

View file

@ -1,22 +1,21 @@
/ Render this callout on top of the package's details page
/ if images have just been uploaded.
- if (@valid_images and @valid_images.any?) or (@invalid_images and @invalid_images.any?)
.row
.callout.warning
.callout.warning
- if @invalid_images.any?
= fa_icon 'exclamation-circle 2x pull-left'
p These images were not accepted:
- if @invalid_images.any?
= fa_icon 'exclamation-circle 2x pull-left'
p These images were not accepted:
ul
- @invalid_images.each do |image|
li
' #{image.image_file_name} (#{image.errors[:image].join(' and the image ')})
ul
- @invalid_images.each do |image|
li
' #{image.image_file_name} (#{image.errors[:image].join(' and the image ')})
- if @valid_images.any?
= fa_icon 'check-circle 2x pull-left'
p
' #{pluralize(@valid_images.length, 'screenshot')} received successfully.
' Please review the images and add a description for each image. Thanks.
- if @valid_images.any?
= fa_icon 'check-circle 2x pull-left'
p
' #{pluralize(@valid_images.length, 'screenshot')} received successfully.
' Please review the images and add a description for each image. Thanks.

View file

@ -2,16 +2,15 @@
/ in a callout.
= render 'receive_upload'
.row.packagepage
.small-12.columns
h1 =@package.name
.packagepage
h1 =@package.name
.row.packagepage
#details.small-7.medium-7.columns.packagepage
.grid-x.grid-padding-x.packagepage
#details.small-7.medium-7.cell.packagepage
p.subtitle = @package.description
- if screenshots_visible_to_user(@package).count > 0
- screenshots_visible_to_user(@package).each do |screenshot|
.row.listview
.listview
.text-center
a.black.fancybox href=screenshot.image.url(:large, timestamp: false) rel='fancybox-thumb' title=screenshot.caption
= image_tag(screenshot.image.url(:large, timestamp: false), alt: screenshot.caption)
@ -38,7 +37,7 @@
// = render(partial: 'report_dropdown', locals: {screenshot: screenshot})
- else
.row.listview
.listview
img src='/images/dummy/no-screenshots-available.svg' width='100%' style='padding: 0 10%'
// Load reviews from the Ubuntu API through our own (cached) URL.
@ -46,7 +45,7 @@
// was not yet cached.
/ #reviews data-package-reviews-url=package_reviews_path(@package.name)
.small-5.medium-5.columns data-sticky-container=true
.small-5.medium-5.cell data-sticky-container=true
= render(partial: 'details_rightbox', locals: {pkg: @package})
/ javascript:

View file

@ -1,20 +1,20 @@
// Paginator and search bar
.row
.small-6.medium-8.large-9.columns
.grid-x
.small-6.medium-8.large-9.cell
// Paginator
= render 'packages/paginator'
.small-6.medium-4.large-3.columns
.small-6.medium-4.large-3.cell
// Search form
= render 'packages/searchfield'
// Grid view
.row
.small-9.large-10.columns
.grid-x
.small-9.large-10.cell
- if @packages.length>0
.row.small-up-1.medium-up-3.large-up-4.grid-thumbnails
.grid-x.grid-margin-x.small-up-1.medium-up-3.large-up-4
- @packages.all.each do |pkg|
.column
.cell
= render partial: 'packages/grid_thumbnail', locals: { pkg: pkg }
- else
@ -24,5 +24,5 @@
= render 'packages/paginator'
// Icon sidebar for options and views
.small-3.large-2.columns
.small-3.large-2.cell
= render 'packages/sidebar'

View file

@ -1,20 +1,20 @@
// Paginator and search bar
.row
.small-6.medium-8.large-9.columns
.grid-x
.small-6.medium-8.large-9.cell
// Paginator
= render 'packages/paginator'
.small-6.medium-4.large-3.columns
.small-6.medium-4.large-3.cell
// Search form
= render 'packages/searchfield'
// Package list
.row.packagepage
.small-9.medium-10.columns
.grid-x.packagepage
.small-9.medium-10.cell
- if @packages.length>0
- @packages.to_a.each do |pkg|
.row.listview
.small-12.medium-4.columns
.grid-x.listview
.small-12.medium-4.cell
- if pkg.screenshots_approved.any?
// TODO: smarter search for the best screenshot instead of taking the first one
- screenshot = pkg.screenshots.first
@ -26,7 +26,7 @@
- else
a href=package_path(name: pkg.name)
img.screenshot src="/images/dummy/no-screenshots-upload-one.svg"
.small-12.medium-8.columns
.small-12.medium-8.cell
h1
a href=package_path(name: pkg.name)
=pkg.name
@ -41,5 +41,5 @@
= render 'packages/noresults'
// Icon sidebar for options and views
.small-3.medium-2.columns
.small-3.medium-2.cell
= render 'packages/sidebar'

View file

@ -1,22 +1,20 @@
.row
h1
i.fi-alert
' No such package…
h1
i.fi-alert
' No such package…
p
' I'm afraid but there is no package
em =@package_name
' in the database. It may be that a package that is available
' in your favorite Linux distribution is not listed here.
' If you think this is an error then feel free to leave
a href="mailto:email@christoph-haas.de" feedback
p
' I'm afraid but there is no package
em =@package_name
' in the database. It may be that a package that is available
' in your favorite Linux distribution is not listed here.
' If you think this is an error then feel free to leave
a href="mailto:email@christoph-haas.de" feedback
p
' Perhaps you want to search for some other piece of software?
= form_tag(packages_grid_path, method: 'GET')
div.row.collapse.postfix-round
div.small-9.columns
input type="text" name="search"autofocus="true"
div.small-3.columns
input.button.postfix type="submit" value="Search"
p
' Perhaps you want to search for some other piece of software?
= form_tag(packages_grid_path, method: 'GET')
div.collapse.postfix-round
div.small-9.columns
input type="text" name="search"autofocus="true"
div.small-3.columns
input.button.postfix type="submit" value="Search"

View file

@ -1,10 +1,9 @@
= render 'receive_upload'
.row
h1 = "Upload screenshots for #{@package.name}"
h1 = "Upload screenshots for #{@package.name}"
.row
.small-7.columns
.grid-x
.small-7.cell
p.subtitle = @package.description
p
' You are about to upload a screenshot for the #{@package.name}
@ -12,8 +11,8 @@
= form_for :screenshot, url: upload_receive_path, html: { multipart: true, id: 'file-form' } do |f|
.row
.small-6.columns
.grid-x
.small-6.cell
input.hidden-inputfile type="file" name="file[]" id="file" multiple=true
label for="file"
a.button id="file-select-button"
@ -21,7 +20,7 @@
span id="file-label"
' Select screenshot file(s)
.small-6.columns
.small-6.cell
button.button type="submit" id="file-submit"
= fa_stacked_icon "upload", base: "circle-thin"
' Start upload
@ -43,7 +42,7 @@
// ' be the first.
.small-5.columns.bigpanel
.small-5.cell.bigpanel
p.subtitle Your upload…
ul
li