From 27a42c9ad8cd5173d8721364ddd34550f34bfb56 Mon Sep 17 00:00:00 2001 From: songqipro Date: Wed, 14 Jun 2023 19:21:25 +0800 Subject: [PATCH 01/22] Add. --- projects/age-calculator/v2/index.html | 20 ++++++++++++++++++++ 1 file changed, 20 insertions(+) create mode 100644 projects/age-calculator/v2/index.html diff --git a/projects/age-calculator/v2/index.html b/projects/age-calculator/v2/index.html new file mode 100644 index 0000000..9ecd2b8 --- /dev/null +++ b/projects/age-calculator/v2/index.html @@ -0,0 +1,20 @@ + + + + + + + Age Calculator + + +
+

Age Calculator

+
+ + +

Your age is 21 years old.

+
+
+ + \ No newline at end of file From 4c31f7f990cbadcd5095d8133f9cd66d18f9dc13 Mon Sep 17 00:00:00 2001 From: songqipro Date: Wed, 14 Jun 2023 20:44:54 +0800 Subject: [PATCH 02/22] Add. --- projects/age-calculator/v2/index.html | 1 + projects/age-calculator/v2/style.css | 23 +++++++++++++++++++++++ 2 files changed, 24 insertions(+) create mode 100644 projects/age-calculator/v2/style.css diff --git a/projects/age-calculator/v2/index.html b/projects/age-calculator/v2/index.html index 9ecd2b8..f24bc83 100644 --- a/projects/age-calculator/v2/index.html +++ b/projects/age-calculator/v2/index.html @@ -5,6 +5,7 @@ + Age Calculator diff --git a/projects/age-calculator/v2/style.css b/projects/age-calculator/v2/style.css new file mode 100644 index 0000000..b79bd4f --- /dev/null +++ b/projects/age-calculator/v2/style.css @@ -0,0 +1,23 @@ +body { + margin: 0; + padding: 20px; + font-family: "Montserrat", sans-serif; + background-color: #f7f7f7; +} + +.container { + background-color: white; + box-shadow: 0 0 10px rgba(0, 0, 0, .2); + padding: 20px; + max-width: 600px; + margin: 0 auto; + border-radius: 5px; +} + +h1 { + font-size: 36px; + text-align: center; + margin-top: 0; + margin-bottom: 20px; +} + From 10a67fbc92e0738dcc1c5ee370b4761f269d88a8 Mon Sep 17 00:00:00 2001 From: songqipro Date: Wed, 14 Jun 2023 20:50:20 +0800 Subject: [PATCH 03/22] Update. --- projects/age-calculator/v2/style.css | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/projects/age-calculator/v2/style.css b/projects/age-calculator/v2/style.css index b79bd4f..7028d53 100644 --- a/projects/age-calculator/v2/style.css +++ b/projects/age-calculator/v2/style.css @@ -21,3 +21,8 @@ h1 { margin-bottom: 20px; } +.form { + display: flex; + flex-direction: column; + align-items: center +} From dc9bdfea758da3122fc7cfceaa4d113fd615bc84 Mon Sep 17 00:00:00 2001 From: songqipro Date: Wed, 14 Jun 2023 21:02:38 +0800 Subject: [PATCH 04/22] Update. --- projects/age-calculator/v2/style.css | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/projects/age-calculator/v2/style.css b/projects/age-calculator/v2/style.css index 7028d53..1e5b928 100644 --- a/projects/age-calculator/v2/style.css +++ b/projects/age-calculator/v2/style.css @@ -26,3 +26,8 @@ h1 { flex-direction: column; align-items: center } + +label { + font-weight: bold; + margin-bottom: 10px; +} \ No newline at end of file From 56e8c5651a065ea7daaa3f636c99ef95a9cdffbb Mon Sep 17 00:00:00 2001 From: songqipro Date: Wed, 14 Jun 2023 21:36:43 +0800 Subject: [PATCH 05/22] Update. --- projects/age-calculator/v2/style.css | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/projects/age-calculator/v2/style.css b/projects/age-calculator/v2/style.css index 1e5b928..ce28267 100644 --- a/projects/age-calculator/v2/style.css +++ b/projects/age-calculator/v2/style.css @@ -30,4 +30,12 @@ h1 { label { font-weight: bold; margin-bottom: 10px; +} + +input { + padding: 8px; + border: 1px solid #cccccc; + border-radius: 5px; + width: 100%; + max-width: 300px; } \ No newline at end of file From d4a546b260270262353245db382079e8b6b814db Mon Sep 17 00:00:00 2001 From: songqipro Date: Wed, 14 Jun 2023 21:43:29 +0800 Subject: [PATCH 06/22] Update. --- projects/age-calculator/v2/index.html | 1 + projects/age-calculator/v2/style.css | 10 ++++++++++ 2 files changed, 11 insertions(+) diff --git a/projects/age-calculator/v2/index.html b/projects/age-calculator/v2/index.html index f24bc83..3e3df3e 100644 --- a/projects/age-calculator/v2/index.html +++ b/projects/age-calculator/v2/index.html @@ -14,6 +14,7 @@

Age Calculator

+

Your age is 21 years old.

diff --git a/projects/age-calculator/v2/style.css b/projects/age-calculator/v2/style.css index ce28267..2393f36 100644 --- a/projects/age-calculator/v2/style.css +++ b/projects/age-calculator/v2/style.css @@ -38,4 +38,14 @@ input { border-radius: 5px; width: 100%; max-width: 300px; +} + +button { + background-color: #007bff; + color: white; + border: none; + padding: 10px 20px; + border-radius: 5px; + margin-top: 10px; + cursor: pointer; } \ No newline at end of file From 2c01e38dbb90d6ab77759e4f391241fc0a193d01 Mon Sep 17 00:00:00 2001 From: songqipro Date: Wed, 14 Jun 2023 21:46:59 +0800 Subject: [PATCH 07/22] Update. --- projects/age-calculator/v2/style.css | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/projects/age-calculator/v2/style.css b/projects/age-calculator/v2/style.css index 2393f36..bd0ac52 100644 --- a/projects/age-calculator/v2/style.css +++ b/projects/age-calculator/v2/style.css @@ -48,4 +48,9 @@ button { border-radius: 5px; margin-top: 10px; cursor: pointer; + transition: background-color 0.3s ease; +} + +button:hover { + background-color: #0062cc; } \ No newline at end of file From 23384e57292b98c550634574aaf166f6740b36df Mon Sep 17 00:00:00 2001 From: songqipro Date: Wed, 14 Jun 2023 21:47:49 +0800 Subject: [PATCH 08/22] Update. --- projects/age-calculator/v2/style.css | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/projects/age-calculator/v2/style.css b/projects/age-calculator/v2/style.css index bd0ac52..f1d748f 100644 --- a/projects/age-calculator/v2/style.css +++ b/projects/age-calculator/v2/style.css @@ -53,4 +53,10 @@ button { button:hover { background-color: #0062cc; +} + +#result { + margin-top: 20px; + font-size: 24px; + font-weight: bold; } \ No newline at end of file From 5313ecbb12dad47edc4fcc7c34424348955035c8 Mon Sep 17 00:00:00 2001 From: songqipro Date: Wed, 14 Jun 2023 21:49:41 +0800 Subject: [PATCH 09/22] Update. --- projects/age-calculator/v2/style.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/projects/age-calculator/v2/style.css b/projects/age-calculator/v2/style.css index f1d748f..351561f 100644 --- a/projects/age-calculator/v2/style.css +++ b/projects/age-calculator/v2/style.css @@ -10,8 +10,8 @@ body { box-shadow: 0 0 10px rgba(0, 0, 0, .2); padding: 20px; max-width: 600px; - margin: 0 auto; border-radius: 5px; + margin: 50px auto 0; } h1 { From 50c37b4465aa1c13cbb95320ff6386c8663194a8 Mon Sep 17 00:00:00 2001 From: songqipro Date: Thu, 15 Jun 2023 09:42:29 +0800 Subject: [PATCH 10/22] Add. --- projects/tip-calculator/v2/index.html | 10 ++++++++++ 1 file changed, 10 insertions(+) create mode 100644 projects/tip-calculator/v2/index.html diff --git a/projects/tip-calculator/v2/index.html b/projects/tip-calculator/v2/index.html new file mode 100644 index 0000000..82549fa --- /dev/null +++ b/projects/tip-calculator/v2/index.html @@ -0,0 +1,10 @@ + + + + + Tip Calculator + + + + + \ No newline at end of file From 7a448fcce3aa6743126183632324497829751452 Mon Sep 17 00:00:00 2001 From: songqipro Date: Thu, 15 Jun 2023 09:48:50 +0800 Subject: [PATCH 11/22] Update. --- projects/tip-calculator/v2/index.html | 11 ++++++++++- 1 file changed, 10 insertions(+), 1 deletion(-) diff --git a/projects/tip-calculator/v2/index.html b/projects/tip-calculator/v2/index.html index 82549fa..e6e2943 100644 --- a/projects/tip-calculator/v2/index.html +++ b/projects/tip-calculator/v2/index.html @@ -5,6 +5,15 @@ Tip Calculator - +

Tip Calculator

+
+

Enter the bill amount and tip percentage to calculate the total

+ + + + + +

Total: $120.00

+
\ No newline at end of file From 31f750b7cb57ad082a65610bae4f6f10db11ec40 Mon Sep 17 00:00:00 2001 From: songqipro Date: Thu, 15 Jun 2023 09:56:23 +0800 Subject: [PATCH 12/22] Update. --- projects/tip-calculator/v2/index.html | 1 + projects/tip-calculator/v2/style.css | 6 ++++++ 2 files changed, 7 insertions(+) create mode 100644 projects/tip-calculator/v2/style.css diff --git a/projects/tip-calculator/v2/index.html b/projects/tip-calculator/v2/index.html index e6e2943..3240d8c 100644 --- a/projects/tip-calculator/v2/index.html +++ b/projects/tip-calculator/v2/index.html @@ -1,6 +1,7 @@ + Tip Calculator diff --git a/projects/tip-calculator/v2/style.css b/projects/tip-calculator/v2/style.css new file mode 100644 index 0000000..2e3d77e --- /dev/null +++ b/projects/tip-calculator/v2/style.css @@ -0,0 +1,6 @@ +body { + margin: 0; + background-color: #f7f7f7; + padding: 20px; + font-family: "Montserrat", sans-serif; +} From 6d27c48f20de104232134f1ff922a05976593eb9 Mon Sep 17 00:00:00 2001 From: songqipro Date: Thu, 15 Jun 2023 10:01:59 +0800 Subject: [PATCH 13/22] Update. --- projects/tip-calculator/v2/index.html | 2 +- projects/tip-calculator/v2/style.css | 9 +++++++++ 2 files changed, 10 insertions(+), 1 deletion(-) diff --git a/projects/tip-calculator/v2/index.html b/projects/tip-calculator/v2/index.html index 3240d8c..0b467e7 100644 --- a/projects/tip-calculator/v2/index.html +++ b/projects/tip-calculator/v2/index.html @@ -6,8 +6,8 @@ Tip Calculator -

Tip Calculator

+

Tip Calculator

Enter the bill amount and tip percentage to calculate the total

diff --git a/projects/tip-calculator/v2/style.css b/projects/tip-calculator/v2/style.css index 2e3d77e..76d6238 100644 --- a/projects/tip-calculator/v2/style.css +++ b/projects/tip-calculator/v2/style.css @@ -4,3 +4,12 @@ body { padding: 20px; font-family: "Montserrat", sans-serif; } + +#container { + background-color: white; + max-width: 600px; + margin: 50px auto 0; + box-shadow: 0 0 10px rgba(0, 0, 0, .2); + border-radius: 5px; + padding: 20px; +} From 47bfbb089b48eb2d1c6992f82ce98d5353f58eb0 Mon Sep 17 00:00:00 2001 From: songqipro Date: Thu, 15 Jun 2023 10:04:18 +0800 Subject: [PATCH 14/22] Update. --- projects/tip-calculator/v2/style.css | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/projects/tip-calculator/v2/style.css b/projects/tip-calculator/v2/style.css index 76d6238..09bccbb 100644 --- a/projects/tip-calculator/v2/style.css +++ b/projects/tip-calculator/v2/style.css @@ -13,3 +13,10 @@ body { border-radius: 5px; padding: 20px; } + +h1 { + font-size: 36px; + text-align: center; + margin-top: 0; + margin-bottom: 20px; +} \ No newline at end of file From 3ade2ea1dc850947a6c599b845ff8aa717740db6 Mon Sep 17 00:00:00 2001 From: songqipro Date: Thu, 15 Jun 2023 10:19:01 +0800 Subject: [PATCH 15/22] Update. --- projects/tip-calculator/v2/index.html | 16 +++++++++------- projects/tip-calculator/v2/style.css | 26 +++++++++++++++++++++++++- 2 files changed, 34 insertions(+), 8 deletions(-) diff --git a/projects/tip-calculator/v2/index.html b/projects/tip-calculator/v2/index.html index 0b467e7..66b953b 100644 --- a/projects/tip-calculator/v2/index.html +++ b/projects/tip-calculator/v2/index.html @@ -8,13 +8,15 @@

Tip Calculator

-

Enter the bill amount and tip percentage to calculate the total

- - - - - -

Total: $120.00

+
+

Enter the bill amount and tip percentage to calculate the total

+ + + + + +

Total: $120.00

+
\ No newline at end of file diff --git a/projects/tip-calculator/v2/style.css b/projects/tip-calculator/v2/style.css index 09bccbb..8ea9d3e 100644 --- a/projects/tip-calculator/v2/style.css +++ b/projects/tip-calculator/v2/style.css @@ -2,7 +2,7 @@ body { margin: 0; background-color: #f7f7f7; padding: 20px; - font-family: "Montserrat", sans-serif; + font-family: "Helvetica", sans-serif; } #container { @@ -19,4 +19,28 @@ h1 { text-align: center; margin-top: 0; margin-bottom: 20px; +} + +#form { + display: flex; + flex-direction: column; +} + +input { + padding: 10px; + border: 1px solid #ccc; + border-radius: 4px; + margin: 10px 0; +} + +button { + background-color: #4caf50; + color: white; + padding: 10px; + border: none; + cursor: pointer; + margin: 10px 0; + width: 100%; + font-size: 18px; + text-transform: uppercase; } \ No newline at end of file From 6e014d822bedfeb1d48a690c55d530f7652dcfde Mon Sep 17 00:00:00 2001 From: songqipro Date: Thu, 15 Jun 2023 10:42:23 +0800 Subject: [PATCH 16/22] Update. --- projects/tip-calculator/v2/index.html | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/projects/tip-calculator/v2/index.html b/projects/tip-calculator/v2/index.html index 66b953b..f496113 100644 --- a/projects/tip-calculator/v2/index.html +++ b/projects/tip-calculator/v2/index.html @@ -15,7 +15,10 @@

Tip Calculator

-

Total: $120.00

+
+ + 120 +
From 63cc0c8213e6e8a64d69c37a0ee1919dbaeea33e Mon Sep 17 00:00:00 2001 From: songqipro Date: Thu, 15 Jun 2023 16:03:27 +0800 Subject: [PATCH 17/22] Add. --- projects/dice-roll-simulator/v2/index.html | 10 ++++++++++ 1 file changed, 10 insertions(+) create mode 100644 projects/dice-roll-simulator/v2/index.html diff --git a/projects/dice-roll-simulator/v2/index.html b/projects/dice-roll-simulator/v2/index.html new file mode 100644 index 0000000..83ac31f --- /dev/null +++ b/projects/dice-roll-simulator/v2/index.html @@ -0,0 +1,10 @@ + + + + + Document + + + + + \ No newline at end of file From 9d483db67b5785a517619c1ac13c53084658b499 Mon Sep 17 00:00:00 2001 From: songqipro Date: Thu, 15 Jun 2023 16:06:02 +0800 Subject: [PATCH 18/22] Add. --- projects/dice-roll-simulator/v2/index.html | 1 + projects/dice-roll-simulator/v2/style.css | 0 2 files changed, 1 insertion(+) create mode 100644 projects/dice-roll-simulator/v2/style.css diff --git a/projects/dice-roll-simulator/v2/index.html b/projects/dice-roll-simulator/v2/index.html index 83ac31f..75bb991 100644 --- a/projects/dice-roll-simulator/v2/index.html +++ b/projects/dice-roll-simulator/v2/index.html @@ -3,6 +3,7 @@ Document + diff --git a/projects/dice-roll-simulator/v2/style.css b/projects/dice-roll-simulator/v2/style.css new file mode 100644 index 0000000..e69de29 From 34af05e579c9f6dc7c6c6700b15c4e5a09164268 Mon Sep 17 00:00:00 2001 From: songqipro Date: Thu, 15 Jun 2023 16:55:29 +0800 Subject: [PATCH 19/22] Update. --- projects/dice-roll-simulator/v2/index.html | 2 +- projects/dice-roll-simulator/v2/style.css | 10 ++++++++++ 2 files changed, 11 insertions(+), 1 deletion(-) diff --git a/projects/dice-roll-simulator/v2/index.html b/projects/dice-roll-simulator/v2/index.html index 75bb991..54e185c 100644 --- a/projects/dice-roll-simulator/v2/index.html +++ b/projects/dice-roll-simulator/v2/index.html @@ -6,6 +6,6 @@ - +

Dice Roll Simulator

\ No newline at end of file diff --git a/projects/dice-roll-simulator/v2/style.css b/projects/dice-roll-simulator/v2/style.css index e69de29..81d4447 100644 --- a/projects/dice-roll-simulator/v2/style.css +++ b/projects/dice-roll-simulator/v2/style.css @@ -0,0 +1,10 @@ +body { + margin: 0; + text-align: center; + font-family: "Open Sans", sans-serif; +} + +h1 { + font-size: 3rem; + margin-top: 2rem; +} From 065ca8b281eb64b97140678ea69bd3411ec7af71 Mon Sep 17 00:00:00 2001 From: songqipro Date: Thu, 15 Jun 2023 17:03:38 +0800 Subject: [PATCH 20/22] Update. --- projects/dice-roll-simulator/v2/index.html | 1 + projects/dice-roll-simulator/v2/style.css | 7 +++++++ 2 files changed, 8 insertions(+) diff --git a/projects/dice-roll-simulator/v2/index.html b/projects/dice-roll-simulator/v2/index.html index 54e185c..9a1e274 100644 --- a/projects/dice-roll-simulator/v2/index.html +++ b/projects/dice-roll-simulator/v2/index.html @@ -7,5 +7,6 @@

Dice Roll Simulator

+
\ No newline at end of file diff --git a/projects/dice-roll-simulator/v2/style.css b/projects/dice-roll-simulator/v2/style.css index 81d4447..d013b38 100644 --- a/projects/dice-roll-simulator/v2/style.css +++ b/projects/dice-roll-simulator/v2/style.css @@ -8,3 +8,10 @@ h1 { font-size: 3rem; margin-top: 2rem; } + +#dice { + font-size: 7rem; + margin: 5px; + animation-duration: 1s; + animation-fill-mode: forwards; +} \ No newline at end of file From f44449a5e1dca56efe480d4db5ddab72238f76e0 Mon Sep 17 00:00:00 2001 From: songqipro Date: Thu, 15 Jun 2023 17:14:38 +0800 Subject: [PATCH 21/22] Update. --- projects/dice-roll-simulator/v2/index.html | 1 + projects/dice-roll-simulator/v2/style.css | 15 +++++++++++++++ 2 files changed, 16 insertions(+) diff --git a/projects/dice-roll-simulator/v2/index.html b/projects/dice-roll-simulator/v2/index.html index 9a1e274..6405855 100644 --- a/projects/dice-roll-simulator/v2/index.html +++ b/projects/dice-roll-simulator/v2/index.html @@ -8,5 +8,6 @@

Dice Roll Simulator

+ \ No newline at end of file diff --git a/projects/dice-roll-simulator/v2/style.css b/projects/dice-roll-simulator/v2/style.css index d013b38..519aabc 100644 --- a/projects/dice-roll-simulator/v2/style.css +++ b/projects/dice-roll-simulator/v2/style.css @@ -14,4 +14,19 @@ h1 { margin: 5px; animation-duration: 1s; animation-fill-mode: forwards; +} + +#roll-dice { + background-color: #47a5c4; + color: white; + border-radius: 1rem; + border: none; + font-size: 1.5rem; + padding: 1rem 2rem; + cursor: pointer; + transition: background-color 0.3s ease; +} + +#roll-dice:hover { + background-color: #2e8baf; } \ No newline at end of file From 1e37bfff9de74b092c078f46007c64d3b42edbfc Mon Sep 17 00:00:00 2001 From: songqipro Date: Thu, 15 Jun 2023 17:33:31 +0800 Subject: [PATCH 22/22] Update. --- projects/dice-roll-simulator/v2/index.html | 13 +++++++++--- projects/dice-roll-simulator/v2/style.css | 24 ++++++++++++++++++++++ 2 files changed, 34 insertions(+), 3 deletions(-) diff --git a/projects/dice-roll-simulator/v2/index.html b/projects/dice-roll-simulator/v2/index.html index 6405855..d363497 100644 --- a/projects/dice-roll-simulator/v2/index.html +++ b/projects/dice-roll-simulator/v2/index.html @@ -1,13 +1,20 @@ - - Document - + + + + Dice Roll Simulator +

Dice Roll Simulator

+
    +
  • + Roll 1: +
  • +
\ No newline at end of file diff --git a/projects/dice-roll-simulator/v2/style.css b/projects/dice-roll-simulator/v2/style.css index 519aabc..48b74b4 100644 --- a/projects/dice-roll-simulator/v2/style.css +++ b/projects/dice-roll-simulator/v2/style.css @@ -29,4 +29,28 @@ h1 { #roll-dice:hover { background-color: #2e8baf; +} + +ul { + list-style: none; + padding: 0; + max-width: 600px; + margin: 2rem auto; +} + +li { + font-size: 1.5rem; + padding: 0.5rem; + margin: 0.5rem; + background-color: #f2f2f2; + border-radius: 0.5rem; + box-shadow: 0 2px 2px rgba(0, 0, 0, 0.3); + display: flex; + justify-content: space-between; + align-items: center; +} + +li span { + font-size: 3rem; + margin-right: 1rem; } \ No newline at end of file