diff --git a/pages/howtoplay.html b/pages/howtoplay.html index bbc7e3a..e53d2e5 100644 --- a/pages/howtoplay.html +++ b/pages/howtoplay.html @@ -17,68 +17,78 @@ rel="stylesheet" /> + rel="stylesheet" + href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" + /> - + + + + + +
-
- -
-
-
+ + + + + +

▂ ▄ ▅ ▆ ▇ █ MAXIMISE BOXES!! █ ▇ ▆ ▅ ▄ ▂

How to Play? ⚔️

@@ -138,14 +148,18 @@

How to Play? ⚔️

-

Here is a demo:

+

+ Here is a demo: +

Tutorial Video

-
- -
-

Watch this tutorial to learn how to play Dots & Boxes effectively!

+
+ +
+

+ Watch this tutorial to learn how to play Dots & Boxes effectively! +

  • Scoring: 🏆
    - Each completed box is worth one point.
    @@ -154,7 +168,7 @@

    Tutorial Video

    - In case of a tie, the player who completed the last box wins.
    - Optionally, a tie can be broken by the number of consecutive boxes completed. -
    • +
  • Strategies: 🧠
    - Try to force your opponent into a position where they have to give @@ -172,10 +186,11 @@

    Tutorial Video

    them from completing boxes whenever possible.
    • - - +
    + +
    -
    -
    - -
    + +

    Licensing

    diff --git a/pages/privacypolicy.html b/pages/privacypolicy.html index 1f62ac0..fb8fc93 100644 --- a/pages/privacypolicy.html +++ b/pages/privacypolicy.html @@ -6,27 +6,21 @@ Privacy Policy - Dot Box - - + + + + + -
    -
    - -
    + +

    Privacy Policy

    @@ -141,7 +135,9 @@

    Contact Us

    contact us:

    -

    By email: dotbox@gmail.com

    +

    + By email: dotbox@gmail.com +

    diff --git a/pages/termsofservice.html b/pages/termsofservice.html index d75a014..a16484e 100644 --- a/pages/termsofservice.html +++ b/pages/termsofservice.html @@ -6,28 +6,22 @@ Terms Of Service - Dot Box - - + + + + + -
    -
    - -
    + +

    Terms Of Services

    @@ -103,7 +97,8 @@

    Changes to These Terms

    Contact Information

    If you have any questions about these Terms and Conditions, please - contact us at dotbox@mail.com. + contact us at: + dotbox@gmail.com

    diff --git a/styles/howtoplay.css b/styles/howtoplay.css index ed806e4..c736b14 100644 --- a/styles/howtoplay.css +++ b/styles/howtoplay.css @@ -1,6 +1,5 @@ body { font-family: "Comic Sans MS", "Chalkboard SE", "Arial", sans-serif; - background-color: #f2bf6d; color: #fff; margin: 0; padding: 0; @@ -28,10 +27,11 @@ body { justify-content: center; max-width: 900px; margin: 2rem auto; + margin-top: 6rem; padding: 2rem; - background: rgba(52, 152, 219, 0.8); + background-color: rgb(66, 61, 142); border-radius: 20px; - box-shadow: 0 0 30px rgba(241, 196, 15, 0.5); + box-shadow: 5px 5px 30px #000; text-align: left; line-height: 1.6; } @@ -126,31 +126,6 @@ body { } } -.home { - font-family: "Comic Sans MS", "Chalkboard SE", "Arial", sans-serif; - display: inline-block; - cursor: pointer; - margin-top: 2rem; - padding: 12px 5px; - background: #f16b4a; - color: #fff; - text-align: center; - border-radius: 50px; - text-decoration: none; - font-weight: bold; - transition: all 0.3s ease; - text-transform: uppercase; -} - -.home:hover { - background-color: #e74c3c; -} - -.home span { - font-size: 1.5rem; -} - - .nav-links { letter-spacing: 2px; display: flex; @@ -184,34 +159,35 @@ button a { } .tutorial-video { - display: flex; - justify-content: center; - align-items: center; - flex-direction: column; + display: flex; + justify-content: center; + align-items: center; + flex-direction: column; box-shadow: -1px 5px 15px rgb(0, 13, 255); background: #33333300; - /* box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); */ - margin: 20px 0; + /* box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); */ + margin: 20px 0; } .tutorial-video video { - width: 100%; - max-width: 800px; - border-radius: 15px; - /* box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); */ + width: 100%; + max-width: 800px; + border-radius: 15px; + /* box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); */ } .tut-head { - color: #ffffff; - margin-bottom: 15px; + color: #ffffff; + margin-bottom: 15px; text-shadow: 1px 1px 2px rgb(255, 217, 0), 0 0 1em blue, 0 0 0.2em blue; - text-align: center; + text-align: center; } .video-caption { - margin-top: 10px; - font-size: 14px; - color: #ffffff; - text-align: center; - text-shadow: 1px 1px 2px rgb(208, 178, 11), 0 0 1em rgb(238, 255, 0), 0 0 0.2em rgb(255, 204, 0); + margin-top: 10px; + font-size: 14px; + color: #ffffff; + text-align: center; + text-shadow: 1px 1px 2px rgb(208, 178, 11), 0 0 1em rgb(238, 255, 0), + 0 0 0.2em rgb(255, 204, 0); } diff --git a/styles/licensing.css b/styles/licensing.css deleted file mode 100644 index c3fd463..0000000 --- a/styles/licensing.css +++ /dev/null @@ -1,135 +0,0 @@ -body { - font-family: "Press Start 2P", cursive; - background-color: #ffd700; - margin: 0; - padding: 0; - color: #333; - overflow-x: hidden; -} - -.video-container { - width: 100%; - height: auto; - overflow: hidden; - text-align: center; -} - -.video { - width: 100%; - height: auto; -} - -@media (max-width: 768px) { - .title { - font-size: 1.5em; - } - - .section-title { - font-size: 1.2em; - } - - .section-content { - font-size: 0.9em; - } - - .back-button { - font-size: 14px; - padding: 5px 14px; - } - - .container { - padding: 11px; - max-width: 100vw; - } -} - -.container { - max-width: 80%; - margin: 50px auto; - padding: 20px; - background: linear-gradient(45deg, #ffc400, #ff8c00); - border-radius: 15px; - box-shadow: 0 0 20px #ff6600; - text-align: left; - line-height: 1.6; -} - -.header { - text-align: center; - margin-bottom: 30px; -} - -.title { - color: #d9ff00; - font-size: 48px; - text-shadow: 3px 3px #ffe066; - animation: glow 2s ease-in-out infinite alternate; -} - -@keyframes glow { - from { - text-shadow: 0 0 5px #ff6600, 0 0 10px #ff6600, 0 0 15px #ff6600; - } - to { - text-shadow: 0 0 10px #ff6600, 0 0 20px #ff6600, 0 0 30px #ff6600; - } -} - -.main-content { - text-align: left; -} - -.section { - margin-bottom: 30px; - padding: 20px; - background: rgba(255, 255, 255, 0.3); - border-radius: 10px; - transition: transform 0.3s ease; -} - -.section:hover { - transform: scale(1.03); -} - -.section-title { - color: #ff4500; - font-size: 24px; - margin-bottom: 15px; - text-transform: uppercase; -} - -.section-content, -.list-item { - margin-bottom: 15px; - font-size: 14px; - color: #4d2600; -} - -pre { - background-color: #ffe066; - color: #4d2600; - padding: 15px; - border-radius: 8px; - overflow-x: auto; - font-family: "Courier New", monospace; -} - -@media (max-width: 767px) { - .container { - max-width: 95%; - padding: 15px; - } - - .title { - font-size: 36px; - } - - .section-title { - font-size: 20px; - } - - .back-btn { - padding: 10px 20px; - font-size: 14px; - } -} diff --git a/styles/termsofservice.css b/styles/pages.footer.css similarity index 76% rename from styles/termsofservice.css rename to styles/pages.footer.css index b977d16..d892ff4 100644 --- a/styles/termsofservice.css +++ b/styles/pages.footer.css @@ -2,7 +2,7 @@ body { font-family: "Comic Sans MS", "Chalkboard SE", "Arial", sans-serif; line-height: 1.6; color: #fff; - background: linear-gradient(135deg, #f2bf6d 0%, #eb9e18 50%, #f16b4a 100%); + background: transparent; margin: 0; padding: 0; overflow-x: hidden; @@ -18,9 +18,9 @@ body { max-width: 900px; margin: 2rem auto; padding: 2rem; - background-color: rgba(52, 152, 219, 0.8); + background-color: rgb(66, 61, 142); border-radius: 20px; - box-shadow: 0 0 30px rgba(241, 196, 15, 0.5); + box-shadow: 5px 5px 30px #000; } .title { @@ -71,28 +71,6 @@ body { top: 0.2rem; } -.video-container { - position: fixed; - top: 0; - left: 0; - width: 100%; - height: 100%; - z-index: -1; - overflow: hidden; -} - -.video { - min-width: 100%; - min-height: 100%; - width: auto; - height: auto; - position: absolute; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - opacity: 0.3; -} - @media (max-width: 768px) { .container { margin: 1rem;