fixing branding positioning on forceOverlay and DropUp

add2cal · Aug 21, 2024 · 81af2db · 81af2db
1 parent 0fc9fd0
commit 81af2db
Show file tree

Hide file tree

Showing 18 changed files with 58 additions and 17 deletions.
diff --git a/assets/css/atcb-3d.css b/assets/css/atcb-3d.css
@@ -1424,6 +1424,7 @@ a.atcb-modal-btn:not([disabled]):hover {
   filter: drop-shadow(0 0 3px rgba(255 255 255 / 80%));
   height: auto;
   padding: 8px 0;
+  text-align: center;
   transform: translate3d(0, 0, 0);
   width: 100%;
   z-index: 15000000;
@@ -1440,6 +1441,10 @@ a.atcb-modal-btn:not([disabled]):hover {
   position: absolute;
 }
 
+.atcb-modal-host-initialized #atcb-reference.atcb-dropup {
+  text-align: left;
+}
+
 /* :host-context(html.atcb-dark):host(.atcb-bodyScheme) #atcb-reference,
 :host-context(body.atcb-dark):host(.atcb-bodyScheme) #atcb-reference, */
 :host(.atcb-dark) #atcb-reference {
@@ -1453,7 +1458,7 @@ a.atcb-modal-btn:not([disabled]):hover {
   width: 150px;
   max-width: 100%;
   margin: auto;
-  display: block;
+  display: inline-block;
   text-decoration: none;
 }
 

diff --git a/assets/css/atcb-3d.min.css b/assets/css/atcb-3d.min.css
diff --git a/assets/css/atcb-date.css b/assets/css/atcb-date.css
@@ -1119,6 +1119,7 @@ a.atcb-modal-btn:not([disabled]):hover {
   filter: drop-shadow(0 0 3px rgba(255 255 255 / 80%));
   height: auto;
   padding: 8px 0;
+  text-align: center;
   transform: translate3d(0, 0, 0);
   width: 100%;
   z-index: 15000000;
@@ -1135,6 +1136,10 @@ a.atcb-modal-btn:not([disabled]):hover {
   position: absolute;
 }
 
+.atcb-modal-host-initialized #atcb-reference.atcb-dropup {
+  text-align: left;
+}
+
 /* :host-context(html.atcb-dark):host(.atcb-bodyScheme) #atcb-reference,
 :host-context(body.atcb-dark):host(.atcb-bodyScheme) #atcb-reference, */
 :host(.atcb-dark) #atcb-reference {
@@ -1148,7 +1153,7 @@ a.atcb-modal-btn:not([disabled]):hover {
   width: 150px;
   max-width: 100%;
   margin: auto;
-  display: block;
+  display: inline-block;
   text-decoration: none;
 }
 

diff --git a/assets/css/atcb-date.min.css b/assets/css/atcb-date.min.css
diff --git a/assets/css/atcb-flat.css b/assets/css/atcb-flat.css
@@ -1349,6 +1349,7 @@ a.atcb-modal-btn:not([disabled]):hover {
   filter: drop-shadow(0 0 3px rgba(255 255 255 / 80%));
   height: auto;
   padding: 8px 0;
+  text-align: center;
   transform: translate3d(0, 0, 0);
   width: 100%;
   z-index: 15000000;
@@ -1365,6 +1366,10 @@ a.atcb-modal-btn:not([disabled]):hover {
   position: absolute;
 }
 
+.atcb-modal-host-initialized #atcb-reference.atcb-dropup {
+  text-align: left;
+}
+
 /* :host-context(html.atcb-dark):host(.atcb-bodyScheme) #atcb-reference,
 :host-context(body.atcb-dark):host(.atcb-bodyScheme) #atcb-reference, */
 :host(.atcb-dark) #atcb-reference {
@@ -1378,7 +1383,7 @@ a.atcb-modal-btn:not([disabled]):hover {
   width: 150px;
   max-width: 100%;
   margin: auto;
-  display: block;
+  display: inline-block;
   text-decoration: none;
 }
 

diff --git a/assets/css/atcb-flat.min.css b/assets/css/atcb-flat.min.css
diff --git a/assets/css/atcb-neumorphism.css b/assets/css/atcb-neumorphism.css
@@ -1348,6 +1348,7 @@ a.atcb-modal-btn:not([disabled]):hover {
   filter: drop-shadow(0 0 3px rgba(255 255 255 / 80%));
   height: auto;
   padding: 8px 0;
+  text-align: center;
   transform: translate3d(0, 0, 0);
   width: 100%;
   z-index: 15000000;
@@ -1364,6 +1365,10 @@ a.atcb-modal-btn:not([disabled]):hover {
   position: absolute;
 }
 
+.atcb-modal-host-initialized #atcb-reference.atcb-dropup {
+  text-align: left;
+}
+
 /* :host-context(html.atcb-dark):host(.atcb-bodyScheme) #atcb-reference,
 :host-context(body.atcb-dark):host(.atcb-bodyScheme) #atcb-reference, */
 :host(.atcb-dark) #atcb-reference {
@@ -1377,7 +1382,7 @@ a.atcb-modal-btn:not([disabled]):hover {
   width: 150px;
   max-width: 100%;
   margin: auto;
-  display: block;
+  display: inline-block;
   text-decoration: none;
 }
 

diff --git a/assets/css/atcb-neumorphism.min.css b/assets/css/atcb-neumorphism.min.css
diff --git a/assets/css/atcb-round.css b/assets/css/atcb-round.css
@@ -1434,6 +1434,7 @@ a.atcb-modal-btn:not([disabled]):hover {
   filter: drop-shadow(0 0 3px rgba(255 255 255 / 80%));
   height: auto;
   padding: 8px 0;
+  text-align: center;
   transform: translate3d(0, 0, 0);
   width: 100%;
   z-index: 15000000;
@@ -1450,6 +1451,10 @@ a.atcb-modal-btn:not([disabled]):hover {
   position: absolute;
 }
 
+.atcb-modal-host-initialized #atcb-reference.atcb-dropup {
+  text-align: left;
+}
+
 /* :host-context(html.atcb-dark):host(.atcb-bodyScheme) #atcb-reference,
 :host-context(body.atcb-dark):host(.atcb-bodyScheme) #atcb-reference, */
 :host(.atcb-dark) #atcb-reference {
@@ -1463,7 +1468,7 @@ a.atcb-modal-btn:not([disabled]):hover {
   width: 150px;
   max-width: 100%;
   margin: auto;
-  display: block;
+  display: inline-block;
   text-decoration: none;
 }
 

diff --git a/assets/css/atcb-round.min.css b/assets/css/atcb-round.min.css
diff --git a/assets/css/atcb-text.css b/assets/css/atcb-text.css
@@ -1431,6 +1431,7 @@ a.atcb-modal-btn:not([disabled]):hover {
   filter: drop-shadow(0 0 3px rgba(255 255 255 / 80%));
   height: auto;
   padding: 8px 0;
+  text-align: center;
   transform: translate3d(0, 0, 0);
   width: 100%;
   z-index: 15000000;
@@ -1447,6 +1448,10 @@ a.atcb-modal-btn:not([disabled]):hover {
   position: absolute;
 }
 
+.atcb-modal-host-initialized #atcb-reference.atcb-dropup {
+  text-align: left;
+}
+
 /* :host-context(html.atcb-dark):host(.atcb-bodyScheme) #atcb-reference,
 :host-context(body.atcb-dark):host(.atcb-bodyScheme) #atcb-reference, */
 :host(.atcb-dark) #atcb-reference {
@@ -1460,7 +1465,7 @@ a.atcb-modal-btn:not([disabled]):hover {
   width: 150px;
   max-width: 100%;
   margin: auto;
-  display: block;
+  display: inline-block;
   text-decoration: none;
 }
 

diff --git a/assets/css/atcb-text.min.css b/assets/css/atcb-text.min.css
diff --git a/assets/css/atcb.css b/assets/css/atcb.css
@@ -1369,6 +1369,7 @@ a.atcb-modal-btn:not([disabled]):hover {
   filter: drop-shadow(0 0 3px rgba(255 255 255 / 80%));
   height: auto;
   padding: 8px 0;
+  text-align: center;
   transform: translate3d(0, 0, 0);
   width: 100%;
   z-index: 15000000;
@@ -1385,6 +1386,10 @@ a.atcb-modal-btn:not([disabled]):hover {
   position: absolute;
 }
 
+.atcb-modal-host-initialized #atcb-reference.atcb-dropup {
+  text-align: left;
+}
+
 /* :host-context(html.atcb-dark):host(.atcb-bodyScheme) #atcb-reference,
 :host-context(body.atcb-dark):host(.atcb-bodyScheme) #atcb-reference, */
 :host(.atcb-dark) #atcb-reference {
@@ -1398,7 +1403,7 @@ a.atcb-modal-btn:not([disabled]):hover {
   width: 150px;
   max-width: 100%;
   margin: auto;
-  display: block;
+  display: inline-block;
   text-decoration: none;
 }
 

diff --git a/assets/css/atcb.min.css b/assets/css/atcb.min.css
diff --git a/demo/public/atcb.css b/demo/public/atcb.css
@@ -1369,6 +1369,7 @@ a.atcb-modal-btn:not([disabled]):hover {
   filter: drop-shadow(0 0 3px rgba(255 255 255 / 80%));
   height: auto;
   padding: 8px 0;
+  text-align: center;
   transform: translate3d(0, 0, 0);
   width: 100%;
   z-index: 15000000;
@@ -1385,6 +1386,10 @@ a.atcb-modal-btn:not([disabled]):hover {
   position: absolute;
 }
 
+.atcb-modal-host-initialized #atcb-reference.atcb-dropup {
+  text-align: left;
+}
+
 /* :host-context(html.atcb-dark):host(.atcb-bodyScheme) #atcb-reference,
 :host-context(body.atcb-dark):host(.atcb-bodyScheme) #atcb-reference, */
 :host(.atcb-dark) #atcb-reference {
@@ -1398,7 +1403,7 @@ a.atcb-modal-btn:not([disabled]):hover {
   width: 150px;
   max-width: 100%;
   margin: auto;
-  display: block;
+  display: inline-block;
   text-decoration: none;
 }
 

diff --git a/demo/tailwind.config.js b/demo/tailwind.config.js
@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-require-imports */
 /* eslint-disable no-undef */
 /** @type {import('tailwindcss').Config} */
 module.exports = {
@@ -67,7 +68,6 @@ module.exports = {
       },
     },
   },
-  // eslint-disable @typescript-eslint/no-require-imports
   // eslint-disable-next-line @typescript-eslint/no-var-requires
   plugins: [require('@headlessui/tailwindcss')({ prefix: 'ui' })],
 };
diff --git a/src/atcb-generate-pro.js b/src/atcb-generate-pro.js
@@ -312,7 +312,7 @@ async function atcb_generate_rsvp_form(host, data, hostEl, keyboardTrigger = fal
   } else {
     rsvpData.fields = rsvpData.fields.map((field) => {
       if (field.name === 'email') {
-        return { ...field, required: true, type: 'email', default: attendee !== '' && attendee || field.default };
+        return { ...field, required: true, type: 'email', default: attendee !== '' ? attendee : field.default };
       }
       return field;
     });

diff --git a/src/atcb-generate.js b/src/atcb-generate.js
@@ -382,6 +382,7 @@ function atcb_create_atcbl(host, atList = true, returnEl = false) {
       atcbL.classList.add('fixed-ref');
     }
   }
+  if (returnEl) return null;
 }
 
 // FUNCTION TO CREATE MODALS