mirror of
https://github.com/dilllxd/gitfolio.git
synced 2024-08-14 22:28:09 +00:00
Remove every Blog related code
This commit is contained in:
parent
723c6925ed
commit
8527e9bfdf
15 changed files with 41 additions and 983 deletions
|
@ -1 +0,0 @@
|
||||||
[]
|
|
|
@ -1,125 +0,0 @@
|
||||||
<!DOCTYPE html>
|
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8" />
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
||||||
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
|
|
||||||
<title>Lorem ipsum dolor</title>
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.0/animate.min.css"
|
|
||||||
/>
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://use.fontawesome.com/releases/v5.7.1/css/all.css"
|
|
||||||
integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<script
|
|
||||||
src="https://code.jquery.com/jquery-3.4.1.min.js"
|
|
||||||
integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div id="loading">
|
|
||||||
<div id="spinner"></div>
|
|
||||||
</div>
|
|
||||||
<a href="/" class="go_back"><i class="fas fa-arrow-left"></i></a>
|
|
||||||
<div id="background_overlay"></div>
|
|
||||||
<div id="background"></div>
|
|
||||||
<table id="profile_blog">
|
|
||||||
<tbody>
|
|
||||||
<tr>
|
|
||||||
<td style="width:8vw;"><div id="profile_img_blog"></div></td>
|
|
||||||
<td style="width:52vw;">
|
|
||||||
<div id="username_blog"></div>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
<div id="blog-display">
|
|
||||||
<h1 id="blog_title">Lorem ipsum dolor</h1>
|
|
||||||
<h2 id="blog_sub_title">
|
|
||||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
|
|
||||||
</h2>
|
|
||||||
<div id="blog">
|
|
||||||
<img
|
|
||||||
src="https://images.unsplash.com/photo-1553748024-d1b27fb3f960?w=1450"
|
|
||||||
/>
|
|
||||||
<p>
|
|
||||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut placerat
|
|
||||||
pretium sem, ac maximus dui sodales a. Nunc aliquet hendrerit turpis
|
|
||||||
ac egestas. Phasellus volutpat tristique maximus.
|
|
||||||
<b>Pellentesque feugiat eget nisi et dignissim.</b> Nam nibh erat,
|
|
||||||
sollicitudin non facilisis nec, scelerisque nec ipsum. Sed accumsan
|
|
||||||
velit condimentum, pharetra felis vitae, commodo tellus.
|
|
||||||
<u><i>Mauris consequat luctus orci.</i></u>
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
Vivamus pharetra lobortis dui non tincidunt. Mauris vitae nisi
|
|
||||||
vestibulum, mollis magna a, maximus mi. Suspendisse dictum eget augue
|
|
||||||
quis sodales. Quisque rutrum ligula nec dapibus tincidunt.
|
|
||||||
<span
|
|
||||||
>Proin hendrerit massa a tellus vestibulum, a hendrerit ipsum
|
|
||||||
iaculis. Suspendisse potenti.</span
|
|
||||||
>
|
|
||||||
Praesent eget erat blandit, finibus sapien vitae, ullamcorper erat.
|
|
||||||
Integer blandit, felis at ullamcorper maximus, odio lectus pretium
|
|
||||||
mauris, vel consequat lectus quam eu risus. Pellentesque gravida nec
|
|
||||||
diam eget vehicula.
|
|
||||||
</p>
|
|
||||||
<img
|
|
||||||
src="https://images.unsplash.com/photo-1556814278-8906c7d3a05f?w=1050"
|
|
||||||
/>
|
|
||||||
<p>
|
|
||||||
Donec hendrerit turpis non libero eleifend dignissim. Mauris non
|
|
||||||
tempor metus, et tristique massa. Integer consequat justo quam, vitae
|
|
||||||
aliquam arcu vestibulum at. Donec porttitor quam in tempus convallis.
|
|
||||||
Praesent feugiat eget eros vitae accumsan. Duis ultricies odio quis
|
|
||||||
nisl volutpat, consectetur imperdiet sem laoreet. Quisque maximus
|
|
||||||
semper ligula at tincidunt. Pellentesque accumsan varius vehicula.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div id="footer_blog">
|
|
||||||
<a href="https://github.com/imfunniee" target="_blank"
|
|
||||||
>made on earth by a human</a
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
<script type="text/javascript">
|
|
||||||
setTimeout(function() {
|
|
||||||
document.getElementById("loading").classList.add("animated");
|
|
||||||
document.getElementById("loading").classList.add("fadeOut");
|
|
||||||
setTimeout(function() {
|
|
||||||
document.getElementById("loading").classList.remove("animated");
|
|
||||||
document.getElementById("loading").classList.remove("fadeOut");
|
|
||||||
document.getElementById("loading").style.display = "none";
|
|
||||||
}, 800);
|
|
||||||
}, 1500);
|
|
||||||
$.getJSON("../../config.json", function(user) {
|
|
||||||
var icon = document.createElement("link");
|
|
||||||
icon.setAttribute("rel", "icon");
|
|
||||||
icon.setAttribute("href", user[0].userimg);
|
|
||||||
icon.setAttribute("type", "image/png");
|
|
||||||
document.getElementsByTagName("head")[0].appendChild(icon);
|
|
||||||
document.getElementById(
|
|
||||||
"profile_img_blog"
|
|
||||||
).style.background = `url('${user[0].userimg}') center center`;
|
|
||||||
document.getElementById(
|
|
||||||
"username_blog"
|
|
||||||
).innerHTML = `<span style="display:${
|
|
||||||
user[0].name == null || !user[0].name ? "none" : "block"
|
|
||||||
};">${user[0].name}</span>@${user[0].username}<b id="blog_time"></b>`;
|
|
||||||
|
|
||||||
if ((user[0].theme = "dark.css")) {
|
|
||||||
document.querySelector("#background_overlay").style.background =
|
|
||||||
"linear-gradient(0deg, rgba(10, 10, 10, 1), rgba(10, 10, 10, 0.1))";
|
|
||||||
} else {
|
|
||||||
document.querySelector("#background_overlay").style.background =
|
|
||||||
"linear-gradient(0deg, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0.1))";
|
|
||||||
}
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
188
assets/index.css
188
assets/index.css
|
@ -84,48 +84,6 @@ body {
|
||||||
height: 18px;
|
height: 18px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#profile_img_blog {
|
|
||||||
border-radius: 50%;
|
|
||||||
width: 90px;
|
|
||||||
height: 90px;
|
|
||||||
background-size: cover !important;
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
#username_blog {
|
|
||||||
font-size: 18px;
|
|
||||||
color: var(--text-color);
|
|
||||||
font-family: "Asap Condensed", sans-serif;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
#username_blog span {
|
|
||||||
font-size: 24px;
|
|
||||||
font-family: "Asap Condensed", sans-serif !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#username_blog b {
|
|
||||||
font-size: 12px;
|
|
||||||
font-family: "Asap Condensed", sans-serif;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
#blog-display {
|
|
||||||
width: 60vw;
|
|
||||||
margin: 0px 20vw;
|
|
||||||
text-align: left;
|
|
||||||
margin-top: 3vh;
|
|
||||||
z-index: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
#profile_blog {
|
|
||||||
width: 60vw;
|
|
||||||
margin: 0px 20vw;
|
|
||||||
margin-top: 34vh;
|
|
||||||
text-align: left;
|
|
||||||
z-index: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
#background_overlay {
|
#background_overlay {
|
||||||
width: 100vw;
|
width: 100vw;
|
||||||
height: 55vh;
|
height: 55vh;
|
||||||
|
@ -146,42 +104,6 @@ body {
|
||||||
left: 0;
|
left: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
#blog-display h1 {
|
|
||||||
font-size: 50px;
|
|
||||||
color: var(--text-color);
|
|
||||||
font-weight: bold;
|
|
||||||
font-family: "Asap", sans-serif;
|
|
||||||
}
|
|
||||||
|
|
||||||
#blog-display h2 {
|
|
||||||
color: var(--blog-gray-color);
|
|
||||||
}
|
|
||||||
|
|
||||||
#blog-display {
|
|
||||||
padding: 1vh 0px;
|
|
||||||
font-family: "Asap", sans-serif;
|
|
||||||
}
|
|
||||||
|
|
||||||
#blog p {
|
|
||||||
font-size: 17px;
|
|
||||||
line-height: 25px;
|
|
||||||
word-spacing: 1.2px;
|
|
||||||
margin: 5vh 0px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#blog p span {
|
|
||||||
padding: 2px 4px;
|
|
||||||
background: var(--text-color);
|
|
||||||
color: var(--bg-color) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#blog img {
|
|
||||||
width: 100%;
|
|
||||||
margin: 2vh 0px;
|
|
||||||
border-radius: 5px;
|
|
||||||
border: 1px solid rgb(0, 0, 0, 0.08);
|
|
||||||
}
|
|
||||||
|
|
||||||
#header {
|
#header {
|
||||||
width: 63vw;
|
width: 63vw;
|
||||||
text-align: right;
|
text-align: right;
|
||||||
|
@ -196,19 +118,6 @@ body {
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
#footer_blog {
|
|
||||||
width: 90vw;
|
|
||||||
padding: 8vh 5vw;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
#footer_blog a {
|
|
||||||
color: var(--text-color) !important;
|
|
||||||
text-decoration: none;
|
|
||||||
font-family: "Asap", sans-serif;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
#footer {
|
#footer {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
padding: 8vh 0px;
|
padding: 8vh 0px;
|
||||||
|
@ -372,53 +281,6 @@ body {
|
||||||
font-weight: normal !important;
|
font-weight: normal !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
#blog_section {
|
|
||||||
margin: 2vh 0px;
|
|
||||||
padding: 2vh 0px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#blogs {
|
|
||||||
columns: 2;
|
|
||||||
}
|
|
||||||
|
|
||||||
#blog_title {
|
|
||||||
font-size: 50px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#blog_sub_title {
|
|
||||||
font-size: 36px;
|
|
||||||
margin-top: -2vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
#blogs section {
|
|
||||||
width: 100%;
|
|
||||||
display: inline-block;
|
|
||||||
border-radius: 5px;
|
|
||||||
color: var(--text-color);
|
|
||||||
border: 1px solid rgb(0, 0, 0, 0.04);
|
|
||||||
box-shadow: 0px 0px 0px rgb(0, 0, 0, 0);
|
|
||||||
transition: 0.4s ease-in-out;
|
|
||||||
transform: scale(1);
|
|
||||||
padding: 0px;
|
|
||||||
margin: 2vh 0px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#blogs section img {
|
|
||||||
width: 100%;
|
|
||||||
border-radius: 5px 5px 0px 0px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.blog_container {
|
|
||||||
padding: 2.5vh 5%;
|
|
||||||
}
|
|
||||||
|
|
||||||
#blogs section:hover {
|
|
||||||
cursor: pointer;
|
|
||||||
border: 1px solid rgb(0, 0, 0, 0);
|
|
||||||
box-shadow: 0px 15px 35px rgb(0, 0, 0, 0.06);
|
|
||||||
transform: scale(1.03);
|
|
||||||
}
|
|
||||||
|
|
||||||
.go_back {
|
.go_back {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
color: var(--text-color);
|
color: var(--text-color);
|
||||||
|
@ -476,48 +338,6 @@ body {
|
||||||
width: 88%;
|
width: 88%;
|
||||||
}
|
}
|
||||||
|
|
||||||
#blogs {
|
|
||||||
columns: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
#blogs section {
|
|
||||||
width: 98%;
|
|
||||||
}
|
|
||||||
|
|
||||||
#blog_section {
|
|
||||||
margin: 0px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#blog-display {
|
|
||||||
width: 90vw;
|
|
||||||
margin: 0px 5vw;
|
|
||||||
text-align: left;
|
|
||||||
margin-top: 0vh;
|
|
||||||
z-index: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
#blog_title {
|
|
||||||
font-size: 32px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#blog_sub_title {
|
|
||||||
font-size: 24px;
|
|
||||||
margin-top: -1vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
#profile_blog {
|
|
||||||
width: 90vw;
|
|
||||||
margin: 0px 5vw;
|
|
||||||
margin-top: 36vh;
|
|
||||||
text-align: left;
|
|
||||||
z-index: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
#profile_img_blog {
|
|
||||||
width: 65px;
|
|
||||||
height: 65px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.go_back {
|
.go_back {
|
||||||
position: relative;
|
position: relative;
|
||||||
color: var(--text-color);
|
color: var(--text-color);
|
||||||
|
@ -525,14 +345,6 @@ body {
|
||||||
margin-left: 5vw;
|
margin-left: 5vw;
|
||||||
top: 5vh;
|
top: 5vh;
|
||||||
}
|
}
|
||||||
|
|
||||||
#blog img {
|
|
||||||
margin: 1vh 0px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#blog p {
|
|
||||||
margin: 2vh 0px;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
::-webkit-scrollbar {
|
::-webkit-scrollbar {
|
||||||
|
|
|
@ -41,46 +41,11 @@
|
||||||
<div class="projects"
|
<div class="projects"
|
||||||
id="forks_section"></div>
|
id="forks_section"></div>
|
||||||
</div>
|
</div>
|
||||||
<div id="blog_section">
|
|
||||||
<h1>Blog.</h1>
|
|
||||||
<div id="blogs"></div>
|
|
||||||
</div>
|
|
||||||
<div id="footer">
|
<div id="footer">
|
||||||
<a href="https://github.com/imfunniee"
|
<a href="https://github.com/imfunniee"
|
||||||
target="_blank">made on earth by a human</a>
|
target="_blank">made on earth by a human</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<script type="text/javascript">
|
|
||||||
$.getJSON("blog.json", function(blog)
|
|
||||||
{
|
|
||||||
blog = blog || [];
|
|
||||||
if (blog.length == 0)
|
|
||||||
{
|
|
||||||
return (document.getElementById("blog_section").style.display =
|
|
||||||
"none");
|
|
||||||
}
|
|
||||||
for (var i = 0; i < blog.length; i++)
|
|
||||||
{
|
|
||||||
$("#blogs").append(`
|
|
||||||
<a href="./blog/${blog[i].url_title}/" target="_blank">
|
|
||||||
<section>
|
|
||||||
<img src="./blog/${blog[i].url_title}/${blog[i].top_image}">
|
|
||||||
<div class="blog_container">
|
|
||||||
<div class="section_title">${blog[i].title}</div>
|
|
||||||
<div class="about_section">
|
|
||||||
${blog[i].sub_title}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
</a>
|
|
||||||
`);
|
|
||||||
}
|
|
||||||
}).fail(function()
|
|
||||||
{
|
|
||||||
return (document.getElementById("blog_section").style.display = "none");
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
const magicProjectsGrid = new MagicGrid(
|
const magicProjectsGrid = new MagicGrid(
|
||||||
{
|
{
|
||||||
|
|
|
@ -1,18 +1,13 @@
|
||||||
:root {
|
:root {
|
||||||
--bg-color: rgb(10, 10, 10);
|
--bg-color: rgb(10, 10, 10);
|
||||||
--text-color: #fff;
|
--text-color: #fff;
|
||||||
--blog-gray-color: rgb(180, 180, 180);
|
--background-image: linear-gradient(90deg,
|
||||||
--background-image: linear-gradient(
|
|
||||||
90deg,
|
|
||||||
rgba(10, 10, 10, 0.3),
|
rgba(10, 10, 10, 0.3),
|
||||||
rgb(10, 10, 10, 1)
|
rgb(10, 10, 10, 1)),
|
||||||
),
|
|
||||||
url("{{{background}}}");
|
url("{{{background}}}");
|
||||||
--background-background: linear-gradient(
|
--background-background: linear-gradient(0deg,
|
||||||
0deg,
|
|
||||||
rgba(10, 10, 10, 1),
|
rgba(10, 10, 10, 1),
|
||||||
rgba(10, 10, 10, 0.6)
|
rgba(10, 10, 10, 0.6)),
|
||||||
),
|
|
||||||
url("{{{background}}}") center center fixed;
|
url("{{{background}}}") center center fixed;
|
||||||
--height: 50vh;
|
--height: 50vh;
|
||||||
}
|
}
|
||||||
|
@ -23,27 +18,15 @@
|
||||||
-webkit-text-fill-color: #fff;
|
-webkit-text-fill-color: #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
#blog-display h1 {
|
|
||||||
-webkit-background-clip: text;
|
|
||||||
background-clip: text;
|
|
||||||
-webkit-text-fill-color: #fff;
|
|
||||||
}
|
|
||||||
|
|
||||||
.projects section {
|
.projects section {
|
||||||
background: rgb(20, 20, 20);
|
background: rgb(20, 20, 20);
|
||||||
}
|
}
|
||||||
|
|
||||||
#blog_section section {
|
|
||||||
background: rgb(20, 20, 20);
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 800px) {
|
@media (max-width: 800px) {
|
||||||
:root {
|
:root {
|
||||||
--background-image: linear-gradient(
|
--background-image: linear-gradient(0deg,
|
||||||
0deg,
|
|
||||||
rgba(10, 10, 10, 1),
|
rgba(10, 10, 10, 1),
|
||||||
rgba(10, 10, 10, 0)
|
rgba(10, 10, 10, 0)),
|
||||||
),
|
|
||||||
url("{{{background}}}") !important;
|
url("{{{background}}}") !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
|
@ -1,12 +1,9 @@
|
||||||
:root {
|
:root {
|
||||||
--bg-color: #fff;
|
--bg-color: #fff;
|
||||||
--text-color: rgb(10, 10, 10);
|
--text-color: rgb(10, 10, 10);
|
||||||
--blog-gray-color: rgb(80, 80, 80);
|
--background-image: linear-gradient(90deg,
|
||||||
--background-image: linear-gradient(
|
|
||||||
90deg,
|
|
||||||
rgba(10, 10, 10, 0.4),
|
rgba(10, 10, 10, 0.4),
|
||||||
rgb(10, 10, 10, 0.4)
|
rgb(10, 10, 10, 0.4)),
|
||||||
),
|
|
||||||
url("{{{background}}}");
|
url("{{{background}}}");
|
||||||
--background-background: #fff;
|
--background-background: #fff;
|
||||||
}
|
}
|
|
@ -55,11 +55,6 @@ program
|
||||||
.description("Update user and repository data")
|
.description("Update user and repository data")
|
||||||
.action(updateCommand);
|
.action(updateCommand);
|
||||||
|
|
||||||
program
|
|
||||||
.command("ui")
|
|
||||||
.description("Create and Manage blogs with ease")
|
|
||||||
.action(uiCommand);
|
|
||||||
|
|
||||||
program
|
program
|
||||||
.command("run")
|
.command("run")
|
||||||
.description("Run build files")
|
.description("Run build files")
|
||||||
|
|
|
@ -1 +0,0 @@
|
||||||
[]
|
|
17
package.json
17
package.json
|
@ -4,13 +4,15 @@
|
||||||
"description": "a portfolio website for everyone to showcase their work",
|
"description": "a portfolio website for everyone to showcase their work",
|
||||||
"main": "build.js",
|
"main": "build.js",
|
||||||
"bin": "bin/gitfolio.js",
|
"bin": "bin/gitfolio.js",
|
||||||
"scripts": {
|
"scripts":
|
||||||
|
{
|
||||||
"cli": "OUT_DIR='./dist' node bin/gitfolio.js",
|
"cli": "OUT_DIR='./dist' node bin/gitfolio.js",
|
||||||
"clean": "rm -rf ./dist/*",
|
"clean": "rm -rf ./dist/*",
|
||||||
"prettier": "prettier --write \"./**/*.{js,jsx,json,html,css,md}\"",
|
"prettier": "prettier --write \"./**/*.{js,jsx,json,html,css,md}\"",
|
||||||
"test": "echo \"Error: no test specified\" && exit 1"
|
"test": "echo \"Error: no test specified\" && exit 1"
|
||||||
},
|
},
|
||||||
"author": {
|
"author":
|
||||||
|
{
|
||||||
"name": "@imfunniee and community",
|
"name": "@imfunniee and community",
|
||||||
"email": "imfunny@wybemf.com",
|
"email": "imfunny@wybemf.com",
|
||||||
"url": "https://imfunniee.github.io"
|
"url": "https://imfunniee.github.io"
|
||||||
|
@ -22,17 +24,17 @@
|
||||||
"github",
|
"github",
|
||||||
"portfolio",
|
"portfolio",
|
||||||
"portfolio website",
|
"portfolio website",
|
||||||
"blog website",
|
|
||||||
"blog",
|
|
||||||
"gitfolio",
|
"gitfolio",
|
||||||
"git"
|
"git"
|
||||||
],
|
],
|
||||||
"repository": {
|
"repository":
|
||||||
|
{
|
||||||
"type": "git",
|
"type": "git",
|
||||||
"url": "https://github.com/imfunniee/gitfolio"
|
"url": "https://github.com/imfunniee/gitfolio"
|
||||||
},
|
},
|
||||||
"license": "GPL-3.0",
|
"license": "GPL-3.0",
|
||||||
"dependencies": {
|
"dependencies":
|
||||||
|
{
|
||||||
"bluebird": "^3.7.2",
|
"bluebird": "^3.7.2",
|
||||||
"body-parser": "^1.19.0",
|
"body-parser": "^1.19.0",
|
||||||
"commander": "4.0.1",
|
"commander": "4.0.1",
|
||||||
|
@ -44,5 +46,6 @@
|
||||||
"jsdom": "^15.2.1",
|
"jsdom": "^15.2.1",
|
||||||
"ncp": "^2.0.0"
|
"ncp": "^2.0.0"
|
||||||
},
|
},
|
||||||
"devDependencies": {}
|
"devDependencies":
|
||||||
|
{}
|
||||||
}
|
}
|
|
@ -157,11 +157,6 @@ module.exports.updateHTML = (username, opts) =>
|
||||||
<span style="display:${
|
<span style="display:${
|
||||||
user.email == null || !user.email ? "none" : "block"
|
user.email == null || !user.email ? "none" : "block"
|
||||||
};"><i class="fas fa-envelope"></i> ${user.email}</span>
|
};"><i class="fas fa-envelope"></i> ${user.email}</span>
|
||||||
<span style="display:${
|
|
||||||
user.blog == null || !user.blog ? "none" : "block"
|
|
||||||
};"><i class="fas fa-link"></i> <a href="${user.blog}">${
|
|
||||||
user.blog
|
|
||||||
}</a></span>
|
|
||||||
<span style="display:${
|
<span style="display:${
|
||||||
user.location == null || !user.location ? "none" : "block"
|
user.location == null || !user.location ? "none" : "block"
|
||||||
};"><i class="fas fa-map-marker-alt"></i> ${
|
};"><i class="fas fa-map-marker-alt"></i> ${
|
||||||
|
|
176
ui.js
176
ui.js
|
@ -38,141 +38,6 @@ const jsdom = require("jsdom").JSDOM,
|
||||||
resources: "usable"
|
resources: "usable"
|
||||||
};
|
};
|
||||||
global.DOMParser = new jsdom().window.DOMParser;
|
global.DOMParser = new jsdom().window.DOMParser;
|
||||||
const
|
|
||||||
{
|
|
||||||
getBlog,
|
|
||||||
outDir
|
|
||||||
} = require("./utils");
|
|
||||||
|
|
||||||
function createBlog(title, subtitle, folder, topImage, images, content)
|
|
||||||
{
|
|
||||||
// Checks to make sure this directory actually exists
|
|
||||||
// and creates it if it doesn't
|
|
||||||
if (!fs.existsSync(`${outDir}/blog/`))
|
|
||||||
{
|
|
||||||
fs.mkdirSync(
|
|
||||||
`${outDir}/blog/`,
|
|
||||||
{
|
|
||||||
recursive: true
|
|
||||||
},
|
|
||||||
err =>
|
|
||||||
{}
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!fs.existsSync(`${outDir}/blog/${folder}`))
|
|
||||||
{
|
|
||||||
fs.mkdirSync(`${outDir}/blog/${folder}`,
|
|
||||||
{
|
|
||||||
recursive: true
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
fs.copyFile(
|
|
||||||
`${__dirname}/assets/blog/blogTemplate.html`,
|
|
||||||
`${outDir}/blog/${folder}/index.html`,
|
|
||||||
err =>
|
|
||||||
{
|
|
||||||
if (err) throw err;
|
|
||||||
jsdom
|
|
||||||
.fromFile(`${outDir}/blog/${folder}/index.html`, options)
|
|
||||||
.then(function(dom)
|
|
||||||
{
|
|
||||||
let window = dom.window,
|
|
||||||
document = window.document;
|
|
||||||
let style = document.createElement("link");
|
|
||||||
style.setAttribute("rel", "stylesheet");
|
|
||||||
style.setAttribute("href", "../../index.css");
|
|
||||||
document.getElementsByTagName("head")[0].appendChild(style);
|
|
||||||
|
|
||||||
document.getElementsByTagName("title")[0].textContent = title;
|
|
||||||
document.getElementById("blog_title").textContent = title;
|
|
||||||
document.getElementById("blog_sub_title").textContent = subtitle;
|
|
||||||
document.getElementById(
|
|
||||||
"background"
|
|
||||||
).style.background = `url('top_image.${
|
|
||||||
topImage.split("/")[1].split(";")[0]
|
|
||||||
}') center center`;
|
|
||||||
|
|
||||||
if (content != null)
|
|
||||||
{
|
|
||||||
var parser = new DOMParser();
|
|
||||||
content = parser.parseFromString(content, "text/html");
|
|
||||||
document.getElementById("blog").innerHTML =
|
|
||||||
content.documentElement.innerHTML;
|
|
||||||
}
|
|
||||||
|
|
||||||
images = JSON.parse(images);
|
|
||||||
images.forEach((item, index) =>
|
|
||||||
{
|
|
||||||
var base64Image = item.split(";base64,").pop();
|
|
||||||
fs.writeFile(
|
|
||||||
`${outDir}/blog/${folder}/img_${index}.${
|
|
||||||
item.split("/")[1].split(";")[0]
|
|
||||||
}`,
|
|
||||||
base64Image,
|
|
||||||
{
|
|
||||||
encoding: "base64"
|
|
||||||
},
|
|
||||||
function(err)
|
|
||||||
{
|
|
||||||
if (err) throw err;
|
|
||||||
}
|
|
||||||
);
|
|
||||||
});
|
|
||||||
|
|
||||||
fs.writeFile(
|
|
||||||
`${outDir}/blog/${folder}/index.html`,
|
|
||||||
"<!DOCTYPE html>" + window.document.documentElement.outerHTML,
|
|
||||||
async function(error)
|
|
||||||
{
|
|
||||||
if (error) throw error;
|
|
||||||
|
|
||||||
var base64ImageTop = topImage.split(";base64,").pop();
|
|
||||||
fs.writeFile(
|
|
||||||
`${outDir}/blog/${folder}/top_image.${
|
|
||||||
topImage.split("/")[1].split(";")[0]
|
|
||||||
}`,
|
|
||||||
base64ImageTop,
|
|
||||||
{
|
|
||||||
encoding: "base64"
|
|
||||||
},
|
|
||||||
function(err)
|
|
||||||
{
|
|
||||||
if (err) throw err;
|
|
||||||
}
|
|
||||||
);
|
|
||||||
|
|
||||||
let blog_data = {
|
|
||||||
url_title: folder,
|
|
||||||
title: title,
|
|
||||||
sub_title: subtitle,
|
|
||||||
top_image: `top_image.${topImage.split("/")[1].split(";")[0]}`,
|
|
||||||
visible: true
|
|
||||||
};
|
|
||||||
const old_blogs = await getBlog();
|
|
||||||
old_blogs.push(blog_data);
|
|
||||||
fs.writeFile(
|
|
||||||
`${outDir}/blog.json`,
|
|
||||||
JSON.stringify(old_blogs, null, " "),
|
|
||||||
function(err)
|
|
||||||
{
|
|
||||||
if (err) throw err;
|
|
||||||
console.log(
|
|
||||||
`Blog created successfully at ${outDir}\\blog\\${folder}\n`
|
|
||||||
);
|
|
||||||
}
|
|
||||||
);
|
|
||||||
}
|
|
||||||
);
|
|
||||||
})
|
|
||||||
.catch(function(error)
|
|
||||||
{
|
|
||||||
console.log(error);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
function uiCommand()
|
function uiCommand()
|
||||||
{
|
{
|
||||||
|
@ -237,47 +102,6 @@ function uiCommand()
|
||||||
res.redirect("/");
|
res.redirect("/");
|
||||||
});
|
});
|
||||||
|
|
||||||
app.get("/blog", function(req, res)
|
|
||||||
{
|
|
||||||
if (!fs.existsSync(`${outDir}/config.json`))
|
|
||||||
{
|
|
||||||
return res.send(
|
|
||||||
'You need to run build command before accessing blogs<br><a href="/">Go Back</a>'
|
|
||||||
);
|
|
||||||
}
|
|
||||||
fs.readFile(`${outDir}/config.json`, function(err, data)
|
|
||||||
{
|
|
||||||
res.render("blog.ejs",
|
|
||||||
{
|
|
||||||
profile: JSON.parse(data)
|
|
||||||
});
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
app.post("/createBlog", function(req, res)
|
|
||||||
{
|
|
||||||
let title = req.body.title;
|
|
||||||
let subtitle = req.body.subtitle;
|
|
||||||
let content = req.body.content ? req.body.content : null;
|
|
||||||
if (!title)
|
|
||||||
{
|
|
||||||
return res.send("title can't be empty");
|
|
||||||
}
|
|
||||||
if (!subtitle)
|
|
||||||
{
|
|
||||||
return res.send("subtitle can't be empty");
|
|
||||||
}
|
|
||||||
if (!content)
|
|
||||||
{
|
|
||||||
return res.send("something isn't working fine, try again :p");
|
|
||||||
}
|
|
||||||
let folder = title.replace(/[^a-zA-Z ]/g, "").replace(/ /g, "-");
|
|
||||||
let topImage = req.body.top_image;
|
|
||||||
let images = req.body.images;
|
|
||||||
createBlog(title, subtitle, folder, topImage, images, content);
|
|
||||||
res.redirect("/blog");
|
|
||||||
});
|
|
||||||
|
|
||||||
console.log("\nStarting...");
|
console.log("\nStarting...");
|
||||||
app.listen(port);
|
app.listen(port);
|
||||||
console.log(
|
console.log(
|
||||||
|
|
22
utils.js
22
utils.js
|
@ -4,19 +4,21 @@ const fs = bluebird.promisifyAll(require("fs"));
|
||||||
|
|
||||||
const outDir = path.resolve("./dist/" || process.env.OUT_DIR);
|
const outDir = path.resolve("./dist/" || process.env.OUT_DIR);
|
||||||
const configPath = path.join(outDir, "config.json");
|
const configPath = path.join(outDir, "config.json");
|
||||||
const blogPath = path.join(outDir, "blog.json");
|
|
||||||
|
|
||||||
const defaultConfigPath = path.resolve(`${__dirname}/default/config.json`);
|
const defaultConfigPath = path.resolve(`${__dirname}/default/config.json`);
|
||||||
const defaultBlogPath = path.resolve(`${__dirname}/default/blog.json`);
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Tries to read file from out dir,
|
* Tries to read file from out dir,
|
||||||
* if not present returns default file contents
|
* if not present returns default file contents
|
||||||
*/
|
*/
|
||||||
async function getFileWithDefaults(file, defaultFile) {
|
async function getFileWithDefaults(file, defaultFile)
|
||||||
try {
|
{
|
||||||
|
try
|
||||||
|
{
|
||||||
await fs.accessAsync(file, fs.constants.F_OK);
|
await fs.accessAsync(file, fs.constants.F_OK);
|
||||||
} catch (err) {
|
}
|
||||||
|
catch (err)
|
||||||
|
{
|
||||||
const defaultData = await fs.readFileAsync(defaultFile);
|
const defaultData = await fs.readFileAsync(defaultFile);
|
||||||
return JSON.parse(defaultData);
|
return JSON.parse(defaultData);
|
||||||
}
|
}
|
||||||
|
@ -24,16 +26,12 @@ async function getFileWithDefaults(file, defaultFile) {
|
||||||
return JSON.parse(data);
|
return JSON.parse(data);
|
||||||
}
|
}
|
||||||
|
|
||||||
async function getConfig() {
|
async function getConfig()
|
||||||
|
{
|
||||||
return getFileWithDefaults(configPath, defaultConfigPath);
|
return getFileWithDefaults(configPath, defaultConfigPath);
|
||||||
}
|
}
|
||||||
|
|
||||||
async function getBlog() {
|
|
||||||
return getFileWithDefaults(blogPath, defaultBlogPath);
|
|
||||||
}
|
|
||||||
|
|
||||||
module.exports = {
|
module.exports = {
|
||||||
outDir,
|
outDir,
|
||||||
getConfig,
|
getConfig
|
||||||
getBlog
|
|
||||||
};
|
};
|
259
views/blog.ejs
259
views/blog.ejs
|
@ -1,259 +0,0 @@
|
||||||
<!DOCTYPE html>
|
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8" />
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
||||||
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
|
|
||||||
<title>Gitfolio UI</title>
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.0/animate.min.css"
|
|
||||||
/>
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://use.fontawesome.com/releases/v5.7.1/css/all.css"
|
|
||||||
integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<link rel="stylesheet" type="text/css" href="./css/index.css" />
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/gh/zeva-ui/zeva/dist/css/zeva.min.css"
|
|
||||||
/>
|
|
||||||
</head>
|
|
||||||
<body class="body-light">
|
|
||||||
<header>
|
|
||||||
<b>gitfolio</b>
|
|
||||||
<a href="/blog" style="float: right">New Blog </a>
|
|
||||||
<a href="/update" style="float: right">Update</a>
|
|
||||||
<a href="/" style="float: right">Home</a>
|
|
||||||
</header>
|
|
||||||
<div id="top_image">
|
|
||||||
<i class="fas fa-camera" onclick="applyTopImage()"></i>
|
|
||||||
</div>
|
|
||||||
<input
|
|
||||||
type="file"
|
|
||||||
id="top_image_file"
|
|
||||||
style="display: none"
|
|
||||||
accept="image/*"
|
|
||||||
style="display: none"
|
|
||||||
/>
|
|
||||||
<table id="profile_blog">
|
|
||||||
<tbody>
|
|
||||||
<tr>
|
|
||||||
<td style="width:8vw;">
|
|
||||||
<div
|
|
||||||
id="profile_img_blog"
|
|
||||||
style="background:url('<%= profile[0].userimg%>') center center;"
|
|
||||||
></div>
|
|
||||||
</td>
|
|
||||||
<td style="width:52vw;">
|
|
||||||
<div id="username_blog">
|
|
||||||
<% if(profile[0].name)%>
|
|
||||||
<span><%= profile[0].name%></span>
|
|
||||||
<% %>
|
|
||||||
<br />@<%= profile[0].username%><b id="blog_time"></b>
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
<div id="blog-display">
|
|
||||||
<form
|
|
||||||
style="padding: 0px; width:100%;"
|
|
||||||
method="POST"
|
|
||||||
action="/createBlog"
|
|
||||||
id="form"
|
|
||||||
>
|
|
||||||
<textarea
|
|
||||||
id="blog_title"
|
|
||||||
placeholder="blog title here"
|
|
||||||
spellcheck="false"
|
|
||||||
rows="1"
|
|
||||||
onkeyup="addRow(event)"
|
|
||||||
name="title"
|
|
||||||
required
|
|
||||||
></textarea>
|
|
||||||
<br />
|
|
||||||
<textarea
|
|
||||||
id="blog_sub_title"
|
|
||||||
placeholder="blog sub title here"
|
|
||||||
spellcheck="false"
|
|
||||||
rows="1"
|
|
||||||
name="subtitle"
|
|
||||||
onkeyup="addRow(event)"
|
|
||||||
required
|
|
||||||
></textarea>
|
|
||||||
<div id="originalContent" style="display: none"></div>
|
|
||||||
<input type="hidden" name="top_image" id="top" />
|
|
||||||
<input type="hidden" name="content" id="content" />
|
|
||||||
<input type="hidden" name="images" id="images" />
|
|
||||||
<div id="blog"></div>
|
|
||||||
<div class="div_for_buttons">
|
|
||||||
<input
|
|
||||||
type="file"
|
|
||||||
name="file"
|
|
||||||
id="file"
|
|
||||||
style="display: none"
|
|
||||||
accept="image/*"
|
|
||||||
/>
|
|
||||||
<button
|
|
||||||
class="button h-weight-bold h-border-pill -size-small"
|
|
||||||
type="button"
|
|
||||||
onclick="clickFile()"
|
|
||||||
>
|
|
||||||
<i class="fas fa-plus"></i> Image
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
class="button h-weight-bold h-border-pill -size-small"
|
|
||||||
type="button"
|
|
||||||
onclick="addPara()"
|
|
||||||
>
|
|
||||||
<i class="fas fa-plus"></i> Paragraph
|
|
||||||
</button>
|
|
||||||
<h5>Tip : You can use html inside paragraphs</h5>
|
|
||||||
</div>
|
|
||||||
<button type="button" class="button" onclick="submitthisform()">
|
|
||||||
Create Blog
|
|
||||||
</button>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
<script
|
|
||||||
type="text/javascript"
|
|
||||||
src="https://cdn.jsdelivr.net/gh/zeva-ui/zeva/dist/js/index.min.js"
|
|
||||||
></script>
|
|
||||||
<script type="text/javascript">
|
|
||||||
var imgElement = document.querySelector("#file");
|
|
||||||
var topImageElement = document.querySelector("#top_image_file");
|
|
||||||
var img_number = 0;
|
|
||||||
var blog_para_number = 0;
|
|
||||||
var images = [];
|
|
||||||
|
|
||||||
function applyTopImage() {
|
|
||||||
topImageElement.value = "";
|
|
||||||
document.querySelector("#top").value = "";
|
|
||||||
document.querySelector("#top_image").style.background =
|
|
||||||
"linear-gradient(0deg, rgb(250, 250, 250), rgb(220, 220, 220))";
|
|
||||||
topImageElement.click();
|
|
||||||
}
|
|
||||||
|
|
||||||
topImageElement.addEventListener("change", e => {
|
|
||||||
var reader = new FileReader();
|
|
||||||
reader.readAsDataURL(e.target.files[0]);
|
|
||||||
reader.onload = data => {
|
|
||||||
var image = data.target.result;
|
|
||||||
document.querySelector(
|
|
||||||
"#top_image"
|
|
||||||
).style.background = `linear-gradient(0deg, rgba(250, 250, 250, 1), rgba(220, 220, 220, 0)), url('${image}') center center`;
|
|
||||||
document.querySelector("#top").value = image;
|
|
||||||
};
|
|
||||||
});
|
|
||||||
|
|
||||||
function addRow(e) {
|
|
||||||
e.preventDefault();
|
|
||||||
if (e.target.clientHeight < e.target.scrollHeight) {
|
|
||||||
e.target.rows += 1;
|
|
||||||
} else {
|
|
||||||
if (e.target.value == "") {
|
|
||||||
e.target.rows = 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function remove(e, element, blobData) {
|
|
||||||
var elem = document.getElementById(element);
|
|
||||||
var elem2 = document.getElementById(`${element}_original`);
|
|
||||||
elem.parentNode.removeChild(e.target);
|
|
||||||
elem.parentNode.removeChild(elem);
|
|
||||||
elem2.parentNode.removeChild(elem2);
|
|
||||||
imgElement.value = "";
|
|
||||||
if (element.split("_")[0] == "img") {
|
|
||||||
images.splice(images.indexOf(blobData), 1);
|
|
||||||
img_number--;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function addDataToOriginalPara(id) {
|
|
||||||
document.querySelector(
|
|
||||||
`#para_${id}_original`
|
|
||||||
).innerHTML = document.querySelector(`#para_${id}`).value;
|
|
||||||
}
|
|
||||||
|
|
||||||
function clickFile() {
|
|
||||||
imgElement.click();
|
|
||||||
}
|
|
||||||
|
|
||||||
imgElement.addEventListener("change", e => {
|
|
||||||
var img = document.createElement("img");
|
|
||||||
var imageblob = URL.createObjectURL(e.target.files[0]);
|
|
||||||
img.setAttribute(
|
|
||||||
"src",
|
|
||||||
`img_${img_number}.${e.target.files[0].type.split("/")[1]}`
|
|
||||||
);
|
|
||||||
img.setAttribute("alt", `blog image ${img_number}`);
|
|
||||||
img.setAttribute("id", `img_${img_number}_original`);
|
|
||||||
|
|
||||||
var img2 = document.createElement("img");
|
|
||||||
img2.setAttribute("src", imageblob);
|
|
||||||
img2.setAttribute("alt", `blog image ${img_number}`);
|
|
||||||
img2.setAttribute("id", `img_${img_number}`);
|
|
||||||
|
|
||||||
var remove = document.createElement("div");
|
|
||||||
remove.setAttribute("class", "remove");
|
|
||||||
remove.setAttribute(
|
|
||||||
"onclick",
|
|
||||||
`remove(event,'img_${img_number}', '${imageblob}')`
|
|
||||||
);
|
|
||||||
remove.innerHTML = '<i class="fas fa-times"></i> Remove';
|
|
||||||
|
|
||||||
document.querySelector("#originalContent").appendChild(img);
|
|
||||||
document.querySelector("#blog").appendChild(img2);
|
|
||||||
document.querySelector("#blog").appendChild(remove);
|
|
||||||
|
|
||||||
var reader = new FileReader();
|
|
||||||
reader.readAsDataURL(e.target.files[0]);
|
|
||||||
reader.onload = data => {
|
|
||||||
images.push(data.target.result);
|
|
||||||
};
|
|
||||||
|
|
||||||
imgElement.value = "";
|
|
||||||
img_number++;
|
|
||||||
});
|
|
||||||
|
|
||||||
function addPara() {
|
|
||||||
var para = document.createElement("textarea");
|
|
||||||
para.setAttribute("class", "para");
|
|
||||||
para.setAttribute("id", `para_${blog_para_number}`);
|
|
||||||
para.setAttribute("spellcheck", false);
|
|
||||||
para.setAttribute("rows", 1);
|
|
||||||
para.setAttribute(
|
|
||||||
"onkeyup",
|
|
||||||
`addRow(event), addDataToOriginalPara('${blog_para_number}')`
|
|
||||||
);
|
|
||||||
para.setAttribute("required", true);
|
|
||||||
para.setAttribute("placeholder", "What's on your Mind?");
|
|
||||||
var remove = document.createElement("div");
|
|
||||||
remove.setAttribute("class", "remove");
|
|
||||||
remove.setAttribute(
|
|
||||||
"onclick",
|
|
||||||
`remove(event,'para_${blog_para_number}', null)`
|
|
||||||
);
|
|
||||||
remove.innerHTML = '<i class="fas fa-times"></i> Remove';
|
|
||||||
var originalPara = document.createElement("p");
|
|
||||||
originalPara.setAttribute("id", `para_${blog_para_number}_original`);
|
|
||||||
document.querySelector("#blog").appendChild(para);
|
|
||||||
document.querySelector("#blog").appendChild(remove);
|
|
||||||
document.querySelector("#originalContent").appendChild(originalPara);
|
|
||||||
blog_para_number++;
|
|
||||||
}
|
|
||||||
|
|
||||||
function submitthisform() {
|
|
||||||
document.querySelector("#content").value = document.querySelector(
|
|
||||||
"#originalContent"
|
|
||||||
).innerHTML;
|
|
||||||
document.querySelector("#images").value = JSON.stringify(images);
|
|
||||||
document.querySelector("#form").submit();
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
|
@ -104,93 +104,6 @@ button:hover {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
#profile_blog {
|
|
||||||
width: 60vw;
|
|
||||||
margin: 0px 20vw;
|
|
||||||
margin-top: 42vh !important;
|
|
||||||
text-align: left;
|
|
||||||
z-index: 1;
|
|
||||||
transition: 0.4s ease-in-out;
|
|
||||||
z-index: 2;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
#profile_img_blog {
|
|
||||||
border-radius: 50%;
|
|
||||||
width: 90px;
|
|
||||||
height: 90px;
|
|
||||||
background-size: cover !important;
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
#username_blog {
|
|
||||||
font-size: 18px;
|
|
||||||
color: #000;
|
|
||||||
font-family: "Poppins", sans-serif;
|
|
||||||
font-weight: bold;
|
|
||||||
padding-left: 0px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#username_blog span {
|
|
||||||
font-size: 24px;
|
|
||||||
font-family: "Questrial", sans-serif !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#username_blog b {
|
|
||||||
font-size: 12px;
|
|
||||||
font-family: "Poppins", sans-serif;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
#blog-display {
|
|
||||||
width: 60vw;
|
|
||||||
margin: 3vh 20vw;
|
|
||||||
text-align: left;
|
|
||||||
z-index: 1;
|
|
||||||
transition: 0.4s ease-in-out;
|
|
||||||
z-index: 2;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
#blog_title {
|
|
||||||
font-size: 50px;
|
|
||||||
color: #000;
|
|
||||||
font-weight: bold;
|
|
||||||
font-family: "Questrial", sans-serif;
|
|
||||||
background: transparent;
|
|
||||||
border: 0px;
|
|
||||||
width: 100%;
|
|
||||||
resize: none;
|
|
||||||
height: auto;
|
|
||||||
overflow-y: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
#blog_sub_title {
|
|
||||||
font-size: 36px;
|
|
||||||
color: rgb(100, 100, 100);
|
|
||||||
font-weight: bold;
|
|
||||||
font-family: "Questrial", sans-serif;
|
|
||||||
background: transparent;
|
|
||||||
border: 0px;
|
|
||||||
width: 100%;
|
|
||||||
resize: none;
|
|
||||||
height: auto;
|
|
||||||
overflow-y: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
#blog_sub_title::placeholder {
|
|
||||||
color: rgb(100, 100, 100);
|
|
||||||
}
|
|
||||||
|
|
||||||
#blog-display h2 {
|
|
||||||
color: var(--blog-gray-color);
|
|
||||||
}
|
|
||||||
|
|
||||||
#blog-display {
|
|
||||||
padding: 1vh 0px;
|
|
||||||
font-family: "Questrial", sans-serif;
|
|
||||||
}
|
|
||||||
|
|
||||||
.div_for_buttons {
|
.div_for_buttons {
|
||||||
margin-top: 5vh;
|
margin-top: 5vh;
|
||||||
}
|
}
|
||||||
|
@ -215,17 +128,6 @@ button:hover {
|
||||||
color: #fff !important;
|
color: #fff !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
#blog {
|
|
||||||
margin-top: 2vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
#blog img {
|
|
||||||
width: 100%;
|
|
||||||
margin: 2vh 0px;
|
|
||||||
border-radius: 5px;
|
|
||||||
border: 1px solid rgb(0, 0, 0, 0.08);
|
|
||||||
}
|
|
||||||
|
|
||||||
.remove {
|
.remove {
|
||||||
margin-bottom: 2vh 0px;
|
margin-bottom: 2vh 0px;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
|
@ -243,34 +145,6 @@ button:hover {
|
||||||
color: rgb(255, 70, 70);
|
color: rgb(255, 70, 70);
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 800px) {
|
|
||||||
#blog-display {
|
|
||||||
width: 90vw;
|
|
||||||
margin: 0px 5vw;
|
|
||||||
text-align: left;
|
|
||||||
margin-top: 0vh;
|
|
||||||
z-index: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
#profile_blog {
|
|
||||||
width: 90vw;
|
|
||||||
margin: 0px 5vw;
|
|
||||||
}
|
|
||||||
|
|
||||||
#profile_img_blog {
|
|
||||||
width: 70px;
|
|
||||||
height: 70px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#blog img {
|
|
||||||
margin: 1vh 0px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#blog p {
|
|
||||||
margin: 2vh 0px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
::selection {
|
::selection {
|
||||||
color: #fff;
|
color: #fff;
|
||||||
background: #000;
|
background: #000;
|
||||||
|
|
|
@ -24,8 +24,6 @@
|
||||||
<body class="body-light">
|
<body class="body-light">
|
||||||
<header>
|
<header>
|
||||||
<b>gitfolio</b>
|
<b>gitfolio</b>
|
||||||
<a href="/blog"
|
|
||||||
style="float: right">New Blog </a>
|
|
||||||
<a href="/update"
|
<a href="/update"
|
||||||
style="float: right">Update</a>
|
style="float: right">Update</a>
|
||||||
<a href="/"
|
<a href="/"
|
||||||
|
|
Loading…
Reference in a new issue