INIT

3 years ago · 2211236007
parent 74477f24a6
commit 2211236007
8 changed files with 168 additions and 0 deletions
--- a/.dockerignore
+++ b/.dockerignore
@ -0,0 +1,2 @@
+node_modules
+npm-debug.log
--- a/.gitingore
+++ b/.gitingore
@ -0,0 +1,2 @@
+node_modules
+npm-debug.log
--- a/19
+++ b/19
@ -0,0 +1,19 @@
+FROM node:16
+
+# Create app directory
+WORKDIR /usr/src/app
+
+# Install app dependencies
+# A wildcard is used to ensure both package.json AND package-lock.json are copied
+# where available (npm@5+)
+COPY package*.json ./
+
+# RUN npm install
+# If you are building your code for production
+RUN npm ci --only=production
+
+# Bundle app source
+COPY . .
+
+EXPOSE 8133
+CMD [ "node", "server.js" ]
--- a/package.json
+++ b/package.json
--- a/public/index.html
+++ b/public/index.html
@ -0,0 +1,39 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+</head>
+<body>
+    <div class="graph">
+        <ul class="months">
+          <li>Jan</li>
+          <li>Feb</li>
+          <li>Mar</li>
+          <li>Apr</li>
+          <li>May</li>
+          <li>Jun</li>
+          <li>Jul</li>
+          <li>Aug</li>
+          <li>Sep</li>
+          <li>Oct</li>
+          <li>Nov</li>
+          <li>Dec</li>
+        </ul>
+        <ul class="days">
+          <li>Sun</li>
+          <li>Mon</li>
+          <li>Tue</li>
+          <li>Wed</li>
+          <li>Thu</li>
+          <li>Fri</li>
+          <li>Sat</li>
+        </ul>
+        <ul class="squares">
+          <!-- added via javascript -->
+        </ul>
+      </div>
+</body>
+</html>
--- a/public/script.js
+++ b/public/script.js
@ -0,0 +1,7 @@
+// Add squares
+
+const squares = document.querySelector('.squares');
+for (var i = 1; i < 365; i++) {
+  const level = Math.floor(Math.random() * 3);  
+  squares.insertAdjacentHTML('beforeend', `<li data-level="${level}"></li>`);
+}
--- a/public/style.css
+++ b/public/style.css
@ -0,0 +1,83 @@
+/* Article - https://bitsofco.de/github-contribution-graph-css-grid/ */
+
+/* Grid-related CSS */
+
+:root {
+    --square-size: 15px;
+    --square-gap: 5px;
+    --week-width: calc(var(--square-size) + var(--square-gap));
+  }
+  
+  .months { grid-area: months; }
+  .days { grid-area: days; }
+  .squares { grid-area: squares; }
+  
+  .graph {
+    display: inline-grid;
+    grid-template-areas: "empty months"
+                         "days squares";
+    grid-template-columns: auto 1fr;
+    grid-gap: 10px;
+  }
+  
+  .months {
+    display: grid;
+    grid-template-columns: calc(var(--week-width) * 4) /* Jan */
+                           calc(var(--week-width) * 4) /* Feb */
+                           calc(var(--week-width) * 4) /* Mar */
+                           calc(var(--week-width) * 5) /* Apr */
+                           calc(var(--week-width) * 4) /* May */
+                           calc(var(--week-width) * 4) /* Jun */
+                           calc(var(--week-width) * 5) /* Jul */
+                           calc(var(--week-width) * 4) /* Aug */
+                           calc(var(--week-width) * 4) /* Sep */
+                           calc(var(--week-width) * 5) /* Oct */
+                           calc(var(--week-width) * 4) /* Nov */
+                           calc(var(--week-width) * 5) /* Dec */;
+  }
+  
+  .days,
+  .squares {
+    display: grid;
+    grid-gap: var(--square-gap);
+    grid-template-rows: repeat(7, var(--square-size));
+  }
+  
+  .squares {
+    grid-auto-flow: column;
+    grid-auto-columns: var(--square-size);
+  }
+  
+  
+  /* Other styling */
+  
+  body {
+    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+    font-size: 12px;
+  }
+  
+  .graph {
+    padding: 20px;
+    border: 1px #e1e4e8 solid;
+    margin: 20px;
+  }
+  
+  .days li:nth-child(odd) {
+    visibility: hidden;
+  }
+  
+  .squares li {
+    background-color: #ebedf0;
+  }
+  
+  .squares li[data-level="1"] {
+    background-color: #c6e48b;
+  }
+  
+  .squares li[data-level="2"] {
+    background-color: #7bc96f;
+  }
+  
+  .squares li[data-level="3"] {
+    background-color: #196127;
+  }
--- a/server.js
+++ b/server.js
@ -0,0 +1,16 @@
+'use strict';
+
+const express = require('express');
+
+const PORT = 8133;
+const HOST = '0.0.0.0';
+
+const app = express();
+
+app.get('/', (req, res) => {
+  res.send('Hello World');
+});
+
+app.listen(PORT, HOST, () => {
+  console.log('Server running - ${HOST}:${PORT}');
+});