code.octet-stream.net Git - broadcaster/blob - broadcaster-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         /* border: black solid; */
  55         /* border-width: 0px 2px 0px 0px; */
  56         text-align: center;
  57       }
  58       .menu-item {
  59         height: 2em;
  60         text-align: center;
  61         line-height: 2em;
  62         background-color: #aaaaaa;
  63         border: black solid;
  64         border-width: 1px 1px 0px 0px;
  65       }
  66       .menu-item a {
  67         text-decoration: none;
  68         color: black;
  69       }
  70       .menu-item.logout {
  71         border-width: 1px 1px 1px 0px;
  72       }
  73       .menu-item:first-of-type {
  74         border-width: 0px 1px 0px 0px;
  75       }
  76       .menu-item.selected {
  77         background-color: #aaccaa;
  78       }
  79       .logged-in {
  80         padding-top: 2em;
  81         padding-bottom: 2em;
  82         text-align: center;
  83         border: black solid;
  84         border-width: 0px 1px 0px 0px;
  85       }
  86       .menu-tail {
  87         flex-grow: 1;
  88         height: 2em;
  89         line-height: 2em;
  90         border: black solid;
  91         border-width: 0px 1px 0px 0px;
  92       }
  93       .content {
  94         flex-grow: 3;
  95         padding: 5em;
  96         padding-top: 1em;
  97         overflow-wrap: break-word;
  98         max-width: 50em;
  99       }
 100     </style>
 101   </head>
 102   <body>
 103     <main>
 104     {{if .SelectedMenu}}
 105         <div class="menu">
 106             <div class="menu-item {{if eq .SelectedMenu "status"}}selected{{end}}"><a href="/">Status</a></div>
 107             <div class="menu-item {{if eq .SelectedMenu "files"}}selected{{end}}"><a href="/files/">Files</a></div>
 108             <div class="menu-item {{if eq .SelectedMenu "playlists"}}selected{{end}}"><a href="/playlists/">Playlists</a></div>
 109             <div class="menu-item {{if eq .SelectedMenu "radios"}}selected{{end}}"><a href="/radios/">Radios</a></div>
 110             <div class="menu-item {{if eq .SelectedMenu "users"}}selected{{end}}"><a href="/users/">Users</a></div>
 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 .Username}}
 114             <div class="logged-in">Logged in as:<br><i>{{.Username}}</i></div>
 115             {{end}}
 116             <div class="menu-tail"><small><i>broadcaster-server v1.0.0</i></small></div>
 117         </div>
 118     {{end}}
 119     <div class="content">