Skip to content

Commit

Permalink
instructions update
Browse files Browse the repository at this point in the history
  • Loading branch information
svavs committed Aug 10, 2020
1 parent f99ee08 commit ebecb9c
Show file tree
Hide file tree
Showing 21 changed files with 366 additions and 90 deletions.
1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
public/*
36 changes: 13 additions & 23 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
# Particle Jekyll Theme
# Port for Zola of the [particle](https://github.com/nrandecker/particle) Jekyll theme

![](./particle.jpg)
![](./screenshot.jpg)

This is a simple and minimalist template for Jekyll designed for developers that want to show of their portfolio.
This is a simple and minimalist template for Zola designed for developers that want to show of their portfolio.

The Theme features:

Expand All @@ -17,52 +17,41 @@ The Theme features:

## Basic Setup

1. [Install Jekyll](http://jekyllrb.com)
2. Clone the particle theme: `git clone https://github.com/nrandecker/particle.git`
3. Edit `_config.yml` to personalize your site.
1. [Install Zola](https://getzola.com)
2. Clone the particle theme: `git clone https://github.com/svavs/particle-zola.git`
3. Edit `config.yml` to personalize your site.

## Site and User Settings

You have to fill some informations on `_config.yml` to customize your site.
You have to fill some informations on the `[extra]` section of the `config.yml` to customize your site.

```
# Site settings
description: A blog about lorem ipsum dolor sit amet
baseurl: "" # the subpath of your site, e.g. /blog/
url: "http://localhost:3000" # the base hostname & protocol for your site
# User settings
username: Lorem Ipsum
user_description: Anon Developer at Lorem Ipsum Dolor
user_title: Anon Developer
email: anon@anon.com
email: my@email.com
twitter_username: lorem_ipsum
github_username: lorem_ipsum
gplus_username: lorem_ipsum
```

**Don't forget to change your url before you deploy your site!**

## Color and Particle Customization
- Color Customization
- Edit the sass variables
- Edit the sass variables (`_vars.scss`)
- Particle Customization
- Edit the json data in particle function in app.js
- Refer to [Particle.js](https://github.com/VincentGarreau/particles.js/) for help

## Running the blog in local

In order to compile the assets and run Jekyll on local you need to follow those steps:

- Install [NodeJS](https://nodejs.org/)
- Install [Jekyll](https://jekyllrb.com): `sudo gem install bundler jekyll`
- Install [Yarn](https://yarnpkg.com/): `npm install -g yarn`
- Install dependencies: `yarn`
- Run: `gulp`
To customize the project lists and the about sections, you need to edit the `templates/content.html` template file.
In future versions will be provided a simpler way.

## Questions

Having any issues file a [GitHub Issue](https://github.com/nrandecker/particle/issues/new).
Having any issues file a [GitHub Issue](https://github.com/svavs/particle-zola/issues/new).

## License

Expand All @@ -71,5 +60,6 @@ This theme is free and open source software, distributed under the The MIT Licen
## Credits

This theme was partially designed with the inspiration from these fine folks
- [Nathan Randecker](https://github.com/nrandecker/particle)
- [Willian Justen](https://github.com/willianjusten/will-jekyll-template)
- [Vincent Garreau](https://github.com/VincentGarreau/particles.js/)
4 changes: 4 additions & 0 deletions public/404.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
<!doctype html>
<title>404 Not Found</title>
<h1>404 Not Found</h1>
<script src="/livereload.js?port=1024&amp;mindelay=10"></script>
Binary file added public/fonts/devicon.ttf
Binary file not shown.
Binary file added public/fonts/devicon.woff
Binary file not shown.
Binary file added public/fonts/fontawesome-webfont.ttf
Binary file not shown.
Binary file added public/fonts/fontawesome-webfont.woff
Binary file not shown.
Binary file added public/fonts/fontawesome-webfont.woff2
Binary file not shown.
Binary file added public/img/.DS_Store
Binary file not shown.
Binary file added public/img/mountains.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/img/skate.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
141 changes: 141 additions & 0 deletions public/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,141 @@
<!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">

<title>A blog about lorem ipsum dolor sit amet</title>
<meta name="description" content="A blog about lorem ipsum dolor sit amet">

<link rel="stylesheet" href="http://127.0.0.1:1111/main.css">
</head>


<body>


<div id="particles-js">
<div class="header">
<h1>
<span class="site-title">Anon Developer</span>
<span class="site-description">Software Developer</span>
</h1>
<div class="header-icons">
<a aria-label="Send email" href="#"><i class="icon fa fa-envelope"></i></a>
<a aria-label="My Twitter" target="_blank" href="#"><i class="icon fa fa-twitter" aria-hidden="true"></i></a>
<a aria-label="My Google Plus" target="_blank" href="#"><i class="icon fa fa-google-plus" aria-hidden="true"></i></a>
<a aria-label="My Github" target="_blank" href="#"><i class="icon fa fa-github-alt" aria-hidden="true"></i></a>
</div>
<div class="header-links">
<a class="link" href="#about" data-scroll>About Me</a>
<a class="link" href="#projects" data-scroll>Projects</a>
</div>
</div>
<a class="down" href="#about" data-scroll><i class="icon fa fa-chevron-down" aria-hidden="true"></i></a>
</div>


<section id="about">

<div class="user-details">
<h1> My Expertise </h1>
<p> Bicycle rights irony actually neutra typewriter lyft. Man bun taxidermy put a bird on it, umami yr ramps pop-up ugh bushwick chia lo-fi. Occupy bitters pour-over snackwave you probably haven&#x27;t heard of them small batch. Cornhole mustache man bun letterpress echo park VHS. </p>
</div>
<div class="user">
<div class="tech">
<h2>Design</h2>
<i class="devicon-html5-plain-wordmark"></i>
<i class="devicon-bootstrap-plain-wordmark colored"></i>
<i class="devicon-sass-original colored"></i>
<p>Mumblecore hexagon kombucha, pitchfork four loko raclette intelligentsia master cleanse.
Vinyl XOXO lumbersexual</p>
</div>
<div class="tech">
<h2>Code</h2>
<i class="devicon-javascript-plain colored"></i>
<i class="devicon-react-original-wordmark colored"></i>
<i class="devicon-nodejs-plain-wordmark"></i>
<p>Mumblecore hexagon kombucha, pitchfork four loko raclette intelligentsia master cleanse.
Vinyl XOXO lumbersexual</p>
</div>
<div class="tech">
<h2>Tools</h2>
<i class="devicon-git-plain"></i>
<i class="devicon-gulp-plain colored"></i>
<i class="devicon-atom-original-wordmark"></i>
<p>Mumblecore hexagon kombucha, pitchfork four loko raclette intelligentsia master cleanse.
Vinyl XOXO lumbersexual</p>
</div>
</div>

</section>

<section id="projects">

<div class="user-details">
<h1> Featured Projects </h1>
</div>
<div class="user-projects">
<div class="images-right">
<img alt="mountains" src="http://127.0.0.1:1111/img/mountains.jpg" />
</div>
<div class="contents">
<h3> Project Title </h3>
<ul>
<li> Featured Skills</li>
</ul>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
<a class="project-link" href="#">Check it out</a>
</div>
</div>
<div class="user-projects">
<div class="images-left">
<img alt="mountains" src="http://127.0.0.1:1111/img/skate.jpg" />
</div>
<div class="contents-right">
<h3> Project Title </h3>
<ul>
<li> Featured Skills</li>
</ul>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
<a class="project-link" href="#">Check it out</a>
</div>
</div>

</section>


<p></p>




<footer class="footer">
<p>&copy; Anon Developer</p>
<p>Build with Jekyll and <span class="love"></span> by <a href="https://github.com/nrandecker">Nathan Randecker</a></p>
</footer>
<script src="//cdn.jsdelivr.net/particles.js/2.0.0/particles.min.js"></script>
<script src="http://127.0.0.1:1111/js/sweet-scroll.min.js"></script>
<script src="http://127.0.0.1:1111/js/main.js"></script>


<!-- Google Analytics -->

<script>
var dnt = navigator.doNotTrack || window.doNotTrack || navigator.msDoNotTrack;
if (dnt != "1" && dnt != "yes") {
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', '', 'auto');
ga('send', 'pageview');
}
</script>



<script src="/livereload.js?port=1024&amp;mindelay=10"></script></body>
118 changes: 118 additions & 0 deletions public/js/app.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,118 @@
/* sweetScroll load */
document.addEventListener("DOMContentLoaded", function () {
new SweetScroll({/* some options */});

/* particlesJS.load(@dom-id, @path-json, @callback (optional)); */
particlesJS('particles-js', {
"particles": {
"number": {
"value": 30,
"density": {
"enable": true,
"value_area": 800
}
},
"color": {
"value": "#ffffff"
},
"shape": {
"type": "polygon",
"stroke": {
"width": 0,
"color": "#000000"
},
"polygon": {
"nb_sides": 5
},
"image": {
"src": "img/github.svg",
"width": 100,
"height": 100
}
},
"opacity": {
"value": 0.5,
"random": false,
"anim": {
"enable": false,
"speed": 1,
"opacity_min": 0.1,
"sync": false
}
},
"size": {
"value": 3,
"random": true,
"anim": {
"enable": false,
"speed": 19.18081918081918,
"size_min": 0.1,
"sync": false
}
},
"line_linked": {
"enable": true,
"distance": 150,
"color": "#ffffff",
"opacity": 0.4,
"width": 1
},
"move": {
"enable": true,
"speed": 4,
"direction": "none",
"random": true,
"straight": false,
"out_mode": "out",
"bounce": false,
"attract": {
"enable": false,
"rotateX": 600,
"rotateY": 1200
}
},
nb: 80
},
"interactivity": {
"detect_on": "canvas",
"events": {
"onhover": {
"enable": false,
"mode": "grab"
},
"onclick": {
"enable": true,
"mode": "push"
},
"resize": true
},
"modes": {
"grab": {
"distance": 400,
"line_linked": {
"opacity": 1
}
},
"bubble": {
"distance": 400,
"size": 40,
"duration": 2,
"opacity": 8,
"speed": 3
},
"repulse": {
"distance": 200,
"duration": 0.4
},
"push": {
"particles_nb": 4
},
"remove": {
"particles_nb": 2
}
}
},
"retina_detect": true
});

}, false);
1 change: 1 addition & 0 deletions public/js/main.js

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

8 changes: 8 additions & 0 deletions public/js/sweet-scroll.min.js

Large diffs are not rendered by default.

4 changes: 4 additions & 0 deletions public/main.css

Large diffs are not rendered by default.

2 changes: 2 additions & 0 deletions public/robots.txt
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
User-agent: *
Sitemap: http://127.0.0.1:1111/sitemap.xml
6 changes: 6 additions & 0 deletions public/sitemap.xml
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
<url>
<loc>http://127.0.0.1:1111/</loc>
</url>
</urlset>
Loading

0 comments on commit ebecb9c

Please sign in to comment.