a few little redesigns for some stuff

2019-12-09 20:48:19 +01:00 · 2019-12-09 20:48:19 +01:00 · ae69b0aa79
parent 9a4cb7bd26
commit ae69b0aa79
12 changed files with 185 additions and 69 deletions
--- a/assets/css/main.css
+++ b/assets/css/main.css
@ -397,31 +397,31 @@ divide {
 }

 .portfolio:hover {
-  color: #ff6a5f;
+  color: #5fff5f;
 }

 .portfolio:hover ~ #box {
-  border-color: #ff6a5f;
+  border-color: #5fff5f;
 }

 .portfolio::-moz-selection {
  color: white;
-  background-color: #ff6a5f;
+  background-color: #5fff5f;
 }

 .portfolio::selection {
  color: white;
-  background-color: #ff6a5f;
+  background-color: #5fff5f;
 }

 body.light .portfolio::-moz-selection {
  color: black;
-  background-color: #ff8479;
+  background-color: #79ff79;
 }

 body.light .portfolio::selection {
  color: black;
-  background-color: #ff8479;
+  background-color: #79ff79;
 }

 .portfolio {
@ -491,4 +491,24 @@ body.light .art::selection {
 .art {
  font-size: 6vh;
 }
+
+body.light h1::-moz-selection {
+  background-color: black;
+  color: white;
+}
+
+body.light h1::selection {
+  background-color: black;
+  color: white;
+}
+
+h1::-moz-selection {
+  background-color: white;
+  color: black;
+}
+
+h1::selection {
+  background-color: white;
+  color: black;
+}
 /*# sourceMappingURL=main.css.map */
--- a/assets/css/main.css.map
+++ b/assets/css/main.css.map
--- a/assets/css/main.scss
+++ b/assets/css/main.scss
@ -141,7 +141,7 @@ divide {
 	padding: 1vh;
 }

-$accents: ("portfolio": #ff6a5f, "lore": #92a9f3, "art": #c974da);
+$accents: ("portfolio": #5fff5f, "lore": #92a9f3, "art": #c974da);
 $links: ('portfolio', 'lore', 'art');
 $time: 2s;
@each $link, $color in $accents {
@ -165,3 +165,13 @@ $time: 2s;
 		font-size: 6vh;
 	}
 }
+
+body.light h1::selection {
+	background-color: black;
+	color: white;
+}
+
+h1::selection {
+	background-color: white;
+	color: black;
+}
--- a/assets/css/portfolio.css
+++ b/assets/css/portfolio.css
@ -13,6 +13,7 @@ body {
 * {
  margin: 0;
  padding: 0;
+  position: inherit;
  font-family: 'Roboto', sans-serif;
 }

@ -34,6 +35,18 @@ body {
  text-align: center;
 }

+.coding {
+  font-size: 7vh;
+  font-style: italic;
+  color: white;
+  border-bottom: white 5px solid;
+}
+
+body.light .coding {
+  color: black !important;
+  border-bottom: black 5px solid;
+}
+
 sub {
  font-size: 1vh;
 }
@ -95,87 +108,115 @@ body.light #box {
 }

 .yiff:hover {
-  color: #ff6d62;
+  color: #4043ff;
 }

 .yiff:hover ~ #box {
-  border-color: #ff6d62;
+  border-color: #4043ff;
 }

 .yiff::-moz-selection {
  color: white;
-  background-color: #ff6d62;
+  background-color: #4043ff;
 }

 .yiff::selection {
  color: white;
-  background-color: #ff6d62;
+  background-color: #4043ff;
 }

 body.light .yiff::-moz-selection {
  color: black;
-  background-color: #ff877c;
+  background-color: #5a5dff;
 }

 body.light .yiff::selection {
  color: black;
-  background-color: #ff877c;
+  background-color: #5a5dff;
 }

 .thaldrin:hover {
-  color: #ff995d;
+  color: #ff9e42;
 }

 .thaldrin:hover ~ #box {
-  border-color: #ff995d;
+  border-color: #ff9e42;
 }

 .thaldrin::-moz-selection {
  color: white;
-  background-color: #ff995d;
+  background-color: #ff9e42;
 }

 .thaldrin::selection {
  color: white;
-  background-color: #ff995d;
+  background-color: #ff9e42;
 }

 body.light .thaldrin::-moz-selection {
  color: black;
-  background-color: #ffb377;
+  background-color: #ffb85c;
 }

 body.light .thaldrin::selection {
  color: black;
-  background-color: #ffb377;
+  background-color: #ffb85c;
 }

-.homepage:hover {
-  color: #ac9efc;
+.website:hover {
+  color: #ff4885;
 }

-.homepage:hover ~ #box {
-  border-color: #ac9efc;
+.website:hover ~ #box {
+  border-color: #ff4885;
 }

-.homepage::-moz-selection {
+.website::-moz-selection {
  color: white;
-  background-color: #ac9efc;
+  background-color: #ff4885;
 }

-.homepage::selection {
+.website::selection {
  color: white;
-  background-color: #ac9efc;
+  background-color: #ff4885;
 }

-body.light .homepage::-moz-selection {
+body.light .website::-moz-selection {
  color: black;
-  background-color: #c6b8ff;
+  background-color: #ff629f;
 }

-body.light .homepage::selection {
+body.light .website::selection {
  color: black;
-  background-color: #c6b8ff;
+  background-color: #ff629f;
+}
+
+.art:hover {
+  color: #1da1f2;
+}
+
+.art:hover ~ #box {
+  border-color: #1da1f2;
+}
+
+.art::-moz-selection {
+  color: white;
+  background-color: #1da1f2;
+}
+
+.art::selection {
+  color: white;
+  background-color: #1da1f2;
+}
+
+body.light .art::-moz-selection {
+  color: black;
+  background-color: #37bbff;
+}
+
+body.light .art::selection {
+  color: black;
+  background-color: #37bbff;
 }

 .yiff {
@ -186,7 +227,31 @@ body.light .homepage::selection {
  font-size: 6vh;
 }

-.homepage {
+.website {
  font-size: 6vh;
 }
+
+.art {
+  font-size: 6vh;
+}
+
+p::-moz-selection {
+  color: black;
+  background-color: white;
+}
+
+p::selection {
+  color: black;
+  background-color: white;
+}
+
+body.light p::-moz-selection {
+  color: white;
+  background-color: black;
+}
+
+body.light p::selection {
+  color: white;
+  background-color: black;
+}
 /*# sourceMappingURL=portfolio.css.map */
--- a/assets/css/portfolio.css.map
+++ b/assets/css/portfolio.css.map
@ -1,6 +1,6 @@
 {
    "version": 3,
-    "mappings": "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",
+    "mappings": "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",
    "sources": [
        "portfolio.scss"
    ],
--- a/assets/css/portfolio.scss
+++ b/assets/css/portfolio.scss
@ -16,6 +16,7 @@ body {
 * {
 	margin: 0;
 	padding: 0;
+	position: inherit;
 	font-family: 'Roboto', sans-serif;
 }
 .title {
@ -37,6 +38,17 @@ body {
 	//height: 1%;
 	text-align: center;
 }
+.coding {
+	font-size: 7vh;
+	font-style: italic;
+	color: white;
+	border-bottom: white 5px solid;
+}
+
+body.light .coding {
+	color: black !important;
+	border-bottom: black 5px solid;
+}
 sub {
 	font-size: 1vh;
 }
@ -84,8 +96,8 @@ body.light #box {
 	transition: border-color 0.5s ease-in-out;
 }

-$accents: ("yiff": #ff6d62, "thaldrin": #ff995d, "homepage": #ac9efc);
-$links: ('yiff', 'thaldrin', 'homepage');
+$accents: ("yiff": #4043ff, "thaldrin": #ff9e42, "website": #ff4885, "art": #1da1f2);
+$links: ('yiff', 'thaldrin', 'website', 'art');
 $time: 2s;
@each $link, $color in $accents {
 	.#{$link}:hover {
@ -110,3 +122,13 @@ $time: 2s;
 		font-size: 6vh;
 	}
 }
+
+p::selection {
+	color: black;
+	background-color: white;
+}
+
+body.light p::selection {
+	color: white;
+	background-color: black;
+}
--- a/constants.js
+++ b/constants.js
@ -1,3 +1,4 @@
 module.exports = {
-	name: 'ry'
+	name: 'ry',
+	updateToken: 'qwertzuiop1234567890'
 };
--- a/routes/portfolio.js
+++ b/routes/portfolio.js
@ -7,24 +7,13 @@ portfolio.get('/', (req, res) => {
 		layout: 'portfolio',
 		name: `${con.name} - portfolio`,
 		host: req.hostname,
-		portfolio: [
-			{ name: 'thaldrin', source: 'https://gitdab.com/r/thaldrin' },
-			{ name: 'homepage', source: 'https://gitdab.com/y/website' },
-			{ name: 'yiff', source: 'https://github.com/codepupper/yiff' }
-		]
-	});
-});
-
-portfolio.get('/art', (req, res) => {
-	res.render('artwork', {
-		layout: 'artwork',
-		name: `${con.name} - artwork`,
-		host: req.hostname
-		/* 		portfolio: [
-			{ name: 'thaldrin', source: 'https://gitdab.com/r/thaldrin' },
-			{ name: 'homepage', source: 'https://gitdab.com/y/website' },
-			{ name: 'yiff', source: 'https://github.com/codepupper/yiff' }
-		] */
+		portfolio: {
+			code: [
+				{ name: 'thaldrin', source: 'https://gitdab.com/r/thaldrin' },
+				{ name: 'website', source: 'https://gitdab.com/y/website' },
+				{ name: 'yiff', source: 'https://github.com/codepupper/yiff' }
+			]
+		}
 	});
 });

--- a/server.js
+++ b/server.js
@ -44,7 +44,7 @@ app.use(cors());
 app.use(
 	morgan((tokens, req, res) => {
 		return [
-			chalk.hex('#34ace0').bold(tokens.method(req, res)),
+			chalk.hex('#34ace0').bold(`[ ${tokens.method(req, res)} ]`),
 			chalk.hex('#ffb142').bold(tokens.status(req, res)),
 			chalk.hex('#ff5252').bold(req.hostname + tokens.url(req, res)),
 			chalk.hex('#2ed573').bold(tokens['response-time'](req, res) + 'ms'),
@ -74,13 +74,15 @@ module.exports = (client) => {
 				{ name: 'Gitdab', color: 'faacb7', link: 'gitdab.com/y', icon: simpleIcons.Git },
 				{ name: 'Github', color: '333', link: 'github.com/codepupper', icon: simpleIcons.GitHub },
 				{ name: 'Gitlab', color: 'E24329', link: 'gitlab.com/codepupper', icon: simpleIcons.GitLab },
-				{ name: 'Twitch', color: '6441a4', link: 'twitch.tv/codepupper', icon: simpleIcons.Twitch }
+				{ name: 'Twitch', color: '6441a4', link: 'twitch.tv/codepupper', icon: simpleIcons.Twitch },
+				{ name: 'Twitter', color: '1DA1F2', link: 'twitter.com/floofydev', icon: simpleIcons.Twitter }
 			]
 		});
 	});
+
 	app.get('/update', async (req, res) => {
 		//console.log(req.headers['user-agent']);
-		if (req.headers.authorization === 'Update') {
+		if (req.headers.authorization === con.updateToken) {
 			await exec('git pull')
 				.then((r) => {
 					console.log('Pulled latest changes');
@ -88,6 +90,7 @@ module.exports = (client) => {
 						success: true,
 						message: 'Successfully pulled latest changes'
 					});
+					process.exit();
 					//trying.edit('```fix\n' + r.stdout + '```');
 				})
 				.catch((error) => {
@ -106,6 +109,6 @@ module.exports = (client) => {
 	});

 	app.listen(port /* , hostname */, () => {
-		console.log(`Listening on ${port}`);
+		console.log(`[ Server ] Listening on ${port}`);
 	});
 };
--- a/views/artwork.hbs
+++ b/views/artwork.hbs
@ -1,10 +1,11 @@
 <body>
-    <h1 class="title" > <a href="/">{{name}}</a></h1>
-    <h1 class="subtitle toggle">dark/light</h1>
-    <div class="center">
-        <div class="imageOne XX"></div>
-    <div class="imageTwo XX"></div>
-    </div>
-    <div id="box"></div>
+  <h1 class="title"> <a href="/">{{name}}</a></h1>
+  <h1 class="subtitle toggle">dark/light</h1>
+  <div class="center">
+    {{#each art}}
+    <img src="http://{{this.image}}" width="{{this.aspect.w}}" height="{{this.aspect.h}}" alt="Image">
+    {{/each}}
+  </div>
+  <div id="box"></div>
  </div>
 </body>
--- a/views/index.hbs
+++ b/views/index.hbs
@ -1,6 +1,6 @@
 <body>
  <div class="center">
-    <h1 class="title"><i>{{name}}</i> </h1>
+    <h1 class="title">{{name}}</h1>
    <h1 class="subtitle toggle">dark/light</h1>
    <divide></divide>
    {{#each item}}
--- a/views/portfolio.hbs
+++ b/views/portfolio.hbs
@ -2,10 +2,15 @@
    <h1 class="title" > <a href="/">{{name}}</a></h1>
    <h1 class="subtitle toggle">dark/light</h1>
    <div class="center">
-    {{#each portfolio}}
+      <p class="subtitle coding">Coding</p>
+     {{!--  <br> --}}
+    {{#each portfolio.code}}
    <a class="{{this.name}}" target="_blank" href="{{this.source}}">{{this.name}}</a>
    {{/each}}
-
+   {{!--  <br> --}}
+    <p class="subtitle coding">Art</p>
+   {{!--  <br> --}}
+    <a class="art" href="https://twitter.com/floofydev" target="_blank">@floofydev</a>
    <div id="box"></div>
  </div>
 </body>