code.octet-stream.net Git - broadcaster/blob - server/templates/header.html

   1 <!DOCTYPE html>
   2 <html lang="en">
   3   <head>
   4     <meta charset="UTF-8">
   5     <meta name="viewport" content="width=device-width, initial-scale=1.0">
   6     <title>Broadcaster</title>
   7     <style type="text/css">
   8       table.radio-status, td.outer {
   9         border: 1px solid;
  10       }
  11       table.inner {
  12         border-collapse: collapse;
  13       }
  14       td.clear {
  15         text-align: center;
  16         background-color: #eeeeee;
  17       }
  18       .time-table {
  19         font-size: 90%;
  20       }
  21       .playlist-field {
  22         text-align: right;
  23         padding-right: 1em;
  24         width: 5em;
  25       }
  26       .playlist-table {
  27         font-size: 90%;
  28       }
  29       .stop {
  30         text-align: center;
  31       }
  32       .head {
  33         text-align: center;
  34       }
  35       body {
  36         background-color: #447744;
  37         font-family: "sans-serif";
  38       }
  39       main {
  40         background-color: #dddddd;
  41         max-width: 80em;
  42         margin-left: auto;
  43         margin-right: auto;
  44         display: flex;
  45         flex-wrap: wrap;
  46         flex-direction: row;
  47         border: 2px solid black;
  48       }
  49       .menu {
  50         min-width: 12em;
  51         display: flex;
  52         flex-grow: 1;
  53         flex-direction: column;
  54         text-align: center;
  55       }
  56       .menu-item {
  57         height: 2em;
  58         text-align: center;
  59         line-height: 2em;
  60         background-color: #aaaaaa;
  61         border: black solid;
  62         border-width: 1px 1px 0px 0px;
  63       }
  64       .menu-item a {
  65         text-decoration: none;
  66         color: black;
  67       }
  68       .menu-item.logout {
  69         border-width: 1px 1px 1px 0px;
  70       }
  71       .menu-item:first-of-type {
  72         border-width: 0px 1px 0px 0px;
  73       }
  74       .menu-item.selected {
  75         background-color: #aaccaa;
  76       }
  77       .logged-in {
  78         padding-top: 2em;
  79         padding-bottom: 2em;
  80         text-align: center;
  81         border: black solid;
  82         border-width: 0px 1px 0px 0px;
  83       }
  84       .menu-tail {
  85         flex-grow: 1;
  86         height: 2em;
  87         line-height: 2em;
  88         border: black solid;
  89         border-width: 0px 1px 0px 0px;
  90       }
  91       .content {
  92         flex-grow: 30;
  93         padding: 5em;
  94         padding-top: 1em;
  95         overflow-wrap: break-word;
  96         max-width: 50em;
  97       }
  98     </style>
  99   </head>
 100   <body>
 101     <main>
 102     {{if .SelectedMenu}}
 103         <div class="menu">
 104             <div class="menu-item {{if eq .SelectedMenu "status"}}selected{{end}}"><a href="/">Status</a></div>
 105             <div class="menu-item {{if eq .SelectedMenu "files"}}selected{{end}}"><a href="/files/">Files</a></div>
 106             <div class="menu-item {{if eq .SelectedMenu "playlists"}}selected{{end}}"><a href="/playlists/">Playlists</a></div>
 107             <div class="menu-item {{if eq .SelectedMenu "radios"}}selected{{end}}"><a href="/radios/">Radios</a></div>
 108             {{if .User.IsAdmin}}
 109             <div class="menu-item {{if eq .SelectedMenu "users"}}selected{{end}}"><a href="/users/">Users</a></div>
 110             {{end}}
 111             <div class="menu-item {{if eq .SelectedMenu "change-password"}}selected{{end}}"><a href="/change-password">Change Password</a></div>
 112             <div class="menu-item logout"><a href="/logout">Log Out</a></div>
 113             {{if .User.Username}}
 114             <div class="logged-in">Logged in as:<br><i>{{.User.Username}}</i></div>
 115             {{end}}
 116             <div class="menu-tail"><small><i>broadcaster-server vTODO</i></small></div>
 117         </div>
 118     {{end}}
 119     <div class="content">