Responsiveness

Author: Emmanouil Konstantinidis

rest_framework_docs/static/rest_framework_docs/css/style.css

@@ -94,29 +94,39 @@ body {
     }
 
     .methods {
-      margin-bottom: 0;
+      margin: 10px 0 5px;
 
-       .method {
-        padding: 4px 8px;
-        color: #FFF;
+      @media (min-width: @screen-md-min) {
+        text-align: right;
+        margin: 0;
+      }
 
-        &.get { background-color: @GetColor; }
-        &.post { background-color: @PostColor; }
-        &.patch { background-color: @PutColor; }
-        &.put { background-color: @PatchColor; }
-        &.delete { background-color: @DeleteColor; }
-        &.options { background-color: @OptionsColor; }
-
-        &.plug {
-          color: @brand-primary;
-          border: 1px solid @brand-primary;
-          .BorderRadius(50%);
-          font-size: 14px;
-          width: 30px;
-          height: 29px;
-          margin-left: 10px;
-        }
+     .method {
+      padding: 4px 8px;
+      margin-top: 5px;
+      color: #FFF;
+
+      @media (min-width: @screen-md-min) {
+        margin-top: 0;
       }
+
+      &.get { background-color: @GetColor; }
+      &.post { background-color: @PostColor; }
+      &.patch { background-color: @PutColor; }
+      &.put { background-color: @PatchColor; }
+      &.delete { background-color: @DeleteColor; }
+      &.options { background-color: @OptionsColor; }
+
+      &.plug {
+        color: @brand-primary;
+        border: 1px solid @brand-primary;
+        .BorderRadius(50%);
+        font-size: 14px;
+        width: 30px;
+        height: 29px;
+        margin-left: 10px;
+      }
+    }
     }
   }
 

rest_framework_docs/static/rest_framework_docs/less/style.less

@@ -36,7 +36,7 @@ <h4 class="panel-title title">
               </h4>
             </div>
 
-            <div class="col-md-5 text-right">
+            <div class="col-md-5">
               <ul class="list-inline methods">
                 {% for method in endpoint.allowed_methods %}
                   <li class="method {{ method|lower }}">{{ method }}</li>