mediabox rev 2

Add lib/ with header.html radio.list and style.css
author Christophe Lincoln <pankso@slitaz.org>
date Thu Feb 23 21:45:12 2017 +0100 (2017-02-23)
parents 482996fb9b2f
children 7d7ba7bf5b13
files lib/header.html lib/radio.list lib/style.css
line diff
     1.1 --- /dev/null	Thu Jan 01 00:00:00 1970 +0000
     1.2 +++ b/lib/header.html	Thu Feb 23 21:45:12 2017 +0100
     1.3 @@ -0,0 +1,8 @@
     1.4 +<!DOCTYPE html>
     1.5 +<html lang="en">
     1.6 +<head>
     1.7 +	<meta charset="utf-8" />
     1.8 +	<title>%TITLE%</title>
     1.9 +	<link rel="stylesheet" type="text/css" href="lib/style.css" />
    1.10 +</head>
    1.11 +<body>

     2.1 --- /dev/null	Thu Jan 01 00:00:00 1970 +0000
     2.2 +++ b/lib/radio.list	Thu Feb 23 21:45:12 2017 +0100
     2.3 @@ -0,0 +1,6 @@
     2.4 +http://streaming.radionomy.com/all-smooth-jazz|Jazz
     2.5 +http://streaming.radionomy.com/ABC-Lounge|Ambient
     2.6 +http://streaming.radionomy.com/100-CHILL|Lounge 
     2.7 +http://streaming.radionomy.com/4U-70s|Rock
     2.8 +http://streaming.radionomy.com/The-Buffalo|Rock
     2.9 +http://streaming.radionomy.com/CurveRadio|Dubstep

     3.1 --- /dev/null	Thu Jan 01 00:00:00 1970 +0000
     3.2 +++ b/lib/style.css	Thu Feb 23 21:45:12 2017 +0100
     3.3 @@ -0,0 +1,120 @@
     3.4 +/* CSS style for CGI/SHell Media Box */
     3.5 +
     3.6 +body { font-size: 94%; margin: 0; }
     3.7 +h1, h2 { color: #e6e6e6; margin: 8px 16px; }
     3.8 +ul { padding: 20px 40px;}
     3.9 +li { list-style-type: none; }
    3.10 +a { text-decoration: none; }
    3.11 +
    3.12 +/* Home page style */
    3.13 +#home {
    3.14 +	max-width: 600px;
    3.15 +	margin: 40px auto;
    3.16 +}
    3.17 +#home nav a { 
    3.18 +	display: block;
    3.19 +	color: #777777;
    3.20 +	font-size: 120%;
    3.21 +	font-weight: bold;
    3.22 +	background-color: #efefef;
    3.23 +	padding: 12px;
    3.24 +	margin: 8px;
    3.25 +	transition-property: background-color;
    3.26 +	transition-duration: 0.8s;
    3.27 +}
    3.28 +
    3.29 +#home nav a:hover {
    3.30 +	background-color: #e8e8e8;
    3.31 +	color: #555555;
    3.32 +}
    3.33 +
    3.34 +/* Header navigation */
    3.35 +header nav {
    3.36 +	position: fixed;
    3.37 +	width: 100%;
    3.38 +	top: 18px;
    3.39 +	right: 5px;
    3.40 +	text-align: right;
    3.41 +}
    3.42 +header nav a {
    3.43 +	color: #888;
    3.44 +	padding: 0 5px;
    3.45 +}
    3.46 +
    3.47 +/* Round corners */
    3.48 +img, nav a, #settings {
    3.49 +	border-radius: 4px;
    3.50 +	-moz-border-radius: 4px;
    3.51 +	-webkit-border-radius: 4px;
    3.52 +}
    3.53 +
    3.54 +/* Audio/Videos Players */
    3.55 +#audio-player, #video-player {
    3.56 +	text-align: center;
    3.57 +	background-color: #ededed;
    3.58 +	/*border: 1px solid #cccccc;*/
    3.59 +}
    3.60 +#audio-title, audio, #video-title, video { color: #666; }
    3.61 +
    3.62 +#audio-player { height: 60px; }
    3.63 +audio { margin: 30px 0 0 0; width: 480px; }
    3.64 +
    3.65 +#audio-title {
    3.66 +	width: 100%;
    3.67 +	position: absolute;
    3.68 +	text-align: center;
    3.69 +	font-size: 80%;
    3.70 +	margin-top: 10px;
    3.71 +}
    3.72 +
    3.73 +#audio-list li span, #audio-list li a, #videos-list li span,
    3.74 +#videos-list li a, #radio-list li a {
    3.75 +	display: block;
    3.76 +	color: #666;
    3.77 +	background-color: #f4f4f4;
    3.78 +	line-height: 1.8em;
    3.79 +	margin: 4px;
    3.80 +	padding: 0 5px;
    3.81 +	font-size: 88%;
    3.82 +	border-radius: 2px;
    3.83 +}
    3.84 +#audio-list li span, #videos-list li span, #radio-list li span { 
    3.85 +	color: #444; }
    3.86 +
    3.87 +#audio-list li a:hover, #videos-list li a:hover, 
    3.88 +#radio-list li a:hover {
    3.89 +	color: #222;
    3.90 +	background-color: #efefef;
    3.91 +}
    3.92 +
    3.93 +#radio-list li a span { 
    3.94 +	position: absolute;
    3.95 +	right: 50px; 
    3.96 +}
    3.97 +
    3.98 +#video-player { height: 315px; }
    3.99 +video { margin: 0; }
   3.100 +
   3.101 +#video-title {
   3.102 +	width: 100%;
   3.103 +	position: absolute;
   3.104 +	font-size: 80%;
   3.105 +	text-align: center;
   3.106 +	margin-top: 6px;
   3.107 +}
   3.108 +
   3.109 +/* Settings page */
   3.110 +#settings {
   3.111 +	max-width: 600px;
   3.112 +	margin: 40px auto;
   3.113 +	padding: 10px;
   3.114 +	color: #333;
   3.115 +	background-color: #efefef;
   3.116 +}
   3.117 +
   3.118 +/* Footer */
   3.119 +footer { 
   3.120 +	color: #efefef;
   3.121 +	font-size: 150%;
   3.122 +	text-align: center;
   3.123 +}