Redesigned footer component

.github/ISSUE_TEMPLATE/bug.yml

@@ -1,54 +1,54 @@
 name: 🐞 Bug
 description: File a bug/issue
-title: "[BUG] <title>"
+title: '[BUG] <title>'
 labels: [Bug, Needs Triage]
 body:
-- type: checkboxes
-  attributes:
-    label: Is there an existing issue for this?
-    description: Please search to see if an issue already exists for the bug you encountered.
-    options:
-    - label: I have searched the existing issues
-      required: true
-- type: textarea
-  attributes:
-    label: Current Behavior
-    description: A concise description of what you're experiencing.
-  validations:
-    required: false
-- type: textarea
-  attributes:
-    label: Expected Behavior
-    description: A concise description of what you expected to happen.
-  validations:
-    required: false
-- type: textarea
-  attributes:
-    label: Steps To Reproduce
-    description: Steps to reproduce the behavior.
-    placeholder: |
-      1. In this environment...
-      2. With this config...
-      3. Run '...'
-      4. See error...
-  validations:
-    required: false
-- type: textarea
-  attributes:
-    label: Anything else?
-    description: |
-      Links? References? Anything that will give us more context about the issue you are encountering!
-      
-      Tip: You can attach images or log files by clicking this area to highlight it and then dragging files in.
-  validations:
-    required: false
-- type: dropdown
-  id: browsers
-  attributes:
-    label: What browsers are you seeing the problem on?
-    multiple: true
-    options:
-      - Firefox
-      - Chrome
-      - Safari
-      - Microsoft Edge
+  - type: checkboxes
+    attributes:
+      label: Is there an existing issue for this?
+      description: Please search to see if an issue already exists for the bug you encountered.
+      options:
+        - label: I have searched the existing issues
+          required: true
+  - type: textarea
+    attributes:
+      label: Current Behavior
+      description: A concise description of what you're experiencing.
+    validations:
+      required: false
+  - type: textarea
+    attributes:
+      label: Expected Behavior
+      description: A concise description of what you expected to happen.
+    validations:
+      required: false
+  - type: textarea
+    attributes:
+      label: Steps To Reproduce
+      description: Steps to reproduce the behavior.
+      placeholder: |
+        1. In this environment...
+        2. With this config...
+        3. Run '...'
+        4. See error...
+    validations:
+      required: false
+  - type: textarea
+    attributes:
+      label: Anything else?
+      description: |
+        Links? References? Anything that will give us more context about the issue you are encountering!
+
+        Tip: You can attach images or log files by clicking this area to highlight it and then dragging files in.
+    validations:
+      required: false
+  - type: dropdown
+    id: browsers
+    attributes:
+      label: What browsers are you seeing the problem on?
+      multiple: true
+      options:
+        - Firefox
+        - Chrome
+        - Safari
+        - Microsoft Edge

.github/ISSUE_TEMPLATE/feature_request.yml

@@ -0,0 +1,25 @@
+name: Feature Request
+description: Suggest an idea for this project
+title: 'Feature Request: '
+labels: [enhancement]
+
+body:
+  - type: markdown
+    attributes:
+      value: Thank you for taking the time to file a Feature Request report.
+  - type: textarea
+    attributes:
+      label: Is your feature request related to a problem? Please describe.
+      description: 'A clear and concise description of what the problem is. Ex. I am always frustrated when [...]'
+  - type: textarea
+    attributes:
+      label: Describe the solution you'd like.
+      description: 'A clear and concise description of what you want to happen.'
+  - type: textarea
+    attributes:
+      label: Describe alternatives you've considered
+      description: 'A clear and concise description of any alternative solutions or features you have considered.'
+  - type: textarea
+    attributes:
+      label: Additional context.
+      description: 'Add any other context or screenshots about the feature request here.'

src/assets/scss/base/flex.scss

@@ -22,6 +22,15 @@
   }
 }
 
+.flex-col {
+  flex-direction: column;
+  align-items: center;
+
+  @media (min-width: $mobile-max) {
+    flex-direction: row;
+  }
+}
+
 .flex-wrap-sm {
   @media (max-width: $mobile-max) {
 

src/assets/scss/components/footer.scss

@@ -49,6 +49,10 @@ footer {
     }
   }
 
+  .color-gray {
+    color: gray;
+  }
+
   @media (max-width: $mobile-max) {
     margin-bottom: 80px;
   }

src/components/Footer.js

@@ -4,7 +4,7 @@ import links from '../utils/Links.store'
 const Footer = () => {
   return (
     <footer>
-      <div className='container flex flex-wrap'>
+      <div className='container flex flex-col flex-wrap'>
         {links.map((ele, i) => {
           return <FooterBlock {...ele} key={i} />
         })}
@@ -20,6 +20,7 @@ const FooterBlock = ({ img, title, links }) => {
       <div className='footer-block-list'>
         {links?.map((ele, index) => (
           <a
+            className='color-gray'
             key={index}
             href={ele.href}
             data-types-category={ele.category}