Merge pull request #3746 from racedale/master

Support for mobile view on Swagger UI
swagger-api · Oct 21, 2017 · 353fd00 · 353fd00
2 parents 3387d47 + bc67660
commit 353fd00
Show file tree

Hide file tree

Showing 4 changed files with 15 additions and 3 deletions.
diff --git a/dev-helpers/index.html b/dev-helpers/index.html
@@ -3,6 +3,7 @@
 <html lang="en">
 <head>
   <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
   <title>Swagger UI</title>
   <link href="https://fonts.googleapis.com/css?family=Open+Sans:400,700|Source+Code+Pro:300,600|Titillium+Web:400,600,700" rel="stylesheet">
   <link rel="stylesheet" type="text/css" href="./swagger-ui.css" >

diff --git a/src/style/_form.scss b/src/style/_form.scss
@@ -30,6 +30,10 @@ select
 .opblock-body select
 {
     min-width: 230px;
+    @media (max-width: 768px)
+    {
+        min-width: 180px;
+    }
 }
 
 label
@@ -56,6 +60,10 @@ input[type=file]
     border: 1px solid #d9d9d9;
     border-radius: 4px;
     background: #fff;
+    @media (max-width: 768px) {
+      max-width: 175px;
+    }
+
 
     &.invalid
     {

diff --git a/src/style/_layout.scss b/src/style/_layout.scss
@@ -250,6 +250,10 @@
     .opblock-summary-path__deprecated
     {
         font-size: 16px;
+        @media (max-width: 768px) {
+          font-size: 12px;
+        }
+
 
         display: flex;
         flex: 0 3 auto;

diff --git a/src/style/_topbar.scss b/src/style/_topbar.scss
@@ -1,6 +1,6 @@
 .topbar
 {
-    padding: 8px 30px;
+    padding: 8px 0;
 
     background-color: #89bf04;
     .topbar-wrapper
@@ -39,7 +39,6 @@
         input[type=text]
         {
             width: 100%;
-            min-width: 350px;
             margin: 0;
 
             border: 2px solid #547f00;
@@ -84,7 +83,7 @@
             font-size: 16px;
             font-weight: bold;
 
-            padding: 4px 40px;
+            padding: 4px 30px;
 
             border: none;
             border-radius: 0 4px 4px 0;