Merge pull request #144 from react-native-community/renovate/styled-components-5.x

fix(deps): update dependency styled-components to v5

Author: Lucas Bento

package.json

@@ -17,7 +17,7 @@
     "react-github-btn": "1.1.1",
     "react-scripts": "3.0.1",
     "semver": "7.1.1",
-    "styled-components": "4.4.1"
+    "styled-components": "5.0.0"
   },
   "devDependencies": {
     "eslint": "5.16.0",

src/__tests__/components/common/__snapshots__/CompletedFilesCounter.spec.js.snap

@@ -3,7 +3,7 @@
 exports[`renders without crashing 1`] = `
 <div>
   <div
-    class="sc-bdVaJa eYGfss"
+    class="sc-AykKC dtOdrK"
   >
     <span
       class="completedAmount"

src/__tests__/components/common/__snapshots__/Loading.spec.js.snap

@@ -4,7 +4,7 @@ exports[`renders without crashing 1`] = `
 <div>
   <img
     alt="Loading"
-    class="sc-bdVaJa dRbStl"
+    class="sc-AykKC cqLuft"
     logo="test.png"
     src="loading.svg"
     title="Loading"

src/__tests__/components/common/__snapshots__/Select.spec.js.snap

@@ -3,13 +3,13 @@
 exports[`renders without crashing 1`] = `
 <div>
   <div
-    class="sc-bdVaJa UoSJW"
+    class="sc-AykKC kCkcwd"
   >
     <h4>
       MyTitle
     </h4>
     <div
-      class="ant-select-lg sc-bwzfXH jwfMIB ant-select ant-select-enabled"
+      class="ant-select-lg sc-AykKD epVcji ant-select ant-select-enabled"
     >
       <div
         aria-autocomplete="list"

src/__tests__/components/common/__snapshots__/UsefulContentSection.spec.js.snap

@@ -3,23 +3,23 @@
 exports[`renders without crashing 1`] = `
 <div>
   <div
-    class="sc-htpNat cxJeAb"
+    class="sc-AykKE dnSnnP"
   >
     <div
-      class="sc-bxivhb cnNsuz"
+      class="sc-AykKF dqdZRH"
     >
       <h2>
         <span
           aria-label="Close useful content section"
-          class="sc-ifAKCX dQIIsA"
+          class="sc-AykKG gpypFm"
           role="img"
         >
           📣
         </span>
          Useful content for upgrading
       </h2>
       <button
-        class="ant-btn sc-EHOje kMAZtT ant-btn-link ant-btn-icon-only"
+        class="ant-btn sc-AykKH cLLRHK ant-btn-link ant-btn-icon-only"
         type="button"
       >
         <i
@@ -46,11 +46,11 @@ exports[`renders without crashing 1`] = `
         React Native 0.61 includes Fast Refresh and more.
       </span>
       <ol
-        class="sc-gzVnrw emyMmg"
+        class="sc-AykKJ imPLGX"
       >
         <li>
           <a
-            class="sc-bdVaJa dFUFTG"
+            class="sc-AykKC csdPub"
             href="https://facebook.github.io/react-native/blog/2019/09/18/version-0.61"
             rel="noopener"
             target="_blank"
@@ -60,7 +60,7 @@ exports[`renders without crashing 1`] = `
         </li>
         <li>
           <a
-            class="sc-bdVaJa dFUFTG"
+            class="sc-AykKC csdPub"
             href="https://reactnative.thenativebits.com/courses/upgrading-react-native/upgrade-to-react-native-0.61/"
             rel="noopener"
             target="_blank"
@@ -70,7 +70,7 @@ exports[`renders without crashing 1`] = `
         </li>
         <li>
           <a
-            class="sc-bdVaJa dFUFTG"
+            class="sc-AykKC csdPub"
             href="https://github.com/react-native-community/releases/blob/master/CHANGELOG.md#061"
             rel="noopener"
             target="_blank"

src/__tests__/components/common/__snapshots__/VersionSelector.spec.js.snap

@@ -3,16 +3,16 @@
 exports[`renders without crashing 1`] = `
 <div>
   <div
-    class="sc-htpNat hqmgw"
+    class="sc-AykKE eYKWmu"
   >
     <div
-      class="sc-bdVaJa UoSJW"
+      class="sc-AykKC kCkcwd"
     >
       <h4>
         What's your current React Native version?
       </h4>
       <div
-        class="ant-select-lg sc-bwzfXH jwfMIB sc-bxivhb iYdHlP ant-select ant-select-enabled ant-select-loading"
+        class="ant-select-lg sc-AykKD epVcji sc-AykKF ksxpcV ant-select ant-select-enabled ant-select-loading"
       >
         <div
           aria-autocomplete="list"
@@ -62,13 +62,13 @@ exports[`renders without crashing 1`] = `
       </div>
     </div>
     <div
-      class="sc-bdVaJa UoSJW"
+      class="sc-AykKC kCkcwd"
     >
       <h4>
         To which version would you like to upgrade?
       </h4>
       <div
-        class="ant-select-lg sc-bwzfXH jwfMIB sc-ifAKCX dTveGH ant-select ant-select-enabled ant-select-loading"
+        class="ant-select-lg sc-AykKD epVcji sc-AykKG bxUSbb ant-select ant-select-enabled ant-select-loading"
       >
         <div
           aria-autocomplete="list"
@@ -119,7 +119,7 @@ exports[`renders without crashing 1`] = `
     </div>
   </div>
   <div
-    class="sc-EHOje jWoLok"
+    class="sc-AykKH jYujfn"
   >
     <button
       class="ant-btn ant-btn-primary ant-btn-lg"

src/components/common/Diff/DiffComment.js

@@ -17,11 +17,12 @@ const CommentContent = styled.div`
 `
 
 const CommentButton = styled(Button)`
-  height: 16px;
-  width: 16px;
+  min-width: initial;
+  width: 20px;
+  height: 20px;
   position: absolute;
-  top: 1px;
-  left: -10px;
+  top: -1px;
+  left: 5px;
   font-size: 8px;
   cursor: 'pointer';
 `