8060f78893
* Added alias for app/javascript/controllers * Added hooks for Stimulus controller. * Fixed eslint issue with @controllers alias. * Initial working logo preview. * Added explicit accept values for png and svg files only for a logo. * Fixed content layout shift issue and resize to max height 80px. * Cleaned up logo preview resizing. * Added focus style to Upload logo label. * Now the logo preview image has empty alt text as it's visual only. * Fixed position of upload logo button. * Removed tooltip for logo. * Fixed check to load client-side controller. * Put back tooltip, minus the aria-describedby * Fixed E2E tests I broke. * Made the logo preview visible to the accessibility tree. * feat: update the brand colors on the page when we select a new one * feat: update the radio button_tags to use crayons-radio * feat: remove the fill attributes in the svg * Added support for JPG image upload. * Fixed height adjustment when width exceeds max preview width. * feat: add form-background class with an accent * feat: update the briightness accent on the page * Fixed JS error if user cancelled file selection for a logo. * Added the @routes webpack alias for routes.js.erb. * Fixed data tooltip for assistive technologies. * Fixed preview logo alignment with upload logo button. * remove required as it's not doing anything * feat: update the code brigtness code * Opting to not show friendly error message if route fails to load. * Fixed validation message not appearing for logo. * Revert "Added the @routes webpack alias for routes.js.erb." This reverts commit 3b6621dcde541f2fa05df6ff75af38955842b88e. * Reverted to default styling of input[type="file"]. * Moved creator_settings_controller to admin/controllers. * Updated E2E test for logo preview on the creator settings page. * create tests for the brand color updates * feat: update the description * Update cypress/integration/creatorOnboardingFlows/creatorSettings.spec.js Co-authored-by: Nick Taylor <nick@iamdeveloper.com> * Update app/javascript/admin/controllers/creator_settings_controller.js Co-authored-by: Suzanne Aitchison <suzanne@forem.com> * feat: do not update branding if an invalid color is provided * feat: move the brightness code to its own accent calculator file in js utilities * test: brightness ratios * chore: remove whitespace Co-authored-by: Nick Taylor <nick@dev.to> Co-authored-by: Nick Taylor <nick@iamdeveloper.com> Co-authored-by: Suzanne Aitchison <suzanne@forem.com>
104 lines
5.6 KiB
Text
104 lines
5.6 KiB
Text
<% title t("views.listings.edit.heading") %>
|
|
|
|
<header class="crayons-layout crayons-layout--limited-l flex items-center justify-between p-2 l:p-4 l:pb-0">
|
|
<h1 class="crayons-title"><%= t("views.listings.edit.heading") %></h1>
|
|
</header>
|
|
|
|
<main class="crayons-layout crayons-layout--2-cols crayons-layout--2-cols--inverted crayons-layout--limited-l">
|
|
<div class="crayons-layout__content">
|
|
<div class="crayons-card mb-6 p-6">
|
|
<%= form_for(@listing, html: { class: "grid gap-6 mb-6" }) do |f| %>
|
|
<div class="crayons-notice" aria-live="polite"><%= t("views.listings.edit.notice") %></div>
|
|
|
|
<%= render partial: "form_errors", locals: { listing: @listing } %>
|
|
|
|
<% if (@listing.bumped_at && @listing.bumped_at > 24.hours.ago) || @listing.updated_at && !@listing.published %>
|
|
<div class="crayons-field">
|
|
<%= f.label "title", class: "crayons-field__label" %>
|
|
<%= f.text_field "title", maxlength: 128, placeholder: t("views.listings.form.title.placeholder"), class: "crayons-textfield" %>
|
|
</div>
|
|
<div class="crayons-field">
|
|
<%= f.label "body_markdown", class: "crayons-field__label" %>
|
|
<%= f.text_area "body_markdown", maxlength: 400, placeholder: t("views.listings.form.body_markdown.placeholder"), class: "crayons-textfield" %>
|
|
<p class="crayons-field__description"><%= t("views.listings.form.body_markdown.description") %></p>
|
|
</div>
|
|
<div class="crayons-field">
|
|
<%= f.label "tag_list", class: "crayons-field__label" %>
|
|
<%= f.text_field "tag_list", value: @listing.cached_tag_list, placeholder: t("views.listings.form.tags.placeholder"), class: "crayons-textfield" %>
|
|
</div>
|
|
<div class="crayons-field">
|
|
<%= f.label "expires_at", "Custom Expire Date", class: "crayons-field__label" %>
|
|
<%= f.date_field "expires_at", min: Date.tomorrow, max: @listing.natural_expiration_date, class: "crayons-textfield m:max-w-50" %>
|
|
<p class="crayons-field__description">
|
|
<%= t("views.listings.form.expiry.description") %>
|
|
</p>
|
|
</div>
|
|
<div class="crayons-field">
|
|
<%= f.label "location", class: "crayons-field__label" %>
|
|
<%= f.text_field "location", maxlength: 32, placeholder: t("views.listings.form.location.placeholder"), class: "crayons-textfield m:max-w-50" %>
|
|
<p class="crayons-field__description"><%= t("views.listings.form.location.description") %></p>
|
|
</div>
|
|
<div>
|
|
<% if @listing.published %>
|
|
<%= f.submit t("views.listings.edit.update"), class: "crayons-btn" %>
|
|
<% else %>
|
|
<%= f.submit t("views.listings.edit.update_draft"), class: "crayons-btn crayons-btn--secondary" %>
|
|
<% end %>
|
|
</div>
|
|
<% end %>
|
|
<% end %>
|
|
|
|
<%= form_for(@listing, html: { class: "pt-6 mt-6 border-t-1 border-solid border-0 border-base-20 flex items-center" }) do |f| %>
|
|
<% if @listing.published == false %>
|
|
<input type="hidden" name="listing[action]" value="publish" />
|
|
<%= f.submit t("views.listings.edit.publish"), class: "crayons-btn mr-4" %>
|
|
<p><%= t("views.listings.edit.not_published.text_html", not: tag.strong(t("views.listings.edit.not_published.not"), class: "color-accent-danger")) %></p>
|
|
<% else %>
|
|
<input type="hidden" name="listing[action]" value="unpublish" />
|
|
<%= f.submit t("views.listings.edit.unpublish"), class: "crayons-btn crayons-btn--danger" %>
|
|
<% end %>
|
|
<% end %>
|
|
</div>
|
|
|
|
<% if @listing.bumped_at %>
|
|
<%= form_for(@listing, html: { class: "crayons-card grid gap-6 p-6 mb-6" }) do |f| %>
|
|
<header>
|
|
<h2 class="mb-2"><%= t("views.listings.edit.bump.subtitle") %></h2>
|
|
<p><%= t("views.listings.edit.bump.description") %></p>
|
|
</header>
|
|
<div class="flex items-center">
|
|
<%= f.submit t("views.listings.edit.bump.button"), class: "crayons-btn crayons-btn--secondary mr-4" %>
|
|
<p class="color-base-70"><%= t("views.listings.edit.bump.last", date: time_ago_in_words(@listing.bumped_at, scope: :"datetime.distance_in_words_ago")) %></p>
|
|
</div>
|
|
<input type="hidden" name="listing[action]" value="bump" />
|
|
<% end %>
|
|
<% end %>
|
|
</div>
|
|
|
|
<aside class="crayons-layout__sidebar-right px-3 m:px-0">
|
|
<% unless @listing.published %>
|
|
<%= form_for(@listing, html: { class: "crayons-card crayons-card--secondary p-3 m:p-4 mb-2 m:mb-4" }) do |f| %>
|
|
<p class="pb-4">
|
|
<%= t("views.listings.edit.not_published.aside_html", not: tag.strong(t("views.listings.edit.not_published.not"), class: "color-accent-danger")) %>
|
|
</p>
|
|
<input type="hidden" name="listing[action]" value="publish" />
|
|
<%= f.submit t("views.listings.edit.publish"), class: "crayons-btn w-100" %>
|
|
<% end %>
|
|
<% end %>
|
|
|
|
<div class="crayons-card crayons-card--secondary p-3 m:p-4 mb-2 m:mb-4">
|
|
<p>
|
|
<% if (@listing.natural_expiration_date) < Date.today %>
|
|
<%= time_ago_in_words @listing.natural_expiration_date, scope: :"datetime.expired_ago" %>
|
|
<% else %>
|
|
<%= time_ago_in_words @listing.natural_expiration_date, scope: :"datetime.expires_in" %>
|
|
<% end %>
|
|
</p>
|
|
<% if @listing.bumped_at %>
|
|
<p class="pt-3 mt-3 border-t-1 border-solid border-0 border-base-10">
|
|
<%= t("views.listings.edit.bump.last", date: time_ago_in_words(@listing.bumped_at, scope: :"datetime.distance_in_words_ago")) %>
|
|
</p>
|
|
<% end %>
|
|
</div>
|
|
</aside>
|
|
</main>
|