diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js index 9b2247c..c60af6a 100644 --- a/app/assets/javascripts/application.js +++ b/app/assets/javascripts/application.js @@ -37,3 +37,21 @@ load_reviews = function() { } ); }; + +// Initialize the upload form. +upload_form_init = function() { + // Disable the submit button until files are selected. + $('#file-submit').hide(); + + // Install event handler to notice when files were selected. + $('#file').on('change', upload_form_files_selected); +}; + +upload_form_files_selected = function() { + no_files = this.files.length; + if (no_files > 0) { + $('#file-label').html(no_files+" files selected"); + $('#file-select-button').addClass('success'); + $('#file-submit').fadeIn('slow'); + } +}; diff --git a/app/assets/stylesheets/_settings.scss b/app/assets/stylesheets/_settings.scss index 8c556ac..f55b409 100644 --- a/app/assets/stylesheets/_settings.scss +++ b/app/assets/stylesheets/_settings.scss @@ -25,19 +25,20 @@ // 20. Label // 21. Media Object // 22. Menu -// 23. Off-canvas -// 24. Orbit -// 25. Pagination -// 26. Progress Bar -// 27. Reveal -// 28. Slider -// 29. Switch -// 30. Table -// 31. Tabs -// 32. Thumbnail -// 33. Title Bar -// 34. Tooltip -// 35. Top Bar +// 23. Meter +// 24. Off-canvas +// 25. Orbit +// 26. Pagination +// 27. Progress Bar +// 28. Reveal +// 29. Slider +// 30. Switch +// 31. Table +// 32. Tabs +// 33. Thumbnail +// 34. Title Bar +// 35. Tooltip +// 36. Top Bar @import 'util/util'; @@ -54,12 +55,14 @@ $debian-color: #c70338; $global-font-size: 100%; $global-width: rem-calc(1200); $global-lineheight: 1.5; -$primary-color: #808080; -//$primary-color: $debian-color; -$secondary-color: #777; -$success-color: #3adb76; -$warning-color: #ffae00; -$alert-color: #ec5840; +$foundation-palette: ( + primary: $debian-color, + // primary: #2199e8, + secondary: #777, + success: #3adb76, + warning: #ffae00, + alert: #ec5840, +); $light-gray: #e6e6e6; $medium-gray: #cacaca; $dark-gray: #8a8a8a; @@ -75,6 +78,10 @@ $global-weight-normal: normal; $global-weight-bold: bold; $global-radius: 0; $global-text-direction: ltr; +$global-flexbox: false; +$print-transparent-backgrounds: true; + +@include add-foundation-colors; // 2. Breakpoints // -------------- @@ -185,9 +192,9 @@ $stat-font-size: 2.5rem; $abide-inputs: true; $abide-labels: true; -$input-background-invalid: $alert-color; -$form-label-color-invalid: $alert-color; -$input-error-color: $alert-color; +$input-background-invalid: map-get($foundation-palette, alert); +$form-label-color-invalid: map-get($foundation-palette, alert); +$input-error-color: map-get($foundation-palette, alert); $input-error-font-size: rem-calc(12); $input-error-font-weight: $global-weight-bold; @@ -201,7 +208,7 @@ $accordion-item-background-hover: $light-gray; $accordion-item-padding: 1.25rem 1rem; $accordion-content-background: $white; $accordion-content-border: 1px solid $light-gray; -$accordion-content-color: foreground($accordion-background, $primary-color); +$accordion-content-color: foreground($accordion-content-background, $body-font-color); $accordion-content-padding: 1rem; // 8. Accordion Menu @@ -239,8 +246,8 @@ $button-margin: 0 0 $global-margin 0; $button-fill: solid; $button-background: $primary-color; $button-background-hover: scale-color($button-background, $lightness: -15%); -$button-color: #fff; -$button-color-alt: #000; +$button-color: $white; +$button-color-alt: $black; $button-radius: $global-radius; $button-sizes: ( tiny: 0.6rem, @@ -296,8 +303,7 @@ $drilldown-background: $white; $dropdown-padding: 1rem; $dropdown-border: 1px solid $medium-gray; $dropdown-font-size: 1rem; -// $dropdown-width: 300px; -$dropdown-width: 400px; +$dropdown-width: 300px; $dropdown-radius: $global-radius; $dropdown-sizes: ( tiny: 100px, @@ -329,7 +335,7 @@ $fieldset-padding: rem-calc(20); $fieldset-margin: rem-calc(18 0); $legend-padding: rem-calc(0 3); $form-spacing: rem-calc(16); -$helptext-color: #333; +$helptext-color: $black; $helptext-font-size: rem-calc(13); $helptext-font-style: italic; $input-prefix-color: $black; @@ -341,9 +347,10 @@ $form-label-font-size: rem-calc(14); $form-label-font-weight: $global-weight-normal; $form-label-line-height: 1.8; $select-background: $white; -$select-triangle-color: #333; +$select-triangle-color: $dark-gray; $select-radius: $global-radius; $input-color: $black; +$input-placeholder-color: $medium-gray; $input-font-family: inherit; $input-font-size: rem-calc(16); $input-background: $white; @@ -353,7 +360,7 @@ $input-border: 1px solid $medium-gray; $input-border-focus: 1px solid $dark-gray; $input-shadow: inset 0 1px 2px rgba($black, 0.1); $input-shadow-focus: 0 0 5px $medium-gray; -$input-cursor-disabled: default; +$input-cursor-disabled: not-allowed; $input-transition: box-shadow 0.5s, border-color 0.25s ease-in-out; $input-number-spinners: true; $input-radius: $global-radius; @@ -379,12 +386,23 @@ $mediaobject-image-width-stacked: 100%; $menu-margin: 0; $menu-margin-nested: 1rem; -//$menu-item-padding: 0.7rem 1rem; -$menu-item-padding: 1.2rem 1rem; +// $menu-item-padding: 0.7rem 1rem; +$menu-item-padding: 0.5rem 1rem; +$menu-item-color-active: $white; +$menu-item-background-active: map-get($foundation-palette, primary); $menu-icon-spacing: 0.25rem; -$menu-expand-max: 6; -// 23. Off-canvas +// 23. Meter +// --------- + +$meter-height: 1rem; +$meter-radius: $global-radius; +$meter-background: $medium-gray; +$meter-fill-good: $success-color; +$meter-fill-medium: $warning-color; +$meter-fill-bad: $alert-color; + +// 24. Off-canvas // -------------- $offcanvas-size: 250px; @@ -397,7 +415,7 @@ $offcanvas-exit-background: rgba($white, 0.25); $maincontent-class: 'off-canvas-content'; $maincontent-shadow: 0 0 10px rgba($black, 0.5); -// 24. Orbit +// 25. Orbit // --------- $orbit-bullet-background: $medium-gray; @@ -412,7 +430,7 @@ $orbit-control-background-hover: rgba($black, 0.5); $orbit-control-padding: 1rem; $orbit-control-zindex: 10; -// 25. Pagination +// 26. Pagination // -------------- $pagination-font-size: rem-calc(14); @@ -429,34 +447,33 @@ $pagination-ellipsis-color: $black; $pagination-mobile-items: false; $pagination-arrows: true; -// 26. Progress Bar +// 27. Progress Bar // ---------------- -// $progress-height: 1rem; -$progress-height: 2rem; +$progress-height: 1rem; $progress-background: $medium-gray; $progress-margin-bottom: $global-margin; $progress-meter-background: $primary-color; $progress-radius: $global-radius; -// 27. Reveal +// 28. Reveal // ---------- $reveal-background: $white; $reveal-width: 600px; $reveal-max-width: $global-width; -$reveal-offset: rem-calc(100); $reveal-padding: $global-padding; $reveal-border: 1px solid $medium-gray; $reveal-radius: $global-radius; $reveal-zindex: 1005; $reveal-overlay-background: rgba($black, 0.45); -// 28. Slider +// 29. Slider // ---------- +$slider-width-vertical: 0.5rem; +$slider-transition: all 0.2s ease-in-out; $slider-height: 0.5rem; -$slider-width-vertical: $slider-height; $slider-background: $light-gray; $slider-fill-background: $medium-gray; $slider-handle-height: 1.4rem; @@ -464,9 +481,8 @@ $slider-handle-width: 1.4rem; $slider-handle-background: $primary-color; $slider-opacity-disabled: 0.25; $slider-radius: $global-radius; -$slider-transition: all 0.2s ease-in-out; -// 29. Switch +// 30. Switch // ---------- $switch-background: $medium-gray; @@ -482,7 +498,7 @@ $switch-paddle-offset: 0.25rem; $switch-paddle-radius: $global-radius; $switch-paddle-transition: all 0.25s ease-out; -// 30. Table +// 31. Table // --------- $table-background: $white; @@ -499,14 +515,13 @@ $table-foot-background: smart-scale($table-background, $table-color-scale); $table-head-font-color: $body-font-color; $show-header-for-stacked: false; -// 31. Tabs +// 32. Tabs // -------- $tab-margin: 0; $tab-background: $white; $tab-background-active: $light-gray; -$tab-border: $light-gray; -$tab-item-color: foreground($tab-background, $primary-color); +$tab-item-font-size: rem-calc(12); $tab-item-background-hover: $white; $tab-item-padding: 1.25rem 1.5rem; $tab-expand-max: 6; @@ -515,18 +530,17 @@ $tab-content-border: $light-gray; $tab-content-color: foreground($tab-background, $primary-color); $tab-content-padding: 1rem; -// 32. Thumbnail +// 33. Thumbnail // ------------- $thumbnail-border: solid 4px $white; $thumbnail-margin-bottom: $global-margin; $thumbnail-shadow: 0 0 0 1px rgba($black, 0.2); -// $thumbnail-shadow-hover: 0 0 6px 1px rgba($primary-color, 0.5); -$thumbnail-shadow-hover: 0 0 6px 3px rgba($primary-color, 0.5); +$thumbnail-shadow-hover: 0 0 6px 1px rgba($primary-color, 0.5); $thumbnail-transition: box-shadow 200ms ease-out; $thumbnail-radius: $global-radius; -// 33. Title Bar +// 34. Title Bar // ------------- $titlebar-background: $black; @@ -537,7 +551,7 @@ $titlebar-icon-color: $white; $titlebar-icon-color-hover: $medium-gray; $titlebar-icon-spacing: 0.25rem; -// 34. Tooltip +// 35. Tooltip // ----------- $has-tip-font-weight: $global-weight-bold; @@ -548,43 +562,29 @@ $tooltip-padding: 0.75rem; $tooltip-font-size: $small-font-size; $tooltip-pip-width: 0.75rem; $tooltip-pip-height: $tooltip-pip-width * 0.866; -$tooltip-pip-offset: 1.25rem; $tooltip-radius: $global-radius; -// 35. Top Bar +// 36. Top Bar // ----------- $topbar-padding: 0.5rem; // $topbar-background: $light-gray; $topbar-background: #2e3436; +$topbar-submenu-background: $topbar-background; $topbar-title-spacing: 1rem; $topbar-input-width: 200px; +$topbar-unstack-breakpoint: medium; // --------------------------------------------------- // -------------- debshots --------------------------- // --------------------------------------------------- -// Hover colors of links in top bar -$topbar-link-bg-hover: $primary-color; -$topbar-dropdown-link-bg-hover: $primary-color; - -// Larger top bar -// $topbar-height: rem-calc(60); -// Larger font in top bar -// $topbar-link-font-size: rem-calc(15); $topbar-padding: 0; -// $topbar-button-font-size: rem-calc(3); -// $topbar-button-top: rem-calc(5); - -// $topbar-link-padding: rem-calc(8); // At which width the top navigation bar should be switched to // mobile mode because otherwise it would wrap into two lines. -$topbar-breakpoint: 800px; -$topbar-media-query: "only screen and (min-width: #{$topbar-breakpoint})"; - -// Import Google font -// @import url(//fonts.googleapis.com/css?family=Droid+Sans:400,700); +// $topbar-breakpoint: 800px; +// $topbar-media-query: "only screen and (min-width: #{$topbar-breakpoint})"; // Use fonts from out own site. Do not load from Google for privacy reasons. @font-face { @@ -610,13 +610,6 @@ $button-font-tny: rem-calc(15); // Make the background of progress bars use a light version of the primary color $progress-bar-color: tint($primary-color, 80); -// Enable special grid and block-grid sizes for xlarge and xxlarge screens -/*$include-xl-html-grid-classes: true;*/ -/*$include-xl-html-block-grid-classes: true;*/ -/*$row-width: 100%;*/ - - - $page-background: #f2f2f2; $footer-background: #333333; $footer-text-color: #b3b3b3; @@ -646,7 +639,7 @@ body } } -.top-bar-title +.top-bar-left .sitename { // Display the site name in a larger font font-size: 26px; @@ -660,10 +653,27 @@ body } } -header +.top-bar-right .menu li a +{ + padding-top: 1.3rem; + padding-bottom: 1.3rem; +} + +.top-bar { // Draw a colored line below the navigation topbar border-bottom: 5px solid $debian_color; + color: #8a8a8a; + + a + { + color: #8a8a8a; + } + + a.active + { + color: #fefefe; + } } // ------- Footer - format as table cell to allow vertical centering @@ -680,28 +690,28 @@ html, body { height: 100%; } -#footer -{ - background-color: $footer-background; - display: table; - width: 100%; +// #footer +// { +// background-color: $footer-background; +// display: table; +// width: 100%; - p - { - display: table-cell; - padding: 5px 20px; - color: $footer-text-color; - vertical-align: middle; - text-align: center; - font-size: 100%; - } +// p +// { +// display: table-cell; +// padding: 5px 20px; +// color: $footer-text-color; +// vertical-align: middle; +// text-align: center; +// font-size: 100%; +// } - a - { - color: $footer-text-color; - font-weight: bolder; - } -} +// a +// { +// color: $footer-text-color; +// font-weight: bolder; +// } +// } // Leave some room after the topbar @@ -710,37 +720,9 @@ html, body { padding-top: 5px; } -// Screenshot thumbnail image with name and description -// .thumbnail -// { -// padding-top: 5px !important; -// padding-bottom: 5px !important; - // border-radius: 10px; -// margin-bottom: 10px; -// text-align: center; -// line-height: 120%; - -// &:hover -// { -// background-color: #d0d0d0; -// } - -// .pkgname -// { -// font-weight: 700; -// } -// .pkgdescription -// { -// font-size: 80%; -// } -// } - .grid-thumbnails .column { - // border: 5px solid green; border-radius: 10px; - // border: 2px solid $light-gray; - // height: 300px; padding: 5px 5px 50px 5px; text-align: center; } @@ -797,14 +779,6 @@ html, body { } } -// .row .gridview -// { -// img.screenshot -// { -// width: 100%; -// } -// } - .pkgname { font-size: 130%; @@ -813,35 +787,6 @@ html, body { line-height: 120%; } - -/*.pkgdetails -{ - .description - { - font-size: 150%; - color: #808080; - padding-bottom: 10px; - } - - .longdescription - { - font-size: 90%; - line-height: 120%; - padding-bottom: 5px; - } - - .rating - { - padding-top: 5px; - vertical-align: bottom; - } - - .commentcount - { - padding-left: 20px; - } -} -*/ .grid-thumbnail { // Pretend that all thumbnails are 120 pixels high to align the captions properly @@ -859,6 +804,20 @@ a.black color: #808080; } +.bigpanel +{ + background-color: $light-gray; + border-radius: 10px; + padding: 1em 1em 0.1em 1em; + margin-bottom: 1em; +} + +.subtitle +{ + font-size: 120%; + color: #808080; +} + .packagepage { h1 @@ -866,11 +825,6 @@ a.black margin-bottom: 0; } - .subtitle - { - font-size: 120%; - color: #808080; - } /* Description of a screenshot (e.g. the situation when the screenshot was taken) */ .imgcaption @@ -887,13 +841,6 @@ a.black color: #808080; } - .bigpanel - { - background-color: $light-gray; - border-radius: 10px; - padding: 1em 1em 0.1em 1em; - margin-bottom: 1em; - } .comment { @@ -934,28 +881,6 @@ a.black } } - -// .ratingbar -// { -// background-color: $progress-bar-color; -// width: 10em; -// display: inline-block; -// padding: 2px; -// text-align: left; -// color: white; -// text-transform: uppercase; -// font-size: 0.8em; -// font-weight: bolder; - -// .meter -// { -// background-color: $primary-color; -// padding: 2px; -// padding-left: 0.4em; -// text-shadow: 0 0 2px black; -// } -// } - /* Properties of a screenshot - shown in details view */ .property-title { @@ -973,5 +898,18 @@ a.black .description-verbatim-lines { line-height: 120%; - // white-space: pre-line; } + +/* Hide the file upload button to just show the styleable label */ +/* display: none will not work - this is the workaround */ +.hidden-inputfile { + width: 0.1px; + height: 0.1px; + opacity: 0; + overflow: hidden; + position: absolute; + z-index: -1; +} +.inputfile + label { + cursor: pointer; /* "hand" cursor */ +} \ No newline at end of file diff --git a/app/assets/stylesheets/foundation_and_overrides.scss b/app/assets/stylesheets/foundation_and_overrides.scss index d843b4d..f60bbaf 100644 --- a/app/assets/stylesheets/foundation_and_overrides.scss +++ b/app/assets/stylesheets/foundation_and_overrides.scss @@ -16,33 +16,34 @@ @include foundation-forms; @include foundation-visibility-classes; @include foundation-float-classes; -// @include foundation-accordion; -// @include foundation-accordion-menu; +@include foundation-accordion; +@include foundation-accordion-menu; @include foundation-badge; @include foundation-breadcrumbs; @include foundation-button-group; @include foundation-callout; -// @include foundation-close-button; -// @include foundation-drilldown-menu; +@include foundation-close-button; +@include foundation-drilldown-menu; @include foundation-dropdown; -// @include foundation-dropdown-menu; -// @include foundation-flex-video; +@include foundation-dropdown-menu; +@include foundation-flex-video; @include foundation-label; -// @include foundation-media-object; +@include foundation-media-object; @include foundation-menu; -// @include foundation-off-canvas; -// @include foundation-orbit; +@include foundation-menu-icon; +@include foundation-off-canvas; +@include foundation-orbit; @include foundation-pagination; @include foundation-progress-bar; -// @include foundation-slider; -// @include foundation-sticky; +@include foundation-slider; +@include foundation-sticky; @include foundation-reveal; -// @include foundation-switch; -// @include foundation-table; -// @include foundation-tabs; +@include foundation-switch; +@include foundation-table; +@include foundation-tabs; @include foundation-thumbnail; @include foundation-title-bar; -// @include foundation-tooltip; +@include foundation-tooltip; @include foundation-top-bar; // If you'd like to include motion-ui the foundation-rails gem comes prepackaged with it, uncomment the 3 @imports, if you are not using the gem you need to install the motion-ui sass package. diff --git a/app/controllers/logs_controller.rb b/app/controllers/logs_controller.rb index e63b34e..cedc8d4 100644 --- a/app/controllers/logs_controller.rb +++ b/app/controllers/logs_controller.rb @@ -2,6 +2,13 @@ class LogsController < ApplicationController before_action :authenticate_user! def index - @logs = Log.paginate(page: params[:page], per_page: 20) + logs = Log + + if params[:search].present? + logger.debug "Searching for #{params[:search]}" + logs = logs.where("message ilike ?", "%#{params[:search]}%") + end + + @logs = logs.paginate(page: params[:page], per_page: 20) end end diff --git a/app/controllers/welcome_controller.rb b/app/controllers/welcome_controller.rb index 38af1ba..c598fd5 100644 --- a/app/controllers/welcome_controller.rb +++ b/app/controllers/welcome_controller.rb @@ -4,11 +4,11 @@ class WelcomeController < ApplicationController @newest_upload = Screenshot.newest_upload # TODO: Use the actually most popular package and not just a random one - @most_popular_package = Package.with_screenshots.first + @most_popular_package = Package.order(:visits).last @package_count = Package.count - @most_wanted = Package.without_screenshots_most_visits.first + @most_wanted_package = Package.without_screenshots_most_visits.first end def about diff --git a/app/models/log.rb b/app/models/log.rb index 1b40cfc..4618711 100644 --- a/app/models/log.rb +++ b/app/models/log.rb @@ -1,4 +1,4 @@ -require 'pry' +# require 'pry' class Log < ApplicationRecord validates :message, presence: true @@ -26,6 +26,6 @@ class Log < ApplicationRecord log.token = token logger.error "Could not log to database - validation errors: #{log.errors.to_a}" unless log.valid? log.save - log + # log end end diff --git a/app/views/devise/confirmations/new.html.erb b/app/views/devise/confirmations/new.html.erb deleted file mode 100644 index 826672f..0000000 --- a/app/views/devise/confirmations/new.html.erb +++ /dev/null @@ -1,16 +0,0 @@ -
Welcome <%= @email %>!
- -You can confirm your account email through the link below:
- -<%= link_to 'Confirm my account', confirmation_url(@resource, confirmation_token: @token) %>
diff --git a/app/views/devise/mailer/password_change.html.erb b/app/views/devise/mailer/password_change.html.erb deleted file mode 100644 index b41daf4..0000000 --- a/app/views/devise/mailer/password_change.html.erb +++ /dev/null @@ -1,3 +0,0 @@ -Hello <%= @resource.email %>!
- -We're contacting you to notify you that your password has been changed.
diff --git a/app/views/devise/mailer/reset_password_instructions.html.erb b/app/views/devise/mailer/reset_password_instructions.html.erb deleted file mode 100644 index f667dc1..0000000 --- a/app/views/devise/mailer/reset_password_instructions.html.erb +++ /dev/null @@ -1,8 +0,0 @@ -Hello <%= @resource.email %>!
- -Someone has requested a link to change your password. You can do this through the link below.
- -<%= link_to 'Change my password', edit_password_url(@resource, reset_password_token: @token) %>
- -If you didn't request this, please ignore this email.
-Your password won't change until you access the link above and create a new one.
diff --git a/app/views/devise/mailer/unlock_instructions.html.erb b/app/views/devise/mailer/unlock_instructions.html.erb deleted file mode 100644 index 41e148b..0000000 --- a/app/views/devise/mailer/unlock_instructions.html.erb +++ /dev/null @@ -1,7 +0,0 @@ -Hello <%= @resource.email %>!
- -Your account has been locked due to an excessive number of unsuccessful sign in attempts.
- -Click the link below to unlock your account:
- -<%= link_to 'Unlock my account', unlock_url(@resource, unlock_token: @token) %>
diff --git a/app/views/devise/passwords/edit.html.erb b/app/views/devise/passwords/edit.html.erb deleted file mode 100644 index 6a796b0..0000000 --- a/app/views/devise/passwords/edit.html.erb +++ /dev/null @@ -1,25 +0,0 @@ -Unhappy? <%= button_to "Cancel my account", registration_path(resource_name), data: { confirm: "Are you sure?" }, method: :delete %>
- -<%= link_to "Back", :back %> diff --git a/app/views/devise/registrations/new.html.erb b/app/views/devise/registrations/new.html.erb deleted file mode 100644 index 5a238ce..0000000 --- a/app/views/devise/registrations/new.html.erb +++ /dev/null @@ -1,29 +0,0 @@ -