From 5fead3443d3c3ed1cf003441f3f0fa7f3d6c4c86 Mon Sep 17 00:00:00 2001 From: Mohit Maroliya Date: Tue, 9 Aug 2022 16:34:40 +0530 Subject: [PATCH] Adding the FileUpload templates --- src/blocks/index.js | 10 +++++++ src/blocks/upload/dark/a.js | 51 ++++++++++++++++++++++++++++++++++ src/blocks/upload/dark/b.js | 53 ++++++++++++++++++++++++++++++++++++ src/blocks/upload/light/a.js | 52 +++++++++++++++++++++++++++++++++++ src/blocks/upload/light/b.js | 53 ++++++++++++++++++++++++++++++++++++ src/icons/index.js | 7 +++++ src/icons/upload/a.js | 39 ++++++++++++++++++++++++++ src/icons/upload/b.js | 40 +++++++++++++++++++++++++++ 8 files changed, 305 insertions(+) create mode 100644 src/blocks/upload/dark/a.js create mode 100644 src/blocks/upload/dark/b.js create mode 100644 src/blocks/upload/light/a.js create mode 100644 src/blocks/upload/light/b.js create mode 100644 src/icons/upload/a.js create mode 100644 src/icons/upload/b.js diff --git a/src/blocks/index.js b/src/blocks/index.js index f48ad80..bf4ba5a 100644 --- a/src/blocks/index.js +++ b/src/blocks/index.js @@ -157,6 +157,12 @@ import DarkTestimonialA from './testimonial/dark/a'; import DarkTestimonialB from './testimonial/dark/b'; import DarkTestimonialC from './testimonial/dark/c'; +import LightUploadA from './upload/light/a'; +import LightUploadB from './upload/light/b'; + +import DarkUploadA from './upload/dark/a'; +import DarkUploadB from './upload/dark/b'; + export default function getBlock({theme = 'indigo', darkMode = false}) { return { Blog: { @@ -251,6 +257,10 @@ export default function getBlock({theme = 'indigo', darkMode = false}) { TestimonialA: darkMode ? : , TestimonialB: darkMode ? : , TestimonialC: darkMode ? : + }, + Upload: { + UploadA: darkMode ? : , + UploadB: darkMode ? : } } } diff --git a/src/blocks/upload/dark/a.js b/src/blocks/upload/dark/a.js new file mode 100644 index 0000000..b0f580c --- /dev/null +++ b/src/blocks/upload/dark/a.js @@ -0,0 +1,51 @@ +import React, { useRef } from "react"; +import PropTypes from "prop-types"; + +function DarkUploadA(props) { + const ref = useRef(); + + const handleClick = () => { + ref.current.click(); + }; + return ( +
+
+
+ + + + + *Remove or hide the button in the above line in the code while using + it. + +
+
+
+ ); +} + +DarkUploadA.defaultProps = { + theme: "indigo", +}; + +DarkUploadA.propTypes = { + theme: PropTypes.string.isRequired, +}; + +export default DarkUploadA; diff --git a/src/blocks/upload/dark/b.js b/src/blocks/upload/dark/b.js new file mode 100644 index 0000000..de650d4 --- /dev/null +++ b/src/blocks/upload/dark/b.js @@ -0,0 +1,53 @@ +import React from "react"; +import PropTypes from "prop-types"; + +function DarkUploadB(props) { + return ( +
+
+
+ +
+
+
+ ); +} + +DarkUploadB.defaultProps = { + theme: "indigo", +}; + +DarkUploadB.propTypes = { + theme: PropTypes.string.isRequired, +}; + +export default DarkUploadB; diff --git a/src/blocks/upload/light/a.js b/src/blocks/upload/light/a.js new file mode 100644 index 0000000..e477ef9 --- /dev/null +++ b/src/blocks/upload/light/a.js @@ -0,0 +1,52 @@ +import React, { useRef } from "react"; +import PropTypes from "prop-types"; + +function LightUploadA(props) { + const ref = useRef(); + + const handleClick = () => { + ref.current.click(); + }; + + return ( +
+
+
+ + + + + *Remove or hide the button in the above line in the code while using + it. + +
+
+
+ ); +} + +LightUploadA.defaultProps = { + theme: "indigo", +}; + +LightUploadA.propTypes = { + theme: PropTypes.string.isRequired, +}; + +export default LightUploadA; diff --git a/src/blocks/upload/light/b.js b/src/blocks/upload/light/b.js new file mode 100644 index 0000000..2b297c8 --- /dev/null +++ b/src/blocks/upload/light/b.js @@ -0,0 +1,53 @@ +import React from "react"; +import PropTypes from "prop-types"; + +function LightUploadB(props) { + return ( +
+
+
+ +
+
+
+ ); +} + +LightUploadB.defaultProps = { + theme: "indigo", +}; + +LightUploadB.propTypes = { + theme: PropTypes.string.isRequired, +}; + +export default LightUploadB; diff --git a/src/icons/index.js b/src/icons/index.js index 9b89c77..340b154 100644 --- a/src/icons/index.js +++ b/src/icons/index.js @@ -78,6 +78,9 @@ import TestimonialA from './testimonial/a'; import TestimonialB from './testimonial/b'; import TestimonialC from './testimonial/c'; +import UploadA from './upload/a'; +import UploadB from './upload/b'; + export default function getIcons() { return { Blog: { @@ -172,6 +175,10 @@ export default function getIcons() { TestimonialA: , TestimonialB: , TestimonialC: + }, + Upload: { + UploadA: , + UploadB: } } } diff --git a/src/icons/upload/a.js b/src/icons/upload/a.js new file mode 100644 index 0000000..9da3175 --- /dev/null +++ b/src/icons/upload/a.js @@ -0,0 +1,39 @@ +import React from "react"; + +function UploadA() { + return ( + + + + + + + + + + + ); +} + +export default UploadA; diff --git a/src/icons/upload/b.js b/src/icons/upload/b.js new file mode 100644 index 0000000..8c35d53 --- /dev/null +++ b/src/icons/upload/b.js @@ -0,0 +1,40 @@ +import React from "react"; + +function UploadB() { + return ( + + + + + + + + + + + + ); +} + +export default UploadB;