diff --git a/public/css/style.scss b/public/css/style.scss index f8fdac359..79eb29410 100644 --- a/public/css/style.scss +++ b/public/css/style.scss @@ -1105,8 +1105,37 @@ key { grid-template-columns: auto 1fr; grid-template-areas: "stats chart" - "morestats morestats" - "login login"; + "morestats morestats"; + // "wordsHistory wordsHistory" + // "buttons buttons" + // "login login" + // "ssw ssw"; + + .buttons { + display: grid; + grid-auto-flow: column; + gap: 1rem; + justify-content: center; + // grid-area: buttons; + grid-column: 1/3; + } + + .ssWatermark{ + // grid-area: ssw; + grid-column: 1/3; + } + + #resultWordsHistory{ + // grid-area: wordsHistory; + grid-column: 1/3; + .words{ + display: flex; + flex-wrap: wrap; + width: 100%; + align-content: flex-start; + user-select: none; + } + } .chart { grid-area: chart; @@ -1130,7 +1159,8 @@ key { grid-column: 1/3; text-align: center; color: var(--sub-color); - grid-area: login; + // grid-area: login; + grid-column: 1/3; } .stats { @@ -1444,7 +1474,8 @@ key { #restartTestButton, #showWordHistoryButton, #copyResultToClipboardButton, -#restartTestButtonWithSameWordset { +#restartTestButtonWithSameWordset, +#nextTestButton { position: relative; border-radius: var(--roundness); padding: 1rem 2rem; @@ -1452,7 +1483,6 @@ key { width: -moz-min-content; color: var(--sub-color); transition: 0.25s; - margin-top: 1rem; cursor: pointer; &:hover, @@ -1466,6 +1496,11 @@ key { } } +#restartTestButton{ + margin: 0 auto; + margin-top: 1rem; +} + #middle { .pageTest { .outOfFocusWarning { @@ -1645,20 +1680,11 @@ key { .pageTest { position: relative; - .buttons { - display: grid; - grid-auto-flow: column; - gap: 1rem; - justify-content: center; - } - .ssWatermark { font-size: 1.25rem; color: var(--sub-color); - // position: absolute; - float: right; - bottom: 0; - right: 0; + line-height: 1rem; + text-align: right; } } diff --git a/public/index.html b/public/index.html index a3840bb01..4eec404c2 100644 --- a/public/index.html +++ b/public/index.html @@ -907,13 +907,228 @@
-