Merge pull request #10158 from netchampfaris/page-builder-fixes

This commit is contained in:
Faris Ansari 2020-04-30 14:42:21 +05:30 committed by GitHub
commit 801e9d411b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
14 changed files with 169 additions and 81 deletions

View file

@ -20,7 +20,7 @@ class TestExporter(unittest.TestCase):
e = Exporter('Web Page', export_fields='All')
csv_array = e.get_csv_array()
header = csv_array[0]
self.assertEqual(len(header), 35)
self.assertEqual(len(header), 36)
def test_exports_selected_fields(self):

View file

@ -13,11 +13,10 @@ details.hide-summary-arrow summary::-webkit-details-marker {
}
.from-markdown {
@apply text-gray-900;
@apply leading-relaxed;
> * + * {
@apply mt-6;
@apply mt-4;
}
> :first-child {
@ -50,28 +49,45 @@ details.hide-summary-arrow summary::-webkit-details-marker {
@apply px-4 py-3 text-sm font-medium text-gray-900 border border-gray-400 rounded-md bg-gray-50;
}
> h1 {
@apply text-4xl;
@apply mt-16;
@apply mb-4;
@apply leading-none;
@apply font-bold;
h1 {
@apply mt-16 mb-4 text-3xl font-extrabold leading-tight tracking-tight;
@screen sm {
@apply text-4xl leading-10;
}
@screen xl {
@apply text-5xl leading-none;
}
}
> h2 {
@apply mt-16;
@apply mb-4;
@apply leading-none;
@apply font-bold;
@apply text-3xl;
h1 + p {
@apply max-w-2xl mt-3 text-base text-gray-900;
@screen sm {
@apply mt-5 text-lg;
}
@screen md {
@apply mt-5 text-xl;
}
}
> h3 {
@apply mt-16;
@apply mb-4;
@apply leading-none;
@apply font-bold;
@apply text-2xl;
h2 {
@apply mb-4 text-2xl font-bold leading-tight mt-14;
}
h3 {
@apply mt-12 mb-4 text-xl font-semibold leading-tight;
}
h4 {
@apply mt-10 mb-4 text-lg font-semibold leading-tight;
}
h5 {
@apply mt-8 mb-4 text-base font-semibold leading-tight;
}
h6 {
@apply mt-6 mb-4 text-sm font-semibold leading-tight;
}
> a,
@ -84,9 +100,17 @@ details.hide-summary-arrow summary::-webkit-details-marker {
}
}
table {
@apply w-full my-8 border-t;
}
tbody {
@apply border-t;
}
tr > td,
tr > th {
@apply px-4 py-2 border border-gray-400;
@apply py-4 pr-6 text-sm leading-6 text-left border-b;
}
th:empty {

View file

@ -7,6 +7,7 @@
web_block.css_class
]) -%}
{%- if not web_block.hide_block -%}
<{{htmltag}} class="{{ classes }}" data-section-idx="{{ web_block.idx | e }}"
data-section-template="{{ web_block.web_template | e }}">
{%- if web_block.add_container -%}
@ -17,3 +18,4 @@
</div>
{%- endif -%}
</{{htmltag}}>
{%- endif -%}

View file

@ -12,7 +12,8 @@
"column_break_5",
"add_container",
"add_padding",
"add_shade"
"add_shade",
"hide_block"
],
"fields": [
{
@ -54,18 +55,24 @@
"default": "0",
"fieldname": "add_shade",
"fieldtype": "Check",
"label": "Shaded Section"
"label": "Add Gray Background"
},
{
"default": "1",
"fieldname": "add_container",
"fieldtype": "Check",
"label": "Add Container"
},
{
"default": "0",
"fieldname": "hide_block",
"fieldtype": "Check",
"label": "Hide Block"
}
],
"istable": 1,
"links": [],
"modified": "2020-04-19 16:16:44.524042",
"modified": "2020-04-29 15:08:25.976179",
"modified_by": "Administrator",
"module": "Website",
"name": "Web Page Block",

View file

@ -31,7 +31,7 @@
"fieldtype": "Select",
"in_list_view": 1,
"label": "Fieldtype",
"options": "Attach Image\nCheck\nData\nInt\nSelect\nSmall Text\nText\nMarkdown Editor",
"options": "Attach Image\nCheck\nData\nInt\nSelect\nSmall Text\nText\nMarkdown Editor\nSection Break\nColumn Break",
"reqd": 1
},
{
@ -48,7 +48,7 @@
],
"istable": 1,
"links": [],
"modified": "2020-04-24 17:05:25.322767",
"modified": "2020-04-29 14:53:23.192395",
"modified_by": "Administrator",
"module": "Website",
"name": "Web Template Field",

View file

@ -9,22 +9,12 @@
</p>
{%- endif -%}
{%- if primary_action or secondary_action -%}
<div class="mt-5 sm:mt-8 sm:flex sm:justify-center lg:justify-start">
<div class="mt-5 sm:mt-8">
{%- if primary_action -%}
<div class="rounded-md shadow">
<a href="{{ primary_action }}"
class="flex items-center justify-center w-full px-8 py-3 text-base font-medium leading-6 text-white transition duration-150 ease-in-out border border-transparent rounded-md bg-primary-500 hover:bg-primary-400 focus:outline-none focus:shadow-outline md:py-4 md:text-lg md:px-10">
{{ primary_action_label }}
</a>
</div>
{{ c('button', label=primary_action_label, url=primary_action, variant="primary", size="large") }}
{%- endif -%}
{%- if secondary_action -%}
<div class="mt-3 sm:mt-0 sm:ml-3">
<a href="{{ secondary_action }}"
class="flex items-center justify-center w-full px-8 py-3 text-base font-medium leading-6 transition duration-150 ease-in-out border border-transparent rounded-md text-primary-700 bg-primary-100 hover:text-primary-600 hover:bg-primary-50 focus:outline-none focus:shadow-outline focus:border-primary-300 md:py-4 md:text-lg md:px-10">
{{ secondary_action_label }}
</a>
</div>
{{ c('button', label=secondary_action_label, url=secondary_action, variant="secondary", size="large", class="ml-4") }}
{%- endif -%}
</div>
{%- endif -%}

View file

@ -1,5 +1,5 @@
<div class="relative flex">
<div class="relative flex items-center flex-shrink-0 w-full sm:w-7/12">
<div class="relative flex items-center flex-shrink-0 w-full md:w-6/12">
<div>
<h1
class="text-3xl font-extrabold leading-tight tracking-tight sm:leading-10 sm:text-4xl xl:leading-none xl:text-5xl">
@ -22,8 +22,16 @@
</div>
</div>
{%- if image -%}
<div class="hidden sm:block lg:w-5/12">
<img class="object-cover w-full h-56 lg:h-full lg:w-full md:h-96 sm:h-72" src="{{ image }}" alt="">
</div>
{{ c('image_with_blur',
class=["hidden md:block max-h-144", "w-full md:w-6/12" if contain_image else "md:max-w-md lg:max-w-lg xl:max-w-xl xxl:max-w-2xl"],
src=image,
alt="")
}}
{%- endif -%}
</div>
{%- if not contain_image -%}
<script>
document.addEventListener('DOMContentLoaded', () => document.body.classList.add('overflow-x-hidden'));
</script>
{%- endif -%}

View file

@ -21,6 +21,12 @@
"label": "Image",
"reqd": 0
},
{
"fieldname": "contain_image",
"fieldtype": "Check",
"label": "Restrict Image inside Container",
"reqd": 0
},
{
"fieldname": "primary_action_label",
"fieldtype": "Data",
@ -47,7 +53,7 @@
}
],
"idx": 0,
"modified": "2020-04-26 15:08:26.937576",
"modified": "2020-04-29 14:12:31.613545",
"modified_by": "Administrator",
"name": "Hero with Right Image",
"owner": "Administrator",

View file

@ -6,8 +6,8 @@
</a>
</div>
<details class="z-10 flex items-center sm:hidden hide-summary-arrow">
<summary>
<button>
<summary class="block h-6 list-none cursor-pointer focus:outline-none focus:shadow-outline">
<button class="pointer-events-none">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="feather feather-menu">

View file

@ -5,9 +5,9 @@
'p-8': card_size == 'Large'
}) -%}
{%- set title_classes = resolve_class({
'text-base': card_size == 'Small',
'text-lg md:text-xl': card_size == 'Medium',
'text-xl md:text-2xl': card_size == 'Large'
'text-base font-semibold': card_size == 'Small',
'text-lg md:text-xl font-semibold': card_size == 'Medium',
'text-xl md:text-2xl font-bold': card_size == 'Large'
}) -%}
{%- set content_classes = resolve_class({
'text-sm': card_size == 'Small',
@ -16,8 +16,8 @@
}) -%}
<a href="{{ url or '#' }}"
class="block bg-white border rounded-xl hover:shadow-lg {{ card_classes }}">
<h3 class="font-semibold {{ title_classes }}">{{ title }}</h3>
class="block bg-white border rounded-xl hover:border-gray-600 {{ card_classes }}">
<h3 class="leading-none {{ title_classes }}">{{ title }}</h3>
<p class="mt-4 text-gray-900 {{ content_classes }}">{{ content or '' }}</p>
</a>
{%- endmacro -%}

View file

@ -22,153 +22,201 @@
"options": "Small\nMedium\nLarge",
"reqd": 0
},
{
"fieldname": "card_1",
"fieldtype": "Section Break",
"label": "Card 1",
"reqd": 0
},
{
"fieldname": "card_1_title",
"fieldtype": "Data",
"label": "Card 1 Title",
"label": "Title",
"reqd": 0
},
{
"fieldname": "card_1_content",
"fieldtype": "Small Text",
"label": "Card 1 Content",
"label": "Content",
"reqd": 0
},
{
"fieldname": "card_1_url",
"fieldtype": "Data",
"label": "Card 1 URL",
"label": "URL",
"reqd": 0
},
{
"fieldname": "card_2",
"fieldtype": "Section Break",
"label": "Card 2",
"reqd": 0
},
{
"fieldname": "card_2_title",
"fieldtype": "Data",
"label": "Card 2 Title",
"label": "Title",
"reqd": 0
},
{
"fieldname": "card_2_content",
"fieldtype": "Small Text",
"label": "Card 2 Content",
"label": "Content",
"reqd": 0
},
{
"fieldname": "card_2_url",
"fieldtype": "Data",
"label": "Card 2 URL",
"label": "URL",
"reqd": 0
},
{
"fieldname": "card_3",
"fieldtype": "Section Break",
"label": "Card 3",
"reqd": 0
},
{
"fieldname": "card_3_title",
"fieldtype": "Data",
"label": "Card 3 Title",
"label": "Title",
"reqd": 0
},
{
"fieldname": "card_3_content",
"fieldtype": "Small Text",
"label": "Card 3 Content",
"label": "Content",
"reqd": 0
},
{
"fieldname": "card_3_url",
"fieldtype": "Data",
"label": "Card 3 URL",
"label": "URL",
"reqd": 0
},
{
"fieldname": "card_4",
"fieldtype": "Section Break",
"label": "Card 4",
"reqd": 0
},
{
"fieldname": "card_4_title",
"fieldtype": "Data",
"label": "Card 4 Title",
"label": "Title",
"reqd": 0
},
{
"fieldname": "card_4_content",
"fieldtype": "Small Text",
"label": "Card 4 Content",
"label": "Content",
"reqd": 0
},
{
"fieldname": "card_4_url",
"fieldtype": "Data",
"label": "Card 4 URL",
"label": "URL",
"reqd": 0
},
{
"fieldname": "card_5",
"fieldtype": "Section Break",
"label": "Card 5",
"reqd": 0
},
{
"fieldname": "card_5_title",
"fieldtype": "Data",
"label": "Card 5 Title",
"label": "Title",
"reqd": 0
},
{
"fieldname": "card_5_content",
"fieldtype": "Small Text",
"label": "Card 5 Content",
"label": "Content",
"reqd": 0
},
{
"fieldname": "card_5_url",
"fieldtype": "Data",
"label": "Card 5 URL",
"label": "URL",
"reqd": 0
},
{
"fieldname": "card_6",
"fieldtype": "Section Break",
"label": "Card 6",
"reqd": 0
},
{
"fieldname": "card_6_title",
"fieldtype": "Data",
"label": "Card 6 Title",
"label": "Title",
"reqd": 0
},
{
"fieldname": "card_6_content",
"fieldtype": "Small Text",
"label": "Card 6 Content",
"label": "Content",
"reqd": 0
},
{
"fieldname": "card_6_url",
"fieldtype": "Data",
"label": "Card 6 URL",
"label": "URL",
"reqd": 0
},
{
"fieldname": "card_7",
"fieldtype": "Section Break",
"label": "Card 7",
"reqd": 0
},
{
"fieldname": "card_7_title",
"fieldtype": "Data",
"label": "Card 7 Title",
"label": "Title",
"reqd": 0
},
{
"fieldname": "card_7_content",
"fieldtype": "Small Text",
"label": "Card 7 Content",
"label": "Content",
"reqd": 0
},
{
"fieldname": "card_7_url",
"fieldtype": "Data",
"label": "Card 7 URL",
"label": "URL",
"reqd": 0
},
{
"fieldname": "card_8",
"fieldtype": "Section Break",
"label": "Card 8",
"reqd": 0
},
{
"fieldname": "card_8_title",
"fieldtype": "Data",
"label": "Card 8 Title",
"label": "Title",
"reqd": 0
},
{
"fieldname": "card_8_content",
"fieldtype": "Small Text",
"label": "Card 8 Content",
"label": "Content",
"reqd": 0
},
{
"fieldname": "card_8_url",
"fieldtype": "Data",
"label": "Card 8 URL",
"label": "URL",
"reqd": 0
}
],
"idx": 0,
"modified": "2020-04-21 21:24:04.192839",
"modified": "2020-04-29 22:40:03.362229",
"modified_by": "Administrator",
"name": "Section with Cards",
"owner": "Administrator",

View file

@ -1,12 +1,12 @@
<div class="relative">
<div class="px-8 py-12 text-center sm:px-12 md:py-20 bg-primary-100 rounded-xl">
<h2 class="max-w-xl mx-auto text-2xl font-bold leading-tight md:text-3xl xl:text-4xl">{{ title }}</h2>
<p class="max-w-xl mx-auto mt-2 text-base text-gray-900 sm:text-lg">{{ subtitle }}</p>
<h2 class="max-w-xl mx-auto text-2xl font-extrabold leading-tight md:text-4xl">{{ title }}</h2>
<p class="max-w-xl mx-auto mt-2 text-base text-gray-900 md:text-lg">{{ subtitle }}</p>
<p class="mt-8">
{{ c('button', label=cta_label, url=cta_url, variant="primary", size="large") }}
</p>
{%- if cta_description -%}
<div class="max-w-xl mx-auto mt-2 text-sm text-gray-900">
<div class="max-w-xl mx-auto mt-2 text-xs text-gray-900">
{{ cta_description }}
</div>
{%- endif -%}

View file

@ -10,7 +10,7 @@
"font_properties": "300,600",
"footer": [],
"idx": 26,
"modified": "2020-04-24 23:52:27.211811",
"modified": "2020-04-29 12:26:48.399125",
"modified_by": "Administrator",
"module": "Website",
"name": "Standard",

View file

@ -46,6 +46,9 @@ module.exports = {
borderRadius: {
xl: '0.75rem'
},
maxHeight: {
'144': '36rem'
},
boxShadow: theme => ({
'outline-primary': `0 0 0 3px ${rgba(theme('colors.blue.300'), 0.45)}`
}),