Add files via upload

franco-aldeco · Nov 17, 2023 · 5973fe2 · 5973fe2
commit 5973fe2
Show file tree

Hide file tree

Showing 4 changed files with 56 additions and 0 deletions.
diff --git a/App.js b/App.js
@@ -0,0 +1,31 @@
+const createContactBlock = () => {
+  return {
+    id: 'email',
+    label: 'Email',
+    category: 'Custom',
+    attributes: { class: 'fa fa-envelope-o' },
+    content: `<form class="contact-form" method="POST" action="https://www.toptal.com/developers/postbin/1700221319848-5961196743883" id="emailForm">
+      <div class="form-group row contact-email">
+        <label for="inputEmail" class="">Enter your email</label>
+        <div class="">
+          <input type="email" class="form-control" id="inputEmail" name="contact[email]" placeholder="test@test.com" required />
+          <button type="submit" class="btn btn-primary btn-block">Submit</button>
+        </div>
+      </div>
+    </form>`,
+  };
+};
+
+var editor = grapesjs.init({
+  fromElement: 1,
+  container: "#gjs",
+
+  plugins: ['grapesjs-preset-webpage'],
+  pluginsOpts: {
+    "gjs-blocks-basic": {},
+  },
+});
+
+editor.BlockManager.add('email', createContactBlock());
+
+
diff --git a/Readme.md b/Readme.md
@@ -0,0 +1 @@
+just click on index.html file for run project
diff --git a/index.html b/index.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Grapes js</title>
+    <script src="https://unpkg.com/grapesjs"></script>
+    <script src="https://unpkg.com/grapesjs-preset-webpage"></script>
+    <link
+      rel="stylesheet"
+      href="https://unpkg.com/grapesjs/dist/css/grapes.min.css"
+    />
+    <link rel="stylesheet" href="./styles.css" />
+    <script src="https://unpkg.com/grapesjs-blocks-basic"></script>
+  </head>
+  <body>
+    <div id="gjs"></div>
+    <script src="./App.js"></script>
+  </body>
+</html>
diff --git a/styles.css b/styles.css
@@ -0,0 +1,4 @@
+* {
+  margin: 0;
+  padding: 0;
+}