initial hapi port of nsp site

totherik · Jan 29, 2014 · f24cdf4 · f24cdf4
1 parent 60c8a1f
commit f24cdf4
Show file tree

Hide file tree

Showing 54 changed files with 21,201 additions and 6 deletions.
diff --git a/README.md b/README.md
@@ -7,8 +7,5 @@ This will be the front end webapp for the Node Security Project at nodesecurity.
 ## Phase I
 - Convert site to hapi 2.0
 - Add form for reporting module vulnerability (emails via postmark)
-- Make it easy to publish advisories via markdown files + meta data (already done on liftsecurity site, just prot the code)
+- Publish advisories via markdown files + meta data (already done on liftsecurity site, just port the code) - At least we can publish advisories then. It's not perfect but will work for now.
 
-## Phase II
-- User management, auth
-...
diff --git a/config/default.json b/config/default.json
@@ -0,0 +1,14 @@
+{
+  "hapi": {
+    "hostname": "0.0.0.0",
+    "port": 8000,
+    "options": {
+    }
+  },
+  "bucker": {
+    "console": {
+      "color": "false"
+    },
+    "app": "logs/app"
+  }
+}
diff --git a/config/runtime.json b/config/runtime.json
@@ -0,0 +1 @@
+{}
diff --git a/less/404.less b/less/404.less
@@ -0,0 +1,130 @@
+
+
+#bugzindanodez {
+  margin: 0 auto;
+  position: relative;
+}
+
+#destructions {
+  font-size: 18px;
+  text-align: center;
+}
+
+.score {
+  position: absolute;
+  top: 117px;
+  left: 50%;
+  width: 150px;
+  z-index: 2000;
+  margin-left: -75px;
+  text-align: center;
+  font-size: 35px;
+  color: #222;
+}
+
+@-webkit-keyframes fail {
+  0%, 100% { color: #D12027; }
+  50% { color: #000; }
+}
+
+@-webkit-keyframes win {
+  0%, 100% { color: #2EFEF7; }
+  50% { color: #FE2EC8; }
+}
+
+#won {
+  position: absolute;
+  top: 40px;
+  left: 50%;
+  z-index: 7000;
+  margin-left: -550px;
+  text-align: center;
+  font-size: 100px;
+  display: none;
+}
+
+.won {
+  -webkit-animation: win 0.1s 0.1s infinite linear alternate;
+}
+
+#fail {
+  position: fixed;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  // left: 50%;
+  z-index: 4000;
+  // margin-left: -175px;
+  text-align: center;
+  font-size: 100px;
+  display: none;
+  background-color: rgba(255,255,255,0.75);
+}
+
+.fail {
+  // -webkit-animation: fail 0.1s 0.1s 5s linear alternate;
+}
+
+#red {
+  display: none;
+}
+
+.node {
+  width: 150px;
+}
+
+.nodes {
+  position: absolute;
+}
+
+.node-center {
+  top: 125px;
+  left: 50%;
+  margin-left: -75px;
+}
+
+.node-one {
+  top: 0px;
+  left: 50%;
+}
+
+.node-two {
+  left: 50%;
+  top: 125px;
+  margin-left: 72px;
+}
+
+.node-three {
+  left: 50%;
+  top: 250px;
+  margin-left: -3px;
+}
+
+.node-four {
+  left: 50%;
+  top: 250px;
+  margin-left: -147px;
+}
+
+.node-five {
+  left: 50%;
+  top: 125px;
+  margin-left: -222px;
+}
+
+.node-six {
+  left: 50%;
+  top: 0px;
+  margin-left: -147px;
+}
+
+.div404 {
+  font-size: 500px;
+  position: absolute;
+  color: #eee;
+  text-align: center;
+  width: 100%;
+  top: -170px;
+  z-index: -1;
+  font-weight: bold;
+}
diff --git a/less/500.less b/less/500.less
@@ -0,0 +1,80 @@
+body.error500 {
+  background: #f0f0f0 url('/img/lock.png');
+  text-align: center;
+  font-size: 16px;
+
+  h1 {
+    font-size: 150px;
+    line-height: 150px;
+    &.hinge {
+      z-index: -1;
+      position: relative;
+    }
+  }
+
+  .error-msg {
+    width: 850px;
+    margin: auto;
+    text-align: left;
+    float: left;
+    z-index: 5;
+    img {
+      display: inline-block;
+      width: 70px;
+    }
+    p {
+      display: inline-block;
+      margin-left: 10px;
+    }
+  }
+
+
+  overflow-y: scroll;
+}
+
+
+.animated{-webkit-animation-fill-mode:both;-moz-animation-fill-mode:both;-ms-animation-fill-mode:both;-o-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:1s;-moz-animation-duration:1s;-ms-animation-duration:1s;-o-animation-duration:1s;animation-duration:1s;}
+.animated.hinge{-webkit-animation-duration:2s;-moz-animation-duration:2s;-ms-animation-duration:2s;-o-animation-duration:2s;animation-duration:2s;}
+
+@-webkit-keyframes hinge {
+  0% { -webkit-transform: rotate(0); -webkit-transform-origin: left; -webkit-animation-timing-function: ease-in-out; }
+  20% { -webkit-transform: rotate(120deg); -webkit-transform-origin: left; -webkit-animation-timing-function: ease-in-out; }
+  40% { -webkit-transform: rotate(70deg); -webkit-transform-origin: left; -webkit-animation-timing-function: ease-in-out; }
+  60% { -webkit-transform: rotate(100deg); -webkit-transform-origin: left; -webkit-animation-timing-function: ease-in-out; }
+  80% { -webkit-transform: rotate(85deg) translateY(0); -webkit-transform-origin: left; -webkit-animation-timing-function: ease-in-out; }
+  100% { -webkit-transform: rotate(90deg) translateY(0); -webkit-transform-origin: left; -webkit-animation-timing-function: ease-out; }
+}
+
+@-moz-keyframes hinge {
+  0% { -moz-transform: rotate(0); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; }
+  20% { -moz-transform: rotate(120deg); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; }
+  40% { -moz-transform: rotate(70deg); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; }
+  60% { -moz-transform: rotate(100deg); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; }
+  80% { -moz-transform: rotate(85deg) translateY(0); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; }
+  100% { -moz-transform: rotate(90deg) translateY(0); -moz-transform-origin: top left; -moz-animation-timing-function: ease-out; }
+}
+
+@-o-keyframes hinge {
+  0% { -o-transform: rotate(0); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; }
+  20% { -o-transform: rotate(120deg); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; }
+  40% { -o-transform: rotate(70deg); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; }
+  60% { -o-transform: rotate(100deg); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; }
+  80% { -o-transform: rotate(85deg) translateY(0); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; }
+  100% { -o-transform: rotate(90deg) translateY(0); -o-transform-origin: top left; -o-animation-timing-function: ease-out; }
+}
+
+@keyframes hinge {
+  0% { transform: rotate(0); transform-origin: top left; animation-timing-function: ease-in-out; }
+  20% { transform: rotate(120deg); transform-origin: top left; animation-timing-function: ease-in-out; }
+  40% { transform: rotate(70deg); transform-origin: top left; animation-timing-function: ease-in-out; }
+  60% { transform: rotate(100deg); transform-origin: top left; animation-timing-function: ease-in-out; }
+  80% { transform: rotate(85deg) translateY(0); transform-origin: top left; animation-timing-function: ease-in-out; }
+  100% { transform: rotate(90deg) translateY(0); transform-origin: top left; animation-timing-function: ease-out; }
+}
+
+.hinge {
+  -webkit-animation-name: hinge;
+  -moz-animation-name: hinge;
+  -o-animation-name: hinge;
+  animation-name: hinge;
+}
diff --git a/less/advisory.less b/less/advisory.less
@@ -0,0 +1,96 @@
+
+.advisory {
+  background-color: #fff;
+  border: 1px solid @borderColor;
+  border-bottom: 0;
+  box-shadow: 0 1px 5px rgba(0,0,0,0.1);
+  // padding: 35px;
+  font-size: 14px;
+  color: @grey;
+  line-height: 30px;
+
+  &:last-child{
+    border: 1px solid @borderColor;
+  }
+
+
+  i {
+    opacity: 0.25;
+  }
+}
+
+.module-name {
+  font-size: 20px;
+  a { color: @grey; }
+}
+.module-version {
+  font-size:12px;
+  color: @lightGrey;
+  line-height: 20px;
+}
+.advisory-title {
+  font-size: 24px;
+  text-shadow: 0px 1px 0px rgba(0,0,0,0.2);
+}
+
+.advisory-left {
+  padding: 25px 0 15px 30px;
+}
+.advisory-right {
+  padding: 25px 30px 15px 0;
+  text-align: right;
+}
+
+.advisory-detail {
+  line-height: 24px;
+  position: relative;
+
+  h1, h2, h3, h4 {
+    color: @darkGrey;
+  }
+  h1 { font-size: 32px; }
+  h2 { font-size: 24px; }
+
+  i { opacity: 0.25; }
+
+  .advisory-right {
+    padding: 0;
+    margin-top: 13px;
+  }
+  .module-version {
+    font-size: 14px;
+  }
+  .module-name {
+    font-size: 32px;
+    margin-bottom: 15px;
+  }
+  .advisory-description {
+    padding-top: 15px;
+    margin-top: 15px;
+    border-top: 1px solid @borderColor;
+  }
+  &:hover .edit-btn {
+    opacity: 1;
+  }
+}
+
+#disqus_thread {
+  margin-top: 25px;
+  padding-top: 25px;
+  border-top: 1px solid @borderColor;
+}
+
+.edit-btn {
+  // float:right;
+  position: absolute;
+  top:5px;
+  right: 5px;
+  opacity: 0;
+  transition: all 500ms;
+}
+
+#create-advisory {
+  textarea {
+    height: 150px;
+  }
+}
diff --git a/less/app.less b/less/app.less
@@ -0,0 +1,15 @@
+// Variables:
+@import 'variables.less';
+
+// Main styles that apply site-wide:
+@import 'main.less';
+@import 'menu.less';
+@import 'footer.less';
+
+// Individual page imports:
+@import 'search.less';
+@import 'advisory.less';
+@import 'login.less';
+@import 'index.less';
+@import '404.less';
+@import '500.less';
diff --git a/less/footer.less b/less/footer.less
@@ -0,0 +1,32 @@
+footer {
+  width: 100%;
+  padding: 25px 0;
+  background: @nsBlue;
+  box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.15);
+
+  p {
+    color: lighten(@nsBlue, 20%);
+    text-align: center;
+    font-size: 1.2em;
+
+    a:link, a:visited {
+      color: lighten(@nsBlue, 40%);
+      text-decoration: none;
+    }
+    a:hover {
+      color: #fff;
+    }
+  }
+
+  a {
+    &:after {
+      content: " // ";
+      color: lighten(@nsBlue, 15%);
+      padding: 10px;
+    }
+
+    &:last-child:after {
+      content: "";
+    }
+  }
+}