From 0901ce93b2b66a88f35a4b832b7854be35358ed5 Mon Sep 17 00:00:00 2001 From: Dan Stewart Date: Thu, 26 Jan 2023 19:44:02 +0000 Subject: [PATCH] Fix footer --- src/css/main.css | 86 ++++++++++++++++--------------- src/index.html | 131 ++++++++++++++++++++++++----------------------- 2 files changed, 111 insertions(+), 106 deletions(-) diff --git a/src/css/main.css b/src/css/main.css index 3e495d5..f080174 100644 --- a/src/css/main.css +++ b/src/css/main.css @@ -1,95 +1,97 @@ body { - width: 90vw; - margin: auto; - /* background-color: #f5f5dc; */ - background-color: #708090; - color: white; - margin-bottom: 150px; + margin: auto; + background-color: #708090; + color: white; + margin-bottom: 150px; } footer { - position: absolute; - bottom: 0; - width: 90vw; - margin: auto; - text-align: center; + position: fixed; + bottom: 0; + width: 100vw; + margin: auto; + text-align: center; + background-color: #708090; + padding-top: 5px; + border-top: 1px solid white; } input { - margin-bottom: 15px; + margin-bottom: 15px; } button { - /* Disable double tap to zoom on buttons */ - touch-action: manipulation; + /* Disable double tap to zoom on buttons */ + touch-action: manipulation; } a { - color: #00008b; + color: #00008b; } a:hover { - text-decoration: underline; + text-decoration: underline; } a#header { - color: white; + color: white; } .icon > img { - margin-bottom: 10px; - margin-right: 15px; + margin-bottom: 10px; + margin-right: 15px; } #link { - white-space: initial; - word-wrap: break-word + white-space: initial; + word-wrap: break-word; } .container { - display: flex; - flex-direction: column; - justify-content: center; - align-items: center; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + width: 90vw; } #flash { - padding: 15px; - font-size: 1.2em; - margin-bottom: 15px; - width: 80vw; + padding: 15px; + font-size: 1.2em; + margin-bottom: 15px; + width: 80vw; } .flash-error { - background-color: #fb6565; - color: white; + background-color: #fb6565; + color: white; } .flash-warning { - background-color: #ffac05; - color: white; + background-color: #ffac05; + color: white; } .flash-success { - background-color: #387b54; - color: white; + background-color: #387b54; + color: white; } .green { - background-color: green; - color: white; + background-color: green; + color: white; } .orange { - background-color: orange; - color: white; + background-color: orange; + color: white; } .gray { - background-color: #696969; - color: white; + background-color: #696969; + color: white; } .is-italic { - font-style: italic; + font-style: italic; } diff --git a/src/index.html b/src/index.html index 9fd6037..d467aea 100644 --- a/src/index.html +++ b/src/index.html @@ -1,82 +1,85 @@ - - - - - - + + + + + + - Custom Wordle + Custom Wordle - - - + + + - - + + - + - - + + - -
-
-

Custom Wordle

- - - - - - + +
+
+

Custom Wordle

+ + + + + + -

Welcome to Custom Wordle!

-

A clone of Wordle that lets you make your own games for others

-
+

Welcome to Custom Wordle!

+

+ A clone of Wordle that lets you make your own games for + others +

+
-
- +
+ - + - + - + -
- -
+
+ +
- -
+
+ +
+
+
+
- - + +