From d84dc2b0a469bd0c71b209b2fbc03b0356759b26 Mon Sep 17 00:00:00 2001 From: smaranjitghose Date: Mon, 31 May 2021 18:12:23 +0000 Subject: [PATCH] Prettified Code! --- .prettierrc.js | 24 +- src/components/Header/Header.jsx | 17 +- .../ScrollToTopButton/ScrollToTopButton.jsx | 5 +- src/index.scss | 138 ++++---- .../DownloadFileModal/DownloadFileModal.jsx | 6 +- src/pages/Editor/containers/editContext.js | 3 +- .../sections/OutputComponent/Output.jsx | 8 +- .../Editor/sections/Settings/Settings.jsx | 6 +- src/pages/Home/sections/About/About.jsx | 12 +- .../Home/sections/Banner/banner.module.scss | 22 +- .../components/EmojiRating/EmojiRating.jsx | 28 +- .../ExperienceForm/ExperienceForm.jsx | 12 +- .../OpenSource/open-source.module.scss | 294 +++++++++--------- src/pages/Home/sections/Team/Team.jsx | 6 +- .../Team/components/FluidCard/FluidCard.jsx | 12 +- src/pages/Home/sections/Team/team.module.scss | 8 +- src/pages/Sketch/components/Canvas.jsx | 12 +- .../Sketch/components/Toolbox/Toolbox.jsx | 40 ++- src/scss/_mixin.scss | 11 +- 19 files changed, 378 insertions(+), 286 deletions(-) diff --git a/.prettierrc.js b/.prettierrc.js index 9e072ac2..3bdb08c7 100644 --- a/.prettierrc.js +++ b/.prettierrc.js @@ -1,14 +1,14 @@ module.exports = { - bracketSpacing: true, - jsxBracketSameLine: false, - singleQuote: false, - trailingComma: 'all', - arrowParens: 'avoid', - endOfLine: 'lf', - embeddedLanguageFormatting: 'auto', - printWidth: 80, - proseWrap: "preserve", - tabWidth: 2, - semi : true, - useTabs: true, + bracketSpacing: true, + jsxBracketSameLine: false, + singleQuote: false, + trailingComma: "all", + arrowParens: "avoid", + endOfLine: "lf", + embeddedLanguageFormatting: "auto", + printWidth: 80, + proseWrap: "preserve", + tabWidth: 2, + semi: true, + useTabs: true, }; diff --git a/src/components/Header/Header.jsx b/src/components/Header/Header.jsx index a32a60ff..3db6da02 100644 --- a/src/components/Header/Header.jsx +++ b/src/components/Header/Header.jsx @@ -56,7 +56,10 @@ function Header() { return ( <> -
+
{ @@ -73,7 +76,8 @@ function Header() { exact activeClassName={styles.header_active_links} onClick={() => { - if (headerRef.current.classList.contains(styles.HeaderOpen)) drop(); + if (headerRef.current.classList.contains(styles.HeaderOpen)) + drop(); window.isHome = false; }} > @@ -85,7 +89,8 @@ function Header() { exact activeClassName={styles.header_active_links} onClick={() => { - if (headerRef.current.classList.contains(styles.HeaderOpen)) drop(); + if (headerRef.current.classList.contains(styles.HeaderOpen)) + drop(); window.isHome = false; }} > @@ -97,7 +102,8 @@ function Header() { exact activeClassName={styles.header_active_links} onClick={() => { - if (headerRef.current.classList.contains(styles.HeaderOpen)) drop(); + if (headerRef.current.classList.contains(styles.HeaderOpen)) + drop(); window.isHome = false; }} > @@ -109,7 +115,8 @@ function Header() { exact activeClassName={styles.header_active_links} onClick={() => { - if (headerRef.current.classList.contains(styles.HeaderOpen)) drop(); + if (headerRef.current.classList.contains(styles.HeaderOpen)) + drop(); window.isHome = false; }} > diff --git a/src/components/ScrollToTopButton/ScrollToTopButton.jsx b/src/components/ScrollToTopButton/ScrollToTopButton.jsx index d792ce8c..619eb807 100644 --- a/src/components/ScrollToTopButton/ScrollToTopButton.jsx +++ b/src/components/ScrollToTopButton/ScrollToTopButton.jsx @@ -18,7 +18,10 @@ const ScrollToTop = () => { }; function scrollFunction() { - if (document.body.scrollTop > 50 || document.documentElement.scrollTop > 50) { + if ( + document.body.scrollTop > 50 || + document.documentElement.scrollTop > 50 + ) { if (!buttonState.visible) { changeButtonState({ visible: true, diff --git a/src/index.scss b/src/index.scss index 5dddbe61..eec8f845 100644 --- a/src/index.scss +++ b/src/index.scss @@ -1,142 +1,142 @@ @font-face { - font-family: HomemadeApple; - src: url(./fonts/HomemadeApple-Regular.ttf); + font-family: HomemadeApple; + src: url(./fonts/HomemadeApple-Regular.ttf); } @font-face { - font-family: Gasalt; - src: url(./fonts/Gasalt-Black.ttf); + font-family: Gasalt; + src: url(./fonts/Gasalt-Black.ttf); } @font-face { - font-family: Dawning; - src: url(./fonts/DawningofaNewDay-Regular.ttf); + font-family: Dawning; + src: url(./fonts/DawningofaNewDay-Regular.ttf); } @font-face { - font-family: CedarvilleCursive; - src: url(./fonts/CedarvilleCursive-Regular.ttf); + font-family: CedarvilleCursive; + src: url(./fonts/CedarvilleCursive-Regular.ttf); } @font-face { - font-family: Caveat; - src: url(./fonts/Caveat-Regular.ttf); + font-family: Caveat; + src: url(./fonts/Caveat-Regular.ttf); } @font-face { - font-family: LeagueScript; - src: url(./fonts/LeagueScript-Regular.ttf); + font-family: LeagueScript; + src: url(./fonts/LeagueScript-Regular.ttf); } @font-face { - font-family: IndieFlower; - src: url(./fonts/IndieFlower-Regular.ttf); + font-family: IndieFlower; + src: url(./fonts/IndieFlower-Regular.ttf); } @font-face { - font-family: Liu; - src: url(./fonts/LiuJianMaoCao-Regular.ttf); + font-family: Liu; + src: url(./fonts/LiuJianMaoCao-Regular.ttf); } @font-face { - font-family: NothingYouCouldDo; - src: url(./fonts/NothingYouCouldDo-Regular.ttf); + font-family: NothingYouCouldDo; + src: url(./fonts/NothingYouCouldDo-Regular.ttf); } @font-face { - font-family: Lato; - src: url(./fonts/Poppins-Regular.otf); + font-family: Lato; + src: url(./fonts/Poppins-Regular.otf); } @font-face { - font-family: Luckiest Guy; - src: url(./fonts/LuckiestGuy-Regular.ttf); + font-family: Luckiest Guy; + src: url(./fonts/LuckiestGuy-Regular.ttf); } @font-face { - font-family: Enola; - src: url(./fonts/Enola-Regular.ttf); + font-family: Enola; + src: url(./fonts/Enola-Regular.ttf); } @font-face { - font-family: RGhandwritten; - src: url(./fonts/Rghandwritten-Regular.ttf); + font-family: RGhandwritten; + src: url(./fonts/Rghandwritten-Regular.ttf); } @font-face { - font-family: RayFont; - src: url(./fonts/RayFont-Regular.ttf); + font-family: RayFont; + src: url(./fonts/RayFont-Regular.ttf); } @font-face { - font-family: Moody; - src: url(./fonts/Moody-Regular.ttf); + font-family: Moody; + src: url(./fonts/Moody-Regular.ttf); } @font-face { - font-family: Norm; - src: url(./fonts/Norm-Regular.ttf); + font-family: Norm; + src: url(./fonts/Norm-Regular.ttf); } * { - margin: 0; - padding: 0; - box-sizing: border-box; - box-sizing: border-box !important; - transition: all 0.3s ease-out; + margin: 0; + padding: 0; + box-sizing: border-box; + box-sizing: border-box !important; + transition: all 0.3s ease-out; } html { - height: 100%; - width: 100%; - scroll-behavior: smooth; + height: 100%; + width: 100%; + scroll-behavior: smooth; } body { - background-color: #ffffff !important; - width: 100%; - height: 100%; - color: #1e1e1e !important; + background-color: #ffffff !important; + width: 100%; + height: 100%; + color: #1e1e1e !important; - font-family: Montserrat; + font-family: Montserrat; } @font-face { - font-family: Ruled1; - src: url(./fonts/Lato-Light.ttf); + font-family: Ruled1; + src: url(./fonts/Lato-Light.ttf); } @font-face { - font-family: Ruled2; - src: url(./fonts/Lato-Light.ttf); + font-family: Ruled2; + src: url(./fonts/Lato-Light.ttf); } @font-face { - font-family: OnlyMargin; - src: url(./fonts/Lato-Light.ttf); + font-family: OnlyMargin; + src: url(./fonts/Lato-Light.ttf); } @font-face { - font-family: Blank1; - src: url(./fonts/Lato-Light.ttf); + font-family: Blank1; + src: url(./fonts/Lato-Light.ttf); } @font-face { - font-family: Blank2; - src: url(./fonts/Lato-Light.ttf); + font-family: Blank2; + src: url(./fonts/Lato-Light.ttf); } body::-webkit-scrollbar { - width: 12px; + width: 12px; } body::-webkit-scrollbar-track { - -webkit-box-shadow: inset 0 0 8px rgba(12, 11, 11, 0.7); - box-shadow: inset 0 0 8px rgba(12, 11, 11, 0.7); - border-radius: 10px; + -webkit-box-shadow: inset 0 0 8px rgba(12, 11, 11, 0.7); + box-shadow: inset 0 0 8px rgba(12, 11, 11, 0.7); + border-radius: 10px; } body::-webkit-scrollbar-thumb { - border-radius: 10px; - -webkit-box-shadow: inset 0 0 13px rgba(31, 113, 180, 5); - box-shadow: inset 0 0 13px rgba(31, 113, 180, 5); + border-radius: 10px; + -webkit-box-shadow: inset 0 0 13px rgba(31, 113, 180, 5); + box-shadow: inset 0 0 13px rgba(31, 113, 180, 5); } ::selection:not(textarea) { - color: none; - background: none; + color: none; + background: none; } ::-moz-selection:not(textarea) { - color: none; - background: none; + color: none; + background: none; } -.root{ - overflow: hidden ; -} \ No newline at end of file +.root { + overflow: hidden; +} diff --git a/src/pages/Editor/components/DownloadFileModal/DownloadFileModal.jsx b/src/pages/Editor/components/DownloadFileModal/DownloadFileModal.jsx index 62981a38..7e823188 100644 --- a/src/pages/Editor/components/DownloadFileModal/DownloadFileModal.jsx +++ b/src/pages/Editor/components/DownloadFileModal/DownloadFileModal.jsx @@ -60,7 +60,11 @@ const DownloadFileModal = props => { - diff --git a/src/pages/Editor/containers/editContext.js b/src/pages/Editor/containers/editContext.js index 12bb8899..1c5475f8 100644 --- a/src/pages/Editor/containers/editContext.js +++ b/src/pages/Editor/containers/editContext.js @@ -87,7 +87,8 @@ const EditContextProvider = props => { else if (dataUrls.length === nodes.length) downloadZip(dataUrls, baseFileName); } else if (type === "PDF") { - if (dataUrls.length === nodes.length) downloadPdf(dataUrls, baseFileName); + if (dataUrls.length === nodes.length) + downloadPdf(dataUrls, baseFileName); } }) .catch(error => { diff --git a/src/pages/Editor/sections/OutputComponent/Output.jsx b/src/pages/Editor/sections/OutputComponent/Output.jsx index c9d021dc..53742afa 100644 --- a/src/pages/Editor/sections/OutputComponent/Output.jsx +++ b/src/pages/Editor/sections/OutputComponent/Output.jsx @@ -64,11 +64,15 @@ const OutputComponent = ({ pageNo, show }) => { >
Word Count:  - {wordCount} + + {wordCount} +
Page Number:  - {pageNo} + + {pageNo} +
diff --git a/src/pages/Editor/sections/Settings/Settings.jsx b/src/pages/Editor/sections/Settings/Settings.jsx index 4d314d16..ef6787a1 100644 --- a/src/pages/Editor/sections/Settings/Settings.jsx +++ b/src/pages/Editor/sections/Settings/Settings.jsx @@ -82,7 +82,11 @@ const Settings = () => { > {/* Download functionality */} - diff --git a/src/pages/Home/sections/About/About.jsx b/src/pages/Home/sections/About/About.jsx index ff503b9e..e444ae7b 100644 --- a/src/pages/Home/sections/About/About.jsx +++ b/src/pages/Home/sections/About/About.jsx @@ -31,8 +31,8 @@ function About() { who is tired of{" "} - writing assignments on paper, drawing sketches by hand, scanning each - page, converting it all to a PDF + writing assignments on paper, drawing sketches by hand, scanning + each page, converting it all to a PDF , and then finally submitting? @@ -88,13 +88,13 @@ function About() { Open Source
- As Doc2Pen helps save a lot of time, you can now invest your valuable time - towards learning some practical stuff. + As Doc2Pen helps save a lot of time, you can now invest your valuable + time towards learning some practical stuff.

- And So, here comes the Good News! Doc2pen is an Open Source Project and we - welcome your contributions ๐Ÿ™‚. + And So, here comes the Good News! Doc2pen is an Open Source Project + and we welcome your contributions ๐Ÿ™‚.
diff --git a/src/pages/Home/sections/Banner/banner.module.scss b/src/pages/Home/sections/Banner/banner.module.scss index e859d3ff..0abbec31 100644 --- a/src/pages/Home/sections/Banner/banner.module.scss +++ b/src/pages/Home/sections/Banner/banner.module.scss @@ -7,17 +7,17 @@ $bg-shade3: #203a43; $btn-hover-bg: #0d739eab; .Home { - background: -webkit-linear-gradient( - to right, - $bg-shade1 $bg-shade2, - $bg-shade3 - ); - background: linear-gradient(to right, $bg-shade1, $bg-shade2, $bg-shade3); - color: colors.$white; - height: 85vh; - padding: 1rem; - padding-top: 3rem; - + background: -webkit-linear-gradient( + to right, + $bg-shade1 $bg-shade2, + $bg-shade3 + ); + background: linear-gradient(to right, $bg-shade1, $bg-shade2, $bg-shade3); + color: colors.$white; + height: 85vh; + padding: 1rem; + padding-top: 3rem; + .content { display: flex; justify-content: center; diff --git a/src/pages/Home/sections/Contact/components/EmojiRating/EmojiRating.jsx b/src/pages/Home/sections/Contact/components/EmojiRating/EmojiRating.jsx index 8a93dbc4..d9c0cebd 100644 --- a/src/pages/Home/sections/Contact/components/EmojiRating/EmojiRating.jsx +++ b/src/pages/Home/sections/Contact/components/EmojiRating/EmojiRating.jsx @@ -14,7 +14,12 @@ function EmojiRating() { overlay={Liked it} > @@ -25,7 +30,12 @@ function EmojiRating() { overlay={Dislike} > @@ -53,7 +63,12 @@ function EmojiRating() { overlay={Loved it} > @@ -64,7 +79,12 @@ function EmojiRating() { overlay={Mind blowing} > diff --git a/src/pages/Home/sections/Contact/components/ExperienceForm/ExperienceForm.jsx b/src/pages/Home/sections/Contact/components/ExperienceForm/ExperienceForm.jsx index f3f0639e..3107edc2 100644 --- a/src/pages/Home/sections/Contact/components/ExperienceForm/ExperienceForm.jsx +++ b/src/pages/Home/sections/Contact/components/ExperienceForm/ExperienceForm.jsx @@ -60,8 +60,16 @@ function ExperienceForm() { Rate your experience: - - diff --git a/src/pages/Home/sections/OpenSource/open-source.module.scss b/src/pages/Home/sections/OpenSource/open-source.module.scss index 1703a4a1..058bb397 100644 --- a/src/pages/Home/sections/OpenSource/open-source.module.scss +++ b/src/pages/Home/sections/OpenSource/open-source.module.scss @@ -2,151 +2,151 @@ @use './../../../../scss/colors'; .OpenSource { - text-align: center; - margin-top: 7rem; - - .title { - @include mixin.section-title; - } - - .card_holder { - display: flex; - justify-content: center; - flex-wrap: wrap; - - .card { - display: grid; - grid-template-columns: 300px; - grid-template-rows: auto auto auto; - grid-template-areas: "image" "text" "stats"; - border-radius: 18px; - box-shadow: 1px 1px 3px 0px colors.$black-light-tint; - text-align: center; - overflow: hidden; - position: relative; - z-index: 0; - transition: 0.5s ease; - cursor: pointer; - margin: 30px; - width: fit-content; - - &:hover { - transform: scale(1.05); - box-shadow: 2px 2px 6px 0px colors.$black-light-tint; - } - - &:before { - content: ""; - position: absolute; - z-index: -1; - top: -16px; - right: -16px; - height: 52px; - width: 52px; - border-radius: 32px; - transform: scale(1); - transform-origin: 50% 50%; - transition: transform 0.25s ease-out, -webkit-transform 0.25s ease-out; - } - - &:hover:before { - transform: scale(22); - } - - .card_image { - grid-area: image; - grid-row: 1; - grid-column: 1; - border-top-left-radius: 15px; - border-top-right-radius: 15px; - - img { - height: 250px; - width: 270px; - border-radius: 10px; - margin-top: 10px; - } - @media ( max-width: 300px ){ - img{ - width: 100%; - margin-top: 0; - height: unset; - } - } - } - .card_text { - grid-area: text; - grid-row: 2; - grid-column: 1; - margin: 25px; - - p { - color: colors.$grey; - font-size: 14.9px; - margin: 0; - } - - h2 { - font-size: 28px; - color: colors.$black; - font-weight: 500; - } - } - .card_stats { - display: flex; - grid-area: stats; - padding: 17px 0 23px 0; - margin-bottom: 5px; - text-align: center; - grid-row: 3; - grid-column: 1; - - .card_btn { - border-radius: 4px; - background-color: #2c8da4; - border: none; - color: #fff; - text-align: center; - font-size: 25px; - padding: 16px; - width: 200px; - transition: all 0.5s; - cursor: pointer; - margin: 36px; - box-shadow: 0 10px 20px -8px rgba(0, 0, 0, 0.7); - } - - .card_btn { - cursor: pointer; - display: inline-block; - position: relative; - transition: 0.5s; - } - - .card_btn:after { - content: "ยป"; - position: absolute; - opacity: 0; - top: 14px; - right: -20px; - transition: 0.5s; - } - - .card_btn:hover { - padding-right: 24px; - padding-left: 8px; - } - - .card_btn:hover:after { - opacity: 1; - right: 10px; - } - } - } - @media ( max-width: 300px ){ - .card{ - grid-template-columns: 220px; - } - } - } + text-align: center; + margin-top: 7rem; + + .title { + @include mixin.section-title; + } + + .card_holder { + display: flex; + justify-content: center; + flex-wrap: wrap; + + .card { + display: grid; + grid-template-columns: 300px; + grid-template-rows: auto auto auto; + grid-template-areas: "image" "text" "stats"; + border-radius: 18px; + box-shadow: 1px 1px 3px 0px colors.$black-light-tint; + text-align: center; + overflow: hidden; + position: relative; + z-index: 0; + transition: 0.5s ease; + cursor: pointer; + margin: 30px; + width: fit-content; + + &:hover { + transform: scale(1.05); + box-shadow: 2px 2px 6px 0px colors.$black-light-tint; + } + + &:before { + content: ""; + position: absolute; + z-index: -1; + top: -16px; + right: -16px; + height: 52px; + width: 52px; + border-radius: 32px; + transform: scale(1); + transform-origin: 50% 50%; + transition: transform 0.25s ease-out, -webkit-transform 0.25s ease-out; + } + + &:hover:before { + transform: scale(22); + } + + .card_image { + grid-area: image; + grid-row: 1; + grid-column: 1; + border-top-left-radius: 15px; + border-top-right-radius: 15px; + + img { + height: 250px; + width: 270px; + border-radius: 10px; + margin-top: 10px; + } + @media (max-width: 300px) { + img { + width: 100%; + margin-top: 0; + height: unset; + } + } + } + .card_text { + grid-area: text; + grid-row: 2; + grid-column: 1; + margin: 25px; + + p { + color: colors.$grey; + font-size: 14.9px; + margin: 0; + } + + h2 { + font-size: 28px; + color: colors.$black; + font-weight: 500; + } + } + .card_stats { + display: flex; + grid-area: stats; + padding: 17px 0 23px 0; + margin-bottom: 5px; + text-align: center; + grid-row: 3; + grid-column: 1; + + .card_btn { + border-radius: 4px; + background-color: #2c8da4; + border: none; + color: #fff; + text-align: center; + font-size: 25px; + padding: 16px; + width: 200px; + transition: all 0.5s; + cursor: pointer; + margin: 36px; + box-shadow: 0 10px 20px -8px rgba(0, 0, 0, 0.7); + } + + .card_btn { + cursor: pointer; + display: inline-block; + position: relative; + transition: 0.5s; + } + + .card_btn:after { + content: "ยป"; + position: absolute; + opacity: 0; + top: 14px; + right: -20px; + transition: 0.5s; + } + + .card_btn:hover { + padding-right: 24px; + padding-left: 8px; + } + + .card_btn:hover:after { + opacity: 1; + right: 10px; + } + } + } + @media (max-width: 300px) { + .card { + grid-template-columns: 220px; + } + } + } } diff --git a/src/pages/Home/sections/Team/Team.jsx b/src/pages/Home/sections/Team/Team.jsx index f2d07f02..8ecac1b8 100644 --- a/src/pages/Home/sections/Team/Team.jsx +++ b/src/pages/Home/sections/Team/Team.jsx @@ -71,7 +71,11 @@ function Team() { className={`${styles.position_relative} ${styles.d_inline_block} ${styles.text_center} ${styles.grid_wd_100} ${styles.figure}`} key={c.login} > - Profile + Profile
diff --git a/src/pages/Home/sections/Team/components/FluidCard/FluidCard.jsx b/src/pages/Home/sections/Team/components/FluidCard/FluidCard.jsx index 5277d568..935b66c6 100644 --- a/src/pages/Home/sections/Team/components/FluidCard/FluidCard.jsx +++ b/src/pages/Home/sections/Team/components/FluidCard/FluidCard.jsx @@ -299,7 +299,11 @@ function FluidCard(props) { return (
-
+
@@ -322,7 +326,11 @@ function FluidCard(props) { target="_blank" rel="noopener noreferrer" > - +
diff --git a/src/pages/Home/sections/Team/team.module.scss b/src/pages/Home/sections/Team/team.module.scss index 8e4c50ae..80e63d13 100644 --- a/src/pages/Home/sections/Team/team.module.scss +++ b/src/pages/Home/sections/Team/team.module.scss @@ -2,10 +2,10 @@ @use './../../../../scss/colors'; .Team { - padding: 0 20px; - text-align: center; - font-size: 28px; - overflow: hidden; + padding: 0 20px; + text-align: center; + font-size: 28px; + overflow: hidden; .titleMain { @include mixin.section-title; } diff --git a/src/pages/Sketch/components/Canvas.jsx b/src/pages/Sketch/components/Canvas.jsx index b6aba54c..958171f1 100644 --- a/src/pages/Sketch/components/Canvas.jsx +++ b/src/pages/Sketch/components/Canvas.jsx @@ -69,7 +69,9 @@ function Canvas() { image.src = dataURL; image.onload = () => { ctx.drawImage(image, 0, 0); - setCanvasStates(() => [ctx.getImageData(0, 0, canvasWidth, canvasHeight)]); + setCanvasStates(() => [ + ctx.getImageData(0, 0, canvasWidth, canvasHeight), + ]); setcanvasStateAt(0); }; }, @@ -171,7 +173,9 @@ function Canvas() { text, downPoint.x, downPoint.y + - parseInt(document.getElementById("canvas-text-input").offsetHeight) - + parseInt( + document.getElementById("canvas-text-input").offsetHeight, + ) - 5, ); setIsWriting(false); @@ -647,7 +651,9 @@ function Canvas() { onClick={() => redo()} style={{ cursor: `${ - canvasStateAt === canvasStates.length - 1 ? "not-allowed" : "pointer" + canvasStateAt === canvasStates.length - 1 + ? "not-allowed" + : "pointer" }`, }} id="sketch-dcd-redo" diff --git a/src/pages/Sketch/components/Toolbox/Toolbox.jsx b/src/pages/Sketch/components/Toolbox/Toolbox.jsx index c3975fec..fa017de0 100644 --- a/src/pages/Sketch/components/Toolbox/Toolbox.jsx +++ b/src/pages/Sketch/components/Toolbox/Toolbox.jsx @@ -158,7 +158,9 @@ function VerticalTabs(props) { return (
- + - setFontFamily(e.target.value)} + > diff --git a/src/scss/_mixin.scss b/src/scss/_mixin.scss index de6528a5..2ed868c1 100644 --- a/src/scss/_mixin.scss +++ b/src/scss/_mixin.scss @@ -1,10 +1,9 @@ @use './colors'; @mixin section-title { - font-family: "Poppins", sans-serif; - color: colors.$steel-blue; - font-size: 2rem; - font-weight: bold; - text-shadow: 3px 4px 2px #0000002e; + font-family: "Poppins", sans-serif; + color: colors.$steel-blue; + font-size: 2rem; + font-weight: bold; + text-shadow: 3px 4px 2px #0000002e; } -