From db6851ae113d73544cb51ab221c63147c8a9d4b5 Mon Sep 17 00:00:00 2001 From: rudolfkoenig <> Date: Wed, 24 Jul 2013 05:24:09 +0000 Subject: [PATCH] ios7 css from fhainz git-svn-id: https://svn.fhem.de/fhem/trunk@3487 2b470e98-0d58-463d-a4d8-8e2adae1ed80 --- fhem/www/pgm2/ios7smallscreenstyle.css | 71 ++++++++++++++++++ fhem/www/pgm2/ios7smallscreensvg_defs.svg | 43 +++++++++++ fhem/www/pgm2/ios7smallscreensvg_style.css | 34 +++++++++ fhem/www/pgm2/ios7style.css | 84 ++++++++++++++++++++++ fhem/www/pgm2/ios7svg_defs.svg | 43 +++++++++++ fhem/www/pgm2/ios7svg_style.css | 33 +++++++++ fhem/www/pgm2/ios7touchpadstyle.css | 1 + fhem/www/pgm2/ios7touchpadsvg_defs.svg | 43 +++++++++++ fhem/www/pgm2/ios7touchpadsvg_style.css | 33 +++++++++ 9 files changed, 385 insertions(+) create mode 100644 fhem/www/pgm2/ios7smallscreenstyle.css create mode 100644 fhem/www/pgm2/ios7smallscreensvg_defs.svg create mode 100644 fhem/www/pgm2/ios7smallscreensvg_style.css create mode 100644 fhem/www/pgm2/ios7style.css create mode 100644 fhem/www/pgm2/ios7svg_defs.svg create mode 100644 fhem/www/pgm2/ios7svg_style.css create mode 100644 fhem/www/pgm2/ios7touchpadstyle.css create mode 100644 fhem/www/pgm2/ios7touchpadsvg_defs.svg create mode 100644 fhem/www/pgm2/ios7touchpadsvg_style.css diff --git a/fhem/www/pgm2/ios7smallscreenstyle.css b/fhem/www/pgm2/ios7smallscreenstyle.css new file mode 100644 index 000000000..2ecf9f800 --- /dev/null +++ b/fhem/www/pgm2/ios7smallscreenstyle.css @@ -0,0 +1,71 @@ +/* +Edit: fhainz +*/ + +body { background-color: #e5e5e5; font-family:Helvetica; font-weight:300; } +textarea { font-family:Helvetica; font-weight:300; font-size:16px;} +input { font-family:Helvetica; font-weight:300; font-size:16px;} +select { font-family:Helvetica; font-weight:300; font-size:16px;} +#back { position:absolute; top: 2px; left:18px; } +#logo { position:absolute; top: 2px; left: 2px; + width:64px; height:67px; background-image:url(../images/smallscreen/fhem_smallscreen.png); } +#menu { position:absolute; top: 2px; left:65px; } +#hdr { position:absolute; top:40px; left:65px; } +#content { position:absolute; top:85px; left: 0px; right: 0px;} +#connect_err { background-color: #000000; color: #FFFFFF; position:absolute; top:0px; left:0px; z-index: 10; } + +.devType { padding-top:10px; font-size:12px;} +a { color: #151515; } +img { border-style: none; } +.col2 { text-align:center; } + +div.col1 { width: 188px; height: 30px; white-space: nowrap; } +div.col2 { width: 108px; height: 30px; + -webkit-box-pack: center; -moz-box-pack: center; box-pack: center; + white-space: wrap; + font-size:16px; +} +div.col1, div.col2 { + overflow: hidden; text-overflow: ellipsis; + + padding-top: 10px; padding-bottom: 10px; + padding-left: 5px; padding-right: 5px; + display: -webkit-box; -webkit-box-align: center; + display: -moz-box; -moz-box-align: center; + + background: #fff; +} + +div.dname, div.dval { + width: 152px; + white-space: nowrap; overflow: hidden; text-overflow: ellipsis; + font-size:16px; +} +div.tiny { font-size:10px; } + +table.block { width: 320px; background: #fff; border-spacing:0px; } +table.block tr { border:1px solid gray; border-spacing:0px; } +table.block tr.odd { background: #fff; } +table.block tr.sel { background: #fff; } +table.block td { width: 150px; border-bottom: 1px solid #cbcbcb; }; +table { -moz-border-radius:8px; border-radius:8px; } + +#menu #block { visibility: hidden; } +#right { position:absolute; top:85px; left: 0px; right: 0px; + font-family:Arial, sans-serif; font-size:16px; } +h2,h3,h4 { color:#52865D; line-height:1.3; + margin-top:1.5em; font-family:Arial,Sans-serif; } +div.block { border:1px solid gray; background: #F8F8E0; padding:0.7em; } +div.dist { padding-top:0.3em; } +button.dist { margin:5px; background:transparent; border:0px; cursor:pointer; } + +.set,.attr { margin-bottom:5px; float:left;} +.slider { float:right; width:320px; height:26px; } +.set .slider { background:#F0F0D8; } +.handle { position:relative; cursor:pointer; width:50px; + height:20px; line-height:20px; + -webkit-user-select:none; -moz-user-select:none; -user-select:none; + border:3px solid; color:#278727; text-align:center; } + +svg { height:32px; width:32px; fill:#1c7efb; } +g.on { fill:red; } \ No newline at end of file diff --git a/fhem/www/pgm2/ios7smallscreensvg_defs.svg b/fhem/www/pgm2/ios7smallscreensvg_defs.svg new file mode 100644 index 000000000..1be83cfcf --- /dev/null +++ b/fhem/www/pgm2/ios7smallscreensvg_defs.svg @@ -0,0 +1,43 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/fhem/www/pgm2/ios7smallscreensvg_style.css b/fhem/www/pgm2/ios7smallscreensvg_style.css new file mode 100644 index 000000000..d3aa2cd63 --- /dev/null +++ b/fhem/www/pgm2/ios7smallscreensvg_style.css @@ -0,0 +1,34 @@ +/* Author: Volker + Edit: fhainz +*/ + +.background { fill:#e5e5e5; } + +text { font-family: Helvetica; font-weight:300; font-size:12px; fill:#343434;} +text.title {font-family: Helvetica; font-weight:300; font-size:16px; fill:#343434;} +text.copy { text-decoration:underline; stroke:none; fill:blue;} +text.paste { text-decoration:underline; stroke:none; fill:blue;} + +polyline { stroke:black; fill:none; } +.border { stroke:black; fill:url(#gr_bg);} +.vgrid { stroke:gray; stroke-dasharray:2,6;} +.hgrid { stroke:gray; stroke-dasharray:2,6;} +.pasted { stroke:black; stroke-dasharray:1,1;} + +.l0 { stroke:#fc3e39; } text.l0 { stroke:none; fill:#fc3e39; } +.l1 { stroke:#53d769; } text.l1 { stroke:none; fill:#53d769; } +.l2 { stroke:#157efb; } text.l2 { stroke:none; fill:#157efb; } +.l3 { stroke:#c34ceb; } text.l3 { stroke:none; fill:#c34ceb; } +.l4 { stroke:brown; } text.l4 { stroke:none; fill:brown; } +.l5 { stroke:black; } text.l5 { stroke:none; fill:black; } +.l6 { stroke:olive; } text.l6 { stroke:none; fill:olive; } +.l7 { stroke:gray; } text.l7 { stroke:none; fill:gray; } +.l8 { stroke:#f7ab28; } text.l8 { stroke:none; fill:#f7ab28; } + +.l0fill{ stroke:#fc3e39; fill:url(#gr_0); } text.l0fill{ stroke:none; fill:#fc3e39; } +.l1fill{ stroke:#53d769; fill:url(#gr_1); } text.l1fill{ stroke:none; fill:#53d769; } +.l2fill{ stroke:#157efb; fill:url(#gr_2); } text.l2fill{ stroke:none; fill:#157efb; } +.l3fill{ stroke:#c34ceb; fill:url(#gr_3); } text.l3fill{ stroke:none; fill:#c34ceb; } +.l4fill{ stroke:#ff0; fill:url(#gr_4); } text.l4fill{ stroke:none; fill:#ff0; } +.l5fill{ stroke:#0ff; fill:url(#gr_5); } text.l5fill{ stroke:none; fill:#0ff; } +.l6fill{ stroke:#000; fill:url(#gr_6); } text.l6fill{ stroke:none; fill:#000; } \ No newline at end of file diff --git a/fhem/www/pgm2/ios7style.css b/fhem/www/pgm2/ios7style.css new file mode 100644 index 000000000..bd6de7631 --- /dev/null +++ b/fhem/www/pgm2/ios7style.css @@ -0,0 +1,84 @@ +/* +Edit: fhainz +*/ +body { background-color: #e5e5e5; + font-family:Helvetica; font-weight:300; font-size:16px; } +input { font-family:Helvetica; font-weight:300; font-size:16px; } +select { font-family:Helvetica; font-weight:300; font-size:16px; } + +#menuScrollArea { } + +#menu { margin: 20px 0 20px 12px; width:200px; left: 20px; } +#menu a { color: #151515; } + +#hdr { position:absolute; top:20px; left:250px; } + +#content { position:absolute; top:50px; left:250px; bottom:20px; right:10px; } + +#connect_err { background-color: #000000; color: #FFFFFF; + position:absolute; top:0px; left:40px; z-index: 10; } +.devType { padding-top:20px; } + +a { color: #147bff; text-decoration:none; cursor: pointer; } + +img { border-style: none; } + +#.wide { width: 100%; } + +table { border-radius:2px; margin: 0; padding: 0px; border-spacing: 0px; border-collapse:separate; } + +table.room { width:210px; } +table.room tr { background:#fff; } +table.room tr.sel { background: #d9d9d9; } +table.room td { padding: 6px; } +table.room td { border-bottom: 1px solid #cbcbcb; } +table.room td:hover { background: #d9d9d9; } + +table.block { width:750px; background: #fff; } +table.block a { color: #151515; } +table.block tr { width: 100%; } +table.block tr.odd { background: #fff; } +table.block tr.sel { background: #d9d9d9; } +table.block td { padding:3px; border-bottom: 1px solid #cbcbcb; } + +table.fileList { width:750px; } +table.fileList td { padding:5px; padding-left: 7px; } +table.fileList td:hover { background: #d9d9d9; } + +#right { position:absolute; top:20px; left:180px; } + +h2,h3,h4 { color:#52865D; line-height:1.3; + margin-top:1.5em; font-family:Arial,Sans-serif; } + +div#block { border:1px solid gray; background: #F8F8E0; padding:0.7em; } +div.dist { padding-top:0.3em; } +div.dval a { color: #147bff; } + +button.dist { margin:10px; background:transparent; border:0px; cursor:pointer; } + +a img { border-style:none; } + +input[type="submit"] { background: transparent; color:#147bff; border:0px; cursor: pointer; } +input[type="text"] { background-color: #e5e5e5; 1px solid #cbcbcb; } + +/* detail-selector & slider */ +select { margin-left:5px; margin-right:5px; background-color: #e5e5e5; border:0px; } +.set,.attr { margin-bottom:5px; float:left; } +.slider { float:left; width:250px; height:26px; } +.set .slider { background:#F0F0D8; border-radius:8px; } +/* timepicker */ +.set .set { margin-bottom:2px; margin-top:3px; } +.changed { color:#fc3e39; } + +.handle { position:relative; cursor:pointer; width:50px; + height:20px; line-height:20px; + -webkit-user-select:none; -moz-user-select:none; -user-select:none; + border:3px solid; color:#278727; text-align:center; } +.downText { margin-top:2px; } + +pre { white-space: pre-wrap; } + +table.room svg { height:20px; width:20px; fill:#147bff; } +svg.icon { margin-right: 20px; margin-left: 7px; } +svg { height:32px; width:32px; fill:#1c7efb; } +g.on { fill:#53d769; } \ No newline at end of file diff --git a/fhem/www/pgm2/ios7svg_defs.svg b/fhem/www/pgm2/ios7svg_defs.svg new file mode 100644 index 000000000..1be83cfcf --- /dev/null +++ b/fhem/www/pgm2/ios7svg_defs.svg @@ -0,0 +1,43 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/fhem/www/pgm2/ios7svg_style.css b/fhem/www/pgm2/ios7svg_style.css new file mode 100644 index 000000000..dfd752c90 --- /dev/null +++ b/fhem/www/pgm2/ios7svg_style.css @@ -0,0 +1,33 @@ +/* Author: Volker + Edit: fhainz +*/ +.background { fill:#e5e5e5; } + +text { font-family: Helvetica; font-weight:300; font-size:12px; fill:#343434;} +text.title {font-family: Helvetica; font-weight:300; font-size:16px; fill:#343434;} +text.copy { text-decoration:underline; stroke:none; fill:blue;} +text.paste { text-decoration:underline; stroke:none; fill:blue;} + +polyline { stroke:black; fill:none; } +.border { stroke:black; fill:url(#gr_bg);} +.vgrid { stroke:gray; stroke-dasharray:2,6;} +.hgrid { stroke:gray; stroke-dasharray:2,6;} +.pasted { stroke:black; stroke-dasharray:1,1;} + +.l0 { stroke:#fc3e39; } text.l0 { stroke:none; fill:#fc3e39; } +.l1 { stroke:#53d769; } text.l1 { stroke:none; fill:#53d769; } +.l2 { stroke:#157efb; } text.l2 { stroke:none; fill:#157efb; } +.l3 { stroke:#c34ceb; } text.l3 { stroke:none; fill:#c34ceb; } +.l4 { stroke:brown; } text.l4 { stroke:none; fill:brown; } +.l5 { stroke:black; } text.l5 { stroke:none; fill:black; } +.l6 { stroke:olive; } text.l6 { stroke:none; fill:olive; } +.l7 { stroke:gray; } text.l7 { stroke:none; fill:gray; } +.l8 { stroke:#f7ab28; } text.l8 { stroke:none; fill:#f7ab28; } + +.l0fill{ stroke:#fc3e39; fill:url(#gr_0); } text.l0fill{ stroke:none; fill:#fc3e39; } +.l1fill{ stroke:#53d769; fill:url(#gr_1); } text.l1fill{ stroke:none; fill:#53d769; } +.l2fill{ stroke:#157efb; fill:url(#gr_2); } text.l2fill{ stroke:none; fill:#157efb; } +.l3fill{ stroke:#c34ceb; fill:url(#gr_3); } text.l3fill{ stroke:none; fill:#c34ceb; } +.l4fill{ stroke:#ff0; fill:url(#gr_4); } text.l4fill{ stroke:none; fill:#ff0; } +.l5fill{ stroke:#0ff; fill:url(#gr_5); } text.l5fill{ stroke:none; fill:#0ff; } +.l6fill{ stroke:#000; fill:url(#gr_6); } text.l6fill{ stroke:none; fill:#000; } \ No newline at end of file diff --git a/fhem/www/pgm2/ios7touchpadstyle.css b/fhem/www/pgm2/ios7touchpadstyle.css new file mode 100644 index 000000000..eabe1d1be --- /dev/null +++ b/fhem/www/pgm2/ios7touchpadstyle.css @@ -0,0 +1 @@ +@import url("iosstyle.css"); diff --git a/fhem/www/pgm2/ios7touchpadsvg_defs.svg b/fhem/www/pgm2/ios7touchpadsvg_defs.svg new file mode 100644 index 000000000..1be83cfcf --- /dev/null +++ b/fhem/www/pgm2/ios7touchpadsvg_defs.svg @@ -0,0 +1,43 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/fhem/www/pgm2/ios7touchpadsvg_style.css b/fhem/www/pgm2/ios7touchpadsvg_style.css new file mode 100644 index 000000000..9d9f18680 --- /dev/null +++ b/fhem/www/pgm2/ios7touchpadsvg_style.css @@ -0,0 +1,33 @@ +/* Author: Volker + Edit: fhainz +*/ +.background { fill:#e5e5e5; } + +text { font-family: Helvetica; font-weight:300; font-size:12px; fill:#343434;} +text.title {font-family: Helvetica; font-weight:300; font-size:16px; fill:#343434;} +text.copy { text-decoration:underline; stroke:none; fill:blue;} +text.paste { text-decoration:underline; stroke:none; fill:blue;} + +polyline { stroke:black; fill:none; } +.border { stroke:black; fill:url(#gr_bg);} +.vgrid { stroke:gray; stroke-dasharray:2,6;} +.hgrid { stroke:gray; stroke-dasharray:2,6;} +.pasted { stroke:black; stroke-dasharray:1,1;} + +.l0 { stroke:#fc3e39; } text.l0 { stroke:none; fill:#fc3e39; } +.l1 { stroke:#53d769; } text.l1 { stroke:none; fill:#53d769; } +.l2 { stroke:#157efb; } text.l2 { stroke:none; fill:#157efb; } +.l3 { stroke:#c34ceb; } text.l3 { stroke:none; fill:#c34ceb; } +.l4 { stroke:brown; } text.l4 { stroke:none; fill:brown; } +.l5 { stroke:black; } text.l5 { stroke:none; fill:black; } +.l6 { stroke:olive; } text.l6 { stroke:none; fill:olive; } +.l7 { stroke:gray; } text.l7 { stroke:none; fill:gray; } +.l8 { stroke:#f7ab28; } text.l8 { stroke:none; fill:#f7ab28; } + +.l0fill{ stroke:#fc3e39; fill:url(#gr_0); } text.l0fill{ stroke:none; fill:#fc3e39; } +.l1fill{ stroke:#53d769; fill:url(#gr_1); } text.l1fill{ stroke:none; fill:#53d769; } +.l2fill{ stroke:#157efb; fill:url(#gr_2); } text.l2fill{ stroke:none; fill:#157efb; } +.l3fill{ stroke:#c34ceb; fill:url(#gr_3); } text.l3fill{ stroke:none; fill:#c34ceb; } +.l4fill{ stroke:#ff0; fill:url(#gr_4); } text.l4fill{ stroke:none; fill:#ff0; } +.l5fill{ stroke:#0ff; fill:url(#gr_5); } text.l5fill{ stroke:none; fill:#0ff; } +.l6fill{ stroke:#000; fill:url(#gr_6); } text.l6fill{ stroke:none; fill:#000; } \ No newline at end of file