Главная Обзор Помощь
Регистрация Вход
lee
/
subline
1
0
Ответвить 0
Файлы Задачи 0 Запросы на слияние 0 Вики
Просмотр исходного кода

Create new css file for the landing/login/register pages.
Add style for landing page.

Lee Morgan 5 лет назад
Родитель
439ee58b9e
Сommit
ed96bdff99
4 измененных файлов с 167 добавлено и 31 удалено
Единый вид Показать статистику Diff
  1. 7 7
      views/otherPages/landing.ejs
  2. 2 3
      views/otherPages/style.css
  3. 137 0
      views/otherPages/style2.css
  4. 21 21
      views/passwordResetPages/style.css

+ 7 - 7
views/otherPages/landing.ejs
Просмотреть файл 

@@ -4,26 +4,26 @@
 
         <meta charset="utf-8">
 
         <meta charset="utf-8">
 
         <title>The Subline</title>
 
         <title>The Subline</title>
 
         <link rel="icon" type="img/png" href="/shared/images/logo.png">
 
         <link rel="icon" type="img/png" href="/shared/images/logo.png">
 
-        <link rel="stylesheet" href="/otherPages/bundle.css">
 
+        <link rel="stylesheet" href="/otherPages/style2.css">
 
         <link href="https://fonts.googleapis.com/css?family=Saira&display=swap" rel="stylesheet">
 
         <link href="https://fonts.googleapis.com/css?family=Saira&display=swap" rel="stylesheet">
 
     </head>
 
     </head>
 
     <body>
 
     <body>
 
         <div class="header">
 
         <div class="header">
 
             <a class="headerStart" href="/" >
 
             <a class="headerStart" href="/" >
 
                 <img src="/shared/images/logo.png" alt="Subline">
 
                 <img src="/shared/images/logo.png" alt="Subline">
 
-                <div class='headerLogo'>THE SUBLINE</div>
 
+                <div class="headerLogo">THE SUBLINE</div>
 
             </a>
 
             </a>
 
         
         
             <div class="headerEnd">
 
             <div class="headerEnd">
 
-                <a id="helpLink" href="/help">HELP</a>
 
+                <a class="link" href="/help">HELP</a>
 
         
         
-                <a id="privacyPolicyLink" href="/privacy">PRIVACY POLICY</a>
 
+                <a class="link" href="/privacy">PRIVACY POLICY</a>
 
         
         
-                <a id="termsLink" href="/terms">TERMS AND CONDITIONS</a>
 
+                <a class="link" href="/terms">TERMS AND CONDITIONS</a>
 
         
         
-                <a id="logInButton" class="button" href="/login">LOG IN</a>
 
+                <a class="enterButton" class="button" href="/login">LOG IN</a>
 
         
         
-                <a id="joinButton" class="button" href="/register">JOIN</a>
 
+                <a class="enterButton" class="button" href="/register">JOIN</a>
 
             </div>
 
             </div>
 
         </div>
 
         </div>

+ 2 - 3
views/otherPages/style.css
Просмотреть файл 

@@ -4,9 +4,8 @@ form{
 
     display: flex;
 
     display: flex;
 
     flex-direction: column;
 
     flex-direction: column;
 
     justify-content: center;
 
     justify-content: center;
 
-    border: 2px solid rgb(0, 27, 45);
 
-    padding: 30px;
 
-    border-radius: 10px;
 
+    border: 1px solid black;
 
+    padding: 25px;
 
     background: rgb(240, 252, 255);
 
     background: rgb(240, 252, 255);
 
     font-size: 16px;
 
     font-size: 16px;
 
     margin-top: 40px;
 
     margin-top: 40px;

+ 137 - 0
views/otherPages/style2.css
Просмотреть файл 

@@ -0,0 +1,137 @@
 
+*{margin:0;padding:0;font-family:'Saira',sans-serif;}
 
+
 
+html, body{
 
+    width: 100vw;
 
+    max-width: 100%;
 
+}
 
+
 
+.header{
 
+    display: flex;
 
+    justify-content: space-between;
 
+    width: 100%;
 
+    background: rgb(0, 27, 45);
 
+    height: 75px;
 
+    padding: 0 25px;
 
+    box-sizing: border-box;
 
+}
 
+
 
+    .headerStart{
 
+        display: flex;
 
+        align-items: center;
 
+        text-decoration: none;
 
+    }
 
+
 
+        .headerLogo{
 
+            color: white;
 
+            font-size: 25px;
 
+            margin-left: 10px;
 
+        }
 
+
 
+        .headerStart img{
 
+            max-height: 90%;
 
+        }
 
+
 
+    .headerEnd{
 
+        display: flex;
 
+        align-items: center;
 
+        height: 100%;
 
+        color: white;
 
+    }
 
+
 
+        .link{
 
+            margin: 10px;
 
+            color: white;
 
+        }
 
+
 
+        .enterButton{
 
+            background: rgb(179, 191, 209);
 
+            border: none;
 
+            text-decoration: none;
 
+            padding: 10px 25px;
 
+            color: black;
 
+            cursor: pointer;
 
+            text-align: center;
 
+            font-size: 15px;
 
+            min-width: 100px;
 
+            margin: 5px;
 
+            max-height: 52px;
 
+        }
 
+
 
+            .enterButton:hover{
 
+                background: rgb(240, 252, 255);
 
+                color:black;
 
+            }
 
+
 
+            .enterButton:active{
 
+                background: rgb(0, 27, 45);
 
+            }
 
+
 
+.main-background{
 
+    display: flex;
 
+    align-items: center;
 
+    justify-content: center;
 
+    background-image: url("/shared/images/backgroundImg01.jpg");
 
+    background-repeat: no-repeat;
 
+    background-size: cover;
 
+    height: 88vh;
 
+    width: 100%;
 
+    color: rgb(0, 27, 45);
 
+}
 
+
 
+    .logo-text{
 
+        display: flex;
 
+        flex-direction: column;
 
+        align-items: center;
 
+        max-width: 50vw;
 
+    }
 
+
 
+        .logo-text img{
 
+            max-height: 25vh;
 
+            margin-bottom: 35px;
 
+        }
 
+
 
+        .logo-text p{
 
+            font-weight: bold;
 
+            font-size: 25px;
 
+            color: rgb(255, 99, 107);
 
+            text-align: center;
 
+        }
 
+
 
+.more-info{
 
+    width: 100%;
 
+    padding: 75px;
 
+    background:rgb(0, 27, 45);
 
+    color: white;
 
+    box-sizing: border-box;
 
+    text-align: justify;
 
+    font-size: 25px;
 
+}
 
+
 
+    .more-info > *{
 
+        margin: 15px;
 
+    }
 
+
 
+    .line-break{
 
+        width: 100%;
 
+        border: 1px solid rgb(255, 99, 107);
 
+        margin: 30px 0;
 
+    }
 
+
 
+    .more-info h1{
 
+        color: rgb(255, 99, 107);
 
+        text-align: center;
 
+        font-size: 45px;
 
+        margin: 25px 0;
 
+    }
 
+
 
+    ul > *{
 
+        margin: 15px 0;
 
+    }
 
+
 
+    ul span{
 
+        color: rgb(255, 99, 107);
 
+    }
 
+
 
+    li{
 
+        font-size: 20px;
 
+    }

+ 21 - 21
views/passwordResetPages/style.css
Просмотреть файл 

@@ -49,28 +49,28 @@ input[type=submit]{
 
         background: rgb(240, 252, 255);
 
         background: rgb(240, 252, 255);
 
     }
 
     }
 
 
 
-    a{
 
-        display: initial;
 
-        background: rgb(255, 99, 107);
 
-        border: none;
 
-        text-decoration: none;
 
-        padding: 10px 25px;
 
-        color: black;
 
-        cursor: pointer;
 
-        text-align: center;
 
-        font-size: 15px;
 
-        min-width: 100px;
 
-        margin: 5px;
 
-        max-height: 52px;
 
+a{
 
+    display: initial;
 
+    background: rgb(255, 99, 107);
 
+    border: none;
 
+    text-decoration: none;
 
+    padding: 10px 25px;
 
+    color: black;
 
+    cursor: pointer;
 
+    text-align: center;
 
+    font-size: 15px;
 
+    min-width: 100px;
 
+    margin: 5px;
 
+    max-height: 52px;
 
+}
 
+
 
+    a:hover{
 
+        background: rgb(255, 129, 137);
 
+    }
 
+
 
+    a:active{
 
+        background: rgb(240, 252, 255);
 
     }
 
     }
 
-    
-        a:hover{
 
-            background: rgb(255, 129, 137);
 
-        }
 
-    
-        a:active{
 
-            background: rgb(240, 252, 255);
 
-        }
 
 
 
 #bannerContainer{
 
 #bannerContainer{
 
     display: flex;
 
     display: flex;