docbrown/app/views/articles/_v2_form.html.erb
2022-01-14 09:33:44 +07:00

109 lines
4.1 KiB
Text

<style>
body {
padding-top: 0 !important;
}
/* This weirdness below has a reason: https://github.com/forem/forem/pull/11701#issuecomment-737319289 */
.crayons-header,
.crayons-header * {
visibility: hidden;
position: absolute;
left: -9999em;
top: -9999em;
pointer-events: none;
opacity: 0;
overflow: hidden;
clip: rect(0, 0, 0, 0);
}
.crayons-header .site-logo,
.crayons-header .site-logo * {
visibility: visible;
position: static;
pointer-events: auto;
opacity: 1;
clip: auto;
overflow: visible;
}
.crayons-footer {
display: none;
}
.wrapper {
overflow: unset;
}
</style>
<main id="main-content"
data-article="<%= article.to_json(only: %i[id title cached_tag_list published body_markdown main_image organization_id canonical_url updated_at], methods: %i[series all_series]) %>"
data-organizations="<%= organizations&.to_json(only: %i[id name bg_color_hex text_color_hex], methods: [:profile_image_90]) %>"
data-version="<%= version %>"
data-site-logo='<%= render "layouts/logo" %>'>
<form class="crayons-article-form crayons-article-form--<%= version %>">
<div class="crayons-article-form__header">
<span class="crayons-article-form__logo">
<%= render "layouts/logo" %>
</span>
<div class="crayons-field__label">
<span class="hidden s:inline-block mr-2"><%= t("views.editor.create") %></span>
<% if organizations && organizations.size > 0 %>
<select name="article[organization_id]" id="article_publish_under_org" class="crayons-select w-auto mt-0">
<%= options_for_select({ "Personal" => "" }.merge(organizations.pluck(:name, :id).to_h), article.organization_id || "") %>
</select>
<% end %>
</div>
<nav class="crayons-article-form__tabs crayons-tabs ml-auto" aria-label="<%= t("views.editor.modes") %>">
<ul class="crayons-tabs__list">
<li>
<button data-text="Edit" class="crayons-tabs__item crayons-tabs__item--current" type="button" aria-current="page"><%= t("views.editor.edit") %></button>
</li>
<li>
<button data-text="Preview" class="crayons-tabs__item " type="button"><%= t("views.editor.preview") %></button>
</li>
</ul>
</nav>
<div class="crayons-article-form__close">
<a href="/" class="crayons-btn crayons-btn--ghost-dimmed crayons-btn--icon" title="<%= t("views.editor.close.title") %>">
<%= crayons_icon_tag(:x, title: t("views.editor.close.icon")) %>
</a>
</div>
</div>
<div class="crayons-card crayons-article-form__content">
<% if version == "v2" %>
<div class="text-padding">
<div class="crayons-article-form__cover" role="presentation">
<% if article.main_image.present? %>
<img src="<%= article.main_image %>" width="250" height="105" alt="Post cover" class="crayons-article-form__cover__image">
<% end %>
<button class="crayons-btn crayons-btn--outlined mr-2">
<label for="cover-image-input">
<% if article.main_image.present? %><%= t("views.editor.cover_image.change") %><% else %><%= t("views.editor.cover_image.add") %><% end %>
</label>
<input id="cover-image-input" type="file" accept="image/*" class="w-100 h-100 absolute left-0 right-0 top-0 bottom-0 overflow-hidden opacity-0 cursor-pointer" data-max-file-size-mb="25">
</button>
</div>
<div class="crayons-article-form__title">
<textarea class="crayons-textfield crayons-textfield--ghost fs-3xl m:fs-4xl l:fs-5xl fw-bold s:fw-heavy lh-tight" type="text" id="article-form-title" placeholder="<%= t("views.editor.new_title") %>" autocomplete="off"><%= article.title %></textarea>
</div>
</div>
<% end %>
</div>
</form>
</main>
<div class="hidden">
<%= render "pages/editor_markdown_help" %>
<%= render "pages/editor_liquid_help" %>
<%= render "pages/editor_frontmatter_help" %>
</div>
<script>
<%== RunkitTag.script %>
</script>