hoist option values out of helper to merged module as config
This commit is contained in:
parent
3a15e58ee3
commit
ad578d9c3d
@ -1744,6 +1744,10 @@ select {
|
||||
min-width: 100%;
|
||||
}
|
||||
|
||||
.max-w-none {
|
||||
max-width: none;
|
||||
}
|
||||
|
||||
.max-w-\[1920px\] {
|
||||
max-width: 1920px;
|
||||
}
|
||||
@ -1849,6 +1853,10 @@ 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));
|
||||
}
|
||||
|
||||
.resize {
|
||||
resize: both;
|
||||
}
|
||||
|
||||
.appearance-none {
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
@ -2262,21 +2270,6 @@ select {
|
||||
background-color: rgb(229 231 235 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.bg-slate-50 {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(248 250 252 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.bg-zinc-50 {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(250 250 250 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.bg-yellow-50 {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(254 252 232 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.bg-cover {
|
||||
background-size: cover;
|
||||
}
|
||||
@ -2668,14 +2661,6 @@ select {
|
||||
text-decoration-line: underline;
|
||||
}
|
||||
|
||||
.opacity-10 {
|
||||
opacity: 0.1;
|
||||
}
|
||||
|
||||
.opacity-90 {
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
.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);
|
||||
@ -2854,6 +2839,10 @@ select {
|
||||
color: rgb(37 99 235 / var(--tw-text-opacity));
|
||||
}
|
||||
|
||||
.prose-headings\:text-inherit :is(:where(h1, h2, h3, h4, h5, h6, th):not(:where([class~="not-prose"] *))) {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.peer:focus ~ .peer-focus\:dark\:text-blue-500 {
|
||||
--tw-text-opacity: 1;
|
||||
@ -2912,6 +2901,10 @@ select {
|
||||
margin: 2rem;
|
||||
}
|
||||
|
||||
.md\:m-4 {
|
||||
margin: 1rem;
|
||||
}
|
||||
|
||||
.md\:my-10 {
|
||||
margin-top: 2.5rem;
|
||||
margin-bottom: 2.5rem;
|
||||
@ -2959,6 +2952,220 @@ select {
|
||||
gap: 2rem;
|
||||
}
|
||||
|
||||
.md\:prose-lg {
|
||||
font-size: 1.125rem;
|
||||
line-height: 1.7777778;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(p):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 1.3333333em;
|
||||
margin-bottom: 1.3333333em;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where([class~="lead"]):not(:where([class~="not-prose"] *)) {
|
||||
font-size: 1.2222222em;
|
||||
line-height: 1.4545455;
|
||||
margin-top: 1.0909091em;
|
||||
margin-bottom: 1.0909091em;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(blockquote):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 1.6666667em;
|
||||
margin-bottom: 1.6666667em;
|
||||
padding-left: 1em;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(h1):not(:where([class~="not-prose"] *)) {
|
||||
font-size: 2.6666667em;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0.8333333em;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(h2):not(:where([class~="not-prose"] *)) {
|
||||
font-size: 1.6666667em;
|
||||
margin-top: 1.8666667em;
|
||||
margin-bottom: 1.0666667em;
|
||||
line-height: 1.3333333;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(h3):not(:where([class~="not-prose"] *)) {
|
||||
font-size: 1.3333333em;
|
||||
margin-top: 1.6666667em;
|
||||
margin-bottom: 0.6666667em;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(h4):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 1.7777778em;
|
||||
margin-bottom: 0.4444444em;
|
||||
line-height: 1.5555556;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(img):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 1.7777778em;
|
||||
margin-bottom: 1.7777778em;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(video):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 1.7777778em;
|
||||
margin-bottom: 1.7777778em;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(figure):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 1.7777778em;
|
||||
margin-bottom: 1.7777778em;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(figure > *):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(figcaption):not(:where([class~="not-prose"] *)) {
|
||||
font-size: 0.8888889em;
|
||||
line-height: 1.5;
|
||||
margin-top: 1em;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(code):not(:where([class~="not-prose"] *)) {
|
||||
font-size: 0.8888889em;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(h2 code):not(:where([class~="not-prose"] *)) {
|
||||
font-size: 0.8666667em;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(h3 code):not(:where([class~="not-prose"] *)) {
|
||||
font-size: 0.875em;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(pre):not(:where([class~="not-prose"] *)) {
|
||||
font-size: 0.8888889em;
|
||||
line-height: 1.75;
|
||||
margin-top: 2em;
|
||||
margin-bottom: 2em;
|
||||
border-radius: 0.375rem;
|
||||
padding-top: 1em;
|
||||
padding-right: 1.5em;
|
||||
padding-bottom: 1em;
|
||||
padding-left: 1.5em;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(ol):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 1.3333333em;
|
||||
margin-bottom: 1.3333333em;
|
||||
padding-left: 1.5555556em;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(ul):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 1.3333333em;
|
||||
margin-bottom: 1.3333333em;
|
||||
padding-left: 1.5555556em;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(li):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 0.6666667em;
|
||||
margin-bottom: 0.6666667em;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(ol > li):not(:where([class~="not-prose"] *)) {
|
||||
padding-left: 0.4444444em;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(ul > li):not(:where([class~="not-prose"] *)) {
|
||||
padding-left: 0.4444444em;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(.prose > ul > li p):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 0.8888889em;
|
||||
margin-bottom: 0.8888889em;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(.prose > ul > li > *:first-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 1.3333333em;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(.prose > ul > li > *:last-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-bottom: 1.3333333em;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(.prose > ol > li > *:first-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 1.3333333em;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(.prose > ol > li > *:last-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-bottom: 1.3333333em;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 0.8888889em;
|
||||
margin-bottom: 0.8888889em;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(hr):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 3.1111111em;
|
||||
margin-bottom: 3.1111111em;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(hr + *):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(h2 + *):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(h3 + *):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(h4 + *):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(table):not(:where([class~="not-prose"] *)) {
|
||||
font-size: 0.8888889em;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(thead th):not(:where([class~="not-prose"] *)) {
|
||||
padding-right: 0.75em;
|
||||
padding-bottom: 0.75em;
|
||||
padding-left: 0.75em;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(thead th:first-child):not(:where([class~="not-prose"] *)) {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(thead th:last-child):not(:where([class~="not-prose"] *)) {
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(tbody td, tfoot td):not(:where([class~="not-prose"] *)) {
|
||||
padding-top: 0.75em;
|
||||
padding-right: 0.75em;
|
||||
padding-bottom: 0.75em;
|
||||
padding-left: 0.75em;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(tbody td:first-child, tfoot td:first-child):not(:where([class~="not-prose"] *)) {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(tbody td:last-child, tfoot td:last-child):not(:where([class~="not-prose"] *)) {
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(.prose > :first-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.md\:prose-lg :where(.prose > :last-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.md\:p-12 {
|
||||
padding: 3rem;
|
||||
}
|
||||
@ -3075,6 +3282,197 @@ select {
|
||||
gap: 3rem;
|
||||
}
|
||||
|
||||
.lg\:prose-xl {
|
||||
font-size: 1.25rem;
|
||||
line-height: 1.8;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(p):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 1.2em;
|
||||
margin-bottom: 1.2em;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where([class~="lead"]):not(:where([class~="not-prose"] *)) {
|
||||
font-size: 1.2em;
|
||||
line-height: 1.5;
|
||||
margin-top: 1em;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(blockquote):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 1.6em;
|
||||
margin-bottom: 1.6em;
|
||||
padding-left: 1.0666667em;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(h1):not(:where([class~="not-prose"] *)) {
|
||||
font-size: 2.8em;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0.8571429em;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(h2):not(:where([class~="not-prose"] *)) {
|
||||
font-size: 1.8em;
|
||||
margin-top: 1.5555556em;
|
||||
margin-bottom: 0.8888889em;
|
||||
line-height: 1.1111111;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(h3):not(:where([class~="not-prose"] *)) {
|
||||
font-size: 1.5em;
|
||||
margin-top: 1.6em;
|
||||
margin-bottom: 0.6666667em;
|
||||
line-height: 1.3333333;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(h4):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 1.8em;
|
||||
margin-bottom: 0.6em;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(img):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 2em;
|
||||
margin-bottom: 2em;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(video):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 2em;
|
||||
margin-bottom: 2em;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(figure):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 2em;
|
||||
margin-bottom: 2em;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(figure > *):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(figcaption):not(:where([class~="not-prose"] *)) {
|
||||
font-size: 0.9em;
|
||||
line-height: 1.5555556;
|
||||
margin-top: 1em;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(code):not(:where([class~="not-prose"] *)) {
|
||||
font-size: 0.9em;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(h2 code):not(:where([class~="not-prose"] *)) {
|
||||
font-size: 0.8611111em;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(h3 code):not(:where([class~="not-prose"] *)) {
|
||||
font-size: 0.9em;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(pre):not(:where([class~="not-prose"] *)) {
|
||||
font-size: 0.9em;
|
||||
line-height: 1.7777778;
|
||||
margin-top: 2em;
|
||||
margin-bottom: 2em;
|
||||
border-radius: 0.5rem;
|
||||
padding-top: 1.1111111em;
|
||||
padding-right: 1.3333333em;
|
||||
padding-bottom: 1.1111111em;
|
||||
padding-left: 1.3333333em;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(ol):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 1.2em;
|
||||
margin-bottom: 1.2em;
|
||||
padding-left: 1.6em;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(ul):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 1.2em;
|
||||
margin-bottom: 1.2em;
|
||||
padding-left: 1.6em;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(li):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 0.6em;
|
||||
margin-bottom: 0.6em;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(ol > li):not(:where([class~="not-prose"] *)) {
|
||||
padding-left: 0.4em;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(ul > li):not(:where([class~="not-prose"] *)) {
|
||||
padding-left: 0.4em;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(.prose > ul > li p):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 0.8em;
|
||||
margin-bottom: 0.8em;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(.prose > ul > li > *:first-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 1.2em;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(.prose > ul > li > *:last-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-bottom: 1.2em;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(.prose > ol > li > *:first-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 1.2em;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(.prose > ol > li > *:last-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-bottom: 1.2em;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 0.8em;
|
||||
margin-bottom: 0.8em;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(hr):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 2.8em;
|
||||
margin-bottom: 2.8em;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(hr + *):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(h2 + *):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(h3 + *):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(h4 + *):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(table):not(:where([class~="not-prose"] *)) {
|
||||
font-size: 0.9em;
|
||||
line-height: 1.5555556;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(thead th):not(:where([class~="not-prose"] *)) {
|
||||
padding-right: 0.6666667em;
|
||||
padding-bottom: 0.8888889em;
|
||||
padding-left: 0.6666667em;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(thead th:first-child):not(:where([class~="not-prose"] *)) {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(thead th:last-child):not(:where([class~="not-prose"] *)) {
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.lg\:px-8 {
|
||||
padding-left: 2rem;
|
||||
padding-right: 2rem;
|
||||
@ -3094,13 +3492,32 @@ select {
|
||||
padding-top: 4rem;
|
||||
padding-bottom: 4rem;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(tbody td, tfoot td):not(:where([class~="not-prose"] *)) {
|
||||
padding-top: 0.8888889em;
|
||||
padding-right: 0.6666667em;
|
||||
padding-bottom: 0.8888889em;
|
||||
padding-left: 0.6666667em;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(tbody td:first-child, tfoot td:first-child):not(:where([class~="not-prose"] *)) {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(tbody td:last-child, tfoot td:last-child):not(:where([class~="not-prose"] *)) {
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(.prose > :first-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.lg\:prose-xl :where(.prose > :last-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1280px) {
|
||||
.xl\:m-20 {
|
||||
margin: 5rem;
|
||||
}
|
||||
|
||||
.xl\:m-8 {
|
||||
margin: 2rem;
|
||||
}
|
||||
@ -3109,6 +3526,10 @@ select {
|
||||
margin: 3.5rem;
|
||||
}
|
||||
|
||||
.xl\:m-20 {
|
||||
margin: 5rem;
|
||||
}
|
||||
|
||||
.xl\:mx-auto {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
|
@ -38,7 +38,7 @@ module Merged
|
||||
|
||||
def order_option(section , clazz = "")
|
||||
if section.has_option?("order")
|
||||
clazz += " order-last" if section.option('order') == "right"
|
||||
clazz += " " + " order-last" if section.option('order') == "right"
|
||||
end
|
||||
{class: clazz}
|
||||
end
|
||||
@ -46,7 +46,7 @@ module Merged
|
||||
def text_align_option(section , clazz = "")
|
||||
if section.has_option?("text_align")
|
||||
# text-center , text-left , text-right , leave comment for tailwind
|
||||
clazz += " text-#{section.option('text_align')}"
|
||||
clazz += " " + " text-#{section.option('text_align')}"
|
||||
end
|
||||
{class: clazz}
|
||||
end
|
||||
@ -55,11 +55,11 @@ module Merged
|
||||
if section.has_option?("item_align")
|
||||
case section.option("item_align")
|
||||
when "left"
|
||||
clazz += " justify-start"
|
||||
clazz += " " + " justify-start"
|
||||
when "right"
|
||||
clazz += " justify-end"
|
||||
clazz += " " + " justify-end"
|
||||
else
|
||||
clazz += " justify-center"
|
||||
clazz += " " + " justify-center"
|
||||
end
|
||||
end
|
||||
{class: clazz }
|
||||
@ -68,112 +68,45 @@ module Merged
|
||||
def background_option(section , clazz = "")
|
||||
if section.has_option?("background")
|
||||
option = section.option('background')
|
||||
clazz += bg_for(section)
|
||||
clazz += " text-white" if option.include?("solid")
|
||||
clazz += " " + Merged.background[section.option('background')] || ""
|
||||
end
|
||||
{class: clazz}
|
||||
end
|
||||
|
||||
def margin_option(section , clazz = "")
|
||||
return {class: clazz} unless section.has_option?("margin")
|
||||
margin = { "none" => " m-0" ,
|
||||
"small" => " 2 md:4 lg:6 xl:m-8" ,
|
||||
"medium" => " 5 md:8 lg:10 xl:m-14" ,
|
||||
"large" => " 8 md:12 lg:16 xl:m-20" ,
|
||||
}[section.option("margin")] || ""
|
||||
margin = Merged.margin[section.option("margin")] || ""
|
||||
{class: clazz + margin}
|
||||
end
|
||||
|
||||
def text_color_option(section , clazz = "")
|
||||
if section.has_option?("text_color")
|
||||
clazz += color_for(section)
|
||||
clazz += " " + Merged.text_color[section.option("text_color")] || ""
|
||||
end
|
||||
{class: clazz }
|
||||
end
|
||||
|
||||
def shade_option(section , clazz = "")
|
||||
if section.has_option?("shade_color")
|
||||
clazz += shade_for(section)
|
||||
clazz += " " + Merged.shade_color[section.option("shade_color")] || ""
|
||||
end
|
||||
{class: clazz }
|
||||
end
|
||||
|
||||
def text_column_option( section)
|
||||
option = section.option('columns')
|
||||
option = 2 if option.blank?
|
||||
case option
|
||||
when "3"
|
||||
columns = "columns-1 md:columns-2 lg:columns-3"
|
||||
when "4"
|
||||
columns = "columns-1 md:columns-2 lg:columns-3 xl:columns-4"
|
||||
else # two
|
||||
columns = "columns-1 md:columns-2"
|
||||
def text_column_option( section )
|
||||
if section.has_option?("text_columns")
|
||||
clazz += " " + Merged.text_columns[section.option("text_columns")] || ""
|
||||
end
|
||||
{class: columns }
|
||||
{class: clazz }
|
||||
end
|
||||
|
||||
def column_option(section)
|
||||
option = section.option('columns')
|
||||
case option
|
||||
when "1"
|
||||
columns = "grid-cols-1"
|
||||
when "3"
|
||||
columns = "grid-cols-1 md:grid-cols-2 lg:grid-cols-3"
|
||||
when "4"
|
||||
columns = "grid-cols-1 md:grid-cols-2 lg:grid-cols-4"
|
||||
when "5"
|
||||
columns = "grid-cols-1 md:grid-cols-3 lg:grid-cols-5"
|
||||
when "6"
|
||||
columns = "grid-cols-2 md:grid-cols-4 lg:grid-cols-6"
|
||||
else # two
|
||||
columns = "grid-cols-1 md:grid-cols-2"
|
||||
if section.has_option?("columns")
|
||||
clazz += " " + Merged.text_columns[section.option("columns")] || ""
|
||||
end
|
||||
columns += " gap-8 md:gap-12 lg:gap-16"
|
||||
{class: columns }
|
||||
{class: clazz }
|
||||
end
|
||||
|
||||
private
|
||||
# need full color names for tailwind to pick it up
|
||||
def bg_for( section )
|
||||
{ "white" => " bg-white" ,
|
||||
"none" => "" ,
|
||||
"light_blue" => " bg-cyan-100" ,
|
||||
"light_gray" => " bg-gray-100" ,
|
||||
"light_orange" => " bg-orange-50" ,
|
||||
"solid_blue" => " bg-cyan-700" ,
|
||||
"solid_red" => " bg-amber-600" ,
|
||||
"solid_green" => " bg-green-700" ,
|
||||
"solid_petrol" => " bg-teal-700" ,
|
||||
"solid_indigo" => " bg-cyan-900" ,
|
||||
"solid_black" => " bg-slate-900" ,
|
||||
}[section.option('background')] || ""
|
||||
end
|
||||
|
||||
# need full color names for tailwind to pick it up
|
||||
def color_for( section )
|
||||
{ "white" => " text-white",
|
||||
"none" => "",
|
||||
"light_blue" => " text-cyan-100" ,
|
||||
"light_gray" => " text-gray-100" ,
|
||||
"solid_blue" => " text-cyan-700" ,
|
||||
"solid_red" => " text-orange-800" ,
|
||||
"solid_green" => " text-green-700" ,
|
||||
"solid_petrol" => " text-teal-700" ,
|
||||
"solid_indigo" => " text-indigo-800" ,
|
||||
"solid_black" => " text-slate-800" ,
|
||||
}[section.option("text_color")] || ""
|
||||
end
|
||||
# need full color names for tailwind to pick it up
|
||||
|
||||
def shade_for( section )
|
||||
{ "white_25" => " bg-white/25",
|
||||
"none" => "",
|
||||
"black_25" => " bg-black/25" ,
|
||||
"light_blue_25" => " bg-cyan-100/25" ,
|
||||
"light_red_25" => " bg-orange-300/25" ,
|
||||
"solid_blue_25" => " bg-cyan-700/25" ,
|
||||
"solid_red_25" => " bg-orange-800/25" ,
|
||||
}[section.option("shade_color")] || ""
|
||||
end
|
||||
end
|
||||
end
|
||||
|
@ -1,4 +1,17 @@
|
||||
module Merged
|
||||
|
||||
# Quite simple mapping from name to usually a selection of values.
|
||||
# Options have type that can be set but usually is inferred from
|
||||
# wether there is one values (select) other wise text.
|
||||
# date is also supported.
|
||||
#
|
||||
# a corresponding ./app/views/merged/sections/_option_form_TYPE.haml
|
||||
# nust exist to render the type.
|
||||
#
|
||||
# Also values may be provided by a module function/attribute on Merged.
|
||||
# eg option text_color (also shade_color) have a Merged.text_color that return a
|
||||
# hash. In this case so it is easy to customize the colors of the app.
|
||||
#
|
||||
class OptionDefinition < SharedBase
|
||||
|
||||
fields :name , :default , :description , :values , :type
|
||||
@ -13,11 +26,13 @@ module Merged
|
||||
end
|
||||
|
||||
def has_values?
|
||||
return true if Merged.respond_to?( name.to_sym )
|
||||
return false if attributes[:values].nil?
|
||||
! attributes[:values].empty?
|
||||
end
|
||||
|
||||
def values
|
||||
return Merged.send(name.to_sym).keys if Merged.respond_to?( name.to_sym )
|
||||
return [] unless has_values?
|
||||
attributes[:values].split(" ")
|
||||
end
|
||||
|
@ -117,3 +117,8 @@
|
||||
:values: left-top left left-bottom top center bottom right-top right right-bottom
|
||||
:default: center
|
||||
:id: 21
|
||||
- :name: text_columns
|
||||
:description: Number of text columns in a newspaper style layout
|
||||
:values: 2 3 4 5
|
||||
:default: 3
|
||||
:id: 22
|
||||
|
@ -175,6 +175,6 @@
|
||||
- text
|
||||
options:
|
||||
- order
|
||||
- columns
|
||||
- text_columns
|
||||
- background
|
||||
- text_color
|
||||
|
@ -3,7 +3,8 @@ const defaultTheme = require('tailwindcss/defaultTheme')
|
||||
module.exports = {
|
||||
content: [
|
||||
'./public/*.html',
|
||||
'./app/helpers/**/*.rb',
|
||||
'./app/**/*.rb',
|
||||
'./lib/**/*.rb',
|
||||
'./app/javascript/**/*.js',
|
||||
'./app/views/**/*.{erb,haml,html,slim}'
|
||||
],
|
||||
|
@ -9,3 +9,58 @@ Merged.images_dir = "merged"
|
||||
# Notice that the data is ALWAYS inside a merged directory,
|
||||
# so in the default case Rails.root/merged/*.yml
|
||||
Merged.data_dir = "."
|
||||
|
||||
|
||||
# text colors, keys are options shown to user, values what gets replaced
|
||||
Merged.text_color = { "white" => "text-white",
|
||||
"none" => "",
|
||||
"light_blue" => "text-cyan-100",
|
||||
"light_gray" => "text-gray-100",
|
||||
"solid_blue" => "text-cyan-700",
|
||||
"solid_red" => "text-orange-800",
|
||||
"solid_green" => "text-green-700",
|
||||
"solid_petrol" => "text-teal-700",
|
||||
"solid_indigo" => "text-indigo-800",
|
||||
"solid_black" => "text-slate-800",
|
||||
}
|
||||
|
||||
# margin option, keys are options shown to user, values what gets replaced
|
||||
Merged.margin = { "none" => "m-0",
|
||||
"small" => " m-2 md:m-4 lg:6 xl:m-8",
|
||||
"medium" => "m-5 md:m-8 lg:10 xl:m-14",
|
||||
"large" => " m-8 md:m-12 lg:16 xl:m-20",}
|
||||
|
||||
# background colors
|
||||
Merged.background = {"white" => "bg-white",
|
||||
"none" => "",
|
||||
"light_blue" => "bg-cyan-100",
|
||||
"light_gray" => "bg-gray-100",
|
||||
"light_orange" => "bg-orange-50",
|
||||
"solid_blue" => "bg-cyan-700 text-white",
|
||||
"solid_red" => "bg-amber-600 text-white",
|
||||
"solid_green" => "bg-green-700 text-white",
|
||||
"solid_petrol" => "bg-teal-700 text-white",
|
||||
"solid_indigo" => "bg-cyan-900 text-white",
|
||||
"solid_black" => "bg-slate-900 text-white", }
|
||||
|
||||
# shade options
|
||||
Merged.shade_color = {"white_25" => "bg-white/25",
|
||||
"none" => "",
|
||||
"black_25" => "bg-black/25",
|
||||
"light_blue_25" => "bg-cyan-100/25",
|
||||
"light_red_25" => "bg-orange-300/25",
|
||||
"solid_blue_25" => "bg-cyan-700/25",
|
||||
"solid_red_25" => "bg-orange-800/25", }
|
||||
|
||||
# amount of text columns
|
||||
Merged.text_columns = {
|
||||
"3" => "columns-1 md:columns-2 lg:columns-3",
|
||||
"4" => "columns-1 md:columns-2 lg:columns-3 xl:columns-4",
|
||||
"2" => "columns-1 md:columns-2" }
|
||||
|
||||
Merged.columns = { "1" => "grid-cols-1",
|
||||
"2" => "grid-cols-1 md:grid-cols-2"
|
||||
"3" => "grid-cols-1 md:grid-cols-2 lg:grid-cols-3",
|
||||
"4" => "grid-cols-1 md:grid-cols-2 lg:grid-cols-4",
|
||||
"5" => "grid-cols-1 md:grid-cols-3 lg:grid-cols-5",
|
||||
"6" => "grid-cols-2 md:grid-cols-4 lg:grid-cols-6", }
|
||||
|
@ -8,7 +8,70 @@ module Merged
|
||||
# Directory inside the app/assets/images
|
||||
mattr_accessor :images_dir
|
||||
@@images_dir = "merged"
|
||||
|
||||
# directory in root to store data
|
||||
mattr_accessor :data_dir
|
||||
@@data_dir = "."
|
||||
|
||||
# text colors, keys are options shown to user, values what gets replaced
|
||||
mattr_accessor :text_color
|
||||
@@text_color = { "white" => "text-white",
|
||||
"none" => "",
|
||||
"light_blue" => "text-cyan-100",
|
||||
"light_gray" => "text-gray-100",
|
||||
"solid_blue" => "text-cyan-700",
|
||||
"solid_red" => "text-orange-800",
|
||||
"solid_green" => "text-green-700",
|
||||
"solid_petrol" => "text-teal-700",
|
||||
"solid_indigo" => "text-indigo-800",
|
||||
"solid_black" => "text-slate-800",
|
||||
}
|
||||
|
||||
# margin option, keys are options shown to user, values what gets replaced
|
||||
mattr_accessor :margin
|
||||
@@margin = { "none" => "m-0",
|
||||
"small" => " m-2 md:m-4 lg:6 xl:m-8",
|
||||
"medium" => "m-5 md:m-8 lg:10 xl:m-14",
|
||||
"large" => " m-8 md:m-12 lg:16 xl:m-20",}
|
||||
|
||||
# background colors
|
||||
mattr_accessor :background
|
||||
@@background = {"white" => "bg-white",
|
||||
"none" => "",
|
||||
"light_blue" => "bg-cyan-100",
|
||||
"light_gray" => "bg-gray-100",
|
||||
"light_orange" => "bg-orange-50",
|
||||
"solid_blue" => "bg-cyan-700 text-white",
|
||||
"solid_red" => "bg-amber-600 text-white",
|
||||
"solid_green" => "bg-green-700 text-white",
|
||||
"solid_petrol" => "bg-teal-700 text-white",
|
||||
"solid_indigo" => "bg-cyan-900 text-white",
|
||||
"solid_black" => "bg-slate-900 text-white", }
|
||||
|
||||
# shade options
|
||||
mattr_accessor :shade_color
|
||||
@@shade_color = {"white_25" => "bg-white/25",
|
||||
"none" => "",
|
||||
"black_25" => "bg-black/25",
|
||||
"light_blue_25" => "bg-cyan-100/25",
|
||||
"light_red_25" => "bg-orange-300/25",
|
||||
"solid_blue_25" => "bg-cyan-700/25",
|
||||
"solid_red_25" => "bg-orange-800/25", }
|
||||
|
||||
# amount of text columns
|
||||
mattr_accessor :text_columns
|
||||
@@text_columns = {
|
||||
"3" => "columns-1 md:columns-2 lg:columns-3",
|
||||
"4" => "columns-1 md:columns-2 lg:columns-3 xl:columns-4",
|
||||
"2" => "columns-1 md:columns-2" }
|
||||
|
||||
# amount of text columns
|
||||
mattr_accessor :columns
|
||||
@@columns = { "1" => "grid-cols-1",
|
||||
"2" => "grid-cols-1 md:grid-cols-2"
|
||||
"3" => "grid-cols-1 md:grid-cols-2 lg:grid-cols-3",
|
||||
"4" => "grid-cols-1 md:grid-cols-2 lg:grid-cols-4",
|
||||
"5" => "grid-cols-1 md:grid-cols-3 lg:grid-cols-5",
|
||||
"6" => "grid-cols-2 md:grid-cols-4 lg:grid-cols-6", }
|
||||
|
||||
end
|
||||
|
Loading…
Reference in New Issue
Block a user