FeenixMakers/residency
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

story editor polish

Browse Source
This commit is contained in:
Torsten
2023-01-22 20:29:10 +02:00
parent 0ac1c341df
commit f6bac88800
8 changed files with 40 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
app/views/members/_form.html.haml
View File

@ -11,9 +11,6 @@
.field
= f.label :name
= f.text_field :name
.field
= f.label :public
= f.check_box :public
.field
= f.label :picture
= f.file_field :picture

57
app/views/members/edit.html.haml
View File

@ -3,42 +3,27 @@
.flex.justify-center.m-20
.flex.flex-col
%h1.text-4xl Editing profile
%h1.text-4xl Edit your profile
= simple_form_for @member do |f|
= f.error_notification
.grid.grid-cols-4.mx-20
.info.mr-8
= f.input :name
.grid.grid-cols-2.gap-10
= f.input :arrived
= f.input :left
= f.input :public , label: "Public: (Click box below)"
= f.input :picture , as: :file , label: (@member.picture.blank? ? "Add picture" : "Change picture")
.flex.justify-center.actions.m-10
= f.button :button, "Update", class: button_classes + " bg-cyan-200"
= link_to member_path(@member) do
%button.ml-10{type: :submit, class: button_classes}
Back
.field.flex.flex-col.pr-2.border-r-8.border-slate-600
= f.text_area :bio ,rows: 18 , "v-model" => "markdown" , class: "appearance-none block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm placeholder-gray-400 focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm"
%div.h-90
-if @member.picture_url
%div.overflow-hidden.ml-2.mr-8
= image_tag @member.picture_url, class: "object-contain w-full"
-else
No Picture
.preview.prose
%b.text-2xl Preview
%div{"v-html" => "compiledMarkdown"}
:ruby2js
class Mark < Vue
options el: '.grid'
def initialize
@markdown = "#{@member.bio.to_s.html_safe}"
end
def compiledMarkdown
marked.parse(@markdown)
end
end
.flex.justify-center
.column{class: "w-11/12 md:w-10/12 lg:w-8/12 xl:w-6/12"}
.grid.grid-cols-1.md:grid-cols-2.mx-20.gap-10
= render "merged/form/editor" , object: @member , field: :bio, form: f
.info.mr-8
.text-red-700= f.error_notification
= f.input :name
.grid.grid-cols-2.gap-10
= f.input :arrived
= f.input :left
.flex.h-16.mt-2
= image_tag(@member.picture_url , class: "align-middle mr-2") if @member.picture?
= f.input :picture , as: :file , input_html: {wrapper_class: "w-full"},
label: (@member.picture.blank? ? "Add picture" : "Change picture")
= f.hidden_field :picture_cache
.flex.justify-center.actions.m-10
= f.button :button, "Update", class: button_classes + " bg-cyan-200"
= link_to member_path(@member) do
%button.ml-10{type: :submit, class: button_classes}
Back

11
app/views/stories/_form.haml
View File

@ -1,17 +1,20 @@
%div
Story layout changes with the amount of text.
For short lext a wide picture is best. Otherwise square, and for
For short text a wide picture is best. Otherwise square, and for
longer text a high picture also works.
= simple_form_for @story do |f|
= f.error_notification
= f.input :picture , as: :file , label: (@story.picture.blank? ? "Add picture" : "Change picture")
.flex.h-16.mt-2
= image_tag(@story.picture_url , class: "align-middle mr-2") if @story.picture?
= f.input :picture , as: :file , input_html: {wrapper_class: "w-full"},
label: (@story.picture.blank? ? "Add picture" : "Change picture")
= f.hidden_field :picture_cache
= f.input :header
= render "merged/form/editor" , object: @story , field: :text, form: f
= f.input :happened , wrapper_class: "flex mt-4 align-center"
.flex.justify-between.mt-6
%button.bg-cyan-200.rounded-lg.px-4.py-3.text-md.font-medium.border.border-gray-400
= f.submit 'Save'
= link_to @story do
= link_to member_path(current_member) do
%button.ml-20.rounded-lg.px-4.py-3.text-md.font-medium.border.border-gray-400
Back