nrandecker / particle Goto Github PK

View Code? Open in Web Editor NEW

1.0K 1.0K 1.1K 5.28 MB

A simple portfolio Jekyll theme:

Home Page: https://nrandecker.github.io/particle/

License: MIT License

HTML 6.75% JavaScript 6.04% SCSS 87.21%

jekyll jekyll-themes particles sass

particle's Introduction

Particle Jekyll Theme

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

The Theme features:

Gulp
SASS
Sweet Scroll
Particle.js
BrowserSync
Font Awesome and Devicon icons
Google Analytics
Info Customization

Basic Setup

Install Jekyll
Clone the particle theme: git clone https://github.com/nrandecker/particle.git
Edit _config.yml to personalize your site.

Site and User Settings

You have to fill some informations on _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: [email protected]
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
Particle Customization
- Edit the json data in particle function in app.js
- Refer to Particle.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
Install Jekyll: sudo gem install bundler jekyll
Install Yarn: npm install -g yarn
Install dependencies: yarn
Run: gulp

License

This theme is free and open source software, distributed under the The MIT License. So feel free to use this Jekyll theme anyway you want.

Credits

This theme was partially designed with the inspiration from these fine folks

particle's People

Contributors

Stargazers

Watchers

Forkers

gab92 peterhogg carroarmato0 holyjunhui alfredlauwyp ohahohah sonyccd lthiery15 gdayton drkvogel nenemati ratlifflj steveraden koreasoul huangpuyuan zkl-whu sunyueru richartl zmnet kingsleep ashkore costingalan mexmirror civicdata xiii dannysperry antoniomdk olers antico5 rajanmayekar szeinali omazhary smeierzubiesen reeditalo lazyfunctor antelio tonymcintosh ikamilov danilogr robts idea-apps mjk5 fitzsij hanschencoder amisrs sharkysharks clockwork189 jameshiggins jgnrodrigues brandonjabr michaelknigge claudiofantacci megraf percosys vogtn schnapster danielceinos ejsmith reiniru mkristiansen rodrigo-martins0101 iamchrissmith akompos willarevalo smadenia qwesaqwes gabriel-brito crazy54 mradinegoro andvon punkty lisethe-coder chintan-vora wouldadam twalsh92 marioviana pedrosantana19 whitelez rlawton2 seltonbrasil stonevalleystudio davidxu2017 lukepan srimply thawsitt cicoria khamaeel xcasteel dianaleeg dkim92 oyozoho cheapwebmonkey kgola larmflower zchelseal codeanddraw ric-bianchi neko2016 shivprakashyadav sydneychin

particle's Issues

Hi

Can you please give me any tip how can I change the colors please?

Best Regards,

Gem version

Dear @nrandecker ,

Is it available a gem-based version of this theme?

gulp build error

When I try and run gulp I am getting this error.

events.js:160
throw er; // Unhandled 'error' event
^

Error: spawn jekyll ENOENT
at exports._errnoException (util.js:1022:11)
at Process.ChildProcess._handle.onexit (internal/child_process.js:193:32)
at onErrorNT (internal/child_process.js:359:16)
at _combinedTickCallback (internal/process/next_tick.js:74:11)
at process._tickCallback (internal/process/next_tick.js:98:9)
at Module.runMain (module.js:606:11)
at run (bootstrap_node.js:394:7)
at startup (bootstrap_node.js:149:9)
at bootstrap_node.js:509:3

background_image for Particles

Hi,
I want to set a different background_image for the header particles instead of the given color. But trying to change the field "background" or adding a field "background-image: url('/assets/img/background.jpg')" in /src/styles/_header.scss does not work for me. Did I do something wrong?
Thank you!

My changes got reverted.

I downloaded all the dependencies and changed _config.yml file and _site/index.html file according to me, but when I run gulp, my changes get reverted to the original website does anybody know what is wrong?

Using gulpfile
Starting 'default'...
Starting 'js'...
Finished 'js' after 312 ms
Starting 'sass'...        
Finished 'sass' after 814 ms
Starting 'fonts'...
Finished 'fonts' after 279 ms
Starting 'browser-sync'...
Starting 'jekyll-build'...
Incremental build: disabled. Enable with --incremental
      Generating...
                    done in 1.407 seconds.
 Auto-regeneration: disabled. Use --watch to enable.
Finished 'jekyll-build' after 36 s
Starting '<anonymous>'...
Finished '<anonymous>' after 7.29 s
Finished 'browser-sync' after 43 s
Starting 'watch'...
[Browsersync] Access URLs:
 --------------------------------------
       Local: http://localhost:3000
    External: http://192.168.43.99:3000
 --------------------------------------
          UI: http://localhost:3001
 UI External: http://localhost:3001
 --------------------------------------
[Browsersync] Serving files from: _site

MyProfile

Theme listed on jekyll-themes.com

Your theme is listed on jekyllthemes.com

How to host the app from Heroku?

I tried to edit and host the app from Heroku but I get this error.
I have not much idea about how the app works, can somebody please help me?
I have already edited the app, I just need to host it.
Please suggest me any free hosting service, where this app can be hosted.
Here are the logs from heroku logs --tail

2020-08-08T07:21:40.808645+00:00 heroku[web.1]: Starting process with command `npm start`
2020-08-08T07:21:42.000000+00:00 app[api]: Build succeeded
2020-08-08T07:21:42.774735+00:00 app[web.1]: npm ERR! missing script: start
2020-08-08T07:21:42.781097+00:00 app[web.1]: 
2020-08-08T07:21:42.781390+00:00 app[web.1]: npm ERR! A complete log of this run can be found in:
2020-08-08T07:21:42.781528+00:00 app[web.1]: npm ERR!     /app/.npm/_logs/2020-08-08T07_21_42_776Z-debug.log
2020-08-08T07:21:42.839619+00:00 heroku[web.1]: Process exited with status 1
2020-08-08T07:21:42.872202+00:00 heroku[web.1]: State changed from starting to crashed
2020-08-08T07:21:42.877912+00:00 heroku[web.1]: State changed from crashed to starting
2020-08-08T07:21:47.935273+00:00 heroku[web.1]: Starting process with command `npm start`
2020-08-08T07:21:50.761153+00:00 app[web.1]: npm ERR! missing script: start
2020-08-08T07:21:50.766210+00:00 app[web.1]: 
2020-08-08T07:21:50.768292+00:00 app[web.1]: npm ERR! A complete log of this run can be found in:
2020-08-08T07:21:50.768411+00:00 app[web.1]: npm ERR!     /app/.npm/_logs/2020-08-08T07_21_50_762Z-debug.log
2020-08-08T07:21:50.836997+00:00 heroku[web.1]: Process exited with status 1
2020-08-08T07:21:50.883340+00:00 heroku[web.1]: State changed from starting to crashed
2020-08-08T07:22:56.601343+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=particle-portfolio.herokuapp.com request_id=8eb76f56-cae5-4693-9c8f-85dae30609ce fwd="157.47.135.93" dyno= connect= service= status=503 bytes= protocol=https
2020-08-08T07:22:58.984548+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=particle-portfolio.herokuapp.com request_id=e903bdcd-358e-4aee-8c0b-17625c4836d3 fwd="157.47.135.93" dyno= connect= service= status=503 bytes= protocol=https
2020-08-08T07:23:49.523899+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=particle-portfolio.herokuapp.com request_id=0657d084-1231-47d9-b830-5214ba43c6cf fwd="157.47.135.93" dyno= connect= service= status=503 bytes= protocol=https
2020-08-08T07:23:50.689551+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=particle-portfolio.herokuapp.com request_id=cb409d0d-caa1-467c-b2b1-329d286a2eaa fwd="157.47.135.93" dyno= connect= service= status=503 bytes= protocol=https
2020-08-08T07:43:53.989421+00:00 heroku[web.1]: State changed from crashed to starting
2020-08-08T07:44:08.192068+00:00 heroku[web.1]: Starting process with command `npm start`
2020-08-08T07:44:11.150054+00:00 heroku[web.1]: Process exited with status 1
2020-08-08T07:44:11.187605+00:00 heroku[web.1]: State changed from starting to crashed
2020-08-08T07:44:11.088405+00:00 app[web.1]: npm ERR! missing script: start
2020-08-08T07:44:11.097675+00:00 app[web.1]: 
2020-08-08T07:44:11.097984+00:00 app[web.1]: npm ERR! A complete log of this run can be found in:
2020-08-08T07:44:11.097985+00:00 app[web.1]: npm ERR!     /app/.npm/_logs/2020-08-08T07_44_11_090Z-debug.log

Devicon customization

I'm having trouble finding where the Devicon/Icon headers are located or referenced to customize them. Can you help?

CSS not rendering

When I try to use this theme the CSS does not load.

update instructions to customize particles

When trying to customize the code for the particles canvas, I noticed that the changes must go in assets/js/main.js instead of app.js.
btw, very nice theme! thank you.

Can't initialize locally

Hi there. When searching for a nice looking page template for github pages I found this particle theme. I like it very much. I wanted to set it up locally to play around with the webpage before publishing it. Since now I was not able to set it up. I am experienced with python and docker but not with web development. I tryed to run this in an ubuntu docker container on a windows machine but failed because of errors when running the suggested steps for local setup from the readme (installing nodejs, etc.).
Could you provide a more detailed description on the steps for a local setup (versions of nodejs etc.)? Maybe you have some suggestions to run this in docker?

My error log:
log.txt

Refactor Styles

Styles need to be refactored and made more modular.

Deploy site to github pages with actions

Would you provide me a sample script to deploy the app to github pages using github actions?

No response when custom the website

Hi,
I am using this template as my website, I change the info in _config.yml and push it to github, but nothing changed. What should I do ?

Your theme is listed in jekyllthemes.ru

Your theme has been listed on http://jekyllthemes.ru/

New dir

I try to add new dir "/blog", but I see particle lock this dir, and I cant use any Jekyll Themes when I use particle.
How to fix this?
https://github.com/gabbhack/gabbhack.github.io

Create a SCSS grid

Need a grid so we no longer have to rely on skel.css grid.

fa-chevron-down is pointing to projects section on mobile

When we open the site on mobile, the sliding-down arrow(fa-chevron-down) directs us to "projects" section instead of "about" section. Could this issue draw some attentions? Thanks!

npm errors with vulnerabilities

Hey there,
I'm using particle on a project and I'm having some issues with npm packages, when I run npm install I get the following output:

npm WARN [email protected] No repository field.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})

audited 14441 packages in 8.317s
found 7 vulnerabilities (1 low, 6 moderate)
  run `npm audit fix` to fix them, or `npm audit` for details

When I run npm audit I receive the output:

                                                                                
                       === npm audit security report ===                        
                                                                                
┌──────────────────────────────────────────────────────────────────────────────┐
│                                Manual Review                                 │
│            Some vulnerabilities require your attention to resolve            │
│                                                                              │
│         Visit https://go.npm.me/audit-guide for additional guidance          │
└──────────────────────────────────────────────────────────────────────────────┘
┌───────────────┬──────────────────────────────────────────────────────────────┐
│ Moderate      │ Memory Exposure                                              │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Package       │ tunnel-agent                                                 │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Patched in    │ >=0.6.0                                                      │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Dependency of │ gulp-imagemin                                                │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Path          │ gulp-imagemin > imagemin-gifsicle > gifsicle > bin-build >   │
│               │ download > caw > tunnel-agent                                │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ More info     │ https://nodesecurity.io/advisories/598                       │
└───────────────┴──────────────────────────────────────────────────────────────┘
┌───────────────┬──────────────────────────────────────────────────────────────┐
│ Moderate      │ Memory Exposure                                              │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Package       │ tunnel-agent                                                 │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Patched in    │ >=0.6.0                                                      │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Dependency of │ gulp-imagemin                                                │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Path          │ gulp-imagemin > imagemin-gifsicle > gifsicle > bin-wrapper > │
│               │ download > caw > tunnel-agent                                │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ More info     │ https://nodesecurity.io/advisories/598                       │
└───────────────┴──────────────────────────────────────────────────────────────┘
┌───────────────┬──────────────────────────────────────────────────────────────┐
│ Moderate      │ Memory Exposure                                              │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Package       │ tunnel-agent                                                 │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Patched in    │ >=0.6.0                                                      │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Dependency of │ gulp-imagemin                                                │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Path          │ gulp-imagemin > imagemin-jpegtran > jpegtran-bin > bin-build │
│               │ > download > caw > tunnel-agent                              │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ More info     │ https://nodesecurity.io/advisories/598                       │
└───────────────┴──────────────────────────────────────────────────────────────┘
┌───────────────┬──────────────────────────────────────────────────────────────┐
│ Moderate      │ Memory Exposure                                              │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Package       │ tunnel-agent                                                 │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Patched in    │ >=0.6.0                                                      │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Dependency of │ gulp-imagemin                                                │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Path          │ gulp-imagemin > imagemin-jpegtran > jpegtran-bin >           │
│               │ bin-wrapper > download > caw > tunnel-agent                  │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ More info     │ https://nodesecurity.io/advisories/598                       │
└───────────────┴──────────────────────────────────────────────────────────────┘
┌───────────────┬──────────────────────────────────────────────────────────────┐
│ Moderate      │ Memory Exposure                                              │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Package       │ tunnel-agent                                                 │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Patched in    │ >=0.6.0                                                      │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Dependency of │ gulp-imagemin                                                │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Path          │ gulp-imagemin > imagemin-optipng > optipng-bin > bin-build > │
│               │ download > caw > tunnel-agent                                │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ More info     │ https://nodesecurity.io/advisories/598                       │
└───────────────┴──────────────────────────────────────────────────────────────┘
┌───────────────┬──────────────────────────────────────────────────────────────┐
│ Moderate      │ Memory Exposure                                              │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Package       │ tunnel-agent                                                 │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Patched in    │ >=0.6.0                                                      │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Dependency of │ gulp-imagemin                                                │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Path          │ gulp-imagemin > imagemin-optipng > optipng-bin > bin-wrapper │
│               │ > download > caw > tunnel-agent                              │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ More info     │ https://nodesecurity.io/advisories/598                       │
└───────────────┴──────────────────────────────────────────────────────────────┘
┌───────────────┬──────────────────────────────────────────────────────────────┐
│ Low           │ Regular Expression Denial of Service                         │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Package       │ debug                                                        │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Patched in    │ >= 2.6.9 < 3.0.0 || >= 3.1.0                                 │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Dependency of │ browser-sync                                                 │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Path          │ browser-sync > localtunnel > debug                           │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ More info     │ https://nodesecurity.io/advisories/534                       │
└───────────────┴──────────────────────────────────────────────────────────────┘
found 7 vulnerabilities (1 low, 6 moderate) in 14441 scanned packages
  7 vulnerabilities require manual review. See the full report for details.

I've already tried to change some modules versions but it always get back at this error, also tried manually editing the version on the package-lock.json and running npm install but isn't working as well.

Any idea how can we workaround this? I'm needing to run gulp to compile the .sccs files to complete the project, but with this issues gulp don't install.

My environment:

uname -a
Linux manjaro-ws 4.14.71-1-MANJARO #1 SMP PREEMPT Thu Sep 20 05:29:20 UTC 2018 x86_64 GNU/Linux
lsb_release -a
LSB Version: n/a
Distributor ID: ManjaroLinux
Description: Manjaro Linux
Release: 17.1.12
Codename: Hakoila
npm --version
6.4.1

Recommend Projects

React

A declarative, efficient, and flexible JavaScript library for building user interfaces.
Vue.js

🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
Typescript

TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
TensorFlow

An Open Source Machine Learning Framework for Everyone
Django

The Web framework for perfectionists with deadlines.
Laravel

A PHP framework for web artisans
D3

Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

javascript

JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
web

Some thing interesting about web. New door for the world.
server

A server is a program made to process requests and deliver data to clients.
Machine learning

Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Visualization

Some thing interesting about visualization, use data art
Game

Some thing interesting about game, make everyone happy.

Recommend Org

Facebook

We are working to build community through open source technology. NB: members must have two-factor auth.
Microsoft

Open source projects and samples from Microsoft.
Google

Google ❤️ Open Source for everyone.
Alibaba

Alibaba Open Source for everyone
D3

Data-Driven Documents codes.
Tencent

China tencent open source team.