Complete mobile reactiveness in CSS layer

2016-04-30 11:31:49 -07:00
parent 545408a7e7
commit e7cd3f0549
10 changed files with 199 additions and 17 deletions
@@ -48,7 +48,7 @@

                .button {
                    flex: 1 1 100%;
-                    max-width: 66%;
+                    max-width: $size-minecraft-block * 10;
                }
            }
        }
@@ -58,3 +58,50 @@
        }
    }
 }
+
+@include screen-size(mobile) {
+    .view__item_page {
+        .about {
+            flex-direction: column;
+
+            & > .left {
+                margin: 0 $size-margin-medium;
+
+                display: flex;
+                flex-direction: column;
+                align-items: center;
+
+                img {
+                }
+            }
+
+            & > .center {
+                flex: 0 0 auto;
+                margin: 0 $size-margin-medium;
+
+                .sourceMod, .title {
+                    text-align: center;
+                }
+
+                a.sourceMod {
+                }
+
+                .button-row {
+                    flex: 0 0 auto;
+                    margin: $size-margin-large 0;
+
+                    .button {
+                        max-width: $size-minecraft-block * 8;
+                        .full {
+                            display: none;
+                        }
+                    }
+                }
+            }
+
+            & > .right {
+                margin: 0 $size-margin-medium;
+            }
+        }
+    }
+}