Code Cards 🃏 is a revolutionary studying tool, letting anyone learn anything.
Features:
Previews:
Secure Login System
Huge Flashcard Database
Flashcards
Practice Quizzes
Importing from Quizlet
Start studying with Code Cards 🃏 today!
If your ubuntu version is old, upgrading ruby
wget http://ftp.ruby-lang.org/pub/ruby/2.7/ruby-2.7.1.tar.gz
tar -xzvf ruby-2.7.1.tar.gz
cd ruby-2.7.1/
./configure
make
sudo make install
Installation
apt install ruby-bundler
bundle install
Also update ruby initially to make sure there is compatibility, then install the bundler to be able to use the gemfile and install packages.
Usage
_layouts/default.html
from repo used to support that theme. Observe comment at top of _layouts/default.html ...<!--
_layouts/default.html
customization to original Midnight theme
found through GitHub Pages Themes
-->
Gemfile
,bundle install
. As an addition add .gitignore
to avoid seeing build files in commit. After pre-requisites run this command to obtain prompt for web server ...bundle exec jekyll serve -H 0.0.0.0 -P 4001 # -H and -P are optional
Preview Site (Option B) - GitHub Pages Ruby Gem has additional information on making a local server. Ruby requirements are the same: Gemfile
,bundle install
. This README looks like basis of FastPages make server
as it uses Docker and shows how to setup a Makefile
.
Customizing style (CSS). This project uses /assets/css/style.scss
as the location to customize your CSS. To avoid warnings in VSCode make sure you install SCSS IntelliSense
plugin. To understand default style, make sure you Preview Site and refer to build generated _site/assets/css/style.css
(this is worth 1000 lectures). For the reunion site gallery.md
uses custom style from assets/css/style.css
to support 3 images per row. Observe file and position of import and custom CSS, order is important as clarified in Midnight Theme readme. ...
---
---
@import "{{ site.theme }}";
/* "row style" is flexible size and aligns pictures in center */
.row {
align-items: center;
display: flex;
}
/* "column style" is one-third of the width with padding */
.column {
flex: 33.33%;
padding: 5px;
}