~cedric/guardian

639e48582295639b83517475d5fd73973e7e7cf9 — Cédric Bonhomme 17 days ago d0dc68f
chg: improved HTML report template.
3 files changed, 113 insertions(+), 4 deletions(-)

M .gitignore
M guardian/templates/report.html
A reports/static/css/custom.css
M .gitignore => .gitignore +2 -2
@@ 37,7 37,7 @@ eproject.cfg
# Vagrant:
.vagrant/

reports/node_modules/
reports/index.html

reports/node_modules/
reports/static/npm_components
guardian/config/*.yaml

M guardian/templates/report.html => guardian/templates/report.html +10 -2
@@ 6,11 6,12 @@
  <meta name="description" content="Guardian report" />
  <title>Guardian report</title>
  <link rel="stylesheet" type="text/css" href="static/npm_components/bootstrap/dist/css/bootstrap.min.css" media="screen" />
  <link rel="stylesheet" type="text/css" href="static/css/custom.css" media="screen" />
  <script type="text/javascript" src="static/npm_components/popper.js/dist/umd/popper.min.js"></script>
  <script type="text/javascript" src="static/npm_components/bootstrap/dist/js/bootstrap.min.js"></script>
</head>
<body>
  <nav class="navbar navbar-expand-lg">
  <nav class="navbar navbar-expand-lg navbar-dark bg-guardian-blue">
    <div class="container-fluid">
      <a class="navbar-brand" href="/">
        Report


@@ 27,6 28,7 @@
      </div>
    </div>
  </nav>
  <br />
  <div class="container">
    <div class="row">
      <div class="col">


@@ 44,13 46,19 @@
        </ul>
      </div>
    </div>
    <br />
    <div class="row">
      <div class="col">
        Report generated at: {{ end_date }}
      </div>
    </div>
  </div>
  <br />
  <footer class="footer">
    <div class="container-fluid">
      <div class="row">
        <div class="col">
          Report generated at: {{ end_date }}
          <a href="https://git.sr.ht/~cedric/guardian" title="source code"  target="_blank" rel="noopener noreferrer">Guardian source code</a>
        </div>
      </div>
    </div>

A reports/static/css/custom.css => reports/static/css/custom.css +101 -0
@@ 0,0 1,101 @@
html {
    position: relative;
    min-height: 100%;
    font-size: 16px;
}
body {
    /* Margin bottom by footer height */
    margin-bottom: 60px;
    background-color: rgb(246, 248, 250);
}
img {
    padding: 2px;
}
a {
    color: #3572B0;
}

#sidebar {
    overflow: auto;
    max-height: 700px;
}

#sidebar .nav li {
  list-style-type: none;
  padding: 0;
  line-height: 1.0;
  flex-direction: row;
  flex-wrap: nowrap; /* assumes you only want one row */
}

.navbar-dark .navbar-nav .nav-link {
    color:
    rgb(255, 255, 255, 1);
}

.bg-guardian-blue {
    /* background-color: #0082c9; */
    background-image: linear-gradient(40deg, #0082c9 0%, #30b6ff 100%);
}
.btn-primary {
    background-color: #0082c9;
    opacity: 1;
    color: white;
}
.btn-secondary {
    background-color: #0082c9;
    opacity: 0.6;
    color: white;
}

.btn-outline-primary {
    border-color: #0082c9;
    color: #0082c9;
}

.bg-primary {
    background-color: #0082c9 !important;
    opacity: 1;
    color: white;
    text-align: center;
}

.badge-light {
    background-color: rgb(246, 248, 250);
    opacity: 1;
    color: #0082c9 !important;
}


/* Sticky footer */
.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  /* Set the fixed height of the footer here */
  height: 60px;
  line-height: 60px; /* Vertically center the text there */
  background-color: #006FBA;
}
.footer a{
    color: #FFFFFF;
}

.input-group-inline {
    min-width: 0;
    width: 200px;
    display: inline;
}

.alert {
  margin-bottom: 1px;
  height: 30px;
  line-height: 30px;
  padding: 0px 15px;
}

.alert-message {
    position: relative;
    display: block;
    z-index: 1001;
}