{"id":15021028,"url":"https://github.com/andreondra/jekyll-theme-simplex","last_synced_at":"2025-04-06T01:07:24.872Z","repository":{"id":37740733,"uuid":"252286954","full_name":"andreondra/jekyll-theme-simplex","owner":"andreondra","description":"An original theme for golasblog project","archived":false,"fork":false,"pushed_at":"2023-03-07T09:29:01.000Z","size":7438,"stargazers_count":77,"open_issues_count":1,"forks_count":80,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-03-30T00:07:17.567Z","etag":null,"topics":["jekyll","jekyll-blog","jekyll-template","jekyll-theme","theme"],"latest_commit_sha":null,"homepage":"","language":"SCSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/andreondra.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.txt","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null}},"created_at":"2020-04-01T21:07:02.000Z","updated_at":"2025-03-02T14:56:14.000Z","dependencies_parsed_at":"2023-10-20T17:09:41.208Z","dependency_job_id":"d99e8d45-b240-4857-8898-b264b20757a5","html_url":"https://github.com/andreondra/jekyll-theme-simplex","commit_stats":{"total_commits":56,"total_committers":3,"mean_commits":"18.666666666666668","dds":0.0357142857142857,"last_synced_commit":"25b620ad4b1ecf649307b12669e164070d3fc7da"},"previous_names":[],"tags_count":2,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/andreondra%2Fjekyll-theme-simplex","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/andreondra%2Fjekyll-theme-simplex/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/andreondra%2Fjekyll-theme-simplex/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/andreondra%2Fjekyll-theme-simplex/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/andreondra","download_url":"https://codeload.github.com/andreondra/jekyll-theme-simplex/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247419860,"owners_count":20936012,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["jekyll","jekyll-blog","jekyll-template","jekyll-theme","theme"],"created_at":"2024-09-24T19:56:02.833Z","updated_at":"2025-04-06T01:07:24.851Z","avatar_url":"https://github.com/andreondra.png","language":"SCSS","funding_links":[],"categories":[],"sub_categories":[],"readme":"[![Blog Demo](https://img.shields.io/badge/demo-golasblog-blue?style=flat-square)](https://golas.blog/)\n[![Generic Demo](https://img.shields.io/badge/demo-generic-green?style=flat-square)](https://simplex-demo.golas.systems/)\n\nThe source of the generic demo is available here: https://github.com/andreondra/simplex-demo\n\n# \u003cimg src=\"assets/img/icons/simplex_logo.svg\" alt=\"Simplex\" height=\"50\"/\u003e\n\nA *simple* yet neat blogging theme. Developed for the [golas blog](https://golas.blog/) project.\n\n\n## 👓 Preview\n![Preview](preview.gif)\n\n## 💎 Features\n### Responsive\n![Responsivity preview](previewResponsive.gif)\n\n### Dark mode\n![Dark mode preview](previewDark.gif)\n\n### Buttons\n![Buttons preview](previewButtons.png)\n\n### Lity Lightbox \nSupports images, videos, iFrames and more. See below for syntax.\n\n### Open Graph tags\n\n## ℹ Installation\n\nAdd this line to your Jekyll site's `Gemfile`:\n\n```ruby\ngem \"jekyll-theme-simplex\"\n```\n\nAnd add this line to your Jekyll site's `_config.yml`:\n\n```yaml\ntheme: jekyll-theme-simplex\n```\n\nAnd then execute:\n\n    $ bundle\n\nOr install it yourself as:\n\n    $ gem install jekyll-theme-simplex\n\n## ✔ Usage\n\n### ⚙ Setting up the template\nAdd following to the `_config.yml`:\n```yaml\nlogo_img: /assets/img/icons/golasblog_logo.svg #Absolute path to the logo. If not specified, the title will be displayed instead.\ncopyright: © Golasowski 2020 #Your copyright.\n\ncollections:\n    category:\n        output: true\n    authors:\n        output: false\n\ndefaults:\n  -\n    scope:\n      path: \"\"\n      type: category\n    values:\n      layout: \"category\"\n```\n\n### ✨ Defining categories\nCreate a `_category` folder in the root directory of the blog. Create a `.md` file for every category with the contents:\n```\n---\ncategory: [design] #Category ID.\nhue: var(--c-themeHueOrange) #Category hue. See note [1].\ntitle: Design #Category title.\ndescription: Lorem ipsum dolor sit amet.\n---\n```\n\n### 🤵 Defining authors\nCreate a `_authors` folder in the root directory. Create a `.md` file for every author with the contents:\n```\n---\nnick: golas #Author's nick.\nfull_name: Andrew Golasowski #Author's full name.\nphoto_dir: assets/img/authors/golas.png #Path to the author's pic.\n---\n```\n\n### 📰 Defining the menu\nCreate a `_data` folder in the root directory. In the folder, create a `nav.yaml` file. Here's an example:\n```yaml\n- title: Programming #Menu item title.\n  url: category/programming.html #Menu item url.\n  icon: assets/img/icons/programming.svg #Menu item icon.\n  hue: \"var(--c-themeHueRed)\" #Menu item hue - see note [1].\n  subnav: #Subnav. See note [2].\n      - title: C++ #Submenu item title.\n        url: category/cpp.html #Submenu item url.\n        hue: \"var(--c-themeHueOrange)\" #Submenu item hue.\n        subnav: #Another subnav\n            - title: Libraries\n              url: libs.html\n              hue: \"var(--c-themeHueBlue)\"\n- title: Design\n  url: category/design.html\n  icon: assets/img/icons/design.svg\n  hue: \"var(--c-themeHueRed)\"\n```\n#### Pro tip:\nUse color icons with the same hue as the menu items. Icons will be black and on hover the color will be shown.\n\n### ✒ Creating posts\nPosts are created in the `_posts` directory. Following front matter attributes are supported:\n```\n---\nlayout: post #Do not change.\ncategory: [programming, testing] #One, more categories or no at all.\ntitle: \"Lorem ipsum\" #Article title.\nauthor: andy #Author's nick.\nnextPart: _posts/2021-01-30-example.md #Next part.\nprevPart: _posts/2021-01-30-example.md #Previous part.\nog_image: assets/example.png #Open Graph preview image.\nog_description: \"Example description.\" #Open Graph description.\nfb_app_id: example\n---\nYour markdown content here.\n```\n\n### ⚡ Syntax highlighting\nThe theme uses Pygments CSS created by [@richleland](https://github.com/richleland). If you want to modify the highlighting styles, just download different CSS or create your own - see [Jekyll docs](https://jekyllrb.com/docs/liquid/tags/#stylesheets-for-syntax-highlighting).\n\nNote - `@media` is used to manage different styles for light and dark web browser mode. See `_variables.scss` file for details.\n\n### 📷 Inserting pictures\nClassic Markdown syntax is supported. However, to be able to use the lightbox feature, you have to use HTML syntax. Minimal example:\n```html\n\u003ca href=\"/assets/example.jpg\" data-lity\u003e\n  \u003cimg src=\"/assets/example_thumbnail.jpg\"/\u003e\n\u003c/a\u003e\n```\n\nTo provide image description use this syntax:\n```html\n\u003cdiv class=\"sx-picture\"\u003e\n  \u003ca href=\"/assets/example.jpg\" data-lity\u003e\n    \u003cimg src=\"/assets/example_thumbnail.jpg\"/\u003e\n  \u003c/a\u003e\n  \u003cspan class=\"sx-subtitle\"\u003eMy picture description.\u003c/span\u003e\n\u003c/div\u003e\n```\n\n**Do not forget the `data-lity` attribute.**\n\n#### ↔ Centering\nTo center pictures, put the code inside a `div` with `sx-center` class like this:\n```html\n\u003cdiv markdown=1 class=\"sx-center\"\u003e\n  ![My picture](/assets/example.jpg)\n\u003c/div\u003e\n```\n\n### 🔘 Buttons\nButtons can be inserted with the following syntax. Just replace `theme` with `red`, `green`, `blue`, `orange`, `purple` or `brown`, specify the target link in `href` attribute and the icon in `src` attribute.\n```html\n\u003cdiv class='sx-button'\u003e\n  \u003ca href='https://your.link.here.example.com/' class='sx-button__content theme'\u003e\n    \u003cimg src='/assets/img/icons/example_icon.svg'/\u003e#{text}\n  \u003c/a\u003e\n\u003c/div\u003e\n```\n\nMarkdown attribute can be omitted if you don't use markdown inside the block (e.g. by using the lightbox syntax).\n\n### ℹ Notes\n[1] Hue can be either one of the predefined colors or any of the CSS `color` attribute supported values (hex, rgb...).\n\n[2] Submenus are generated recursively, so any menu (and submenu) can have its own submenu.\n\n#### Predefined colors\nYou can use following predefined colors:\n```scss\n--c-themePrimaryLight: #EFEFEF;\n--c-themePrimaryDark:  #101010;\n--c-themeSecondaryLight: #DADADA;\n--c-themeSecondaryDark: #252525;\n--c-themeTerniaryLight: #AEAEAE;\n--c-themeTerniaryDark: #515151;\n--c-themeQuaternaryLight: #919191;\n--c-themeQuaternaryDark: #888888;\n\n--c-themeHueRed: #C02717;\n--c-themeHueGreen: #8EA604;\n--c-themeHueBlue: #2E86AB;\n--c-themeHueOrange: #E59500;\n--c-themeHuePurple: #9F00CE;\n--c-themeHueBrown: #230007;\n```\nThese colors are CSS variables, usage: `var(--var-name)`\n\n## Add-ons\nAdd-ons are distributed as Jekyll plugins. Just download any desired `.rb` file from the repository `_plugin` folder and put it in your `_plugin` folder.\n\n### Buttons (button.rb)\nAdds a tag to simplify insertion of buttons:\n```\n{% button red|https://www.example.com/|/assets/img/icons/cog.svg %}\nDownload binary\n{% endbutton %}\n```\n\n## 🤝 Contributing\n \nBug reports and pull requests are welcome on [GitHub](https://github.com/andreondra/jekyll-theme-simplex).\n\n## ⚙ Development\n\nTo set up your environment to develop this theme, run `bundle install`.\n\nYour theme is setup just like a normal Jekyll site! To test your theme, run `bundle exec jekyll serve` and open your browser at `http://localhost:4000`. This starts a Jekyll server using your theme. Add pages, documents, data, etc. like normal to test your theme's contents. As you make modifications to your theme and to your content, your site will regenerate and you should see the changes in the browser after a refresh, just like normal.\nIf you recieve an error stating, `\"require': cannot load such file -- webrick (LoadError)'` Simply run `bundle add webrick` and this will install the dependencies for running the Jekyll and then you may repeat Step 2!\n\nWhen your theme is released, only the files in `_layouts`, `_includes`, `_sass` and `assets` tracked with Git will be bundled.\nTo add a custom directory to your theme-gem, please edit the regexp in `jekyll-theme-simplex.gemspec` accordingly.\n\n## Credits\nIncludes icons by [uxwing](https://uxwing.com/).\n\nThe lightbox feature is provided by [Lity](https://github.com/jsor/lity) licensed under the [MIT License](https://opensource.org/licenses/MIT).\n\nUses [jQuery](https://github.com/jquery/jquery) JavaScript plugin licensed under the [MIT License](https://opensource.org/licenses/MIT).\n\n## ⚖ License\n© Ondrej Golasowski. The theme is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fandreondra%2Fjekyll-theme-simplex","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fandreondra%2Fjekyll-theme-simplex","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fandreondra%2Fjekyll-theme-simplex/lists"}