From e01cf8ad95c9002880de8db5e66f556e6fb24348 Mon Sep 17 00:00:00 2001 From: "M. Voerman" Date: Wed, 12 Nov 2014 03:03:21 +0100 Subject: Some updates for CSS --- index.html | 46 ++++++++++++++---------- style_1.css | 110 +++++++++++++++++++++++++++++++++++++++++++++++++++------- style_old.css | 63 +++++++++++++++++++++++++++++++++ 3 files changed, 188 insertions(+), 31 deletions(-) create mode 100644 style_old.css diff --git a/index.html b/index.html index 40176f7..0bdc6c8 100644 --- a/index.html +++ b/index.html @@ -1,26 +1,23 @@ - - + + + + + + + @@ -35,6 +32,7 @@
Volume :
+ +
+
+
+
+
+
+
+ +
diff --git a/style_1.css b/style_1.css index 302d4b8..f93c858 100644 --- a/style_1.css +++ b/style_1.css @@ -1,13 +1,99 @@ -div#osdmain { - background: rgba(0,0,0,0.8) !important; - width: 100% !important; - height: 20% !important; - position: absolute; - border-top: 3px solid #DADADA !important; - bottom: 0% !important; - left: 0% !important; - border-radius: 0px !important; - -webkit-border-radius: 0px !important; - color: #FFF !important; -} + div#osdmain { + font-family : 'Ubuntu', sans-serif; + font-weight : 400; + position : relative; + z-index : 505; + background : url(osd-bg.png) top center repeat-x rgba(0,0,0,0.8); + width : 100%; + height : 25%; + top : 75%; + bottom : 0%; + left : 0%; + color : #FFF; + border-radius : 0 30px 0 30px; + overflow : hidden; + } + div#osdnr { + font-size : 40px; + padding : 40px 0; + font-weight : 700; + color : #feb900; + position : absolute; + width : 8%; + height : 100%; + left : 0%; + top : 0%; + text-align : center; + border-right: 1px solid #111; + background : rgba(0,0,0,0.3); + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; + } + + div#osdname { + font-size : 22px; + font-weight : 700; + position : absolute; + width : 60%; + height : 25%; + left : 10%; + top : 15%; + border-bottom: 1px solid #111; + } + + div#osdtimer { + color : #feb900; + position : absolute; + width : auto; + text-align : center; + left : 10%; + top : 45%; + border-radius : 10px; + -webkit-border-radius: 10px; + background : rgba(0,0,0,0.2); + padding : 10px; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; + } + + div#osdepg { + position : absolute; + width : 50%; + height : 55%; + left : 20%; + top : 45%; + line-height : 28px; + } + + div#osdtime { + font-size : 18px; + color : #FFF; + position : absolute; + width : 27%; + height : 25%; + right : 3%; + top : 15%; + text-align : right; + border-bottom: 1px solid #111; + } + + div#osdca { + color : #999; + position : absolute; + width : auto; + right : 3%; + top : 45%; + text-align : right; + border-radius : 10px; + -webkit-border-radius: 10px; + background : rgba(0,0,0,0.2); + padding : 10px; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; + + } + diff --git a/style_old.css b/style_old.css new file mode 100644 index 0000000..d7ac967 --- /dev/null +++ b/style_old.css @@ -0,0 +1,63 @@ + div#osdmain { + position : absolute; + z-index : 505; + width : 80%; + top : 60%; + bottom : 9%; + left : 10%; + -webkit-border-radius : 50px; + } + + div#osdnr { + position : absolute; + z-index : 505; + width : 10%; + height : 9%; + left : 12%; + top : 56%; + -webkit-border-radius : 25px; + } + + div#osdname { + z-index : 505; + position : absolute; + width : 69%; + height : 4%; + left : 12%; + top : 66%; + } + + + div#osdtimer { + z-index : 505; + position : absolute; + width : 7%; + left : 12%; + top : 69%; + } + + div#osdepg { + z-index : 505; + position : absolute; + width : 63%; + left : 21%; + top : 69%; + } + + div#osdtime { + z-index : 505; + position : absolute; + width : 42%; + left : 58%; + top : 63%; + } + + div#osdca { + z-index : 505; + position : absolute; + width : 5%; + left : 75%; + top : 67%; + } + + -- cgit v1.2.3