diff --git a/app/assets/images/about/neopass-thumbnail.png b/app/assets/images/about/neopass-thumbnail.png new file mode 100644 index 00000000..57d3efcf Binary files /dev/null and b/app/assets/images/about/neopass-thumbnail.png differ diff --git a/app/assets/images/about/neopass-thumbnail@2x.png b/app/assets/images/about/neopass-thumbnail@2x.png new file mode 100644 index 00000000..d4bcfbf4 Binary files /dev/null and b/app/assets/images/about/neopass-thumbnail@2x.png differ diff --git a/app/assets/stylesheets/outfits/_new.sass b/app/assets/stylesheets/outfits/_new.sass index 5418fac8..9dd4bd70 100644 --- a/app/assets/stylesheets/outfits/_new.sass +++ b/app/assets/stylesheets/outfits/_new.sass @@ -1,3 +1,4 @@ +@import "partials/clean/constants" @import "partials/campaign-progress" body.outfits-new @@ -6,6 +7,23 @@ body.outfits-new #pet-not-found display: none + .neopass-announcement + border: 1px solid #7bd5ce + color: #3b6c68 + padding: .5em + display: grid + grid-template-areas: "thumbnail content" + grid-template-columns: auto 1fr + column-gap: .5em + margin-bottom: 1em + + p + font-family: $main-font + margin-bottom: .5em + + p:last-of-type + margin-bottom: 0 + #outfit-forms +clearfix +module diff --git a/app/views/outfits/new.html.haml b/app/views/outfits/new.html.haml index 25073476..791e069d 100644 --- a/app/views/outfits/new.html.haml +++ b/app/views/outfits/new.html.haml @@ -4,6 +4,20 @@ %p#pet-not-found.alert= t 'pets.load.not_found' +%section.neopass-announcement + = image_tag "about/neopass-thumbnail.png", width: 70, height: 70, + srcset: {"about/neopass-thumbnail@2x.png": "2x"}, + class: "neopass-thumbnail" + .neopass-content + %p + %strong + Big news: we're adding NeoPass and other integrations to DTI over the + coming months! + %p + We're hoping it will help new users, and can be part of a more sustainable future for the site. + %br + = link_to "Here's what's coming and why.", about_neopass_path + #outfit-forms - localized_cache :action_suffix => 'outfit_forms_intro' do #pet-preview