Mobile improvement

4 years ago · 0233a402a7
parent d80db25430
commit 0233a402a7
2 changed files with 263 additions and 265 deletions
--- a/css.css
+++ b/css.css
@ -14,7 +14,7 @@ body{
    font-family: 'DM Mono', monospace;
    background-color: #1d1e22;
    color: white;
-    font-size: 1.1em;
+    /*font-size: 1.1em;*/
 }

 h1, h2{
@ -38,22 +38,20 @@ img{

 .panel{
    background-color: #393f4d;
-    padding: 25px;
+    padding: 2vh 2vh 2vw 2vw;
    border-radius: 4px;
    border: solid 1px #feda6a;
 }

 .ethernet-frame-grid{
-    border: 2px solid white;
-    height: 3vh;
+    border: 1px solid #151d30;
    background-color: #feda6a;
    color: black;
    cursor: pointer;
 }

 .ethernet-frame-cell{
-    height: 3vh;
-    border-left: 2px solid white;
+    border-left: 1px solid #151d30;
    text-align: center;
 }

@ -76,3 +74,4 @@ img{
    margin: 0 auto;
 }

+
--- a/index.html
+++ b/index.html
@ -8,17 +8,16 @@
        <title>networking cheat sheet</title>
    </head>
    <body>
-    <div id="wrapper">
-        <r-grid columns="1">
+    <r-grid columns="1" columns-s="1" columns-l="1">
        <r-cell span="row">
            <a href="https://github.com/domeniko-gentner/network-cheatsheet"><img src="/github.png" alt="github logo"></a>
            <h1>networking cheat sheet</h1>
        </r-cell>
    </r-grid>
-        <r-grid columns="1">
+    <r-grid columns="1" class="wrapper">
        <r-cell class="panel">
            <h2>Ethernet Frame</h2>
-                <r-grid columns="9" class="ethernet-frame-grid">
+            <r-grid columns="9" columns-s=1 class="ethernet-frame-grid">
                <r-cell span="1" data-tooltip title="7 bytes<br>for synchronization" class="ethernet-frame-cell">
                    <p class="frame-text">Preamble</p>
                </r-cell>
@ -156,7 +155,7 @@
                </r-cell>
            </r-grid>
            <r-grid columns="1" class="ethernet-frame-grid">
-                    <r-cell span="row" data-tooltip title="32 bits<br>If the ACK flag is set then the value of this field is the next sequence number that the sender of the ACK is expecting." class="ethernet-frame-cell">
+                <r-cell span="row" data-tooltip title="32 bits<br>If the ACK flag is set,<br>then the value of this field is the next<br>sequence number that the sender of the ACK is expecting." class="ethernet-frame-cell">
                    <p class="frame-text">Acknowledgment number</p>
                </r-cell>
            </r-grid>
@ -208,7 +207,7 @@
            </r-grid>
        </r-cell><!-- UDP Header -->
        <r-cell>
-                <r-grid columns="10" class="panel">
+            <r-grid columns="10" columns-s="1" class="panel">
                <r-cell span="row"><h2>tcpdump</h2></r-cell>
                <r-cell span="row"><h3>flags</h3></r-cell>
                <r-cell span="1" data-tooltip title="tcpdump -i eth0">-i name</r-cell><r-cell span="2-5">Capture named interfaces, any for all</r-cell>
@ -231,7 +230,7 @@
                <r-cell span="9-10">[P]&nbsp;PUSH</r-cell>
                <r-cell span="row">Flags can be displayed combined, [S.] means sync and acknowledge</r-cell>
            </r-grid><!-- tcpdump -->
-                <r-grid columns="10"  class="panel">
+            <r-grid columns="10" columns-s="1"  class="panel">
                <r-cell span="row"><h2>nmap</h2></r-cell>
                <r-cell span="1" data-tooltip title="nmap 10.10.10.1">IP</r-cell><r-cell span="2-5">Scan host</r-cell>
                <r-cell span="6-6" data-tooltip title="nmap 10.10.10.1 10.10.10.2">LIST</r-cell><r-cell span="7-10">Scan list</r-cell>
@ -248,7 +247,7 @@
                <r-cell span="1" data-tooltip title="nmap -F 10.10.10.1">-F</r-cell><r-cell span="2-5">Fast scan 100 ports</r-cell>
                <r-cell span="6-6" data-tooltip title="nmap -sV -p 443 10.10.10.1">-sV</r-cell><r-cell span="7-10">Try to detect service</r-cell>
            </r-grid><!-- nmap -->
-                <r-grid columns="10"  class="panel">
+            <r-grid columns="10" columns-s="1"  class="panel">
                <r-cell span="row"><h2>mtr</h2></r-cell>
                <r-cell span="1" data-tooltip title="mtr 10.10.10.1">IP</r-cell><r-cell span="2-5">Run route to host</r-cell>
                <r-cell span="6-6" data-tooltip title="mtr -z 10.10.10.1">-z</r-cell><r-cell span="7-10">Resolve ASN</r-cell>
@ -266,6 +265,6 @@
            <p>Provided by <a href="https://tuxstash.de">tuxstash.de</a></p>
        </r-cell>
    </r-grid>
-    </div> <!-- Wrapper -->
+    <div id="sideways" class="panel"><p>Please hold your phone sideways</p></div>
    </body>
 </html>