Added web server

abradifcode · Dec 1, 2017 · de8268a · de8268a
1 parent 54d9224
commit de8268a
Show file tree

Hide file tree

Showing 14 changed files with 749 additions and 307 deletions.
diff --git a/package.json b/package.json
@@ -1,11 +1,17 @@
 {
-  "name": "scarlet",
+  "name": "adele",
   "version": "1.0.0",
   "description": "",
+  "engines": {
+    "node": "7.2.0",
+    "npm": "3.10.9"
+  },
   "main": "index.js",
   "scripts": {
     "test": "jest",
-    "serve": "NODE_ENV=development webpack-dev-server --open --no-info --history-api-fallback"
+    "serve": "NODE_ENV=development webpack-dev-server --open --no-info --history-api-fallback",
+    "start": "NODE_ENV=production node server.js",
+    "postinstall": "webpack -p"
   },
   "author": "Marcin Treder",
   "license": "MIT",
@@ -56,15 +62,12 @@
   },
   "jest": {
     "moduleNameMapper": {
-      "\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/__mocks__/fileMock.js"
+      "\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$":
+        "<rootDir>/__mocks__/fileMock.js"
     },
-    "moduleFileExtensions": [ "js", "jsx", "JSON" ],
+    "moduleFileExtensions": ["js", "jsx", "JSON"],
     "setupTestFrameworkScriptFile": "<rootDir>/testsConfig/enzymeConfig.js",
-    "setupFiles": [
-      "<rootDir>/testsConfig/enzymeConfig.js"
-    ],
-    "snapshotSerializers": [
-      "enzyme-to-json/serializer"
-    ]
+    "setupFiles": ["<rootDir>/testsConfig/enzymeConfig.js"],
+    "snapshotSerializers": ["enzyme-to-json/serializer"]
   }
 }
diff --git a/src/components/adeleInfo/tests/__snapshots__/adele-info.test.jsx.snap b/src/components/adeleInfo/tests/__snapshots__/adele-info.test.jsx.snap
@@ -25,6 +25,39 @@ exports[`renders AdeleInfo correctly 1`] = `
   margin: 40px auto 0 auto;
 }
 
+.c3 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+}
+
+.c4 {
+  position: relative;
+  outline: none;
+  border: none;
+  background: none;
+  font-family: Proxima Nova;
+  font-size: 14px;
+  color: #323335;
+  font-weight: 100;
+  cursor: pointer;
+}
+
+.c4:hover {
+  text-decoration: underline;
+  -webkit-transition: all ease-in 0.2s;
+  transition: all ease-in 0.2s;
+}
+
+.c4:focus {
+  color: #006cff;
+}
+
 <AdeleInfo>
   <styled.section>
     <section
@@ -47,6 +80,7 @@ exports[`renders AdeleInfo correctly 1`] = `
             <a
               href="https://en.wikipedia.org/wiki/Adele_Goldberg_(computer_scientist)"
               rel="noopener noreferrer"
+              tabIndex={5}
               target="_blank"
             >
               Adele Goldeberg
@@ -59,9 +93,33 @@ exports[`renders AdeleInfo correctly 1`] = `
           <p>
             Needlss to say, SmallTalk also pioneered many concepts important to all modern design systems. Object in Smalltalk were easily transferable between applications and customizable. Smalltalk also served as the foundation of PARC's work on graphically based user interfaces (many GUI concepts has been developed by Adele Goldberg and her group!).
           </p>
-          <p>
-            Thank you Adele!
-          </p>
+          <styled.footer>
+            <footer
+              className="c3"
+            >
+              <p>
+                Thank you Adele!
+              </p>
+              <NavLink
+                action={[Function]}
+                label="Back to the top"
+                tab={5}
+              >
+                <styled.button
+                  onClick={[Function]}
+                  tabIndex={5}
+                >
+                  <button
+                    className="c4"
+                    onClick={[Function]}
+                    tabIndex={5}
+                  >
+                    Back to the top
+                  </button>
+                </styled.button>
+              </NavLink>
+            </footer>
+          </styled.footer>
         </span>
       </styled.span>
     </section>

diff --git a/src/components/button/tests/__snapshots__/button.test.jsx.snap b/src/components/button/tests/__snapshots__/button.test.jsx.snap
@@ -1,131 +1,21 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders filled Button correctly 1`] = `
-.c0 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  height: 40px;
-  min-height: 40px;
-  width: 100%;
-  max-width: 200px;
-  background-color: #006cff;
-  border-radius: 25px;
-  border: 1px solid #006cff;
-  box-shadow: 4px 4px 20px rgba(179,211,255,0.6);
-  font-family: Proxima Nova;
-  font-size: 14px;
-  font-weight: 100;
-  color: white;
-  text-decoration: none;
-  -webkit-transition: all ease-in 0.1s;
-  transition: all ease-in 0.1s;
-}
-
-.c0:hover {
-  background-color: #3389ff;
-  border-color: #3389ff;
-  color: white;
-}
-
-.c0:active {
-  background-color: #0061e6;
-  box-shadow: 'none';
-}
-
 <Button
   label="String"
   link="String"
+  tab={0}
   targetBlank="_blank"
   type="filled"
->
-  <styled.a
-    href="String"
-    target="_blank"
-    type="filled"
-  >
-    <a
-      className="c0"
-      href="String"
-      target="_blank"
-      type="filled"
-    >
-      String
-    </a>
-  </styled.a>
-</Button>
+/>
 `;
 
 exports[`renders ghost Button correctly 1`] = `
-.c0 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  height: 40px;
-  min-height: 40px;
-  width: 100%;
-  max-width: 200px;
-  background-color: none;
-  border-radius: 25px;
-  border: 1px solid #006cff;
-  box-shadow: 4px 4px 20px rgba(179,211,255,0.6);
-  font-family: Proxima Nova;
-  font-size: 14px;
-  font-weight: 100;
-  color: #006cff;
-  text-decoration: none;
-  -webkit-transition: all ease-in 0.1s;
-  transition: all ease-in 0.1s;
-}
-
-.c0:hover {
-  background-color: #006cff;
-  border-color: #006cff;
-  color: white;
-}
-
-.c0:active {
-  background-color: #0061e6;
-  box-shadow: 'none';
-}
-
 <Button
   label="String"
   link="String"
+  tab={0}
   targetBlank="_blank"
   type="ghost"
->
-  <styled.a
-    href="String"
-    target="_blank"
-    type="ghost"
-  >
-    <a
-      className="c0"
-      href="String"
-      target="_blank"
-      type="ghost"
-    >
-      String
-    </a>
-  </styled.a>
-</Button>
+/>
 `;
diff --git a/src/components/filterTagSection/tests/__snapshots__/filter-tag-section.test.jsx.snap b/src/components/filterTagSection/tests/__snapshots__/filter-tag-section.test.jsx.snap
@@ -17,6 +17,7 @@ exports[`renders FilterTagSection with 0 filters correctly 1`] = `
   -webkit-align-self: center;
   -ms-flex-item-align: center;
   align-self: center;
+  width: 100%;
   font-family: Proxima Nova;
   font-size: 14px;
 }
@@ -51,6 +52,7 @@ exports[`renders FilterTagSection with 1 filters correctly 1`] = `
   -webkit-align-self: center;
   -ms-flex-item-align: center;
   align-self: center;
+  width: 100%;
   font-family: Proxima Nova;
   font-size: 14px;
 }
@@ -85,6 +87,7 @@ exports[`renders FilterTagSection with 3 filters correctly 1`] = `
   -webkit-align-self: center;
   -ms-flex-item-align: center;
   align-self: center;
+  width: 100%;
   font-family: Proxima Nova;
   font-size: 14px;
 }

diff --git a/src/components/footer/tests/footer.test.jsx b/src/components/footer/tests/footer.test.jsx