Commit 157dad0a authored by ale's avatar ale

Slight modernization of the status UI

parent b1a92b9b
Pipeline #5685 passed with stages
in 5 minutes and 24 seconds
......@@ -3,14 +3,15 @@ SOURCES = \
static/css/bootstrap.min.css \
static/js/bootstrap.bundle.min.js \
static/js/jquery-3.4.0.slim.min.js \
static/js/autoradio.js
static/js/autoradio.js \
static/autoradio.svg
COMPRESSED = \
$(SOURCES:%=%.br) \
$(SOURCES:%=%.gz)
%.br: %
brotli --input $^ --output $@
brotli --best --output=$@ --force $^
%.gz: %
zopfli $^
......
This diff is collapsed.
<?xml version="1.0"?>
<svg width="722" height="952" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<symbol id="svg_1" viewBox="0 0 80 100" x="0px" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" y="0px">
<g>
<path d="m43.2263,34.0562c1.7085,-1.0909 2.7737,-2.9803 2.7737,-5.0562c0,-3.3086 -2.6914,-6 -6,-6s-6,2.6914 -6,6c0,2.0744 1.0638,3.9625 2.7739,5.0555l-11.6948,27.5539c-0.2158,0.5088 0.0215,1.0957 0.5303,1.3115c0.1279,0.0537 0.2597,0.0791 0.3906,0.0791c0.3887,0 0.7588,-0.2285 0.9209,-0.6094l3.0032,-7.0757l9.0759,6.2122l0,5.4729c0,0.5527 0.4473,1 1,1s1,-0.4473 1,-1l0,-5.4729l9.0759,-6.2122l3.0032,7.0757c0.1621,0.3809 0.5322,0.6094 0.9209,0.6094c0.1309,0 0.2637,-0.0254 0.3906,-0.0791c0.5088,-0.2158 0.7461,-0.8027 0.5303,-1.3115l-11.6946,-27.5532zm-4.2263,0.8547l0,12.1921l-4.3313,-2.9669l3.9482,-9.3022c0.127,0.0298 0.2545,0.0556 0.3831,0.077zm2,-0.0001c0.1284,-0.0215 0.256,-0.0472 0.3829,-0.0771l3.9484,9.3026l-4.3313,2.9668l0,-12.1923zm-1,-9.9108c2.2061,0 4,1.7944 4,4c0,1.6118 -0.958,3.0601 -2.4346,3.6865c-0.998,0.416 -2.1387,0.4131 -3.125,0.0029c-1.4824,-0.6293 -2.4404,-2.0776 -2.4404,-3.6894c0,-2.2056 1.7939,-4 4,-4zm-9.279,28.4373l3.1503,-7.4224l5.1287,3.5127l0,9.576l-8.279,-5.6663zm10.279,5.6663l0,-9.576l5.1287,-3.5126l3.1503,7.4224l-8.279,5.6662z"/>
<path d="m27.4307,24.3545c-0.9502,2.7573 -0.7324,5.7319 0.6113,8.375c0.1768,0.3472 0.5283,0.5469 0.8926,0.5469c0.1523,0 0.3066,-0.0347 0.4521,-0.1084c0.4922,-0.2505 0.6885,-0.8525 0.4385,-1.3447c-1.0967,-2.1558 -1.2754,-4.5771 -0.5039,-6.8174c0.7715,-2.2397 2.4023,-4.0371 4.5928,-5.061c0.501,-0.2334 0.7168,-0.8286 0.4834,-1.3291c-0.2334,-0.5 -0.8281,-0.7163 -1.3291,-0.4824c-2.6866,1.2548 -4.6885,3.4643 -5.6377,6.2211z"/>
<path d="m29.4844,14.2104c0.5068,-0.2188 0.7402,-0.8076 0.5215,-1.3145s-0.8086,-0.7427 -1.3145,-0.5215c-4.2676,1.8433 -7.4131,5.1689 -8.8574,9.3647c-1.4453,4.1958 -1.0137,8.7534 1.2139,12.8335c0.1816,0.333 0.5244,0.521 0.8789,0.521c0.1621,0 0.3262,-0.0391 0.4785,-0.1221c0.4844,-0.2651 0.6631,-0.8726 0.3984,-1.3569c-1.9551,-3.5806 -2.3389,-7.5669 -1.0791,-11.2246c1.2598,-3.6571 4.0156,-6.5619 7.7598,-8.1796z"/>
<path d="m46.0859,19.8511c2.1904,1.0239 3.8213,2.8213 4.5928,5.061c0.7715,2.2402 0.5928,4.6616 -0.5039,6.8174c-0.25,0.4922 -0.0537,1.0942 0.4385,1.3447c0.1455,0.0737 0.2998,0.1084 0.4521,0.1084c0.3643,0 0.7158,-0.1997 0.8926,-0.5469c1.3438,-2.6431 1.5615,-5.6177 0.6113,-8.375c-0.9492,-2.7568 -2.9512,-4.9663 -5.6377,-6.2212c-0.5,-0.2344 -1.0947,-0.0166 -1.3291,0.4824c-0.2334,0.5006 -0.0175,1.0958 0.4834,1.3292z"/>
<path d="m60.166,21.6455c-1.4443,-4.1958 -4.5898,-7.5215 -8.8574,-9.3647c-0.5068,-0.2188 -1.0967,0.0156 -1.3145,0.5215c-0.2188,0.5068 0.0146,1.0957 0.5215,1.3145c3.7441,1.6177 6.5,4.5225 7.7598,8.1797c1.2598,3.6577 0.876,7.644 -1.0791,11.2246c-0.2646,0.4844 -0.0859,1.0918 0.3984,1.3569c0.1524,0.0829 0.3164,0.122 0.4785,0.122c0.3545,0 0.6973,-0.188 0.8789,-0.521c2.2276,-4.0801 2.6592,-8.6377 1.2139,-12.8335z"/>
</g>
</symbol>
</defs>
<g class="layer">
<title>Layer 1</title>
<circle cx="365.500004" cy="346.000004" fill="#ff7f00" id="svg_13" r="299.563416" stroke="#ff7f00" stroke-dasharray="null" stroke-linecap="null" stroke-linejoin="null" stroke-width="5"/>
<use id="svg_2" x="5.5" xlink:href="#svg_1" y="-23.5"/>
<g id="svg_3"/>
</g>
</svg>
This source diff could not be displayed because it is too large. You can view the blob instead.
......@@ -4,29 +4,17 @@ body {
padding-bottom: 20px;
}
/* Everything gets side spacing for mobile first views */
.header,
.mainitems,
.footer {
padding-left: 15px;
padding-right: 15px;
.row {
margin-left: 0;
margin-right: 0;
}
.page-header {
background: url(../radio52.png) top left no-repeat;
padding-left: 58px;
}
/* Custom page header */
.header {
border-bottom: 1px solid #e5e5e5;
}
/* Make the masthead heading the same height as the navigation */
.header h3 {
margin-top: 0;
margin-bottom: 0;
line-height: 40px;
padding-bottom: 19px;
background: url(../autoradio.svg);
background-position: top left;
background-repeat: no-repeat;
background-size: 50px 66px;
padding-left: 65px;
}
/* Custom page footer */
......@@ -67,13 +55,3 @@ body {
margin-bottom: 30px;
}
}
#bgImg {
display: none;
position: fixed;
top: 0;
left: 0;
overflow: hidden;
z-index: -100;
opacity: 0.3;
}
This source diff could not be displayed because it is too large. You can view the blob instead.
/**
* jQuery.fullBg
* Version 1.0
* Copyright (c) 2010 c.bavota - http://bavotasan.com
* Dual licensed under MIT and GPL.
* Date: 02/23/2010
**/
(function($) {
$.fn.fullBg = function(){
var bgImg = $(this);
function resizeImg() {
var imgwidth = bgImg.width();
var imgheight = bgImg.height();
var winwidth = $(window).width();
var winheight = $(window).height();
var widthratio = winwidth / imgwidth;
var heightratio = winheight / imgheight;
var widthdiff = heightratio * imgwidth;
var heightdiff = widthratio * imgheight;
var newwidth, newheight;
if(heightdiff>winheight) {
newwidth = winwidth;
newheight = heightdiff;
} else {
newwidth = widthdiff;
newheight = winheight;
}
var xoffset = (newwidth - winwidth) / 2,
yoffset = (newheight - winheight) / 2;
bgImg.css({
width: newwidth+'px',
height: newheight+'px',
top: '-'+yoffset+'px',
left: '-'+xoffset+'px'
});
}
resizeImg();
$(window).resize(function() {
resizeImg();
});
return this;
};
})(jQuery)
......@@ -10,9 +10,12 @@
<div class="container">
<div class="page-header">
<h1>{{.Domain}}
<!-- Antenna by Icon Lauk from the Noun Project -->
<h1>
{{.Domain}}
<small>
streaming network
service status
</small>
</h1>
</div>
......@@ -73,7 +76,7 @@
</p>
</div>
<div class="footer">
<div class="row footer">
powered by
<a href="https://git.autistici.org/ale/autoradio">
autoradio
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment