diff --git a/ende.html b/ende.html new file mode 100644 index 0000000..1abb1ca --- /dev/null +++ b/ende.html @@ -0,0 +1,21 @@ + +
+ +
+ + + + + + + + +
Tel.:
+mobil:
ImpressumDatenschutzhinweis
+ + + +
+ + + \ No newline at end of file diff --git a/html/ende.html b/html/ende.html new file mode 100644 index 0000000..1abb1ca --- /dev/null +++ b/html/ende.html @@ -0,0 +1,21 @@ + +
+ +
+ + + + + + + + +
Tel.:
+mobil:
ImpressumDatenschutzhinweis
+ + + +
+ + + \ No newline at end of file diff --git a/html/navh.html b/html/navh.html new file mode 100644 index 0000000..2400b47 --- /dev/null +++ b/html/navh.html @@ -0,0 +1,23 @@ +
+ +
+ diff --git a/html/site.html b/html/site.html new file mode 100644 index 0000000..e749c1a --- /dev/null +++ b/html/site.html @@ -0,0 +1,25 @@ + + + Status Gateway rola1 + + + + + + + + + + + +
+
+
+
+ + + + + diff --git a/html/start.html b/html/start.html new file mode 100644 index 0000000..7d1e1e5 --- /dev/null +++ b/html/start.html @@ -0,0 +1,84 @@ + +
+FFF Gateway $hostname"; +echo "

Hoods: has und has-süd"; +?> + +

+ + + +"; + +$load = shell_exec('cat /proc/loadavg'); +$load = explode(" ", $load); +$load[0] > 2? $ampel = 'ampelgelb.jpg' : $ampel = 'ampelgr.jpg'; +$load[0] > 3? $ampel = 'ampelrot.jpg' : ""; +echo ""; + +$leases = shell_exec('dhcp-lease-list --parsable | wc -l'); +$leases < 3? $ampel = 'ampelgelb.jpg' : $ampel = 'ampelgr.jpg'; +$leases > 120? $ampel = 'ampelrot.jpg': ""; +echo ""; + +?> +
Status
Uptime:$uptime
Load:$load[0] $load[1] $load[2]
DHCP:Leases in use: $leases
+ +
+Aktuelle default Route table fff:
+
"; + +$l2tp = shell_exec('ip l | grep -c l2tp'); +echo "Anzahl der l2tp Tunnel: $l2tp

"; +$gwsel = shell_exec('sudo batctl gw'); +echo "Gateway-selection:
"; +echo "$gwsel

"; + +echo "Die anderen GW in der Hood
"; +$other = shell_exec('sudo batctl gwl | grep MBit | tr -s " " | cut -f 2,3,8 -d" "'); +$othergw = explode(PHP_EOL, $other); +for($i = 0; $i < count($othergw); ++$i) { + echo "$othergw[$i]
"; +} + + + +?> +
+
+
+

Durchsatz eth0

+GW has + + +GW has1 + + +GW has2 + + +GW has3 + + +GW roffl + + +GW rola1 + + +
+ +Speedtest der has und has-sued GWs (Kabel, wr-841, l2tp) + + +
+
+
+ + diff --git a/images/bg.png b/images/bg.png new file mode 100644 index 0000000..6579886 Binary files /dev/null and b/images/bg.png differ diff --git a/img/.directory b/img/.directory new file mode 100644 index 0000000..c39f5fb --- /dev/null +++ b/img/.directory @@ -0,0 +1,3 @@ +[Dolphin] +Timestamp=2011,1,9,13,51,20 +ViewMode=2 diff --git a/img/Logo.png b/img/Logo.png new file mode 100644 index 0000000..872a497 Binary files /dev/null and b/img/Logo.png differ diff --git a/img/ampelgelb.jpg b/img/ampelgelb.jpg new file mode 100644 index 0000000..d73d7a0 Binary files /dev/null and b/img/ampelgelb.jpg differ diff --git a/img/ampelgr.jpg b/img/ampelgr.jpg new file mode 100644 index 0000000..b09cf2f Binary files /dev/null and b/img/ampelgr.jpg differ diff --git a/img/ampelrot.jpg b/img/ampelrot.jpg new file mode 100644 index 0000000..80d2ef2 Binary files /dev/null and b/img/ampelrot.jpg differ diff --git a/img/bg_bodybox.jpg b/img/bg_bodybox.jpg new file mode 100644 index 0000000..07e89b6 Binary files /dev/null and b/img/bg_bodybox.jpg differ diff --git a/img/bg_fuss.jpg b/img/bg_fuss.jpg new file mode 100644 index 0000000..5f33e98 Binary files /dev/null and b/img/bg_fuss.jpg differ diff --git a/img/linie.bmp b/img/linie.bmp new file mode 100644 index 0000000..8fccb3c Binary files /dev/null and b/img/linie.bmp differ diff --git a/img/linie.jpg b/img/linie.jpg new file mode 100644 index 0000000..1106ea1 Binary files /dev/null and b/img/linie.jpg differ diff --git a/img/nav.jpg b/img/nav.jpg new file mode 100644 index 0000000..9d79a78 Binary files /dev/null and b/img/nav.jpg differ diff --git a/index.php b/index.php new file mode 100644 index 0000000..24bb7f0 --- /dev/null +++ b/index.php @@ -0,0 +1,6 @@ + + + diff --git a/main.css b/main.css new file mode 100644 index 0000000..dc3e344 --- /dev/null +++ b/main.css @@ -0,0 +1,149 @@ +/* CSS Document */ + +html { +# width:100%; +} + +body { + background-color:#8db5cb; + text-align:left; + font-family:Arial, Helvetica, sans-serif; +# font-family:Verdana, sans-serif; + font-size:small; + color:#454545; + background-repeat:repeat-x; +} + +#wrapper { + margin:0 auto; + + +} + +#kopf { + + width:100%; +} +#kopf img { + width:100%; +} + +#bodybox { + float:left; + background-color:#ffffff; + width:100%; + + +# background-image:url('img/bg_bodybox.jpg'); +} + +#content { + + margin-right:2.5em; + margin-left:2.5em; + margin-top:1em; + padding-bottom:1em; +} + +#fuss { + float:left; + width:100%; +# height:5em; + font-size:1.5em; + font-weight:bold; + background-color:#D3ECED; + text-align:center; + +} +#fuss td { +# height:3em; + vertical-align:middle; + } + +div.imgrechts { + float:right; + text-align:center; + margin-left:10px; + margin-bottom:10px; + width:30%; +} + +div.imgrechts img { + border:1px solid #bbbbbb; + width:100%; +} + +div.imgrechts p { + text-align:center; + margin:12px; + padding:0px; + font-size:11px; + color:#454545; +} +div.ampel { + float:left; + width:100%; + max-width:550px; +} + +div.ampel img { + width:2em; +} +div.ampel table { + width:100%; +} + +div.mrtg { + float:left; + width:100%; + max-width:550px; +} +div.mrtg img { + width:100% +} + + +@media only screen and (max-width: 600px) { + +#kopf { + display:none; + +} +#content { + float:left; + width:95%; + margin-right:0.5em; + margin-left:0.5em; + margin-top:0.5em; + padding-bottom:1em; +} + +div.ampel { + float:left; + width:100%; + max-width:550px; +} + +div.ampel img { + width:2em; +} + +div.ampel table { + width:100%; +} +div.mrtg { + float:left; + width:100%; + max-width:550px; + margin-left:0px; +} + +div.mrtg img { + width:100% +} + +} + + + + diff --git a/navh.html b/navh.html new file mode 100644 index 0000000..65e660e --- /dev/null +++ b/navh.html @@ -0,0 +1,12 @@ +
+ +
+ diff --git a/reset.css b/reset.css new file mode 100644 index 0000000..a2e9a6d --- /dev/null +++ b/reset.css @@ -0,0 +1,553 @@ + + + + + + + + + + + + + Lingulo-Responsive-Tutorial/reset.css at master · ChristophAnastasiades/Lingulo-Responsive-Tutorial · GitHub + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + Skip to content + + + + + + + + + + + + +
+ +
+
+ + +
+
+
+ +
+ +
+ + + + +

+ + /Lingulo-Responsive-Tutorial + + + + + +

+ +
+
+
+ +
+
+
+ + + +
+ +
+

HTTPS clone URL

+
+ + + + +
+
+ + +
+

Subversion checkout URL

+
+ + + + +
+
+ + + +
You can clone with +
or
. + + + +
+ + + Clone in Desktop + + + + + Download ZIP + +
+
+
+ + + + + + + +
+ +
+ + + +
+ +
+ + + + +
+ +
+ Lingulo-Responsive-Tutorial/css/reset.css +
+
+ + +
+ + + 8e4bca3 + + + + + +
+ + 1 + contributor + + +
+ + +
+ +
+
+
+ +
+ Raw + Blame + History +
+ + + + + + + +
+ +
+ 1 lines (1 sloc) + + 1.03 KB +
+
+ + + +
+ + + + + +
/** * Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/) * http://cssreset.com */html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;}/* HTML5 display-role reset for older browsers */article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block;}body { line-height: 1;}ol, ul { list-style: none;}blockquote, q { quotes: none;}blockquote:before, blockquote:after,q:before, q:after { content: ''; content: none;}table { border-collapse: collapse; border-spacing: 0;}
+ +
+ +
+ +Jump to Line + + +
+
+
+
+
+ + +
+ +
+ +
+ + + + + + + +
+ + + Something went wrong with that request. Please try again. +
+ + + + + + + + + + diff --git a/script.js b/script.js new file mode 100644 index 0000000..3961c6e --- /dev/null +++ b/script.js @@ -0,0 +1,14 @@ +( function( $ ) { +$( document ).ready(function() { +$('#cssmenu').prepend(''); + $('#cssmenu #menu-button').on('click', function(){ + var menu = $(this).next('ul'); + if (menu.hasClass('open')) { + menu.removeClass('open'); + } + else { + menu.addClass('open'); + } + }); +}); +} )( jQuery ); diff --git a/site.html b/site.html new file mode 100644 index 0000000..7ae58bb --- /dev/null +++ b/site.html @@ -0,0 +1,25 @@ + + + Status Gateway rola1 + + + + + + + + + + + +
+
+
+
+ + + + + diff --git a/styles.css b/styles.css new file mode 100644 index 0000000..318d736 --- /dev/null +++ b/styles.css @@ -0,0 +1,329 @@ +@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,700); +#cssmenu, +#cssmenu ul, +#cssmenu ul li, +#cssmenu ul li a, +#cssmenu #menu-button { + margin: 0; + padding: 0; + border: 0; + list-style: none; + line-height: 1; + display: block; + position: relative; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; +} +#cssmenu:after, +#cssmenu > ul:after { + content: "."; + display: block; + clear: both; + visibility: hidden; + line-height: 0; + height: 0; +} +#cssmenu #menu-button { + display: none; +} +#cssmenu { + width: auto; + font-family: 'Open Sans', Helvetica, sans-serif; + background: #39b1cc; + background: -moz-linear-gradient(top, #51bbd2 0%, #2d97af 100%); + background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #51bbd2), color-stop(100%, #2d97af)); + background: -webkit-linear-gradient(top, #51bbd2 0%, #2d97af 100%); + background: -o-linear-gradient(top, #51bbd2 0%, #2d97af 100%); + background: -ms-linear-gradient(top, #51bbd2 0%, #2d97af 100%); + background: linear-gradient(to bottom, #51bbd2 0%, #2d97af 100%); +} +#cssmenu > ul { + background: url('images/bg.png'); + box-shadow: inset 0 -3px 0 rgba(0, 0, 0, 0.05); +} +#cssmenu.align-right > ul > li { + float: right; +} +#cssmenu > ul > li { + float: left; + display: inline-block; +} +#cssmenu.align-center > ul { + float: none; + text-align: center; +} +#cssmenu.align-center > ul > li { + float: none; +} +#cssmenu.align-center ul ul { + text-align: left; +} +#cssmenu > ul > li > a { + padding: 18px 25px 21px 25px; + border-right: 1px solid rgba(80, 80, 80, 0.12); + text-decoration: none; + font-size: 13px; + font-weight: 700; + color: #d3eced; + text-transform: uppercase; + letter-spacing: 1px; +} +#cssmenu > ul > li:hover > a, +#cssmenu > ul > li > a:hover, +#cssmenu > ul > li.active > a { + color: #ffffff; + background: #32a9c3; + background: rgba(0, 0, 0, 0.1); +} +#cssmenu > ul > li.has-sub > a { + padding-right: 45px; +} +#cssmenu > ul > li.has-sub > a::after { + content: ""; + position: absolute; + width: 0; + height: 0; + border: 6px solid transparent; + border-top-color: #d3eced; + right: 17px; + top: 22px; +} +#cssmenu > ul > li.has-sub.active > a::after, +#cssmenu > ul > li.has-sub:hover > a { + border-top-color: #ffffff; +} +#cssmenu ul ul { + position: absolute; + left: -9999px; + top: 60px; + padding-top: 6px; + font-size: 13px; + opacity: 0; + -webkit-transition: top 0.2s ease, opacity 0.2s ease-in; + -moz-transition: top 0.2s ease, opacity 0.2s ease-in; + -ms-transition: top 0.2s ease, opacity 0.2s ease-in; + -o-transition: top 0.2s ease, opacity 0.2s ease-in; + transition: top 0.2s ease, opacity 0.2s ease-in; +} +#cssmenu.align-right ul ul { + text-align: right; +} +#cssmenu > ul > li > ul::after { + content: ""; + position: absolute; + width: 0; + height: 0; + border: 5px solid transparent; + border-bottom-color: #ffffff; + top: -4px; + left: 20px; +} +#cssmenu.align-right > ul > li > ul::after { + left: auto; + right: 20px; +} +#cssmenu ul ul ul::after { + content: ""; + position: absolute; + width: 0; + height: 0; + border: 5px solid transparent; + border-right-color: #ffffff; + top: 11px; + left: -4px; +} +#cssmenu.align-right ul ul ul::after { + border-right-color: transparent; + border-left-color: #ffffff; + left: auto; + right: -4px; +} +#cssmenu > ul > li > ul { + top: 120px; +} +#cssmenu > ul > li:hover > ul { + top: 52px; + left: 0; + opacity: 1; +} +#cssmenu.align-right > ul > li:hover > ul { + left: auto; + right: 0; +} +#cssmenu ul ul ul { + padding-top: 0; + padding-left: 6px; +} +#cssmenu.align-right ul ul ul { + padding-right: 6px; +} +#cssmenu ul ul > li:hover > ul { + left: 180px; + top: 0; + opacity: 1; +} +#cssmenu.align-right ul ul > li:hover > ul { + left: auto; + right: 100%; + opacity: 1; +} +#cssmenu ul ul li a { + text-decoration: none; + font-weight: 400; + padding: 11px 25px; + width: 180px; +# color: #777777; + color: #ffffff; + text-transform: uppercase; + + background: #32a9c3; + + box-shadow: 0 2px 2px rgba(0, 0, 0, 0.1), 1px 1px 1px rgba(0, 0, 0, 0.1), -1px 1px 1px rgba(0, 0, 0, 0.1); +} +#cssmenu ul ul li:hover > a, +#cssmenu ul ul li.active > a { + color: #333333; +} +#cssmenu ul ul li:first-child > a { + border-top-left-radius: 3px; + border-top-right-radius: 3px; +} +#cssmenu ul ul li:last-child > a { + border-bottom-left-radius: 3px; + border-bottom-right-radius: 3px; +} +#cssmenu > ul > li > ul::after { + position: absolute; + display: block; +} +#cssmenu ul ul li.has-sub > a::after { + content: ""; + position: absolute; + width: 0; + height: 0; + border: 4px solid transparent; + border-left-color: #777777; + right: 17px; + top: 14px; +} +#cssmenu.align-right ul ul li.has-sub > a::after { + border-left-color: transparent; + border-right-color: #777777; + right: auto; + left: 17px; +} +#cssmenu ul ul li.has-sub.active > a::after, +#cssmenu ul ul li.has-sub:hover > a::after { + border-left-color: #333333; +} +#cssmenu.align-right ul ul li.has-sub.active > a::after, +#cssmenu.align-right ul ul li.has-sub:hover > a::after { + border-right-color: #333333; + border-left-color: transparent; +} +@media all and (max-width: 800px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) { + #cssmenu { + background: #39b1cc; + } + #cssmenu > ul { + display: none; + } + #cssmenu > ul.open { + display: block; + border-top: 1px solid rgba(0, 0, 0, 0.1); + } + #cssmenu.align-right > ul { + float: none; + } + #cssmenu.align-center > ul { + text-align: left; + } + #cssmenu > ul > li, + #cssmenu.align-right > ul > li { + float: none; + display: block; + } + #cssmenu > ul > li > a { + padding: 18px 25px 18px 25px; + border-right: 0; + } + #cssmenu > ul > li:hover > a, + #cssmenu > ul > li.active > a { + background: rgba(0, 0, 0, 0.1); + } + #cssmenu #menu-button { + display: block; + text-decoration: none; + font-size: 13px; + font-weight: 700; + color: #d3eced; + padding: 18px 25px 18px 25px; + text-transform: uppercase; + letter-spacing: 1px; + background: url('images/bg.png'); + cursor: pointer; + } + #cssmenu ul ul, + #cssmenu ul li:hover > ul, + #cssmenu > ul > li > ul, + #cssmenu ul ul ul, + #cssmenu ul ul li:hover > ul, + #cssmenu.align-right ul ul, + #cssmenu.align-right ul li:hover > ul, + #cssmenu.align-right > ul > li > ul, + #cssmenu.align-right ul ul ul, + #cssmenu.align-right ul ul li:hover > ul { + left: 0; + right: auto; + top: auto; + opacity: 1; + width: 100%; + padding: 0; + position: relative; + text-align: left; + } + #cssmenu ul ul li { + width: 100%; + + + } + #cssmenu ul ul li a { + width: 100%; + box-shadow: none; + padding-left: 35px; + background: rgba(0, 0, 0, 0.0); + } + #cssmenu ul ul ul li a { + padding-left: 45px; + } + #cssmenu ul ul li:first-child > a, + #cssmenu ul ul li:last-child > a { + border-radius: 0; + } + #cssmenu #menu-button::after { + display: block; + content: ''; + position: absolute; + height: 3px; + width: 22px; + border-top: 2px solid #d3eced; + border-bottom: 2px solid #d3eced; + right: 25px; + top: 18px; + } + #cssmenu #menu-button::before { + display: block; + content: ''; + position: absolute; + height: 3px; + width: 22px; + border-top: 2px solid #d3eced; + right: 25px; + top: 28px; + } + #cssmenu > ul > li.has-sub > a::after, + #cssmenu ul ul li.has-sub > a::after { + display: none; + } +}