Add Pattern

saurabh73 · Dec 31, 2020 · 8087a3b · 8087a3b
1 parent aea86e7
commit 8087a3b
Show file tree

Hide file tree

Showing 6 changed files with 55 additions and 8 deletions.
diff --git a/src/assets/images/dark-pattern.svg b/src/assets/images/dark-pattern.svg
diff --git a/src/assets/images/light-pattern.svg b/src/assets/images/light-pattern.svg
diff --git a/src/components/portfolio-card/index.js b/src/components/portfolio-card/index.js
@@ -56,5  56,18 @@ const PortfolioCard = ({ portfolio }) => {
   );
 }
 
 PortfolioCard.propTypes = {
   portfolio: PropTypes.shape({
     id: PropTypes.string.isRequired,
     name: PropTypes.string.isRequired,
     description: PropTypes.string,
     tags: PropTypes.array,
     role: PropTypes.string,
     link: PropTypes.string,
     background: PropTypes.string,
     image: PropTypes.object,
     showBadge: PropTypes.bool
   }).isRequired
 };
 
 export default PortfolioCard;
diff --git a/src/pages/portfolio.js b/src/pages/portfolio.js
@@ -36,7  36,7 @@ const PortfolioPage = () => {
         <h1 className="title">Projects</h1>
 
         {data.portfolio.nodes.map((portfolio) => (
-          <PortfolioCard portfolio={portfolio} />
           <PortfolioCard key={portfolio.id} portfolio={portfolio} />
         ))}
       </div>
     </Layout>

diff --git a/src/styles/_theme.scss b/src/styles/_theme.scss
@@ -20,11  20,13 @@ $themes: (
 
 // Bootstrap Variables
 $primary: #158ff3;
 $dark: #3f3855;
 $activeColor: $primary;
 $font-family-sans-serif: "HK Grotesk", sans-serif;
 $font-family-monospace: "Anonymous Pro", monospace;
 $theme-colors: (
   "primary": $primary,
   "dark": $dark,
 );
 $hamburger-padding-x: 0px;
 $hamburger-padding-y: 5px;

diff --git a/src/styles/style.scss b/src/styles/style.scss
@@ -11,6  11,25 @@ body {
   position: relative;
   font-family: $font-family-sans-serif;
   font-size: 1rem;
 
   &.light {
     background-image: url("./../assets/images/light-pattern.svg");
 
     header,
     .overlay-menu__overlay {
       transition: all 300ms ease-in-out;
       background-image: url("./../assets/images/light-pattern.svg");
     }
   }
 
   &.dark {
     background-image: url("./../assets/images/dark-pattern.svg");
 
     header,
     .overlay-menu__overlay {
       background-image: url("./../assets/images/dark-pattern.svg");
     }
   }
 }
 
 p {
@@ -135,7  154,7 @@ button:focus {
     }
 
     .nav-link {
-      background: rgba(0, 0, 0, 0.1);
       // background: rgba(0, 0, 0, 0.1);
       border-radius: 0.5rem;
       padding: 1rem;
       width: 100%;
@@ -348,10  367,18 @@ button:focus {
     }
   }
 
   .nav-mobile {
     .nav-link {
       transition: all 300ms ease-in-out;
       background-color: themed("backgroundColor");
       box-shadow: 0px 15px 20px themed("shadowColor");
     }
   }
 
   a.btn-resume {
-    box-shadow: 0px 15px 20px themed("shadowColor");
     transition: all 300ms ease-in-out;
-    background-color: rgba(153, 153, 153, 0.1);
     background-color: themed("backgroundColor");
     box-shadow: 0px 15px 20px themed("shadowColor");
     color: themed("contentTextColor");
     font-weight: bold;
 
@@ -378,10  405,13 @@ button:focus {
     border-bottom-right-radius: 0.5rem;
   }
 
-  .portfolio-body {
-    .badge {
-      background-color: themed("headerTextColor");
-      color: themed("contentBackgroundColor");
   .portfolio-card {
     box-shadow: 0px 15px 20px themed("shadowColor");
     .portfolio-body {
       .badge {
         background-color: themed("headerTextColor");
         color: themed("contentBackgroundColor");
       }
     }
   }