diff --git a/src/static/css/main.css b/src/static/css/main.css index 0ace9d05eaa0b304529a8e2cfdd474e6aa4514fe..98b9fedaecc9a241e0df8fb5e9798bcb65918ee2 100644 --- a/src/static/css/main.css +++ b/src/static/css/main.css @@ -52,3 +52,26 @@ body { margin: auto; text-align: center; } + +.spacer { + margin-bottom: 5vmin; +} + +.page-item { + display: block; + background-color: #616161; + text-align: center; + border-radius: 1vh; + margin: 2vmin; + padding: 2vmin; + + text-decoration: none; + color: white; + font-size: 1.5rem; +} + +@media (max-width: 600px) { + .content { + width: 90%; + } +} \ No newline at end of file diff --git a/src/templates/index.html b/src/templates/index.html index 69a48e6a49c68caeddce8515062759b0b8b6077e..26d46ebacf02ab091c8b9a512f642a294f64fb16 100644 --- a/src/templates/index.html +++ b/src/templates/index.html @@ -10,11 +10,10 @@ <div class="main"> <div class="content"> <h2>Available Pages</h2> - <ul> - {% for name in pageNames %} - <li><a href="{{ url_for("routes.show_page", pageName=name) }}">{{ name }}</a></li> - {% endfor %} - </ul> + <div class="spacer"></div> + {% for name in pageNames %} + <a class="page-item" href="{{ url_for("routes.show_page", pageName=name) }}">{{ name }}</a> + {% endfor %} </div> </div> </body>