From 65bdb7ece34bfbd1abb4dcaf43fb4fd1d491a14b Mon Sep 17 00:00:00 2001
From: Boid <john@boid.com>
Date: Fri, 1 Nov 2024 21:15:43 -0400
Subject: [PATCH] ready to overwrite main

---
 eslint.config.mjs         |  1 +
 public/mailchimp.html     | 45 ++++++++++++++++++++++
 src/css/app.sass          | 15 ++++----
 src/pages/IndexPage.vue   |  4 ++
 src/pages/TosPage.vue     | 80 +++++++++++++++++++++++++++++++++++++++
 src/router/routeData.json |  5 +++
 6 files changed, 143 insertions(+), 7 deletions(-)
 create mode 100644 public/mailchimp.html
 create mode 100644 src/pages/TosPage.vue

diff --git a/eslint.config.mjs b/eslint.config.mjs
index 31d68d2..1d721ab 100644
--- a/eslint.config.mjs
+++ b/eslint.config.mjs
@@ -33,6 +33,7 @@ export default ts.config(
       ],
       "@typescript-eslint/await-thenable": "error",
       "require-await": "warn",
+      "vue/multi-word-component-names": "off",
     },
   },
   eslintConfigPrettier,
diff --git a/public/mailchimp.html b/public/mailchimp.html
new file mode 100644
index 0000000..b15ee18
--- /dev/null
+++ b/public/mailchimp.html
@@ -0,0 +1,45 @@
+<div id="mc_embed_shell">
+  <link href="//cdn-images.mailchimp.com/embedcode/classic-061523.css" rel="stylesheet" type="text/css">
+  <style type="text/css">
+    #mc_embed_signup {
+      background: #fff;
+      false;
+      clear: left;
+      font: 14px Helvetica, Arial, sans-serif;
+      width: 600px;
+    }
+
+    /* Add your own Mailchimp form style overrides in your site stylesheet or in this style block.
+           We recommend moving this block and the preceding CSS link to the HEAD of your HTML file. */
+  </style>
+  <div id="mc_embed_signup">
+    <form
+      action="https://art.us13.list-manage.com/subscribe/post?u=38b81578f00eb77fbe89b6dc1&amp;id=78e676b2ff&amp;f_id=00634de1f0"
+      method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank"
+      data-dashlane-rid="035788ec8441b2e7" data-dashlane-classification="newsletter">
+      <div id="mc_embed_signup_scroll" style="padding-top:10px;">
+        <h2>Subscribe</h2>
+        <!-- <div class="indicates-required"><span class="asterisk">*</span> indicates required</div> -->
+        <div class="mc-field-group"><label for="mce-EMAIL">Email Address</label><input type="email" name="EMAIL"
+            class="required email" id="mce-EMAIL" required="" value="" data-dashlane-rid="2db58558c6fccc17"
+            data-dashlane-classification="email" data-kwimpalastatus="alive" data-kwimpalaid="1725843414457-0"><span
+            id="1725843414457-0" data-dashlanecreated="true"
+            style="color-scheme: initial; forced-color-adjust: initial; mask: initial; math-depth: initial; position: absolute; position-anchor: initial; text-size-adjust: initial; appearance: initial; color: initial; font: initial; font-palette: initial; font-synthesis: initial; inset-area: initial; text-orientation: initial; text-rendering: initial; text-spacing-trim: initial; -webkit-font-smoothing: initial; -webkit-locale: initial; -webkit-text-orientation: initial; -webkit-writing-mode: initial; writing-mode: initial; zoom: initial; accent-color: initial; place-content: initial; place-items: initial; place-self: initial; alignment-baseline: initial; anchor-name: initial; animation-composition: initial; animation: initial; app-region: initial; aspect-ratio: initial; backdrop-filter: initial; backface-visibility: initial; background: url(&quot;chrome-extension://fdjamakpfbbddfjaooikfcpapjohcfmg/content/injected/logo-autofill-known.svg&quot;) center center / contain no-repeat; background-blend-mode: initial; baseline-shift: initial; baseline-source: initial; block-size: initial; border-block: initial; border: none; border-radius: initial; border-collapse: initial; border-end-end-radius: initial; border-end-start-radius: initial; border-inline: initial; border-start-end-radius: initial; border-start-start-radius: initial; bottom: initial; box-shadow: initial; box-sizing: initial; break-after: initial; break-before: initial; break-inside: initial; buffered-rendering: initial; caption-side: initial; caret-color: initial; clear: initial; clip: initial; clip-path: initial; clip-rule: initial; color-interpolation: initial; color-interpolation-filters: initial; color-rendering: initial; columns: initial; column-fill: initial; gap: initial; column-rule: initial; column-span: initial; contain: initial; contain-intrinsic-block-size: initial; contain-intrinsic-size: initial; contain-intrinsic-inline-size: initial; container: initial; content: initial; content-visibility: initial; counter-increment: initial; counter-reset: initial; counter-set: initial; cursor: pointer; cx: initial; cy: initial; d: initial; display: inline; dominant-baseline: initial; empty-cells: initial; field-sizing: initial; fill: initial; fill-opacity: initial; fill-rule: initial; filter: initial; flex: initial; flex-flow: initial; float: initial; flood-color: initial; flood-opacity: initial; grid: initial; grid-area: initial; height: 16px; hyphenate-character: initial; hyphenate-limit-chars: initial; hyphens: initial; image-orientation: initial; image-rendering: initial; initial-letter: initial; inline-size: initial; inset-block: initial; inset-inline: initial; isolation: initial; left: 521px; letter-spacing: initial; lighting-color: initial; line-break: initial; list-style: initial; margin-block: initial; margin: initial; margin-inline: initial; marker: initial; mask-type: initial; math-shift: initial; math-style: initial; max-block-size: initial; max-height: initial; max-inline-size: initial; max-width: initial; min-block-size: initial; min-height: initial; min-inline-size: initial; min-width: 16px; mix-blend-mode: initial; object-fit: initial; object-position: initial; object-view-box: initial; offset: initial; opacity: 1; order: initial; orphans: initial; outline: initial; outline-offset: initial; overflow-anchor: initial; overflow-clip-margin: initial; overflow-wrap: initial; overflow: initial; overlay: initial; overscroll-behavior-block: initial; overscroll-behavior-inline: initial; overscroll-behavior: initial; padding-block: initial; padding: initial; padding-inline: initial; page: initial; page-orientation: initial; paint-order: initial; perspective: initial; perspective-origin: initial; pointer-events: initial; position-try: initial; position-visibility: initial; quotes: initial; r: initial; resize: initial; right: initial; rotate: initial; ruby-align: initial; ruby-position: initial; rx: initial; ry: initial; scale: initial; scroll-behavior: initial; scroll-margin-block: initial; scroll-margin: initial; scroll-margin-inline: initial; scroll-padding-block: initial; scroll-padding: initial; scroll-padding-inline: initial; scroll-snap-align: initial; scroll-snap-stop: initial; scroll-snap-type: initial; scroll-timeline: initial; scrollbar-color: initial; scrollbar-gutter: initial; scrollbar-width: initial; shape-image-threshold: initial; shape-margin: initial; shape-outside: initial; shape-rendering: initial; size: initial; speak: initial; stop-color: initial; stop-opacity: initial; stroke: initial; stroke-dasharray: initial; stroke-dashoffset: initial; stroke-linecap: initial; stroke-linejoin: initial; stroke-miterlimit: initial; stroke-opacity: initial; stroke-width: initial; tab-size: initial; table-layout: initial; text-align: initial; text-align-last: initial; text-anchor: initial; text-combine-upright: initial; text-decoration: initial; text-decoration-skip-ink: initial; text-emphasis: initial; text-emphasis-position: initial; text-indent: initial; text-overflow: initial; text-shadow: initial; text-transform: initial; text-underline-offset: initial; text-underline-position: initial; white-space: initial; timeline-scope: initial; top: 36px; touch-action: initial; transform: initial; transform-box: initial; transform-origin: initial; transform-style: initial; transition: initial; translate: initial; user-select: initial; vector-effect: initial; vertical-align: initial; view-timeline: initial; view-transition-class: initial; view-transition-name: initial; visibility: visible; border-spacing: initial; -webkit-box-align: initial; -webkit-box-decoration-break: initial; -webkit-box-direction: initial; -webkit-box-flex: initial; -webkit-box-ordinal-group: initial; -webkit-box-orient: initial; -webkit-box-pack: initial; -webkit-box-reflect: initial; -webkit-line-break: initial; -webkit-line-clamp: initial; -webkit-mask-box-image: initial; -webkit-print-color-adjust: initial; -webkit-rtl-ordering: initial; -webkit-ruby-position: initial; -webkit-tap-highlight-color: initial; -webkit-text-combine: initial; -webkit-text-decorations-in-effect: initial; -webkit-text-fill-color: initial; -webkit-text-security: initial; -webkit-text-stroke: initial; -webkit-user-drag: initial; widows: initial; width: 16px; will-change: initial; word-break: initial; word-spacing: initial; x: initial; y: initial; z-index: auto;"></span>
+        </div>
+        <div hidden=""><input type="hidden" name="tags" value="3679252,3679253"></div>
+        <div id="mce-responses" class="clear">
+          <div class="response" id="mce-error-response" style="display: none;"></div>
+          <div class="response" id="mce-success-response" style="display: none;"></div>
+        </div>
+        <div aria-hidden="true" style="position: absolute; left: -5000px;"><input type="text"
+            name="b_38b81578f00eb77fbe89b6dc1_78e676b2ff" tabindex="-1" value=""></div>
+        <div class="clear"><input type="submit" name="subscribe" id="mc-embedded-subscribe" class="button"
+            value="Subscribe" data-dashlane-rid="73578188b1115854" data-dashlane-classification="action,subscribe">
+        </div>
+      </div>
+    </form>
+  </div>
+  <script type="text/javascript" src="//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+  <script
+    type="text/javascript">(function ($) { window.fnames = new Array(); window.ftypes = new Array(); fnames[0] = 'EMAIL'; ftypes[0] = 'email'; fnames[1] = 'FNAME'; ftypes[1] = 'text'; fnames[2] = 'LNAME'; ftypes[2] = 'text'; fnames[3] = 'ADDRESS'; ftypes[3] = 'address'; fnames[4] = 'PHONE'; ftypes[4] = 'phone'; fnames[5] = 'BIRTHDAY'; ftypes[5] = 'birthday'; fnames[6] = 'COMPANY'; ftypes[6] = 'text'; }(jQuery)); var $mcj = jQuery.noConflict(true);</script>
+</div>
diff --git a/src/css/app.sass b/src/css/app.sass
index f45fbc2..99c451a 100644
--- a/src/css/app.sass
+++ b/src/css/app.sass
@@ -8,10 +8,11 @@ p
   font-size: 15px
   margin-bottom: 0px
   color: white
+  text-align: left
 h1
   font-size: 75px
   margin: 0px
-  font-family: gluten
+  font-family: Poppins
   color: white
 h2
   font-size: 30px
@@ -199,12 +200,12 @@ input[type="number"]
   justify-content: center
   align-items: center
 
-p
-  font-size: 12px
-  line-height: 22px
-  margin: 0
-  padding: 0
-  text-align: center
+  p
+    font-size: 12px
+    line-height: 22px
+    margin: 0
+    padding: 0
+    text-align: center
 
 a
   color: #1a73e8
diff --git a/src/pages/IndexPage.vue b/src/pages/IndexPage.vue
index d1e87c7..e6b40b0 100644
--- a/src/pages/IndexPage.vue
+++ b/src/pages/IndexPage.vue
@@ -21,6 +21,10 @@ q-page.full-height.full-width.bgimg
               h5 Earn points when someone purchases your images
         .centered.q-mt-md
           h5 Have fun exploring the site
+  .centered.q-mt-lg
+    h5 Join the mailing list to be updated on new features and events.
+  .centered
+    iframe(data-w-type="embedded" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="/mailchimp.html" style="height: 300px; width:500px; max-width:100vw;").bg-dark-page
 
   .centered.q-mt-xl
     q-btn(type="a" href="https://twitter.com/fiddlart" icon="fa-brands fa-x-twitter" color="primary" flat)
diff --git a/src/pages/TosPage.vue b/src/pages/TosPage.vue
new file mode 100644
index 0000000..b9fd076
--- /dev/null
+++ b/src/pages/TosPage.vue
@@ -0,0 +1,80 @@
+<template>
+  <div class="terms-of-service" style="max-width: 900px; padding-bottom: 200px">
+    <h1>Terms of Service</h1>
+    <p>Welcome to fiddl.art, an AI-powered platform for creating digital art. By using this website, you agree to comply with and be bound by the following terms of service:</p>
+
+    <h2>1. Liability Disclaimer</h2>
+    <p>
+      fiddl.art is provided by Progredia Futura as a platform for users to generate and share digital art. You agree that your use of the platform is at your own risk. Progredia Futura is not liable for any damages, direct or indirect, arising from your use of the platform or the
+      content generated on it.
+    </p>
+    <p>
+      Users are solely responsible for the content they create and share on fiddl.art. Progredia Futura does not endorse or claim ownership of user-generated content. Any liability arising from the misuse, distribution, or display of content rests entirely with the user who
+      created it. We provide the platform as-is without warranties of any kind.
+    </p>
+
+    <h2>2. User Responsibilities</h2>
+    <p>
+      By using fiddl.art, you agree to use the platform in compliance with applicable laws and regulations. You must not use fiddl.art to create or distribute any content that is unlawful, offensive, defamatory, or infringes on the rights of others. Any breach of these terms may
+      result in the termination of your access to the platform.
+    </p>
+
+    <h2>3. Content Takedown Policy</h2>
+    <p>
+      If you believe that an image or content created on fiddl.art infringes upon your rights, or if you find content that is objectionable, please contact us at <a href="mailto:social@fiddl.art">social@fiddl.art</a>. When submitting a takedown request, include a detailed
+      description of the content in question and the reason for the request. We will review all requests and take appropriate action in compliance with applicable laws. Please note that we may require proof of ownership or rights in order to take action.
+    </p>
+
+    <h2>4. Intellectual Property Rights</h2>
+    <p>
+      All user-generated content remains the property of the respective user. By using fiddl.art, you grant Progredia Futura a non-exclusive, royalty-free, worldwide license to use, display, and promote your content within the platform and related marketing. This license is
+      necessary for the operation and promotion of fiddl.art, and may be revoked upon removal of the content.
+    </p>
+
+    <h2>5. Privacy Policy</h2>
+    <p>
+      We respect your privacy. Any personal information you provide will be used solely for the purpose of providing our services and enhancing your experience on fiddl.art. We will not share your information with third parties without your consent, except as required by law. For
+      more details, please refer to our <a href="/privacy-policy">Privacy Policy</a>.
+    </p>
+
+    <h2>6. Messaging and Notifications</h2>
+    <p>
+      By providing your phone number, you agree to receive messages from fiddl.art related to your use of the platform, including service updates, notifications, and promotional content. You may opt out of these messages at any time by replying STOP. Standard messaging rates may
+      apply, and consent to receive messages is not a condition of using our services.
+    </p>
+    <p>Message frequency may vary, and you can text HELP for assistance. Messaging campaigns are managed by Progredia Futura and are used to keep you informed of relevant features, events, and updates.</p>
+    <p>No mobile information will be shared with third parties/affiliates for marketing/promotional purposes. All the above categories exclude text messaging originator opt-in data and consent; this information will not be shared with any third parties.'</p>
+
+    <h2>7. Prohibited Activities</h2>
+    <p>Users may not use fiddl.art to create or distribute content that is illegal, harmful, abusive, defamatory, or violates the intellectual property rights of others. Prohibited activities include but are not limited to:</p>
+    <ul>
+      <li>Creating content that is discriminatory or promotes hate speech.</li>
+      <li>Engaging in activities that would harm or disrupt the platform or its users.</li>
+      <li>Using automated means (e.g., bots) to interact with the platform without authorization.</li>
+    </ul>
+
+    <h2>8. Termination</h2>
+    <p>
+      Progredia Futura reserves the right to suspend or terminate your access to fiddl.art if you violate these terms. We may also remove any content that violates these terms or is deemed harmful to the community. Termination of your access to the platform may occur without
+      prior notice, and we are not liable for any consequences arising from such action.
+    </p>
+
+    <h2>9. Disclaimer of Warranties</h2>
+    <p>
+      fiddl.art is provided on an "as is" and "as available" basis. Progredia Futura makes no representations or warranties of any kind, express or implied, regarding the operation of the platform or the content available on it. We disclaim all warranties, including but not
+      limited to merchantability, fitness for a particular purpose, and non-infringement.
+    </p>
+
+    <h2>10. Limitation of Liability</h2>
+    <p>
+      To the fullest extent permitted by law, Progredia Futura shall not be liable for any damages arising from the use of fiddl.art, including but not limited to direct, indirect, incidental, punitive, and consequential damages. This includes any loss of data, revenue, or
+      reputation resulting from your use of the platform.
+    </p>
+
+    <h2>11. Changes to Terms</h2>
+    <p>We reserve the right to modify these Terms of Service at any time. Changes will be posted on this page, and your continued use of fiddl.art constitutes acceptance of the updated terms. We encourage you to review these terms periodically for any updates.</p>
+
+    <h2>Contact Information</h2>
+    <p>If you have questions about these terms, please contact us at <a href="mailto:social@fiddl.art">social@fiddl.art</a>.</p>
+  </div>
+</template>
diff --git a/src/router/routeData.json b/src/router/routeData.json
index 09ebac9..eeb2536 100644
--- a/src/router/routeData.json
+++ b/src/router/routeData.json
@@ -73,5 +73,10 @@
     "claim",
     "/claim/:claimShortId?",
     "ClaimPage"
+  ],
+  [
+    "tos",
+    "/tos",
+    "TosPage"
   ]
 ]