diff --git a/homework/math/assets/media/math-teacher-logo-small.png b/homework/math/assets/media/math-teacher-logo-small.png new file mode 100644 index 0000000..7c0e2a1 Binary files /dev/null and b/homework/math/assets/media/math-teacher-logo-small.png differ diff --git a/homework/math/assets/media/math-teacher-logo.png b/homework/math/assets/media/math-teacher-logo.png new file mode 100644 index 0000000..066cb09 Binary files /dev/null and b/homework/math/assets/media/math-teacher-logo.png differ diff --git a/homework/math/assets/style/style.css b/homework/math/assets/style/style.css index d72a7cf..b8ea1c6 100644 --- a/homework/math/assets/style/style.css +++ b/homework/math/assets/style/style.css @@ -49,6 +49,12 @@ button:hover, button.active { color: #666; } +#result { + display: flex; + flex-direction: column; + align-items: center; +} + #resultTime { font-size: 3vh; } @@ -83,8 +89,9 @@ footer button { max-width: 100%; } -#counter div { +#counterCount { margin-top: 1em; + opacity: .5; } #life { @@ -101,14 +108,24 @@ footer button { font-size: 6px; } -#intro img { +#intro { max-width: 25%; } +#intro img { + width: 100%; +} + #highScore { font-size: 2vh; color: #666; margin-top: 1em; + padding: 2em; + max-width: 100px; +} + +#highScore strong { + text-decoration: underline; } #dailyStreak { @@ -126,6 +143,40 @@ button[data-theme-toggle] { right: 1em; } +.mathTeacher[title]{ + position: relative; +} +.mathTeacher[title]:before { + position: absolute; + right: 0; + top: -60px; + background-color: #333; + color: white; + height: 30px; + line-height: 30px; + border-radius: 5px; + padding: 10px 15px; + content: attr(title); + white-space: nowrap; + display: none; + font-size: 16px; +} +.mathTeacher[title]:after { + position: absolute; + left: 15px; + top: -10px; + border-top: 7px solid #333; + border-left: 7px solid transparent; + border-right: 7px solid transparent; + content: ""; + display: none; + font-size: 1em; +} +.mathTeacher[title]:hover:after, +.mathTeacher[title]:hover:before { + display: block; +} + @media (max-width: 768px) { main, #game, #resultInput { font-size: 10vh; diff --git a/homework/math/game.html b/homework/math/game.html index 46e99a2..ac6c411 100644 --- a/homework/math/game.html +++ b/homework/math/game.html @@ -6,9 +6,9 @@ content="width=device-width, initial-scale=1.0, height=device-height, minimum-scale=1.0, maximum-scale=1.0,user-scalable=0">