Fix icons invisible on iOS

It was ONLY because of flex-direction being row by default. Switched to column, does the trick… !?%@

src/style/atoms/_button-control.scss

@@ -2,6 +2,7 @@
 .button-control {
     position: relative;
     display: flex;
+    flex-direction: column;
     align-items: center;
     justify-content: center;
     width: 40px;
@@ -9,7 +10,7 @@
     overflow: hidden;
     padding-top: 2px;
     pointer-events: auto;
-    border-radius: 100%;
+    border-radius: 50%;
     border: none;
     cursor: pointer;
     outline: none;
@@ -23,6 +24,7 @@
 
     // Icon
     .icon {
+        position: relative;
         overflow: hidden;
         display: block;
         width: 13px;
@@ -266,4 +268,4 @@
             }
         }
     }
-}
+}

src/style/atoms/_link.scss

@@ -44,7 +44,7 @@
         height: 22px;
         margin-left: 6px;
         background-color: #fff;
-        border-radius: 100%;
+        border-radius: 50%;
 
         svg {
             height: auto;

src/style/molecules/_globe.scss

@@ -67,7 +67,7 @@
             width: 8px;
             height: 8px;
             padding: 4px;
-            border-radius: 100%;
+            border-radius: 50%;
             opacity: 1;
             background: #ff6c89;
             will-change: transform;

src/style/molecules/_location.scss

@@ -22,7 +22,7 @@
         width: 32px;
         height: auto;
         margin: 0 auto;
-        border-radius: 100%;
+        border-radius: 50%;
     }
 
     // City
@@ -75,7 +75,7 @@
         width: 184px;
         height: 184px;
         background: rgba($color-lightpurple, 0.3);
-        border-radius: 100%;
+        border-radius: 50%;
         transition: transform 0.3s $ease-quart, opacity 0.3s $ease-quart;
         will-change: transform;
 

src/style/organisms/_carousel.scss

@@ -344,7 +344,7 @@
                 height: 8px;
                 padding: 0;
                 background-color: $color-lightpurple;
-                border-radius: 100%;
+                border-radius: 50%;
                 text-decoration: none;
             }
         }

src/style/organisms/_fullscreen.scss

@@ -75,7 +75,7 @@
         width: 80px;
         height: 80px;
         background-color: $color-primary;
-        border-radius: 100%;
+        border-radius: 50%;
         transition: transform 0.8s $ease-quart, opacity 0.8s $ease-quart;
 
         // Hidden state