首頁 探索 說明
登入
tati
/
positive-derm
1
0
複刻 0
Files 問題管理 0 合併請求 0 Wiki
瀏覽代碼

Add base layout and styles

Tatiana Inama 6 年之前
父節點
b9aa924437
當前提交
1e069a611b
共有 7 個文件被更改，包括 219 次插入 和 1 次删除
統一視圖 顯示文件統計
  1. 85 0
      hand-sanitizer-launch/css/styles.css
  2. 3 0
      hand-sanitizer-launch/img/logo-light.svg
  3. 32 1
      hand-sanitizer-launch/index.html
  4. 5 0
      hand-sanitizer-launch/package-lock.json
  5. 47 0
      logo-dark.svg
  6. 47 0
      logo-light.svg
  7. 二進制
      positive-brand.pdf

+ 85 - 0
hand-sanitizer-launch/css/styles.css
查看文件 

@@ -0,0 +1,85 @@
 
+:root {
 
+  --main-dark-color: #382f2d;
 
+  --main-light-color: #faf4f2;
 
+}
 
+
 
+header.positive-header {
 
+  background-color: var(--main-dark-color);
 
+  color: var(--main-light-color);
 
+}
 
+
 
+.mdl-layout__header-row {
 
+  padding: 1rem;
 
+}
 
+
 
+.positive-content {
 
+  display: flex;
 
+  flex-direction: column;
 
+}
 
+
 
+.positive-content mdl-grid {
 
+  width: 100%;
 
+}
 
+
 
+.positive-animation-area {
 
+  position: absolute;
 
+  top: 0;
 
+  left: 0;
 
+  height: 100%;
 
+  width: 100%;
 
+  background-color: var(--main-light-color);
 
+  overflow: hidden;
 
+}
 
+
 
+ul.plus-area {
 
+  margin: 0;
 
+  padding: 0;
 
+  list-style: none;
 
+}
 
+
 
+ul.plus-area li {
 
+  position: absolute;
 
+  display: block;
 
+  color: #ebe4e1;
 
+  animation: animate 30s ease-in infinite;
 
+  bottom: -150px;
 
+}
 
+
 
+ul.plus-area li:nth-child(1) {
 
+  left: 0%;
 
+  font-size: 15rem;
 
+  animation-delay: 0s;
 
+}
 
+
 
+ul.plus-area li:nth-child(2) {
 
+  left: 5%;
 
+  font-size: 40rem;
 
+  animation-delay: 5s;
 
+}
 
+
 
+ul.plus-area li:nth-child(3) {
 
+  left: 20%;
 
+  font-size: 20rem;
 
+  animation-delay: 10s;
 
+}
 
+
 
+ul.plus-area li:nth-child(4) {
 
+  left: 3%;
 
+  font-size: 10rem;
 
+  animation-delay: 15s;
 
+}
 
+
 
+ul.plus-area li:nth-child(5) {
 
+  left: 30%;
 
+  font-size: 15rem;
 
+  animation-delay: 20s;
 
+}
 
+
 
+@keyframes animate {
 
+  0% {
 
+    transform: translateY(0);
 
+  }
 
+  100% {
 
+    transform: translateY(-120vh);
 
+  }
 
+}

File diff suppressed because it is too large
+ 3 - 0
hand-sanitizer-launch/img/logo-light.svg


+ 32 - 1
hand-sanitizer-launch/index.html
查看文件 

@@ -18,6 +18,11 @@
 
 
 
   <link rel="stylesheet" href="css/normalize.css">
 
   <link rel="stylesheet" href="css/normalize.css">
 
   <link rel="stylesheet" href="css/main.css">
 
   <link rel="stylesheet" href="css/main.css">
 
+  <link rel="stylesheet" href="/node_modules/material-design-lite/material.min.css">
 
+  <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
 
+  <link rel="stylesheet" href="css/styles.css">
 
+
 
+  <script src="/node_modules/material-design-lite/material.min.js"></script>
 
 
 
   <meta name="theme-color" content="#fafafa">
 
   <meta name="theme-color" content="#fafafa">
 
 </head>
 
 </head>
 
@@ -25,7 +30,33 @@
 
 <body>
 
 <body>
 
 
 
   <!-- Add your site or application content here -->
 
   <!-- Add your site or application content here -->
 
-  <p>Hello world! This is HTML5 Boilerplate.</p>
 
+  <div class="mdl-layout mdl-js-layout mdl-layout--fixed-header">
 
+    <header class="mdl-layout__header positive-header">
 
+      <div class="mdl-layout__header-row">
 
+        <div class="mdl-layout-icon">
 
+          <object type="image/svg+xml" data="img/logo-light.svg" class="positive-logo" height="32"></object>
 
+        </div>
 
+      </div>
 
+    </header>
 
+    <main class="mdl-layout__content">
 
+      <div class="page-content positive-content">
 
+        <div class="mdl-grid">
 
+          <div class="mdl-cell mdl-cell--12-col">Content</div>
 
+        </div>
 
+      </div>
 
+      <div class="positive-animation-area">
 
+        <ul class="plus-area">
 
+          <li>+</li>
 
+          <li>+</li>
 
+          <li>+</li>
 
+          <li>+</li>
 
+          <li>+</li>
 
+        </ul>
 
+      </div>
 
+    </main>
 
+  </div>
 
+
 
+
 
   <script src="js/vendor/modernizr-3.11.2.min.js"></script>
 
   <script src="js/vendor/modernizr-3.11.2.min.js"></script>
 
   <script src="js/plugins.js"></script>
 
   <script src="js/plugins.js"></script>
 
   <script src="js/main.js"></script>
 
   <script src="js/main.js"></script>

+ 5 - 0
hand-sanitizer-launch/package-lock.json
查看文件 

@@ -4611,6 +4611,11 @@
 
         "object-visit": "^1.0.0"
 
         "object-visit": "^1.0.0"
 
       }
 
       }
 
     },
 
     },
 
+    "material-design-lite": {
 
+      "version": "1.3.0",
 
+      "resolved": "https://registry.npmjs.org/material-design-lite/-/material-design-lite-1.3.0.tgz",
 
+      "integrity": "sha1-0ATOP+6Zoe63Sni4oyUTSl8RcdM="
 
+    },
 
     "md5.js": {
 
     "md5.js": {
 
       "version": "1.3.5",
 
       "version": "1.3.5",
 
       "resolved": "https://registry.npmjs.org/md5.js/-/md5.js-1.3.5.tgz",
 
       "resolved": "https://registry.npmjs.org/md5.js/-/md5.js-1.3.5.tgz",

+ 47 - 0
logo-dark.svg
查看文件 

@@ -0,0 +1,47 @@
 
+<?xml version="1.0" encoding="utf-8"?>
 
+<!-- Generator: Adobe Illustrator 23.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
 
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
 
+	 viewBox="0 0 438 64" style="enable-background:new 0 0 438 64;" xml:space="preserve">
 
+<style type="text/css">
 
+	.st0{fill:#382F2D;}
 
+</style>
 
+<g>
 
+	<path class="st0" d="M22.9,13.84H4.06v0.92c0,0,3.15-0.13,4.73,1.97c0.26,0.39,0.52,0.92,0.66,1.44c0.13,0.46,0.2,0.92,0.2,1.31
 
+		v38.09l6.76,4.27c-0.33-0.46-0.59-0.99-0.72-1.58c-0.13-0.39-0.13-0.79-0.13-1.18V42.4h6.3c0,0,17.01,0.26,17.01-15.37
 
+		C38.86,15.15,26.58,13.9,22.9,13.84z M32.36,28.61c0,12.28-9.72,12.47-10.44,12.47h-6.37V19.68c0-0.33,0-0.59,0.07-0.85
 
+		c0.13-0.85,0.46-1.58,0.85-2.1c1.58-1.9,4.6-1.71,5.38-1.71C32.75,15.02,32.36,27.29,32.36,28.61z"/>
 
+	<path class="st0" d="M73.06,13.11c-11.82,0-21.41,11.23-21.41,25.15c0,13.85,9.59,25.15,21.41,25.15
 
+		c11.82,0,21.41-11.29,21.41-25.15C94.47,24.34,84.88,13.11,73.06,13.11z M73.06,61.7c-8.4,0-15.23-10.64-15.23-23.77
 
+		c0-13.13,6.83-23.77,15.23-23.77c8.47,0,15.3,10.64,15.3,23.77C88.36,51.06,81.53,61.7,73.06,61.7z"/>
 
+	<path class="st0" d="M122.51,33.6c-14.84-7.29-8.8-15.56-8.8-15.56c0.66-0.92,1.44-1.77,2.36-2.5c2.23-1.64,5.32-1.51,7.88-0.79
 
+		c1.05,0.33,2.1,0.66,3.02,1.38c0.72,0.52,1.38,1.25,1.91,1.97c1.05,1.38,1.77,2.95,2.36,4.59c0.46,1.44,0.85,3.02,0.92,4.53h1.51
 
+		v-6.3l0.13-7.68h-1.31l-0.13,0.92c-0.13,0.59-0.33,1.18-0.72,1.64c-0.98,1.31-2.49,0.2-3.48-0.46c-1.31-0.85-2.76-1.51-4.27-1.9
 
+		c-1.05-0.33-2.17-0.46-3.22-0.53h-0.2c-0.59,0-1.18,0-1.77,0.07c-1.71,0.2-3.41,0.66-4.99,1.38c-2.17,1.05-4.01,2.69-5.06,4.86
 
+		c-0.98,2.1-1.18,4.47-1.05,6.7c0,0,0,6.76,7.35,11.03c7.42,4.27,16.28,9.59,15.23,16.15c-0.59,3.74-2.69,7.29-6.63,8.08
 
+		c-1.44,0.33-2.89,0.33-4.33,0.07c-0.66-0.07-1.25-0.26-1.9-0.46c-1.05-0.33-1.9-0.66-2.76-1.38c-0.72-0.59-1.38-1.25-1.97-1.97
 
+		c-1.05-1.38-1.84-2.89-2.43-4.53c-0.79-2.1-1.25-4.4-1.31-6.7v-0.26h-1.51l0.07,8.4l-0.13,7.88h1.25l0.2-0.99
 
+		c0.2-0.66,0.39-1.38,0.92-1.9c0.59-0.46,1.31-0.33,1.9-0.07c0.72,0.39,1.38,0.85,2.1,1.31c0.66,0.39,1.38,0.72,2.1,0.98
 
+		c1.44,0.59,3.02,0.92,4.53,1.05c1.58,0.2,3.15,0.07,4.73-0.13c2.17-0.39,4.33-1.12,6.17-2.36c2.5-1.71,4.14-4.2,4.73-7.09
 
+		c0.26-1.18,0.39-2.36,0.39-3.48C136.3,43.97,131.44,37.93,122.51,33.6z"/>
 
+	<path class="st0" d="M160.98,56.25V18.1l-6.76-4.27c0.33,0.46,0.52,0.98,0.72,1.58c0.07,0.39,0.13,0.79,0.13,1.18v39.59
 
+		c0,0.39-0.07,0.85-0.2,1.31c-0.99,3.61-5.45,3.41-5.45,3.41v0.92h17.14v-0.92C166.57,60.91,161.18,61.18,160.98,56.25z"/>
 
+	<path class="st0" d="M179.7,28.08h1.58c0-6.04,1.18-12.93,9.13-12.93h5.12v7.03v0.13v0.06v35.2l6.76,4.27
 
+		c-0.33-0.46-0.53-0.99-0.72-1.58c-0.07-0.39-0.13-0.79-0.13-1.18v-2.63v-0.33V15.15h5.19c7.88,0,9.06,6.9,9.06,12.93h1.58V13.84
 
+		H179.7V28.08z"/>
 
+	<path class="st0" d="M241.94,56.25V18.1l-6.76-4.27c0.33,0.46,0.52,0.98,0.72,1.58c0.07,0.39,0.13,0.79,0.13,1.18v39.59
 
+		c0,0.39-0.07,0.85-0.2,1.31c-0.99,3.61-5.45,3.41-5.45,3.41v0.92h17.14v-0.92C247.52,60.91,242.14,61.18,241.94,56.25z"/>
 
+	<path class="st0" d="M286.79,36.69l-3.15,8.27c-0.85,2.1-1.64,4.2-2.43,6.3l-0.99,2.56l-0.06-0.13l-11.89-31.32
 
+		c-0.2-0.53-0.33-1.12-0.46-1.64c-1.12-6.3,6.04-5.91,6.04-5.91v-0.98h-13.2v0.98l0.52,0.13c3.81,1.12,5.06,5.65,6.24,8.86
 
+		c0.92,2.3,1.77,4.66,2.69,7.03l3.15,8.34c1.05,2.69,2.04,5.39,3.09,8.01c0.72,2.04,1.51,4.07,2.23,6.11
 
+		c0.33,0.72,0.59,1.44,0.85,2.17c0,0.07,0.07,0.13,0.07,0.2l2.36,6.04l0.85,2.3l0.85-2.3l2.5-6.5l4.46-11.69l0.46-1.31L305.7,2.36
 
+		c0,0,0.39-0.85,0.59-1.18c0.39-0.52,0.79-0.92,1.18-1.18l-7.88,1.64C299.59,1.71,287.84,33.86,286.79,36.69z"/>
 
+	<path class="st0" d="M340.89,60.45h-7.29c-0.13,0-5.32,0.33-5.58-4V38.33h4.92c5.32,0.2,5.97,4.33,5.97,8.67h1.18V28.21h-1.18
 
+		c0,4.33-0.72,8.6-6.24,8.8h-4.66V19.22c0.26-4.4,5.45-4.07,5.58-4.07h5.65c7.88,0,9.13,4.73,9.13,10.77h1.58V13.84h-3.81H333.6
 
+		h-5.58h-5.91h-5.65v0.92c0,0,5.38-0.2,5.65,4.66v37.17c-0.46,4.53-5.65,4.33-5.65,4.33v0.92h5.65h29.48V48.37h-1.58
 
+		C350.02,54.41,348.77,60.45,340.89,60.45z"/>
 
+	<polygon class="st0" points="423.37,35.36 423.37,22.57 418.39,22.57 418.39,35.36 405.77,35.36 405.77,40.02 418.39,40.02 
+		418.39,52.75 423.37,52.75 423.37,40.02 435.94,40.02 435.94,35.36 	"/>
 
+	<polygon class="st0" points="386.4,22.57 381.42,22.57 381.42,35.36 368.8,35.36 368.8,40.02 381.42,40.02 381.42,52.75 
+		386.4,52.75 386.4,40.02 398.98,40.02 398.98,35.36 386.4,35.36 	"/>
 
+</g>
 
+</svg>

+ 47 - 0
logo-light.svg
查看文件 

@@ -0,0 +1,47 @@
 
+<?xml version="1.0" encoding="utf-8"?>
 
+<!-- Generator: Adobe Illustrator 23.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
 
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
 
+	 viewBox="0 0 438 64" style="enable-background:new 0 0 438 64;" xml:space="preserve">
 
+<style type="text/css">
 
+	.st0{fill:#FAF4F2;}
 
+</style>
 
+<g>
 
+	<path class="st0" d="M22.9,13.84H4.06v0.92c0,0,3.15-0.13,4.73,1.97c0.26,0.39,0.52,0.92,0.66,1.44c0.13,0.46,0.2,0.92,0.2,1.31
 
+		v38.09l6.76,4.27c-0.33-0.46-0.59-0.99-0.72-1.58c-0.13-0.39-0.13-0.79-0.13-1.18V42.4h6.3c0,0,17.01,0.26,17.01-15.37
 
+		C38.86,15.15,26.58,13.9,22.9,13.84z M32.36,28.61c0,12.28-9.72,12.47-10.44,12.47h-6.37V19.68c0-0.33,0-0.59,0.07-0.85
 
+		c0.13-0.85,0.46-1.58,0.85-2.1c1.58-1.9,4.6-1.71,5.38-1.71C32.75,15.02,32.36,27.29,32.36,28.61z"/>
 
+	<path class="st0" d="M73.06,13.11c-11.82,0-21.41,11.23-21.41,25.15c0,13.85,9.59,25.15,21.41,25.15
 
+		c11.82,0,21.41-11.29,21.41-25.15C94.47,24.34,84.88,13.11,73.06,13.11z M73.06,61.7c-8.4,0-15.23-10.64-15.23-23.77
 
+		c0-13.13,6.83-23.77,15.23-23.77c8.47,0,15.3,10.64,15.3,23.77C88.36,51.06,81.53,61.7,73.06,61.7z"/>
 
+	<path class="st0" d="M122.51,33.6c-14.84-7.29-8.8-15.56-8.8-15.56c0.66-0.92,1.44-1.77,2.36-2.5c2.23-1.64,5.32-1.51,7.88-0.79
 
+		c1.05,0.33,2.1,0.66,3.02,1.38c0.72,0.52,1.38,1.25,1.91,1.97c1.05,1.38,1.77,2.95,2.36,4.59c0.46,1.44,0.85,3.02,0.92,4.53h1.51
 
+		v-6.3l0.13-7.68h-1.31l-0.13,0.92c-0.13,0.59-0.33,1.18-0.72,1.64c-0.98,1.31-2.49,0.2-3.48-0.46c-1.31-0.85-2.76-1.51-4.27-1.9
 
+		c-1.05-0.33-2.17-0.46-3.22-0.53h-0.2c-0.59,0-1.18,0-1.77,0.07c-1.71,0.2-3.41,0.66-4.99,1.38c-2.17,1.05-4.01,2.69-5.06,4.86
 
+		c-0.98,2.1-1.18,4.47-1.05,6.7c0,0,0,6.76,7.35,11.03c7.42,4.27,16.28,9.59,15.23,16.15c-0.59,3.74-2.69,7.29-6.63,8.08
 
+		c-1.44,0.33-2.89,0.33-4.33,0.07c-0.66-0.07-1.25-0.26-1.9-0.46c-1.05-0.33-1.9-0.66-2.76-1.38c-0.72-0.59-1.38-1.25-1.97-1.97
 
+		c-1.05-1.38-1.84-2.89-2.43-4.53c-0.79-2.1-1.25-4.4-1.31-6.7v-0.26h-1.51l0.07,8.4l-0.13,7.88h1.25l0.2-0.99
 
+		c0.2-0.66,0.39-1.38,0.92-1.9c0.59-0.46,1.31-0.33,1.9-0.07c0.72,0.39,1.38,0.85,2.1,1.31c0.66,0.39,1.38,0.72,2.1,0.98
 
+		c1.44,0.59,3.02,0.92,4.53,1.05c1.58,0.2,3.15,0.07,4.73-0.13c2.17-0.39,4.33-1.12,6.17-2.36c2.5-1.71,4.14-4.2,4.73-7.09
 
+		c0.26-1.18,0.39-2.36,0.39-3.48C136.3,43.97,131.44,37.93,122.51,33.6z"/>
 
+	<path class="st0" d="M160.98,56.25V18.1l-6.76-4.27c0.33,0.46,0.52,0.98,0.72,1.58c0.07,0.39,0.13,0.79,0.13,1.18v39.59
 
+		c0,0.39-0.07,0.85-0.2,1.31c-0.99,3.61-5.45,3.41-5.45,3.41v0.92h17.14v-0.92C166.57,60.91,161.18,61.18,160.98,56.25z"/>
 
+	<path class="st0" d="M179.7,28.08h1.58c0-6.04,1.18-12.93,9.13-12.93h5.12v7.03v0.13v0.06v35.2l6.76,4.27
 
+		c-0.33-0.46-0.53-0.99-0.72-1.58c-0.07-0.39-0.13-0.79-0.13-1.18v-2.63v-0.33V15.15h5.19c7.88,0,9.06,6.9,9.06,12.93h1.58V13.84
 
+		H179.7V28.08z"/>
 
+	<path class="st0" d="M241.94,56.25V18.1l-6.76-4.27c0.33,0.46,0.52,0.98,0.72,1.58c0.07,0.39,0.13,0.79,0.13,1.18v39.59
 
+		c0,0.39-0.07,0.85-0.2,1.31c-0.99,3.61-5.45,3.41-5.45,3.41v0.92h17.14v-0.92C247.52,60.91,242.14,61.18,241.94,56.25z"/>
 
+	<path class="st0" d="M286.79,36.69l-3.15,8.27c-0.85,2.1-1.64,4.2-2.43,6.3l-0.99,2.56l-0.06-0.13l-11.89-31.32
 
+		c-0.2-0.53-0.33-1.12-0.46-1.64c-1.12-6.3,6.04-5.91,6.04-5.91v-0.98h-13.2v0.98l0.52,0.13c3.81,1.12,5.06,5.65,6.24,8.86
 
+		c0.92,2.3,1.77,4.66,2.69,7.03l3.15,8.34c1.05,2.69,2.04,5.39,3.09,8.01c0.72,2.04,1.51,4.07,2.23,6.11
 
+		c0.33,0.72,0.59,1.44,0.85,2.17c0,0.07,0.07,0.13,0.07,0.2l2.36,6.04l0.85,2.3l0.85-2.3l2.5-6.5l4.46-11.69l0.46-1.31L305.7,2.36
 
+		c0,0,0.39-0.85,0.59-1.18c0.39-0.52,0.79-0.92,1.18-1.18l-7.88,1.64C299.59,1.71,287.84,33.86,286.79,36.69z"/>
 
+	<path class="st0" d="M340.89,60.45h-7.29c-0.13,0-5.32,0.33-5.58-4V38.33h4.92c5.32,0.2,5.97,4.33,5.97,8.67h1.18V28.21h-1.18
 
+		c0,4.33-0.72,8.6-6.24,8.8h-4.66V19.22c0.26-4.4,5.45-4.07,5.58-4.07h5.65c7.88,0,9.13,4.73,9.13,10.77h1.58V13.84h-3.81H333.6
 
+		h-5.58h-5.91h-5.65v0.92c0,0,5.38-0.2,5.65,4.66v37.17c-0.46,4.53-5.65,4.33-5.65,4.33v0.92h5.65h29.48V48.37h-1.58
 
+		C350.02,54.41,348.77,60.45,340.89,60.45z"/>
 
+	<polygon class="st0" points="423.37,35.36 423.37,22.57 418.39,22.57 418.39,35.36 405.77,35.36 405.77,40.02 418.39,40.02 
+		418.39,52.75 423.37,52.75 423.37,40.02 435.94,40.02 435.94,35.36 	"/>
 
+	<polygon class="st0" points="386.4,22.57 381.42,22.57 381.42,35.36 368.8,35.36 368.8,40.02 381.42,40.02 381.42,52.75 
+		386.4,52.75 386.4,40.02 398.98,40.02 398.98,35.36 386.4,35.36 	"/>
 
+</g>
 
+</svg>

二進制
positive-brand.pdf
查看文件