style overview, sections only for now

This commit is contained in:
Torsten 2022-11-29 15:57:10 +02:00
parent 4136eaf282
commit 15ef3c34fd
12 changed files with 105 additions and 6 deletions

View File

@ -2,6 +2,7 @@ PATH
remote: .
specs:
merged (0.1.0)
haml-rails
rails (>= 7.0.4)
GEM

View File

@ -8,7 +8,7 @@ module Merged
def create
new_image = Image.create_new(params['filename'] , params['image_file'])
redirect = :merged_images
redirect = :images
if(params[:redirect])
redirect = params[:redirect].gsub("NEW" ,new_image.name)
puts "image redirect #{redirect}"

View File

@ -0,0 +1,9 @@
module Merged
class StylesController < MergedController
def index
@styles = Style.all
end
end
end

View File

@ -0,0 +1,4 @@
module Merged
module StylesHelper
end
end

View File

@ -48,7 +48,7 @@ module Merged
end
def save
file_name = Rails.root.join(@root , name + ".yaml")
file_name = Rails.root.join(@@root , name + ".yaml")
File.write( file_name , @content.to_yaml)
end

View File

@ -0,0 +1,35 @@
module Merged
class Style
include ActiveModel::API
attr_reader :content
def initialize content
@content = content
end
def template
@content["template"]
end
def header
@content["header"]
end
def text
@content["text"]
end
def cards
@content["cards"] == true
end
def preview
"merged/section_preview/" + template
end
def self.all
# should account for app styles. now just loading engines
@@styles = YAML.load_file(Engine.root.join("config/styles.yaml"))
@@styles.collect{ |content| Style.new(content) }
end
end
end

View File

@ -29,7 +29,7 @@
%a.text-gray-500.transition{:class => "hover:text-gray-500/75", :href => images_path}
Images
%li
%a.text-gray-500.transition{:class => "hover:text-gray-500/75", :href => "/merged/styles"}
%a.text-gray-500.transition{:class => "hover:text-gray-500/75", :href => styles_index_path}
Styles
%li
%a.text-gray-500.transition{:class => "hover:text-gray-500/75", :href => "/changes"}

View File

@ -11,7 +11,7 @@
.p-4
%h3.mt-4.text-lg.font-bold Section #{index + 1}
%button.mt-4.rounded-lg.bg-yellow-500.p-4
=link_to "Up" , "/index"
=link_to( "Up" , "/index")
%button.mt-4.rounded-lg.bg-yellow-500.p-4
=link_to "Down" , "/index"
%button.mt-4.rounded-lg.bg-blue-400.p-4

View File

@ -1,5 +1,6 @@
.relative.block.border.border-gray-100
%h3.mt-4.text-lg.font-bold= key.upcase
%p= value
%h3.mt-4.text-lg.font-bold= key.upcase + " : " + value
%button.ml-3.inline-block.rounded-lg.bg-blue-500.px-5.py-3.text-md.font-medium.text-white
=link_to "Change Template" , page_section_select_template_url(@page.name,@section.id)
.relative.block.border.border-gray-100
=image_tag("merged/section_preview/#{section.template}" , class: "w-full object-contain")

View File

@ -0,0 +1,25 @@
.grid.grid-cols-3.gap-4.m-8
-@styles.each do |style|
%article.overflow-hidden.rounded-lg.border.border-gray-100.shadow-sm
=image_tag(style.preview , class: "h-56 w-full object-contain lg:h-72")
%p.mt-2.text-sm.text-gray-500
=style.template
%article.overflow-hidden.rounded-lg.border.border-gray-100.shadow-sm
.p-6
%h3.text-lg.font-medium.text-gray-900
=style.header
%p.mt-2.text-sm.leading-relaxed.text-gray-500.line-clamp-3
= style.text
%article.overflow-hidden.rounded-lg.border.border-gray-100.shadow-sm
.p-6
%h3.text-lg.font-medium.text-gray-900
Option
%p.mt-2.text-sm.leading-relaxed.text-gray-500.line-clamp-3
Following options: none (wip)
%h3.text-lg.font-medium.text-gray-900
Cards
%p.mt-2.text-sm.leading-relaxed.text-gray-500.line-clamp-3
-if(style.cards)
Section may include cards. See card styles below
-else
Section may not include cards

View File

@ -1,9 +1,12 @@
Merged::Engine.routes.draw do
get "/styles/index" , to: "styles#index"
resources :pages do
resources :sections do
get :select_image
get :set_image
get :select_template
get :set_template
end
end
resources :images

21
config/styles.yaml Normal file
View File

@ -0,0 +1,21 @@
- template: section_2_col
header: Two column layout with header
text: A header with text and two column layout. Columns have a little gap, so
background color comes through.
cards: true
- template: section_full_up
header: Centered Header with text
text: Full width header with centered headline and optional text
- template: section_half_right
header: Split section image right
text: Image right, header and text on the left. Optional button.
- template: section_full_left2
header: Full image header, text left
text: Large picture background with Header and text towards the left.
Text is slightly shaded for readability
- template: section_half_left
header: Split section image left
text: Image left, header and text on the right. Optional button.
- template: section_spacer
header: Spacer
text: Just for extra padding