diff --git a/assets/layout.css b/assets/layout.css
index dc963b9..c0610c2 100644
--- a/assets/layout.css
+++ b/assets/layout.css
@@ -18,23 +18,93 @@ body {
max-width: 100vw;
height: 100vh;
max-height: 100vh;
- display: grid;
- grid-template-rows: 80px auto 80px;
- grid-template-areas:
- "header header header header"
- "empty-left nav main empty-right"
- "footer footer footer footer";
- grid-column-gap: 25px;
+}
+
+@media screen and (min-width: 992px) and (max-width: 1274px) {
+ body {
+ text-align: center;
+ }
+
+ main {
+ text-align: left;
+ }
+
+ nav {
+ width: auto;
+ display: inline-block;
+ min-width: 33%;
+ }
+}
+
+@media screen and (max-width: 1274px) {
+ header > h1 {
+ font-size: 1.5em;
+ }
}
@media screen and (min-width: 0px) {
body {
+ font-size: 12px;
+ }
+
+ .empty-left, .empty-right {
+ display: none;
+ }
+
+ main {
+ font-size: 14px;
+ }
+
+ code {
+ font-size: 12px;
+ }
+
+ button.section-method, a.section-site {
+ font-size: 12px;
+ }
+
+ pre {
+ font-size: 13px;
+ }
+}
+
+@media screen and (min-width: 1275px) {
+ body {
+ display: grid;
+ grid-column-gap: 25px;
grid-template-columns: auto 300px 900px auto;
+ grid-template-rows: 80px auto 25px;
+ grid-template-areas:
+ "header header header header"
+ "empty-left nav main empty-right"
+ "footer footer footer footer";
font-size: 12px;
}
+ header {
+ grid-area: header;
+ }
+
+ nav {
+ grid-area: nav;
+ align-self: start;
+ }
+
main {
font-size: 14px;
+ border-radius: 2px;
+ }
+
+ .empty-left {
+ grid-area: empty-left;
+ }
+
+ .empty-right {
+ grid-area: empty-right;
+ }
+
+ footer {
+ grid-area: footer;
}
code {
@@ -53,6 +123,11 @@ body {
@media screen and (min-width: 1500px) {
body {
grid-template-columns: auto 350px 1050px auto;
+ grid-template-rows: 80px auto 25px;
+ grid-template-areas:
+ "header header header header"
+ "empty-left nav main empty-right"
+ "footer footer footer footer";
font-size: 13px;
}
@@ -73,32 +148,12 @@ body {
}
}
-header {
- grid-area: header;
-}
-
header > h1 {
color: #eee;
text-align: center;
line-height: 80px;
vertical-align: middle;
-}
-
-nav {
- grid-area: nav;
- align-self: start;
-}
-
-.empty-left {
- grid-area: empty-left;
-}
-
-.empty-right {
- grid-area: empty-right;
-}
-
-footer {
- grid-area: footer;
+ margin: 0 !important;
}
button.section-method, a.section-site {
@@ -214,7 +269,6 @@ a:hover {
main {
background-color: #fff;
padding: 25px;
- border-radius: 2px;
box-sizing: border-box;
grid-area: main;
align-self: start;
diff --git a/assets/layout.php b/assets/layout.php
index 53aa797..80ff745 100644
--- a/assets/layout.php
+++ b/assets/layout.php
@@ -2,6 +2,8 @@
+
+
{title}
diff --git a/demo/index.html b/demo/index.html
index 885903e..5363dc1 100644
--- a/demo/index.html
+++ b/demo/index.html
@@ -1 +1 @@
- Awesome cookbook JSON-RPC API doc Awesome cookbook JSON-RPC API doc
\ No newline at end of file
+ Awesome cookbook JSON-RPC API doc Awesome cookbook JSON-RPC API doc
\ No newline at end of file