]> jfr.im git - irc/freenode/web-7.0.git/blobdiff - css/mock1.css
Pin right
[irc/freenode/web-7.0.git] / css / mock1.css
index 9f863a2204314d8effda6bc222c654410efae888..3e77b1ee75b37cd660964d846cb65b63927ba456 100644 (file)
@@ -5,7 +5,7 @@
   --jumbotron-bg-fall: 65,225,64;
   --copyright-bg: 0,0,0;
   --link-color: 66,139,202;
-  --footer-link-color: 32,32,32;
+  --footer-link-color: 255,255,255;
   --nlink-col: black;
   --text-color: #333;
   --footer-text-color: 255,255,255;
@@ -24,7 +24,7 @@
 
 /* global */
 body {
-  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-family: 'Open Sans';
   color: var(--text-color);
 }
 a {
@@ -66,10 +66,12 @@ a {
   margin: 50px 0 0 0;
   padding: 0;
   width: 100%; 
-  margin-left: 0;
-  margin-right: 0;
   min-height: 100%;
 }
+.main {
+  margin-left: 0.5em;
+  /*margin-right: 0.5em;*/
+}
 
 /* jumbotron */
 .jumbotron {
@@ -90,21 +92,20 @@ a {
 }
 .child {
   text-align: center;
+  margin-bottom: 0.5em;
 }
 .box-container {
   display: flex;
   flex-wrap: wrap;
   justify-content: space-around;
-  align-items: center;
+  align-items: stretch;
 }
 .box {
   text-align: center;
   text-decoration: none;
   color: var(--text-color);
   margin-bottom: 5px;
-  border: 1px solid rgb(var(--border-color));
   flex-basis: 30%;
-  height: 105px;
   background-color: #fff;
   border-radius: var(--box-round);
   -webkit-border-radius: var(--box-round);
@@ -114,10 +115,8 @@ a {
 .box:active {
   background-color: var(--box-hover-color);
 }
-.box-center {
-  margin-top: 22.5px;
-  margin-left: 5px;
-  margin-right: 5px;
+.fa-users {
+  margin-top: 5px;
 }
 .title {
   text-align: center;
@@ -156,10 +155,11 @@ p.art-link {
   display: flex;
   flex-wrap: wrap;
   justify-content: space-around;
+  align-items: stretch;
 }
 a.hchild {
   color: var(--text-color);
-  height: 40px;
+  /*height: 40px;*/
   width: 95%;
   text-align: center;
   border-top: 1px solid rgba(var(--border-color),.6);
@@ -200,14 +200,30 @@ a.hchild:active {
   justify-content: space-between;
   align-items: flex-start;
   box-shadow: 0 -3px 5px rgba(0,0,0, 0.36);
-
+  -webkit-border-top-left-radius: var(--box-round);
+  -webkit-border-top-right-radius: var(--box-round);
+  -moz-border-radius-topleft: var(--box-round);
+  -moz-border-radius-topright: var(--box-round);
+  border-top-left-radius: var(--box-round);
+  border-top-right-radius: var(--box-round);
 }
-.footerchild h2 {
-  margin-top: 1em;
+.footerchild {
+  margin-top: 0.5em;
 }
 .footer a {
   color: rgb(var(--footer-link-color));
 }
+.footerchild ul,
+.footerchild ul ul {
+  margin: 0;
+  margin-left: 0.5em;
+  margin-right: 0.5em;
+  padding: 0;
+  list-style-type: none;
+}
+.footerchild ul ul {
+  padding-left: 2em;
+}
 @media all and (max-width: 500px) {
   .footer {
     flex-direction: column;
@@ -219,21 +235,17 @@ a.hchild:active {
   .footerchild:last-child {
   border: none;
   }
-}
-.footerchild ul,
-.footerchild ul ul {
-  margin: 0;
-  padding: 0;
-  list-style-type: none;
-}
-.footerchild ul ul {
-  padding-left: 2em;
+  .footerchild ul li:last-child {
+    margin-bottom: 0.5em;
+  }
 }
 .footer h2, .footer h3 {
-margin: 0;
-}
-.footer .footerchild p {
   margin: 0;
+  margin-left: 0.5em;
+  margin-right: 0.5em;
+}
+.fkex-right {
+  align-self: flex-end;
 }
 .copyright {
   display: flex;
@@ -246,6 +258,8 @@ margin: 0;
 }
 a.copyright {
   background: rgba(var(--copyright-bg),.5);
-  padding: 0;
-  margin: 0;
+  margin-bottom: 0;
+  margin-top: 0;
+  margin-left: 0.5em;
+  margin-right: 0.5em;
 }
\ No newline at end of file