add a coming soon message to each lang page

JeelDobariya38 · Sep 23, 2023 · fbf48f3 · fbf48f3
1 parent d408682
commit fbf48f3
Show file tree

Hide file tree

Showing 10 changed files with 163 additions and 0 deletions.
diff --git a/Pages/clang/clang.html b/Pages/clang/clang.html
@@ -23,6 +23,11 @@
             <a href="../clang/clang.html">C-Lang</a>
         </div>
     </header>
+    <main>
+        <div class="coming-soon">
+            <h1>Support For C-language is Coming Soon!!!!</h1>
+        </div>
+    </main>
 </body>
 <script src="../../Scripts/script.js"></script>
 <script src="../../Scripts/language.js"></script>

diff --git a/Pages/cpp/cpp.html b/Pages/cpp/cpp.html
@@ -23,6 +23,11 @@
             <a href="../clang/clang.html">C-Lang</a>
         </div>
     </header>
+    <main>
+        <div class="coming-soon">
+            <h1>Support For C++ is Coming Soon!!!!</h1>
+        </div>
+    </main>
 </body>
 <script src="../../Scripts/script.js"></script>
 <script src="../../Scripts/language.js"></script>

diff --git a/Pages/css/css.html b/Pages/css/css.html
@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Css | Coding Notes</title>
+    <link rel="stylesheet" href="../../Prism/prism.css">
+    <script src="../../Prism/prism.js"></script>
+    <link rel="stylesheet" href="../../Stylesheets/utils.css">
+    <link rel="stylesheet" href="../../Stylesheets/style.css">
+    <link rel="stylesheet" href="../../Stylesheets/language.css">
+    <link rel="stylesheet" href="../../Stylesheets/css.css">
+</head>
+<body>
+    <header class="header">
+        <div class="heading">
+            <a href="../../index.html"><h1>Coding Notes</h1></a>
+        </div>
+        <div class="navigation-bar">
+            <a href="../python/python.html">Python</a>
+            <a href="../java/java.html">Java</a>
+            <a href="../cpp/cpp.html">C++</a>
+            <a href="../clang/clang.html">C-Lang</a>
+        </div>
+    </header>
+    <main>
+        <div class="coming-soon">
+            <h1>Support For Css is Coming Soon!!!!</h1>
+        </div>
+    </main>
+</body>
+<script src="../../Scripts/script.js"></script>
+<script src="../../Scripts/language.js"></script>
+</html>
diff --git a/Pages/html/html.html b/Pages/html/html.html
@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Html | Coding Notes</title>
+    <link rel="stylesheet" href="../../Prism/prism.css">
+    <script src="../../Prism/prism.js"></script>
+    <link rel="stylesheet" href="../../Stylesheets/utils.css">
+    <link rel="stylesheet" href="../../Stylesheets/style.css">
+    <link rel="stylesheet" href="../../Stylesheets/language.css">
+    <link rel="stylesheet" href="../../Stylesheets/html.css">
+</head>
+<body>
+    <header class="header">
+        <div class="heading">
+            <a href="../../index.html"><h1>Coding Notes</h1></a>
+        </div>
+        <div class="navigation-bar">
+            <a href="../python/python.html">Python</a>
+            <a href="../java/java.html">Java</a>
+            <a href="../cpp/cpp.html">C++</a>
+            <a href="../clang/clang.html">C-Lang</a>
+        </div>
+    </header>
+    <main>
+        <div class="coming-soon">
+            <h1>Support For Html is Coming Soon!!!!</h1>
+        </div>
+    </main>
+</body>
+<script src="../../Scripts/script.js"></script>
+<script src="../../Scripts/language.js"></script>
+</html>
diff --git a/Pages/java/java.html b/Pages/java/java.html
@@ -23,6 +23,11 @@
             <a href="../clang/clang.html">C-Lang</a>
         </div>
     </header>
+    <main>
+        <div class="coming-soon">
+            <h1>Support For Java is Coming Soon!!!!</h1>
+        </div>
+    </main>
 </body>
 <script src="../../Scripts/script.js"></script>
 <script src="../../Scripts/language.js"></script>

diff --git a/Pages/python/python.html b/Pages/python/python.html
@@ -23,6 +23,11 @@
             <a href="../clang/clang.html">C-Lang</a>
         </div>
     </header>
+    <main>
+        <div class="coming-soon">
+            <h1>Support For Python is Coming Soon!!!!</h1>
+        </div>
+    </main>
 </body>
 <script src="../../Scripts/script.js"></script>
 <script src="../../Scripts/language.js"></script>

diff --git a/Stylesheets/css.css b/Stylesheets/css.css
diff --git a/Stylesheets/html.css b/Stylesheets/html.css
diff --git a/Stylesheets/index.css b/Stylesheets/index.css
@@ -0,0 +1,62 @@
+.hero-section {
+    margin: auto;
+    width: 90vw;
+    height: min(300px,90vh);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-direction: column;
+}
+
+.hero-section  h1{
+    font-size: max(30px,5vw);
+    letter-spacing: -0.3vw;
+    word-spacing: -0.5vw;
+    text-shadow: 3px 3px var(--text-shadow-color);
+}
+
+.hero-section  p{
+    font-size: max(1vw,6px);
+}
+
+.container {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: space-around;
+}
+
+.item {
+    width: max(400px,40vw);
+    height: 60vh;
+    margin: 10px;
+    border-radius: 30px;
+    padding: 10px;
+    background-color: var(--primary-color);
+    overflow: hidden;
+    transition-property: transform box-shadow background-color;
+    transition-duration: 0.4s;
+}
+
+.item:hover {
+    transform: translate(-10px,-5px);
+    box-shadow: 5px 10px var(--box-shadow-color);
+    background-color: var(--secondary-color);
+}
+
+.item h2{
+    text-align: center;
+    font-size: min(40px,max(4vw,28px));
+    color: var(--primary-text-color);
+}
+
+.item p{
+    text-align: left;
+    font-size: max(15px,2vw,20px);
+    color: var(--primary-text-color);
+}
+
+@media (max-width: 460px) {
+    .item {
+        width: max(200px,40vw);
+    }
+}
diff --git a/Stylesheets/utils.css b/Stylesheets/utils.css
@@ -23,3 +23,16 @@ a {
     text-decoration: none;
     color: inherit;
 }
+
+.coming-soon {
+    width: 80vw;
+    height: 80vh;
+    display: flex;
+    margin: auto;
+    justify-content: center;
+    align-items: center;
+}
+
+.coming-soon h1 {
+    font-size: max(14px,min(60px,4vw));
+}