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

back to merged layout (more space)

Browse Source
This commit is contained in:
Torsten 2023-01-09 14:44:00 +02:00
parent 81aafe593f
commit cc4aa25e46
18 changed files with 215 additions and 90 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

152
app/assets/stylesheets/merged/merged.css
View File

@ -1390,6 +1390,16 @@ select {
margin-bottom: 0.75rem;
}
.mx-20 {
margin-left: 5rem;
margin-right: 5rem;
}
.my-10 {
margin-top: 2.5rem;
margin-bottom: 2.5rem;
}
.mx-2 {
margin-left: 0.5rem;
margin-right: 0.5rem;
@ -1400,11 +1410,6 @@ select {
margin-right: auto;
}
.mx-20 {
margin-left: 5rem;
margin-right: 5rem;
}
.my-4 {
margin-top: 1rem;
margin-bottom: 1rem;
@ -1455,6 +1460,11 @@ select {
margin-right: 1.5rem;
}
.my-6 {
margin-top: 1.5rem;
margin-bottom: 1.5rem;
}
.mr-3 {
margin-right: 0.75rem;
}
@ -1463,6 +1473,14 @@ select {
margin-left: 5rem;
}
.mt-2 {
margin-top: 0.5rem;
}
.mt-1 {
margin-top: 0.25rem;
}
.mt-4 {
margin-top: 1rem;
}
@ -1479,10 +1497,6 @@ select {
margin-bottom: 1rem;
}
.mt-2 {
margin-top: 0.5rem;
}
.mt-8 {
margin-top: 2rem;
}
@ -1511,10 +1525,6 @@ select {
margin-bottom: 2rem;
}
.mt-1 {
margin-top: 0.25rem;
}
.mr-2 {
margin-right: 0.5rem;
}
@ -1587,6 +1597,10 @@ select {
height: 2.5rem;
}
.h-4 {
height: 1rem;
}
.h-6 {
height: 1.5rem;
}
@ -1639,6 +1653,10 @@ select {
width: 100%;
}
.w-4 {
width: 1rem;
}
.w-6 {
width: 1.5rem;
}
@ -1807,6 +1825,10 @@ select {
flex-wrap: wrap;
}
.items-start {
align-items: flex-start;
}
.items-end {
align-items: flex-end;
}
@ -1839,10 +1861,6 @@ select {
gap: 1.5rem;
}
.gap-10 {
gap: 2.5rem;
}
.gap-2 {
gap: 0.5rem;
}
@ -1851,6 +1869,10 @@ select {
gap: 1rem;
}
.gap-10 {
gap: 2.5rem;
}
.gap-3 {
gap: 0.75rem;
}
@ -1859,6 +1881,10 @@ select {
gap: 3rem;
}
.gap-8 {
gap: 2rem;
}
.space-y-4 > :not([hidden]) ~ :not([hidden]) {
--tw-space-y-reverse: 0;
margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
@ -1900,6 +1926,10 @@ select {
border-radius: 0.25rem;
}
.rounded-xl {
border-radius: 0.75rem;
}
.rounded-md {
border-radius: 0.375rem;
}
@ -1924,6 +1954,10 @@ select {
border-width: 0px;
}
.border-l-4 {
border-left-width: 4px;
}
.border-b {
border-bottom-width: 1px;
}
@ -1941,6 +1975,16 @@ select {
border-color: rgb(156 163 175 / var(--tw-border-opacity));
}
.border-red-500 {
--tw-border-opacity: 1;
border-color: rgb(239 68 68 / var(--tw-border-opacity));
}
.border-gray-100 {
--tw-border-opacity: 1;
border-color: rgb(243 244 246 / var(--tw-border-opacity));
}
.border-gray-200 {
--tw-border-opacity: 1;
border-color: rgb(229 231 235 / var(--tw-border-opacity));
@ -1951,11 +1995,6 @@ select {
border-color: rgb(0 0 0 / var(--tw-border-opacity));
}
.border-gray-100 {
--tw-border-opacity: 1;
border-color: rgb(243 244 246 / var(--tw-border-opacity));
}
.border-gray-300 {
--tw-border-opacity: 1;
border-color: rgb(209 213 219 / var(--tw-border-opacity));
@ -2100,16 +2139,16 @@ select {
background-color: rgb(154 52 18 / 0.25);
}
.bg-cyan-50 {
--tw-bg-opacity: 1;
background-color: rgb(236 254 255 / var(--tw-bg-opacity));
}
.bg-red-50 {
--tw-bg-opacity: 1;
background-color: rgb(254 242 242 / var(--tw-bg-opacity));
}
.bg-cyan-50 {
--tw-bg-opacity: 1;
background-color: rgb(236 254 255 / var(--tw-bg-opacity));
}
.bg-transparent {
background-color: transparent;
}
@ -2172,14 +2211,14 @@ select {
object-fit: cover;
}
.p-2 {
padding: 0.5rem;
}
.p-4 {
padding: 1rem;
}
.p-2 {
padding: 0.5rem;
}
.p-3 {
padding: 0.75rem;
}
@ -2214,6 +2253,11 @@ select {
padding-bottom: 0.75rem;
}
.py-2 {
padding-top: 0.5rem;
padding-bottom: 0.5rem;
}
.px-20 {
padding-left: 5rem;
padding-right: 5rem;
@ -2234,11 +2278,6 @@ select {
padding-bottom: 0.25rem;
}
.py-2 {
padding-top: 0.5rem;
padding-bottom: 0.5rem;
}
.py-8 {
padding-top: 2rem;
padding-bottom: 2rem;
@ -2289,6 +2328,11 @@ select {
padding-bottom: 1rem;
}
.py-6 {
padding-top: 1.5rem;
padding-bottom: 1.5rem;
}
.pr-12 {
padding-right: 3rem;
}
@ -2334,16 +2378,16 @@ select {
line-height: 1.75rem;
}
.text-xl {
font-size: 1.25rem;
line-height: 1.75rem;
}
.text-sm {
font-size: 0.875rem;
line-height: 1.25rem;
}
.text-xl {
font-size: 1.25rem;
line-height: 1.75rem;
}
.text-2xl {
font-size: 1.5rem;
line-height: 2rem;
@ -2454,6 +2498,21 @@ select {
color: rgb(107 114 128 / var(--tw-text-opacity));
}
.text-blue-700 {
--tw-text-opacity: 1;
color: rgb(29 78 216 / var(--tw-text-opacity));
}
.text-red-700 {
--tw-text-opacity: 1;
color: rgb(185 28 28 / var(--tw-text-opacity));
}
.text-green-600 {
--tw-text-opacity: 1;
color: rgb(22 163 74 / var(--tw-text-opacity));
}
.text-gray-900 {
--tw-text-opacity: 1;
color: rgb(17 24 39 / var(--tw-text-opacity));
@ -2478,6 +2537,12 @@ select {
text-decoration-line: underline;
}
.shadow-xl {
--tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
--tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-sm {
--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
@ -2530,6 +2595,11 @@ select {
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.hover\:bg-red-50:hover {
--tw-bg-opacity: 1;
background-color: rgb(254 242 242 / var(--tw-bg-opacity));
}
.hover\:bg-sky-100:hover {
--tw-bg-opacity: 1;
background-color: rgb(224 242 254 / var(--tw-bg-opacity));

2
app/controllers/merged/application_controller.rb
View File

@ -1,4 +1,4 @@
module Merged
class ApplicationController < ApplicationController
class ApplicationController < ActionController::Base
end
end

2
app/controllers/merged/merged_controller.rb
View File

@ -1,5 +1,5 @@
module Merged
class MergedController < ::ApplicationController
class MergedController < ApplicationController
before_action :authenticate_member!
end
end

26
app/views/layouts/merged/_header.haml Normal file
View File

@ -0,0 +1,26 @@
.mx-20.my-6.flex.h-16.items-center.gap-16
%a{:href => "/merged/pages"}
%span.sr-only Home
=image_tag("merged/merged_logo" , class: "h-10")
%ul.flex.items-center.gap-6.text-lg
%li
%a.text-gray-500.transition{:class => "hover:text-gray-500/75", :href => merged.pages_path}
Pages
%li
%a.text-gray-500.transition{:class => "hover:text-gray-500/75", :href => merged.images_path}
Images
%li
%a.text-gray-500.transition{:class => "hover:text-gray-500/75", :href => merged.styles_index_path}
Styles
%li
%a.text-gray-500.transition{:class => "hover:text-gray-500/75", :href => merged.changes_index_path}
Changes
%button.my-3{class: last_change_class}= last_change_text
= form_tag( main_app.destroy_member_session_path , {method: :delete } ) do
%button.flex.w-full.items-center.gap-2.rounded-lg.px-4.py-2.text-sm.text-blue-700.hover:bg-red-50{:role => "menuitem", :type => "submit"}
%svg.h-4.w-4{:fill => "none", :stroke => "currentColor", "stroke-width" => "2", :viewbox => "0 0 24 24", :xmlns => "http://www.w3.org/2000/svg"}
%path{:d => "M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16", "stroke-linecap" => "round", "stroke-linejoin" => "round"}
Sign out

28
app/views/layouts/merged/_messages.haml Normal file
View File

@ -0,0 +1,28 @@
-if flash.alert
#flash
.m-20.rounded.border-l-4.border-red-500.bg-red-50.p-4{:role => "alert"}
%strong.block.font-medium.text-red-700 Oops
%p.mt-2.text-sm.text-red-700
=flash.alert
-if flash.notice
#flash
.m-20.rounded-xl.border.border-gray-100.p-4.shadow-xl{:role => "alert"}
.flex.items-start.gap-4
%span.text-green-600
%svg.h-6.w-6{:fill => "none", :stroke => "currentColor", "stroke-width" => "1.5", :viewbox => "0 0 24 24", :xmlns => "http://www.w3.org/2000/svg"}
%path{:d => "M9 12.75L11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0z", "stroke-linecap" => "round", "stroke-linejoin" => "round"}
.flex-1
%strong.block.font-medium.text-gray-900 Ok
%p.mt-1.text-sm.text-gray-700
= flash.notice
:javascript
function hideNotice() {
const notification = document.querySelector('#flash')
if (notification) {
setInterval(function() {
notification.classList.add('hidden');
}, 5000);
}
}
hideNotice();

18
app/views/layouts/merged/application.haml Normal file
View File

@ -0,0 +1,18 @@
!!!
%html
%head
%meta{:content => "text/html; charset=UTF-8", "http-equiv" => "Content-Type"}/
%title Hubfeenix
%meta{:content => "width=device-width,initial-scale=1", :name => "viewport"}/
= csrf_meta_tags
= csp_meta_tag
= stylesheet_link_tag "merged/merged"
= javascript_importmap_tags
- if false
%script{:src => "https://cdn.tailwindcss.com"}
%body
= render "layouts/merged/header"
= render "layouts/merged/messages"
= yield

9
app/views/merged/cards/index.haml
View File

@ -1,26 +1,23 @@
- content_for( :merged_menu ) do
.mx-20.flex.h-16.items-center.gap-16
= render "merged/sections/sections_pagination" , section: @section
.text-xl.text-gray-900
Cards for Section #{@section.index} -
= link_to @section.header , merged.section_path( @section.id) , class: "underline"
= link_to( "New Card" , merged.new_section_card_path(@section.id) , class: "p-2 border border-gray-200 bg-cyan-100 font-bold rounded-lg hover:bg-sky-100")
= render "layouts/merged_header"
- template = find_template(@section)
= render( template , section: @section)
- @section.cards.each_with_index do |card , index|
.flex.gap-10.px-20.py-10{class: (card.index%2)==1 ? 'bg-cyan-50' : 'bg-red-50' , id: "card_#{card.id}"}
.flex.gap-8.px-20.py-6.mb-2{class: (card.index%2)==1 ? 'bg-cyan-50' : 'bg-red-50' , id: "card_#{card.id}"}
.basis-80
.p-4
%h3.mt-4.text-lg.font-bold Card #{index + 1}:#{card.header}
.flex.flex-wrap
= blue_button( "Up" , merged.card_move_path(card.id , dir: :up) )
= blue_button( "Down" , merged.card_move_path(card.id , dir: :down) )
= form_tag( merged.card_path(card.id) , {method: :delete } ) do
=submit_button( "Delete" , true)
.p-4
.mt-6
= yellow_button("Change Image" , merged.images_path(card_id: card.id) )
.basis-full.mt-3
Updated at:

4
app/views/merged/changes/index.haml
View File

@ -1,12 +1,10 @@
- content_for( :merged_menu ) do
.mx-20.flex.h-16.items-center.gap-16
.text-xl.font-bold.text-gray-900
Changes
.text-xl.text-gray-900
Branch
= @git.current_branch
= render "layouts/merged_header"
.overflow-hidden.overflow-x-auto.rounded-lg.border.border-gray-200.m-20
%table.min-w-full.divide-y.divide-gray-200.text-sm
%thead.bg-gray-100

3
app/views/merged/images/index.haml
View File

@ -1,8 +1,7 @@
- content_for( :merged_menu ) do
.mx-20.flex.h-16.items-center.gap-16
.text-xl.font-bold.text-gray-900
= text_for_index
= render "layouts/merged_header"
- if Rails.env.development?
= javascript_include_tag "merged/vue.js"
-else

4
app/views/merged/images/show.haml
View File

@ -1,4 +1,4 @@
- content_for( :merged_menu ) do
.mx-20.flex.h-16.items-center.gap-16
.text-xl.font-bold.text-gray-900
Image: #{@image.name}
@ -10,8 +10,6 @@
-else
= javascript_include_tag "merged/vue.min.js"
= render "layouts/merged_header"
.flex.m-20
.left.flex.gap-2.mt-3
%p

5
app/views/merged/pages/index.haml
View File

@ -1,11 +1,10 @@
- content_for( :merged_menu ) do
.mx-20.flex.h-16.items-center.gap-16
.text-xl.font-bold.text-gray-900
= link_to( "All" , merged.pages_path(type: '') , class: "p-2 px-4 border border-gray-200 font-bold rounded-lg hover:bg-sky-100 #{params[:type].blank? ? 'bg-blue-200':''}")
- @page_styles.each do |style|
= link_to( "Only #{style.type.capitalize}s" , merged.pages_path(type: style.type) , class: "p-2 px-4 border border-gray-200 font-bold rounded-lg hover:bg-sky-100 #{(params[:type] == style.type) ? 'bg-blue-200':''}")
= render "layouts/merged_header"
.overflow-hidden.overflow-x-auto.rounded-lg.border.border-gray-200.m-20
.overflow-hidden.overflow-x-auto.rounded-lg.border.border-gray-200.mx-20.my-10
%table.min-w-full.divide-y.divide-gray-200.text-sm
%thead.bg-gray-100
%tr

3
app/views/merged/pages/show.haml
View File

@ -1,4 +1,4 @@
- content_for( :merged_menu ) do
.mx-20.flex.h-16.items-center.gap-16
.text-xl.font-bold.text-gray-900
= @page.type.capitalize
.text-xl.font-bold.text-gray-900
@ -7,7 +7,6 @@
= link_to 'Sections', merged.page_sections_path(@page.id)
.text-xl= distance_of_time_in_words_to_now(@page.updated_at)
= render "layouts/merged_header"
.flex.gap-4.justify-center.m-20
.flex.flex-col

8
app/views/merged/sections/index.haml
View File

@ -1,4 +1,4 @@
- content_for( :merged_menu ) do
.mx-20.flex.h-16.items-center.gap-16.mb-10
.text-xl.font-bold.text-gray-900
= @page.type.capitalize
= link_to @page.name , merged.page_path(@page)
@ -6,11 +6,9 @@
=link_to "View live" , "/#{@page.name}" , target: @page.name
= link_to( "New Section" , merged.new_page_section_path(@page.id) , class: "p-2 border border-gray-200 bg-cyan-100 font-bold rounded-lg hover:bg-sky-100")
= render "layouts/merged_header"
-@page.sections.each do |section |
.flex.gap-10.p-4{class: (section.index%2)==1 ? 'bg-cyan-50' : 'bg-red-50' , id: "section_#{section.id}"}
.basis-72
.flex.gap-10.mt-2{class: (section.index%2)==1 ? 'bg-cyan-50' : 'bg-red-50' , id: "section_#{section.id}"}
.basis-72.mx-20
%h3.mt-4.text-lg.font-bold Section #{section.index} : #{section.header}
.flex.flex-wrap
= yellow_button("Edit" , merged.section_path(section.id) )

2
app/views/merged/sections/new.haml
View File

@ -1,4 +1,4 @@
- content_for( :merged_menu ) do
.mx-20.flex.h-16.items-center.gap-16
.text-xl.font-bold.text-gray-900
Changes
.text-xl.text-gray-900

2
app/views/merged/sections/select_card_template.haml
View File

@ -1,4 +1,4 @@
- content_for( :merged_menu ) do
.mx-20.flex.h-16.items-center.gap-16
.text-xl.font-bold.text-gray-900
Page #{link_to @section.page.name, merged.page_sections_path(@section.page.id), class: "underline"}
.text-xl.text-gray-900

6
app/views/merged/sections/select_template.haml
View File

@ -1,12 +1,10 @@
- content_for( :merged_menu ) do
.mx-20.flex.h-16.items-center.gap-16
.text-xl.font-bold.text-gray-900
Page #{link_to @section.page.name, merged.page_sections_path(@section.page.id), class: "underline"}
.text-xl.text-gray-900
Select Style for Section #{@section.index} - #{@section.header}
= render "layouts/merged_header"
.grid.grid-cols-4.gap-6.m-8
.grid.grid-cols-4.gap-6.my-10.mx-20
- @sections.each do |style|
.border.border-gray-300.rounded-lg.p-2
= link_to( merged.section_set_template_path( template: style.template )) do

13
app/views/merged/sections/show.haml
View File

@ -1,13 +1,11 @@
- content_for( :merged_menu ) do
.mx-20.flex.h-16.items-center.gap-16
= render "sections_pagination" , section: @section
= render "layouts/merged_header"
- template = find_template(@section)
= render( template , section: @section)
.flex.gap-4.m-8.flex-wrap
.basis-96
.flex.gap-8.my-10.flex-wrap
.basis-80.ml-20
%h3.mt-4.text-lg.font-bold= @section.template_style.header
= section_preview(@section , class: "w-full object-contain my-4")
= yellow_button( "Change Style" , merged.section_select_template_path(@section.id))
@ -19,7 +17,7 @@
Updated by:
= @section.updated_by
.basis-96.image
.basis-80.image
= link_to(merged.images_path(section_id: @section.id)) do
-if @section.image
%h3.mt-4.text-lg.font-bold Image #{@section.image.name}
@ -62,10 +60,11 @@
= yellow_button( "View and Edit Cards" , merged.section_cards_path(@section.id))
= green_button( "New Card" , merged.new_section_card_path(@section.id) )
.basis-80.grow
.basis-80.grow.mr-20
%h3.mt-4.text-lg.font-bold Options
= section_form( class: "mx-auto mt-8 mb-0 max-w space-y-4") do
- @section.option_definitions.each do |option|
.grid.grid-cols-3
=render "option_form_#{option.type}" , section: @section , option: option
-if @section.option_definitions.empty?
%p No options

4
app/views/merged/styles/index.haml
View File

@ -1,4 +1,4 @@
- content_for( :merged_menu ) do
.mx-20.flex.h-16.items-center.gap-16
.text-xl.font-bold
Page styles
.text-xl.font-bold
@ -6,8 +6,6 @@
.text-xl.font-bold
=link_to "Card styles" , "#cards_styles"
= render "layouts/merged_header"
.flex.bg-cyan-100
.px-4.py-8.mx-auto.text-center
%h1.text-4xl.font-bold