Merge pull request #3746 from racedale/master

Support for mobile view on Swagger UI

Merge pull request #3746 from racedale/master
Support for mobile view on Swagger UI
353fd00b · kyle · GitHub · 3387d476 · bc676601 · 353fd00b
Showing with 15 addition and 3 deletion

dev-helpers/index.html dev-helpers/index.html +1 -0

src/style/_form.scss src/style/_form.scss +8 -0

src/style/_layout.scss src/style/_layout.scss +4 -0

src/style/_topbar.scss src/style/_topbar.scss +2 -3

未找到文件。
--- 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" >

--- 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
    {

--- 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;

--- a/src/style/_topbar.scss
+++ b/src/style/_topbar.scss
 .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;