Lates updates

kesnel · Jul 12, 2021 · 10ead9a · 10ead9a
1 parent ad6d39e
commit 10ead9a
Show file tree

Hide file tree

Showing 15 changed files with 4,621 additions and 16 deletions.
diff --git a/.DS_Store b/.DS_Store
diff --git a/index.html b/index.html
@@ -57,33 +57,46 @@
 </head>
 <body>
 
-    <!-- %% Header %% -->
-    <header id="header-app" class="header-app hdr-app">
-        <div class="container">
-
+<header class="header-app hdr-app header" id="header-app">
 
+</header>
 
-        </div>
-    </header>
+<!-- %% Main %% -->
+<main id="main-app" class="main-app page-top">
 
-    <!-- %% Main %% -->
-
-    <main id="main-app" class="main-app page-top">
 
+        <section class="banner" id="banner">
+            <div class="ova">
+                <div class="container">
+                    <div class="dis-flex banner-center">
+                        <div class="banner-content">
+                            <h1 class="hero-txt"> <span class="break"> Korek </span> online education. </h1>
+                            <h3 class="hero-cc"> Our plans were built to fit your unique needs. Let’s start with a few quick online courses. </h3>
+                            <div class="hero-end">
+                                <a href="" class="hero-btn"> Get Started  </a>
+                            </div>
+                            <div class="hero-log">
+                                <p class="hero-ca"> Already have an account? <a href="" class="break"> Login </a> </p>
+                            </div>
+                        </div>
+                    </div>
+                    <img src="static/media/img/img/Shanik.png" alt="" class="banner-hero">
+                </div>
+            </div>
+        </section>
 
-    </main>
 
-    <!-- %%% -->
+</main>
 
 
-    <!-- %% Footer %% -->
-    <footer id="footer-app" class="footer-app">
-        <div class="container">
+<!-- %% Footer %% -->
+<footer id="footer-app" class="footer-app">
+    <div class="container">
 
 
 
-        </div>
-    </footer>
+    </div>
+</footer>
 
 
 <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

diff --git a/static/.DS_Store b/static/.DS_Store
diff --git a/static/asset/.DS_Store b/static/asset/.DS_Store
diff --git a/static/asset/css/base.css b/static/asset/css/base.css
@@ -0,0 +1,66 @@
+/* Import requirements css styles */
+@import url('../css/reset.css');
+@import url('../css/punaise.css');
+
+/* Import pages stylesheets */
+@import url('../style/main.css');
+
+/** Webfonts **/
+@import url('https://fonts.googleapis.com/css2?family=Mulish:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
+
+/** Pages **/
+@import url('../style/index.css');
+
+:root{
+/** Color Principal **/ 
+    --co: #00A0F6;
+    --co-1: #00EC50;
+
+/** Additional Colors **/
+    --co-select: #dd2481;
+    --co-white: #fff;
+    --co-black: #000;
+    --html-bg: var(--co-white);
+
+/** Color Text **/
+    --co-text: #2d3a58;
+    --co-text-fade: #696f7c;
+
+/** Backgrounds  **/
+    --bg-fade: #eceff8;
+
+    --gd: linear-gradient(90deg,var(--co), var(--co-1));
+    --gd-reverse: linear-gradient(90deg,var(--co-1), var(--co));
+
+
+    --shadow: rgba(0, 0, 0, 0.09) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px;
+
+/** Borders **/
+    --co-bdr: #d8d8d875;
+    --co-bdr-fade: #34343b3f;
+    --co-bdr-dark: #34343b0e;
+
+/** Fonts Text **/
+    --f: 'Mulish', var(--f-variables);
+    --f-bold: 'Mulish', var(--f-variables);;
+    --f-variables: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;;
+}
+
+.html-bg{
+    background: var(--html-bg);
+}
+
+/** Layout **/
+
+.container{
+    margin: 0 auto;
+    height: 100%;
+    width: 1100px;
+}
+
+@media (max-width: 1100px) {
+    .container {
+        width: 100%;
+        padding: 0 10px;
+    }
+}