Merge pull request #8 from riitasointi/linters

Linters

.eslintrc.json

@@ -1,6 +1,17 @@
 {
-  "extends": "next/core-web-vitals",
+  "extends": [
+    "plugin:@typescript-eslint/recommended",
+    "next/core-web-vitals",
+    "plugin:jsx-a11y/recommended",
+    "plugin:prettier/recommended"
+  ],
+  "plugins": ["@typescript-eslint", "prettier"],
   "rules": {
-    "@next/next/no-img-element": "off"
+    "@typescript-eslint/no-unused-vars": "off",
+    "@typescript-eslint/no-explicit-any": "off",
+    "@typescript-eslint/no-unnecessary-type-constraint": "off",
+    "@typescript-eslint/ban-types": ["off", { "types": ["{}", "object"] }],
+    "@next/next/no-img-element": "off",
+    "prettier/prettier": "error"
   }
 }

.husky/common.sh

@@ -0,0 +1,8 @@
+command_exists () {
+  command -v "$1" >/dev/null 2>&1
+}
+
+# Workaround for Windows 10, Git Bash and Yarn
+if command_exists winpty && test -t 1; then
+  exec < /dev/tty
+fi

.husky/pre-commit

@@ -0,0 +1,5 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+. "$(dirname "$0")/common.sh"
+
+yarn pre-commit

.stylelintrc.json

@@ -0,0 +1,16 @@
+{
+  "plugins": ["stylelint-prettier"],
+  "extends": ["stylelint-config-standard-scss"],
+  "rules": {
+    "scss/at-import-no-partial-leading-underscore": null,
+    "length-zero-no-unit": null,
+    "shorthand-property-no-redundant-values": null,
+    "selector-class-pattern": [
+      "^[a-zA-Z][a-zA-Z0-9-_]+$",
+      {
+        "message": "Expected selector to be camelCase or  kebab-case"
+      }
+    ],
+    "prettier/prettier": true
+  }
+}

GrandOne/BoxWithIcon/BoxWithIcon.module.scss

@@ -1,62 +1,63 @@
 .box-with-icon {
-    align-items: center;
-    display: flex;
-    overflow: hidden;
-    padding: 20px;
-    position: relative;
-    background: #fff;
-    border-radius: 4px;
-    box-shadow: 0 2px 4px 1px rgb(41 41 41 / 20%);
-    max-width: 420px;
+  align-items: center;
+  display: flex;
+  overflow: hidden;
+  padding: 20px;
+  position: relative;
+  background: #fff;
+  border-radius: 4px;
+  box-shadow: 0 2px 4px 1px rgb(41 41 41 / 20%);
+  max-width: 420px;
 }
+
 .box-with-icon_icon-container {
-    line-height: 0;
-    z-index: 3;
+  line-height: 0;
+  z-index: 3;
 }
 
 .box-with-icon_text {
-    flex: 1;
-    display: flex;
-    justify-content: center;
+  flex: 1;
+  display: flex;
+  justify-content: center;
 }
 
 .box-with-icon_h3 {
-    text-align: center;
+  text-align: center;
 }
 
 .box-with-icon::before {
-    background: #f0f6ff;
-    border-radius: 50%;
-    content: "";
-    display: block;
-    height: 210px;
-    left: -90px;
-    position: absolute;
-    top: 50%;
-    transform: translateY(-50%);
-    width: 210px;
-    z-index: 2;
+  background: #f0f6ff;
+  border-radius: 50%;
+  content: '';
+  display: block;
+  height: 210px;
+  left: -90px;
+  position: absolute;
+  top: 50%;
+  transform: translateY(-50%);
+  width: 210px;
+  z-index: 2;
 }
 
 .simplebox-with-icon {
-    align-items: center;
-    display: flex;
-    overflow: hidden;
-    padding: 20px;
-    background: #fff;
-    border-radius: 2px;
-    box-shadow: 0 2px 4px 1px rgb(41 41 41 / 20%);
-    width: 320px;
+  align-items: center;
+  display: flex;
+  overflow: hidden;
+  padding: 20px;
+  background: #fff;
+  border-radius: 2px;
+  box-shadow: 0 2px 4px 1px rgb(41 41 41 / 20%);
+  width: 320px;
 }
+
 .simplebox-with-icon_icon-container {
-    line-height: 0;
-    margin-right: 20px;
-    z-index: 3;
+  line-height: 0;
+  margin-right: 20px;
+  z-index: 3;
 }
 
-
 @media (max-width: 991px) {
-    .simplebox-with-icon {
-        width: 100%;
-    }
-}
+  .simplebox-with-icon {
+    width: 100%;
+  }
+}

GrandOne/GrandOnePage.scss

@@ -10,15 +10,18 @@
     margin-right: auto;
     margin-left: auto;
   }
+
   .half-container {
     display: flex;
     justify-content: space-between;
     gap: 40px;
     flex-direction: column;
   }
+
   .half {
     width: 100%;
   }
+
   .boxes {
     display: flex;
     justify-content: flex-start;
@@ -27,171 +30,191 @@
     padding: 0;
     margin: 0;
   }
-  
+
   .boxes li {
     list-style-type: none;
     display: flex;
   }
-  
+
   .boxes-2 {
     padding: 0;
     margin: 0;
   }
+
   .boxes-2 li {
     list-style-type: none;
   }
 
   .simplebox-icon {
     width: 40px;
     height: auto;
-    color: #235A9A;
+    color: #235a9a;
   }
 
   .box-icon {
     width: 70px;
     height: auto;
   }
-  
+
   #hero {
     width: 100%;
-    background-image: url("/grand-one/grand-one-banner.png");
+    background-image: url('/grand-one/grand-one-banner.png');
     background-size: cover;
     background-repeat: no-repeat;
     background-position: center;
     height: 400px;
   }
+
   .buttons {
     display: flex;
     justify-content: flex-start;
     gap: 25px;
     flex-wrap: wrap;
   }
+
   .quotebox {
     background: #fff;
     border-radius: 2px;
     box-shadow: 0 2px 4px 1px rgb(41 41 41 / 20%);
     padding: 30px 40px;
     text-align: center;
   }
-  
+
   .quotebox .quote {
     font-style: italic;
     font-size: 16px;
     text-align: center;
   }
-
-
+
   #section1 {
     padding: var(--grand-one-section-spacing-small) 0;
   }
+
   #section2 {
-    background: #F0F6FF;
+    background: #f0f6ff;
     padding: var(--grand-one-section-spacing-small) 0;
   }
+
   #section3 {
     padding: var(--grand-one-section-spacing-small) 0;
   }
-  
+
   #section4 .left {
     background: url('/grand-one/SFI-tabletti.jpg');
     background-size: cover;
     background-position: center;
   }
-  
+
   #section4 .text-container {
     max-width: 550px;
   }
-  
+
   #section5 {
     padding: var(--grand-one-section-spacing-small) 0;
   }
-  
+
   #section6 {
-    background: #F0F6FF;
+    background: #f0f6ff;
     padding: var(--grand-one-section-spacing-small) 0;
   }
-  
+
   #section7 {
     padding: var(--grand-one-section-spacing-small) 0;
   }
-  
+
   #section8 {
     padding: var(--grand-one-section-spacing-small) 0;
     background-image: url('/hero_bg.png');
   }
-
-
+
   @media (min-width: 576px) {
     .container {
       width: 540px;
     }
   }
+
   @media (min-width: 768px) {
     .container {
       width: 720px;
     }
-    #section1, #section2, #section3, #section5, #section6, #section7, #section8 {
+
+    #section1,
+    #section2,
+    #section3,
+    #section5,
+    #section6,
+    #section7,
+    #section8 {
       padding: var(--grand-one-section-spacing) 0;
     }
   }
+
   @media (min-width: 992px) {
     .container {
       width: 960px;
     }
+
     .half-container {
       flex-direction: row;
       gap: 60px;
     }
+
     .half {
       flex: 1;
     }
-  
+
     #section4 .half-container {
       background: #235a9a;
       padding: 0;
       width: 100%;
       gap: 90px;
     }
-  
+
     #section4 .right {
       padding: 65px 35px 65px 0;
     }
   }
+
   @media (min-width: 1200px) {
     #hero {
       height: 520px;
     }
+
     .container {
       width: 1140px;
       padding: 0;
     }
+
     .boxes {
       justify-content: space-between;
     }
   }
-  
+
   @media (max-width: 574px) {
-    #section4 .half-container .text-container{
+    #section4 .half-container .text-container {
       padding: 20px 20px 60px 20px;
     }
   }
-  
+
   @media (max-width: 991px) {
-    .boxes li{
+    .boxes li {
       width: 100%;
     }
+
     #section4 {
       background: #235a9a;
       padding-bottom: var(--grand-one-section-spacing-small) 0;
     }
+
     #section4 .left {
       height: 400px;
     }
+
     #section4 .half-container {
       padding: 0;
     }
   }
-  
+
   @media (min-width: 575px) and (max-width: 991px) {
     #section4 .half-container {
       padding: var(--grand-one-section-spacing) 0;