Made some changes

diff --git a/.index_mock1.html.swo b/.index_mock1.html.swo
new file mode 100644 (file)
index 0000000..4dac3db
Binary files /dev/null and b/.index_mock1.html.swo differ

diff --git a/.index_mock1.html.swp b/.index_mock1.html.swp
new file mode 100644 (file)
index 0000000..ffc8fbd
Binary files /dev/null and b/.index_mock1.html.swp differ

diff --git a/css/.mock1.css.swo b/css/.mock1.css.swo
new file mode 100644 (file)
index 0000000..8122859
Binary files /dev/null and b/css/.mock1.css.swo differ

diff --git a/css/.mock1.css.swp b/css/.mock1.css.swp
new file mode 100644 (file)
index 0000000..bf84786
Binary files /dev/null and b/css/.mock1.css.swp differ

diff --git a/css/mock1.css b/css/mock1.css
index 9faa9880b6f26ca528be3201813311d48a63c593..d2164f6146b17d84a6da6555f579d4c4b18ec31a 100644 (file)
--- a/css/mock1.css
+++ b/css/mock1.css
@@ -1,3 +1,16 @@
+<<<<<<< HEAD
+/* reset css for browser compat */
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+}
+
+body {
+  font-family: Verdana, Helvetica, sans-serif;
+  font-size: 16px;
+  color: #222222;
+=======
 /* vars */
 :root {
   --navbar-bg: white;
@@ -19,6 +32,7 @@ body {
 a {
   color: var(--link-color);
   text-decoration: none;
+>>>>>>> a76ce2ec5a7fbf382a09e6e87b16841374fe28a0
 }
 
 /* navbar */
@@ -32,7 +46,6 @@ a {
   top: 0;
   display: flex;
   flex-wrap: nowrap;
-  justify-content: space-between;
   align-items: center;
   border-bottom: 1px solid rgba(var(--border-color),.3);
   z-index: 100;
@@ -40,26 +53,62 @@ a {
 .nlogo {
   height: 40px;
 }
-.nlink {
+/* navigation links */
+.navlinks {
+        position: relative;
+        display: table;
+        height: 50px;
+        margin: 0 20px;
+        list-style-type: none;
+}
+
+.navlinks > li {
   text-decoration: none;
+<<<<<<< HEAD
+  font-size: 20px;
+  color: black;
+  float: left;
+  display: table-cell;
+  margin: 0 15px;
+  padding-top: 25px;
+  transform: translate(0, -25%); /* I have no idea how or why this works but it just does. */
+  cursor: pointer; /* for pseudo-links to still feel like links */
+=======
   color: var(--nlink-col);
+>>>>>>> a76ce2ec5a7fbf382a09e6e87b16841374fe28a0
 }
 
 /* main */
 .container {
-  margin-top: 51px;
-  margin-left: 0;
-  margin-right: 0;
-  margin-bottom: 0;
+  margin: 51px 0 0; /* merged margins into one */
   padding: 0;
   width: 100%; 
+<<<<<<< HEAD
+  position: relative;
+  height: auto;
+  min-height: 100%; /* height is needed for some properties */
+=======
   margin-left: 0;
   margin-right: 0;
   position: static;
+>>>>>>> a76ce2ec5a7fbf382a09e6e87b16841374fe28a0
 }
 
 /* jumbotron */
 .jumbotron {
+<<<<<<< HEAD
+  color: white;
+  height: 50%;
+  width: 100%;
+  top: 50%;
+  margin: 5% 0;
+  position: relative;
+  display: flex;
+  padding: 25px;
+  wrap-flex: wrap;
+  justify-content: center;
+  align-items: center;
+=======
   background: var(--jumbotron-bg);
   width: 100%;
   -webkit-border-bottom-right-radius: var(--box-round);
@@ -68,19 +117,25 @@ a {
   -moz-border-radius-bottomleft: var(--box-round);
   border-bottom-right-radius: var(--box-round);
   border-bottom-left-radius: var(--box-round);
+>>>>>>> a76ce2ec5a7fbf382a09e6e87b16841374fe28a0
 }
 .child {
   text-align: center;
 }
-.box-container {
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: space-around;
-  align-items: center;
-}
 .box {
   text-align: center;
   text-decoration: none;
+<<<<<<< HEAD
+  color: black;
+  margin: 0 1%;
+  margin-bottom: 5px;
+  border: 1px solid #000;
+  height: 250px;
+  background-color: #fff;
+  border-radius: 10px;
+  width: 350px;
+  display: inline-block;
+=======
   color: var(--text-color);
   margin-bottom: 5px;
   border: 1px solid rgb(var(--border-color));
@@ -90,6 +145,7 @@ a {
   border-radius: var(--box-round);
   -webkit-border-radius: var(--box-round);
   -moz-border-radius: var(--box-round);
+>>>>>>> a76ce2ec5a7fbf382a09e6e87b16841374fe28a0
 }
 .box:hover, .box:active {
   background-color: var(--box-hover-color);
@@ -98,6 +154,63 @@ a {
   text-align: center;
 }
 
+/* a big welcome for newcomers ;) */
+.welcome-big {
+  position: relative;
+  margin-top: 51px;
+  border-bottom: 1px solid #888;
+  width: 100%;
+
+  background: rgb(65,225,64); /* fallback */
+  background: rgba(15, 75, 14, .6);
+
+  padding: 10%;
+
+  text-align: center;
+  color: white;
+  text-shadow: 0 3px 6px rgba(0,0,0, 0.16), 0 3px 6px rgba(0,0,0, 0.21);
+
+  box-shadow: 0 3px 5px rgba(0,0,0, 0.36);
+
+  height: 50%;
+
+  overflow: hidden;
+  vertical-align: bottom;
+}
+
+.welcome-big h1 { /* make this stand out */
+  font-size: 50px;
+  line-height: 80px;
+} 
+
+.welcome-big h3 {
+  font-size: 22px;
+  width: 70%;
+  margin: 0 auto;
+  vertical-align: middle;
+  }
+
+.welcome-learnmore {
+  border: 1px solid #666;
+  background-color: white;
+  font-size: 18px;
+  line-height: 24px;
+  font-weight: 400;
+
+  padding: 5px 8px;
+
+  border-radius: 8px;
+
+  box-shadow: 0 3px 6px rgba(0,0,0, 0.16), 0 3px 6px rgba(0,0,0, 0.21);
+
+  display: block;
+  position: relative;
+  margin: 0 auto;
+  vertical-align: middle;
+  bottom: -50%;
+  transform: translate(0, 50%);
+
+  }
 /* articles feed */
 h1 {
   margin: 0;
@@ -166,6 +279,34 @@ a.hchild:hover, a.hchild:active {
 
 /* footer */
 .footer {
+<<<<<<< HEAD
+  background: #666; /* >:^) */
+  width: 100%;
+  /* margin and padding are reset at line 1-5 */
+  display: flex;
+  flex-wrap: wrap;
+  color: #eee;
+  font-size: 18px;
+  line-height: 22px;
+  
+  min-height: 22px;
+  height: auto;
+
+  position: fixed;
+  bottom: 0;
+} /* plz no justify ;_; */
+
+.footer a {
+  text-decoration: none;
+  color: #7bf;
+  }
+
+.footer-links {
+  position: absolute;
+  right: 0;
+  margin-right: 8px;
+  }
+=======
   background: var(--footer-bg);
   width: device-width;
   margin: 0;
@@ -187,4 +328,5 @@ a.hchild:hover, a.hchild:active {
 .footerline {
   border-right: 1px solid #000;
   height: 100%;
-}
\ No newline at end of file
+}
+>>>>>>> a76ce2ec5a7fbf382a09e6e87b16841374fe28a0

diff --git a/index_mock1.html b/index_mock1.html
index 5798a3e354c6324c616b0eea99edae1a0857c1ea..05239a2396e60228c1f404a44e28c83521751d15 100644 (file)
--- a/index_mock1.html
+++ b/index_mock1.html
@@ -10,14 +10,42 @@
 </head>
 <body>
     <nav class="navbar">
+<<<<<<< HEAD
+        <img src="img/logos/coloured-alphabg.svg" class="nlogo" alt="Freenode" />
+        <ul class="navlinks">
+            <li href="" >Chat</li>
+            <li href="" >Collaborate</li>
+            <li href="" >Support&nbsp;</li>
+        </ul>
+=======
         <a href="index"><img src="img/logos/coloured-alphabg.svg" class="nlogo" alt="freenode" /></a>
         <a href="about" class="nlink">About</a>
         <a href="help" class="nlink">Help</a>
         <a href="contribute" class="nlink">Contribute</a>
         <a href="projects" class="nlink">Projects&nbsp;</a>
+>>>>>>> a76ce2ec5a7fbf382a09e6e87b16841374fe28a0
     </nav>
     <div class="container">
+        <div class="welcome-big">
+            <h1>Welcome to the new home of your projects.</h1>
+            <h3>freenode aims to maximize efficiency in development by allowing a collaborative and relaxed environment for developers while allowing users to get an answer for their problems.</h3>
+            <button type="button" class="welcome-learnmore">Learn More &gt;&gt;</button>
+        </div>
         <div class="jumbotron">
+<<<<<<< HEAD
+                <div href="" class="box">
+                    <img src="" alt="chat" height="60px" width="60px" /><br />
+                    Join a community
+                </div>
+                <div href="" class="box">
+                    <img src="" alt="group" height="60px" width="60px" /><br />
+                    Get my project on freenode
+                </div>
+                <div href="" class="box">
+                    <img src="" alt="support" height="60px" width="60px" /><br />
+                    Support freenode
+                </div>
+=======
             <h2 class="child">I want to...</h2>
             <div class="box-container">
                 <a href="about" class="box">
@@ -37,6 +65,7 @@
                     Know who's using freenode
                 </a>
             </div>
+>>>>>>> a76ce2ec5a7fbf382a09e6e87b16841374fe28a0
         </div>
         
         <div class="main">
@@ -55,6 +84,15 @@
             </div>
         </div>
     </div>
+<<<<<<< HEAD
+    <!--I do not even know why footer was put in the container-->
+        <div class="footer">
+                &nbsp;&copy; freenode 1995?-2016. All rights reserved.
+            <span class="footer-links">
+                <a href="/sitemap.xml">Sitemap</a> - <a href="/anotherlink.html">Another Link</a>
+            </span>
+        </div>
+=======
     
         <footer class="footer">
             <div class="footerchild">
@@ -75,3 +113,4 @@
     </div>
 </body>
 </html>
+>>>>>>> a76ce2ec5a7fbf382a09e6e87b16841374fe28a0