Introduce Stylelint

Author: x3388638

.stylelintrc.json

@@ -0,0 +1,10 @@
+{
+  "processors": ["stylelint-processor-styled-components"],
+  "extends": [
+    "stylelint-config-standard",
+    "stylelint-config-styled-components"
+  ],
+  "rules": {
+    "declaration-colon-newline-after": null
+  }
+}

examples/home/App.js

@@ -32,9 +32,10 @@ const CustomBtn = styled.div`
 
 const CustomDot = styled.span`
   display: inline-block;
-  height: ${({ isActive }) => (isActive ? '8px' : '6px')};
-  width: ${({ isActive }) => (isActive ? '8px' : '6px')};
+  height: 8px;
+  width: ${({ isActive }) => (isActive ? '16px' : '8px')};
   opacity: ${({ isActive }) => (isActive ? '0.8' : '0.5')};
+  border-radius: 8px;
   background: red;
   transition: all 0.2s;
 `

examples/image-carousel/App.js

@@ -35,6 +35,7 @@ const HotelRow = styled.div`
 
 const CarouselWapeer = styled.div`
   width: 340px;
+
   @media screen and (max-width: 767px) {
     margin-bottom: 20px;
     width: 100%;

examples/tour-carousel/App.js

@@ -36,7 +36,7 @@ const City = styled.div`
 
   &:hover {
     transform: translateY(-5px);
-    box-shadow: 0px 5px 5px 0px #666;
+    box-shadow: 0 5px 5px 0 #666;
   }
 `