diff options
Diffstat (limited to 'apps/youtube/css')
| -rw-r--r-- | apps/youtube/css/appbase.css | 219 | ||||
| -rw-r--r-- | apps/youtube/css/style.css | 120 |
2 files changed, 339 insertions, 0 deletions
diff --git a/apps/youtube/css/appbase.css b/apps/youtube/css/appbase.css new file mode 100644 index 0000000..ad45a26 --- /dev/null +++ b/apps/youtube/css/appbase.css @@ -0,0 +1,219 @@ +/* CSS Reset + Font */ +body { + font-family:Segoe UI; + margin:0px; + padding:0px; +} +img, a { + border:none; + outline:none; +} +/* Splashscreen */ +#splashscreen { + position:fixed; + top:0; + width:100%; + height:100%; + color:#1E1E1E; + background-image:url('../splashscreen.png'); + background-position:center; + background-color:#1E1E1E; + background-repeat:no-repeat; + animation:splash 4s; + -ms-animation:splash 4s; + -webkit-animation:splash 4s; + -o-animation:splash 4s; + opacity:0; + z-index:-1; +} +@keyframes splash { + from { + z-index:6; + opacity: 1; + } + 66% { + opacity: 1; + } + to { + opacity:0; + z-index:1; + display:none; + } +} +@-webkit-keyframes splash { + from { + z-index:6; + opacity: 1; + } + 66% { + opacity: 1; + } + to { + opacity:0; + z-index:1; + display:none; + } +} +@-ms-keyframes splash { + from { + z-index:6; + opacity: 1; + } + 66% { + opacity: 1; + } + to { + opacity:0; + z-index:1; + display:none; + } +} +@-o-keyframes splash { + from { + z-index:2; + opacity: 1; + } + 66% { + opacity: 1; + } + to { + opacity:0; + z-index:1; + display:none; + } +} +/* Charms */ +/* Hover areas */ +#hoverarea { + position:fixed; + top:0px; + right:0px; + width:15px; + height:15px; +} +#bottomhoverarea { + position:fixed; + bottom:0px; + right:0px; + width:15px; + height:15px; +} +#starthoverarea { + position:fixed; + bottom:0px; + left:0px; + width:15px; + height:15px; +} +/* Charms bar */ +#charmsbar { + display:none; + background-color:#111111; + position:fixed; + padding:5% 0; + top:0px; + right:0px; + height:100%; + width: 86px; +} +/* Start button */ +#startbutton { + display:none; + position:fixed; + left:0px; + bottom:0px; + margin:0; + padding:0; +} +/* Date and time on charms */ +#datetime { + display:none; + position:fixed; + left:50px; + bottom:50px; + width:490px; + height:139px; + background-color: rgba(17,17,17,0.96); + color:#FFFFFF; +} +#ctime { + position:absolute; + left:70px; + bottom:19px; + font-family: Segoe UI Light; + font-size: 64pt; +} +#date { + margin-top:20px; + margin-right:20px; + float:right; + font-size:24pt; +} +#iconnetwork { + position:absolute; + top:35px; + left:25px; +} +#iconbattery { + position:absolute; + bottom:35px; + left:32px; +} + +/* Text styling on Settings, share charms */ +.charms span { + line-height:40px; +} +.ch1 { + font-family:Segoe UI Semilight; + font-size:28px; + margin-bottom:25px; +} +.ch2 { + font-size:11pt; + margin-bottom:25px; +} +.ch2d { + font-size:11pt; + color:#A8A8A8; + margin-bottom:25px; +} +.sharing { + font-size:14pt; +} +/* Close button on settings, share charms */ +.closecharms { + float:right; + height:32px !important; + width:32px !important; + box-shadow:none !important; + background-image: url(../img/charmsbar/close.png); +} +/*.closecharms:hover { + background-image: url(../img/charmsbar/close-hover.png); +}*/ +.closecharms:active { + background-image: url(../img/charmsbar/close-active.png); +} +/* Charms */ +.charms { + z-index:2; + background-color:#001E4E; + padding : 40px; + position:fixed; + top:0px; + right:0px; + height:100%; + width: 345px; + -webkit-user-select: none; + -khtml-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + display:none; + color:#FFF; +} +/* Settings charms */ +#settingscharms { + +}
\ No newline at end of file diff --git a/apps/youtube/css/style.css b/apps/youtube/css/style.css new file mode 100644 index 0000000..6f70a3c --- /dev/null +++ b/apps/youtube/css/style.css @@ -0,0 +1,120 @@ +body { + background-image:url('img/bg.png'); + background-color:rgb(235, 235, 235); + color:#000000; + font-family:Segoe UI; + margin:0px; + padding:0px; +} + +.search_input { + font-family: Segoe UI; + position: relative; + overflow: hidden; + height: 35px; + margin-left:15%; + margin-top:15px; + padding:8px; + width:70%; + font-size: 14px; + line-height: 30px; + background-color: rgb(255, 255, 255); + -moz-box-sizing: border-box; + border-radius:3px; + transition: border-color 0.2s ease 0s; + border: 1px solid rgb(204, 204, 204); + box-shadow: 0px 1px 2px rgb(238, 238, 238) inset; + outline: medium none; + display:inline-block; + transition:all 1s; +} +.search_input:hover { + border-color:rgb(185, 185, 185); + box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3) inset; +} +.search_input:focus { + border-color:rgb(28, 98, 185); + box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3) inset; +} +#hugelogo { + margin-top:70px; + margin-bottom: 60px; + display:block; + margin-left:auto; + margin-right:auto; + width:400px; +} +#logo { + display: none; + position:absolute; + margin:10px; +} +#input_box { + text-align:left; +} +#viewer { + display:none; + position:absolute; + background-color:#FFF; + bottom:0px; + border:none; +} +.result { + background-color:#000; + margin-top:25px; + min-height:218px; + width:340px; + border:solid 10px #ffffff; + float:left; + margin-left:10px; + overflow:hidden; + overflow:auto; + border-radius:3px; +} +.result:hover { + box-shadow:0px 1px 2px #CCC; +} +.result a { + display:inline-block; + width:340px; + color:#36C; + text-decoration:none; +} +.result a:hover { + text-decoration:underline; +} +#video { + background-color:#FFFFFF; + margin-left:auto; + margin-right: auto; + width:90%; +} +#close { + float:right; + display:none; + margin:1.5%; +} + +#title { + background-color:#fff; + font-size:14px; + text-align:left; + padding-bottom:8px; + height:30px; + overflow:hidden; +} +#no { + margin-top:50px; + padding:20px; + background-color:#F23838; + font-size:25px; + font-family: Segoe UI Light; + color:#FFF; + border:1px solid #C40000; + border-radius:3px; +} +#tipbox { + font-size:10pt; + width:600px; + margin-top:40px; +}
\ No newline at end of file |