mirror of
https://gitlab.xiph.org/xiph/icecast-server.git
synced 2024-12-04 14:46:30 -05:00
WIP new style for the web interface
This commit is contained in:
parent
6484fb40c6
commit
5b4ad6d7a8
@ -1,30 +1,47 @@
|
|||||||
<xsl:stylesheet xmlns:xsl = "http://www.w3.org/1999/XSL/Transform" version = "1.0" xmlns="http://www.w3.org/1999/xhtml">
|
<xsl:stylesheet xmlns:xsl = "http://www.w3.org/1999/XSL/Transform" version = "1.0" xmlns="http://www.w3.org/1999/xhtml">
|
||||||
<xsl:output omit-xml-declaration="no" method="xml" doctype-public="-//W3C//DTD XHTML 1.0 Strict//EN" doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" indent="yes" encoding="UTF-8" />
|
<xsl:output omit-xml-declaration="no" method="xml" doctype-public="-//W3C//DTD XHTML 1.0 Strict//EN" doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" indent="yes" encoding="UTF-8" />
|
||||||
<!-- Import include files -->
|
<!-- Import include files -->
|
||||||
|
|
||||||
<xsl:template match="/node()">
|
<xsl:template match="/node()">
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<title><xsl:value-of select="$title"/> — Icecast Streaming Media Server</title>
|
<meta charset="utf-8" />
|
||||||
<link rel="stylesheet" type="text/css" href="style.css" />
|
<title><xsl:value-of select="$title"/> — Icecast Server</title>
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
|
|
||||||
</head>
|
<link rel="stylesheet" type="text/css" href="/assets/css/style.css" media="screen, print" />
|
||||||
<body>
|
|
||||||
<h1 id="header">Icecast <xsl:value-of select="$title"/></h1>
|
<meta name="theme-color" content="#001826" />
|
||||||
<!--index header menu -->
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
|
||||||
<div id="menu">
|
<meta name="description" content="Icecast is free server software for streaming multimedia." />
|
||||||
<ul>
|
</head>
|
||||||
<li><a href="admin/">Administration</a></li>
|
<body>
|
||||||
<li><a href="status.xsl">Server Status</a></li>
|
<!-- Header and menu -->
|
||||||
<li><a href="server_version.xsl">Version</a></li>
|
<header>
|
||||||
</ul>
|
<nav id="main-nav" role="primary">
|
||||||
</div>
|
<a href="/" id="branding">
|
||||||
<!--end index header menu -->
|
<img src="icecast.png" alt="" />
|
||||||
<xsl:call-template name="content" namespace="http://www.w3.org/1999/xhtml" />
|
<h1>Icecast Server</h1>
|
||||||
<div id="footer">
|
</a>
|
||||||
Support icecast development at <a href="http://www.icecast.org">www.icecast.org</a>
|
<ul>
|
||||||
</div>
|
<li><a href="#">Status</a></li>
|
||||||
</body>
|
<li><a href="#">Version</a></li>
|
||||||
</html>
|
<li class="right"><a href="#">Administration</a></li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<!--<h1 id="header">Icecast <xsl:value-of select="$title"/></h1>-->
|
||||||
|
|
||||||
|
<!-- Content -->
|
||||||
|
<main role="main">
|
||||||
|
<xsl:call-template name="content" namespace="http://www.w3.org/1999/xhtml" />
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<!-- Footer -->
|
||||||
|
<footer>
|
||||||
|
<p>Support icecast development at <a href="http://icecast.org">icecast.org</a></p>
|
||||||
|
</footer>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
</xsl:template>
|
</xsl:template>
|
||||||
</xsl:stylesheet>
|
</xsl:stylesheet>
|
||||||
|
@ -3,29 +3,14 @@
|
|||||||
webdir = $(pkgdatadir)/web
|
webdir = $(pkgdatadir)/web
|
||||||
|
|
||||||
nobase_web_DATA = \
|
nobase_web_DATA = \
|
||||||
status.xsl \
|
status.xsl \
|
||||||
favicon.ico \
|
|
||||||
icecast.png \
|
|
||||||
style.css \
|
|
||||||
auth.xsl \
|
auth.xsl \
|
||||||
server_version.xsl \
|
server_version.xsl \
|
||||||
tunein.png \
|
|
||||||
key.png \
|
|
||||||
status-json.xsl \
|
status-json.xsl \
|
||||||
xml2json.xslt \
|
xml2json.xslt \
|
||||||
|
favicon.ico \
|
||||||
assets/css/style.css \
|
assets/css/style.css \
|
||||||
assets/font/FiraMono-Bold.eot \
|
assets/img/icecast.png
|
||||||
assets/font/FiraMono-Regular.eot \
|
|
||||||
assets/font/FiraSans-Bold.eot \
|
|
||||||
assets/font/FiraSans-BoldItalic.woff \
|
|
||||||
assets/font/FiraSans-Italic.eot \
|
|
||||||
assets/font/FiraSans-Regular.eot \
|
|
||||||
assets/font/FiraMono-Bold.woff \
|
|
||||||
assets/font/FiraMono-Regular.woff \
|
|
||||||
assets/font/FiraSans-BoldItalic.eot \
|
|
||||||
assets/font/FiraSans-Bold.woff \
|
|
||||||
assets/font/FiraSans-Italic.woff \
|
|
||||||
assets/font/FiraSans-Regular.woff
|
|
||||||
|
|
||||||
|
|
||||||
EXTRA_DIST = $(nobase_web_DATA)
|
EXTRA_DIST = $(nobase_web_DATA)
|
||||||
|
File diff suppressed because it is too large
Load Diff
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Before Width: | Height: | Size: 8.9 KiB After Width: | Height: | Size: 8.9 KiB |
BIN
web/key.png
BIN
web/key.png
Binary file not shown.
Before Width: | Height: | Size: 2.2 KiB |
307
web/status.xsl
307
web/status.xsl
@ -13,157 +13,164 @@
|
|||||||
-->
|
-->
|
||||||
</xsl:text>
|
</xsl:text>
|
||||||
<!--mount point stats-->
|
<!--mount point stats-->
|
||||||
<xsl:for-each select="source">
|
<h2>Status</h2>
|
||||||
<xsl:choose>
|
<xsl:choose>
|
||||||
<xsl:when test="listeners">
|
<xsl:when test="source">
|
||||||
<div class="roundbox">
|
<xsl:for-each select="source">
|
||||||
<div class="mounthead">
|
<xsl:choose>
|
||||||
<h3 class="mount">Mount Point <xsl:value-of select="@mount" /></h3>
|
<xsl:when test="listeners">
|
||||||
<div class="right">
|
<section class="box">
|
||||||
<xsl:choose>
|
<h3 class="box_title">Mountpoint <code><xsl:value-of select="@mount" /></code></h3>
|
||||||
<xsl:when test="authenticator">
|
|
||||||
<a class="auth" href="/auth.xsl">Login</a>
|
<!-- Playlists section -->
|
||||||
</xsl:when>
|
<h4>Play stream</h4>
|
||||||
<xsl:otherwise>
|
<ul class="playlists">
|
||||||
<ul class="mountlist">
|
<li><a href="{@mount}">Direct</a></li>
|
||||||
<li><a class="play" href="{@mount}.m3u">M3U</a></li>
|
<li><a href="{@mount}.m3u">M3U</a></li>
|
||||||
<li><a class="play" href="{@mount}.xspf">XSPF</a></li>
|
<li><a href="{@mount}.xspf">XSPF</a></li>
|
||||||
<!-- <li><a class="play" href="{@mount}.vclt">VCLT</a></li> -->
|
</ul>
|
||||||
</ul>
|
|
||||||
</xsl:otherwise>
|
<!-- Player -->
|
||||||
</xsl:choose>
|
<xsl:if test="server_type and ((server_type = 'application/ogg') or (server_type = 'audio/ogg') or (server_type = 'audio/webm'))">
|
||||||
</div>
|
<div class="audioplayer">
|
||||||
</div>
|
<audio controls="controls" preload="none">
|
||||||
<div class="mountcont">
|
<source src="{@mount}" type="{server_type}" />
|
||||||
<xsl:if test="server_type and ((server_type = 'application/ogg') or (server_type = 'audio/ogg') or (server_type = 'audio/webm'))">
|
</audio>
|
||||||
<div class="audioplayer">
|
</div>
|
||||||
<audio controls="controls" preload="none">
|
</xsl:if>
|
||||||
<source src="{@mount}" type="{server_type}" />
|
|
||||||
</audio>
|
<!-- Stream info and stats -->
|
||||||
</div>
|
<h4>Further information</h4>
|
||||||
</xsl:if>
|
<div class="mountcont">
|
||||||
<table class="yellowkeys">
|
<table class="table-keys">
|
||||||
<tbody>
|
<tbody>
|
||||||
<xsl:if test="server_name">
|
<xsl:if test="server_name">
|
||||||
<tr>
|
<tr>
|
||||||
<td>Stream Name:</td>
|
<td>Stream Name:</td>
|
||||||
<td><xsl:value-of select="server_name" /></td>
|
<td><xsl:value-of select="server_name" /></td>
|
||||||
</tr>
|
</tr>
|
||||||
</xsl:if>
|
</xsl:if>
|
||||||
<xsl:if test="server_description">
|
<xsl:if test="server_description">
|
||||||
<tr>
|
<tr>
|
||||||
<td>Stream Description:</td>
|
<td>Stream Description:</td>
|
||||||
<td><xsl:value-of select="server_description" /></td>
|
<td><xsl:value-of select="server_description" /></td>
|
||||||
</tr>
|
</tr>
|
||||||
</xsl:if>
|
</xsl:if>
|
||||||
<xsl:if test="server_type">
|
<xsl:if test="server_type">
|
||||||
<tr>
|
<tr>
|
||||||
<td>Content Type:</td>
|
<td>Content Type:</td>
|
||||||
<td><xsl:value-of select="server_type" /></td>
|
<td><xsl:value-of select="server_type" /></td>
|
||||||
</tr>
|
</tr>
|
||||||
</xsl:if>
|
</xsl:if>
|
||||||
<xsl:if test="stream_start">
|
<xsl:if test="stream_start">
|
||||||
<tr>
|
<tr>
|
||||||
<td>Stream started:</td>
|
<td>Stream started:</td>
|
||||||
<td class="streamstats"><xsl:value-of select="stream_start" /></td>
|
<td class="streamstats"><xsl:value-of select="stream_start" /></td>
|
||||||
</tr>
|
</tr>
|
||||||
</xsl:if>
|
</xsl:if>
|
||||||
<xsl:if test="bitrate">
|
<xsl:if test="bitrate">
|
||||||
<tr>
|
<tr>
|
||||||
<td>Bitrate:</td>
|
<td>Bitrate:</td>
|
||||||
<td class="streamstats"><xsl:value-of select="bitrate" /></td>
|
<td class="streamstats"><xsl:value-of select="bitrate" /></td>
|
||||||
</tr>
|
</tr>
|
||||||
</xsl:if>
|
</xsl:if>
|
||||||
<xsl:if test="quality">
|
<xsl:if test="quality">
|
||||||
<tr>
|
<tr>
|
||||||
<td>Quality:</td>
|
<td>Quality:</td>
|
||||||
<td class="streamstats"><xsl:value-of select="quality" /></td>
|
<td class="streamstats"><xsl:value-of select="quality" /></td>
|
||||||
</tr>
|
</tr>
|
||||||
</xsl:if>
|
</xsl:if>
|
||||||
<xsl:if test="video_quality">
|
<xsl:if test="video_quality">
|
||||||
<tr>
|
<tr>
|
||||||
<td>Video Quality:</td>
|
<td>Video Quality:</td>
|
||||||
<td class="streamstats"><xsl:value-of select="video_quality" /></td>
|
<td class="streamstats"><xsl:value-of select="video_quality" /></td>
|
||||||
</tr>
|
</tr>
|
||||||
</xsl:if>
|
</xsl:if>
|
||||||
<xsl:if test="frame_size">
|
<xsl:if test="frame_size">
|
||||||
<tr>
|
<tr>
|
||||||
<td>Framesize:</td>
|
<td>Framesize:</td>
|
||||||
<td class="streamstats"><xsl:value-of select="frame_size" /></td>
|
<td class="streamstats"><xsl:value-of select="frame_size" /></td>
|
||||||
</tr>
|
</tr>
|
||||||
</xsl:if>
|
</xsl:if>
|
||||||
<xsl:if test="frame_rate">
|
<xsl:if test="frame_rate">
|
||||||
<tr>
|
<tr>
|
||||||
<td>Framerate:</td>
|
<td>Framerate:</td>
|
||||||
<td class="streamstats"><xsl:value-of select="frame_rate" /></td>
|
<td class="streamstats"><xsl:value-of select="frame_rate" /></td>
|
||||||
</tr>
|
</tr>
|
||||||
</xsl:if>
|
</xsl:if>
|
||||||
<xsl:if test="listeners">
|
<xsl:if test="listeners">
|
||||||
<tr>
|
<tr>
|
||||||
<td>Listeners (current):</td>
|
<td>Listeners (current):</td>
|
||||||
<td class="streamstats"><xsl:value-of select="listeners" /></td>
|
<td class="streamstats"><xsl:value-of select="listeners" /></td>
|
||||||
</tr>
|
</tr>
|
||||||
</xsl:if>
|
</xsl:if>
|
||||||
<xsl:if test="listener_peak">
|
<xsl:if test="listener_peak">
|
||||||
<tr>
|
<tr>
|
||||||
<td>Listeners (peak):</td>
|
<td>Listeners (peak):</td>
|
||||||
<td class="streamstats"><xsl:value-of select="listener_peak" /></td>
|
<td class="streamstats"><xsl:value-of select="listener_peak" /></td>
|
||||||
</tr>
|
</tr>
|
||||||
</xsl:if>
|
</xsl:if>
|
||||||
<xsl:if test="genre">
|
<xsl:if test="genre">
|
||||||
<tr>
|
<tr>
|
||||||
<td>Genre:</td>
|
<td>Genre:</td>
|
||||||
<td class="streamstats"><xsl:value-of select="genre" /></td>
|
<td class="streamstats"><xsl:value-of select="genre" /></td>
|
||||||
</tr>
|
</tr>
|
||||||
</xsl:if>
|
</xsl:if>
|
||||||
<xsl:if test="server_url">
|
<xsl:if test="server_url">
|
||||||
<tr>
|
<tr>
|
||||||
<td>Stream URL:</td>
|
<td>Stream URL:</td>
|
||||||
<td class="streamstats">
|
<td class="streamstats">
|
||||||
<a href="{server_url}"><xsl:value-of select="server_url" /></a>
|
<a href="{server_url}"><xsl:value-of select="server_url" /></a>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
</xsl:if>
|
</xsl:if>
|
||||||
<tr>
|
|
||||||
<td>Currently playing:</td>
|
|
||||||
<td class="streamstats">
|
|
||||||
<xsl:if test="artist">
|
|
||||||
<xsl:value-of select="artist" /> -
|
|
||||||
</xsl:if>
|
|
||||||
<xsl:value-of select="title" />
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
<!-- Extra playlist -->
|
|
||||||
<xsl:if test="playlist/*">
|
|
||||||
<h4>Playlist</h4>
|
|
||||||
<table class="table-block">
|
|
||||||
<tbody>
|
|
||||||
<tr>
|
|
||||||
<th>Album</th>
|
|
||||||
<th>Track</th>
|
|
||||||
<th>Creator</th>
|
|
||||||
<th>Title</th>
|
|
||||||
</tr>
|
|
||||||
<xsl:for-each select="playlist/trackList/track">
|
|
||||||
<tr>
|
<tr>
|
||||||
<td><xsl:value-of select="album" /></td>
|
<td>Currently playing:</td>
|
||||||
<td><xsl:value-of select="trackNum" /></td>
|
<td class="streamstats">
|
||||||
<td><xsl:value-of select="creator" /></td>
|
<xsl:if test="artist">
|
||||||
<td><xsl:value-of select="title" /></td>
|
<xsl:value-of select="artist" /> -
|
||||||
|
</xsl:if>
|
||||||
|
<xsl:value-of select="title" />
|
||||||
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
</xsl:for-each>
|
</tbody>
|
||||||
</tbody>
|
</table>
|
||||||
</table>
|
<!-- Extra playlist -->
|
||||||
</xsl:if>
|
<xsl:if test="playlist/*">
|
||||||
</div>
|
<h4>Playlist</h4>
|
||||||
</div>
|
<table class="table-block">
|
||||||
</xsl:when>
|
<tbody>
|
||||||
<xsl:otherwise>
|
<tr>
|
||||||
<h3><xsl:value-of select="@mount" /> - Not Connected</h3>
|
<th>Album</th>
|
||||||
</xsl:otherwise>
|
<th>Track</th>
|
||||||
</xsl:choose>
|
<th>Creator</th>
|
||||||
</xsl:for-each>
|
<th>Title</th>
|
||||||
|
</tr>
|
||||||
|
<xsl:for-each select="playlist/trackList/track">
|
||||||
|
<tr>
|
||||||
|
<td><xsl:value-of select="album" /></td>
|
||||||
|
<td><xsl:value-of select="trackNum" /></td>
|
||||||
|
<td><xsl:value-of select="creator" /></td>
|
||||||
|
<td><xsl:value-of select="title" /></td>
|
||||||
|
</tr>
|
||||||
|
</xsl:for-each>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</xsl:if>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</xsl:when>
|
||||||
|
<xsl:otherwise>
|
||||||
|
<h3><xsl:value-of select="@mount" /> - Not Connected</h3>
|
||||||
|
</xsl:otherwise>
|
||||||
|
</xsl:choose>
|
||||||
|
</xsl:for-each>
|
||||||
|
</xsl:when>
|
||||||
|
<xsl:otherwise>
|
||||||
|
<aside class="error">
|
||||||
|
<strong>No mounts!</strong> There are no active mountpoints.
|
||||||
|
</aside>
|
||||||
|
</xsl:otherwise>
|
||||||
|
</xsl:choose>
|
||||||
</xsl:template>
|
</xsl:template>
|
||||||
</xsl:stylesheet>
|
</xsl:stylesheet>
|
||||||
|
274
web/style.css
274
web/style.css
@ -1,274 +0,0 @@
|
|||||||
html {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
background-color: #000;
|
|
||||||
}
|
|
||||||
|
|
||||||
body {
|
|
||||||
padding: 0 25px 0 50px;
|
|
||||||
background-color: #000;
|
|
||||||
font-family: Verdana, sans-serif;
|
|
||||||
text-decoration: none;
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
|
|
||||||
a {
|
|
||||||
color: #f8ef64;
|
|
||||||
text-decoration: none;
|
|
||||||
border-bottom: 1px dotted #f8ef64;
|
|
||||||
}
|
|
||||||
|
|
||||||
a:hover {
|
|
||||||
color: #f8ef64;
|
|
||||||
text-decoration: none;
|
|
||||||
border-bottom: 1px solid #f8ef64;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1 {
|
|
||||||
font-family: Verdana, sans-serif;
|
|
||||||
text-decoration: none;
|
|
||||||
font-weight: bold;
|
|
||||||
font-size: 3em;
|
|
||||||
color: #fff;
|
|
||||||
margin-top: 3px;
|
|
||||||
}
|
|
||||||
|
|
||||||
h3 {
|
|
||||||
margin: 0px;
|
|
||||||
padding: 0px;
|
|
||||||
font-family: Verdana, sans-serif;
|
|
||||||
font-weight: bold;
|
|
||||||
font-size: 110%;
|
|
||||||
color: #f8ef64;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1#header{
|
|
||||||
padding: 10px 0px 10px 80px;
|
|
||||||
background: transparent url(/icecast.png) no-repeat scroll left center;
|
|
||||||
}
|
|
||||||
|
|
||||||
h3 small {
|
|
||||||
color: #fff;
|
|
||||||
font-size: 70%;
|
|
||||||
padding-left: 15px;
|
|
||||||
}
|
|
||||||
|
|
||||||
form.alignedform label {
|
|
||||||
text-align: right;
|
|
||||||
display: inline-block;
|
|
||||||
vertical-align: middle;
|
|
||||||
width: 10em;
|
|
||||||
margin: 0 1em 0 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
form.alignedform input {
|
|
||||||
display: inline-block;
|
|
||||||
vertical-align: middle;
|
|
||||||
border: 1px solid #f8ef64;
|
|
||||||
background-color: #333;
|
|
||||||
color: #f8ef64;
|
|
||||||
padding: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#menu {
|
|
||||||
border-top: 3px solid #7B96C6;
|
|
||||||
border-bottom: 3px solid #7B96C6;
|
|
||||||
text-align: center;
|
|
||||||
margin-bottom: 35px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#menu ul {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
list-style: none;
|
|
||||||
display: inline-block;
|
|
||||||
vertical-align: middle;
|
|
||||||
}
|
|
||||||
|
|
||||||
#menu ul li {
|
|
||||||
float: left;
|
|
||||||
padding-left: 25px;
|
|
||||||
padding-right: 25px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#menu ul li a {
|
|
||||||
font-family: Verdana, sans-serif;
|
|
||||||
text-decoration: none;
|
|
||||||
color: #fff;
|
|
||||||
font-size: 18px;
|
|
||||||
border: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
#menu ul li a:hover {
|
|
||||||
color: #f8ef64;
|
|
||||||
}
|
|
||||||
|
|
||||||
.roundbox {
|
|
||||||
width: 90%;
|
|
||||||
background-color: #656565;
|
|
||||||
border-radius: 10px;
|
|
||||||
padding: 15px 20px;
|
|
||||||
margin-bottom: 35px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.roundbox h3 {
|
|
||||||
margin-bottom: 10px;
|
|
||||||
border-bottom: 1px groove #ACACAC;
|
|
||||||
}
|
|
||||||
|
|
||||||
.roundbox table.yellowkeys tr td:last-child {
|
|
||||||
color: #f8ef64;
|
|
||||||
}
|
|
||||||
|
|
||||||
table.colortable {
|
|
||||||
border-collapse: collapse;
|
|
||||||
padding: 20px 0 20px 0;
|
|
||||||
margin: 0 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
table.colortable td {
|
|
||||||
border: 1px solid #000;
|
|
||||||
text-align: center;
|
|
||||||
padding: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
table.colortable thead tr td {
|
|
||||||
color: #656565;
|
|
||||||
background: #f8ef64;
|
|
||||||
border-color: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
.roundbox table.yellowkeys tr td {
|
|
||||||
padding: 5px 5px 0 0;
|
|
||||||
word-wrap: break-word;
|
|
||||||
word-break: break-all;
|
|
||||||
}
|
|
||||||
|
|
||||||
.right {
|
|
||||||
float: right;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mounthead h3 {
|
|
||||||
float: left;
|
|
||||||
margin-bottom: 0px;
|
|
||||||
border-bottom: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mountcont {
|
|
||||||
border-top: 1px groove #ACACAC;
|
|
||||||
clear: both;
|
|
||||||
}
|
|
||||||
|
|
||||||
ul.mountlist {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
list-style: none;
|
|
||||||
text-align: right;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mountlist li {
|
|
||||||
display: inline;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.play {
|
|
||||||
padding-left: 22px;
|
|
||||||
margin-left: 25px;
|
|
||||||
border: none;
|
|
||||||
background: transparent url(/tunein.png) no-repeat scroll left center;
|
|
||||||
background-size: auto 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.auth {
|
|
||||||
padding-left: 22px;
|
|
||||||
margin-left: 25px;
|
|
||||||
border: none;
|
|
||||||
background: transparent url(/key.png) no-repeat scroll left top;
|
|
||||||
background-size: auto 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Admin navigation */
|
|
||||||
|
|
||||||
ul.nav {
|
|
||||||
margin: 0;
|
|
||||||
padding: 5px 0 10px 0;
|
|
||||||
clear: both;
|
|
||||||
list-style: none;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
ul.nav li {
|
|
||||||
display: inline;
|
|
||||||
}
|
|
||||||
|
|
||||||
ul.nav li a {
|
|
||||||
border: none;
|
|
||||||
display: inline-block;
|
|
||||||
padding: .2em .7em;
|
|
||||||
margin-top: .2em;
|
|
||||||
background-color: #333;
|
|
||||||
white-space: nowrap;
|
|
||||||
}
|
|
||||||
|
|
||||||
ul.nav li a:hover {
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Footer */
|
|
||||||
|
|
||||||
#footer {
|
|
||||||
border-top: 1px groove #ACACAC;
|
|
||||||
margin-top: 20px;
|
|
||||||
font-size: 80%;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 800px) {
|
|
||||||
|
|
||||||
body {
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.roundbox {
|
|
||||||
width: auto;
|
|
||||||
border-radius: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.roundbox table.yellowkeys tr td {
|
|
||||||
display: block;
|
|
||||||
padding: 5px 5px 0 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.roundbox table.yellowkeys tr td:last-child {
|
|
||||||
margin-bottom: 5px;
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.scrolltable {
|
|
||||||
overflow: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 320px) {
|
|
||||||
|
|
||||||
ul.nav, #menu ul {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
|
|
||||||
ul.nav li, #menu ul li {
|
|
||||||
float: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
ul.nav li a, #menu ul li a {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
|
|
||||||
ul.nav li + li, #menu ul li + li {
|
|
||||||
border-top: 1px solid #ACACAC;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.play {
|
|
||||||
margin-left: 15px;
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
BIN
web/tunein.png
BIN
web/tunein.png
Binary file not shown.
Before Width: | Height: | Size: 2.0 KiB |
Loading…
Reference in New Issue
Block a user