chishgg-slate 0.1.0 → 0.2.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: f021edbeddad3af864dbaa6752d414f182a05f737f25420dc77ede8a7ce6727e
-  data.tar.gz: 490686edd00cd464ddccaa5f185f9b1da9c09e6af5faeb195775594bfc79261f
+  metadata.gz: 98302780ab081e0d771a925d37c74d8db9fc45c4d326e6e74d07f4ff0eddd93f
+  data.tar.gz: 82255c0dd2c61fa2981877ba70917eddd6eaa044202f927b83300b2046211f18
 SHA512:
-  metadata.gz: 99f4ce27d667ada4c59df7cdbf450e606287d4a19ca8fc94803675789555a2023067710b5ac9eee411efd9f58400d2218541215b5d2765484bc424880f1de74f
-  data.tar.gz: 20118a3a993fd7bd396cfa9786be49929102506442419acf8a8710c10677636aabceec0e812824e6f4ac93c03d482794785dd5c75bc6c9edb12f3d9e16a2e2bc
+  metadata.gz: a99c782523c6e96294862b30e0c7b3cb0dcc33a82121c33b37719508d8bdedd07a3155ea45989d9ea811f8a0bc44e020485c97f034fbf00751741dc301069170
+  data.tar.gz: be567c7a466179501408d8db993599849d772ec297ba7c33fb7d6233cefcff3e72c8d90983759012c65efdca3d04029877c0cd6f35fff094f22996c7c994158b

data/README.md

@@ -2,25 +2,25 @@
 
 A Markdown to HTML generator written in Ruby while participating in DUMMIES by Hack Club.
 
-## Installation
+README generated by Ruby Bundler!
 
-TODO: Replace `UPDATE_WITH_YOUR_GEM_NAME_IMMEDIATELY_AFTER_RELEASE_TO_RUBYGEMS_ORG` with your gem name right after releasing it to RubyGems.org. Please do not do it earlier due to security reasons. Alternatively, replace this section with instructions to install your gem from git if you don't plan to release to RubyGems.org.
+## Installation
 
 Install the gem and add to the application's Gemfile by executing:
 
 ```bash
-bundle add UPDATE_WITH_YOUR_GEM_NAME_IMMEDIATELY_AFTER_RELEASE_TO_RUBYGEMS_ORG
+bundle add chishgg-slate
 ```
 
 If bundler is not being used to manage dependencies, install the gem by executing:
 
 ```bash
-gem install UPDATE_WITH_YOUR_GEM_NAME_IMMEDIATELY_AFTER_RELEASE_TO_RUBYGEMS_ORG
+gem install chishgg-slate
 ```
 
 ## Usage
 
-TODO: Write usage instructions here
+Check out slate --help for usage guide!
 
 ## Development
 

data/bin/console

@@ -0,0 +1,11 @@
+#!/usr/bin/env ruby
+# frozen_string_literal: true
+
+require "bundler/setup"
+require "slate"
+
+# You can add fixtures and/or initialization code here to make experimenting
+# with your gem easier. You can also use a different console, if you like.
+
+require "irb"
+IRB.start(__FILE__)

data/bin/setup

@@ -0,0 +1,8 @@
+#!/usr/bin/env bash
+set -euo pipefail
+IFS=$'\n\t'
+set -vx
+
+bundle install
+
+# Do any other automated setup that you need to do here

data/bin/slate

@@ -0,0 +1,45 @@
+#!/usr/bin/env ruby
+
+require_relative '../lib/slate'
+require 'kramdown'
+require 'fileutils'
+
+# filename = File.basename(args, ".*")
+
+# Ruby uses begin-rescue keywords instead of try-catch LMAO.... WHYYY
+begin
+  Slate::CLI.run(ARGV)
+  # if File.file?(args)
+  #   puts "Argument seems to be a single file, Parsing it"
+  #   content = File.read(args)
+  #   filename = File.basename(args, ".*")
+  #   dir = File.dirname(args)
+
+  #   style_path = File.join(__dir__, '..', 'style.css')
+  #   FileUtils.cp(style_path, dir)
+
+  #   final_html = Slate.convert(content, filename)
+  #   File.write("#{filename}.html", final_html)
+  #   puts "Saved #{filename}.html"
+
+  # elsif File.directory?(args)
+  #   puts "Found a directory, gotta check all .md files!"
+
+  #   style_path = File.join(__dir__, '..', 'style.css')
+  #   FileUtils.cp(style_path, args)
+
+  #   files = Dir.glob(File.join(args, "*.md"))
+  #   files.each do |file|
+  #     content = File.read(file)
+  #     filename = File.basename(file, ".*")
+  #     final_html = Slate.convert(content, file)
+  #     File.write("#{filename}.html", final_html)
+  #     puts "Saved #{filename}.html"
+  #   end
+
+  # else
+  #   puts "Error: #{args} is neither a file nor a directory"
+  # end
+rescue StandardError => e
+  puts "Unexpected error occured: #{e.message}"
+end

data/bin/text.md

@@ -0,0 +1,5 @@
+# Slate
+
+Hello, This is a slate by **MEEE**
+
+> Testing random _shit_

data/lib/slate/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module Slate
-  VERSION = "0.1.0"
+  VERSION = "0.2.0"
 end

data/lib/slate.rb

@@ -3,15 +3,17 @@ require 'kramdown'
 require 'kramdown-parser-gfm'
 require 'optparse'
 
+THEMES = %w[github minimal serif pico-blue simple].freeze
+
 module Slate
   class Error < StandardError; end
 
-  Options = Struct.new(:output_dir)
+  Options = Struct.new(:output_dir, :theme)
   # The main class to rule them all
   class CLI
     # This method is the MAIN method... Refactored from bin/slate
     def self.run(argv)
-      options = Options.new(nil)
+      options = Options.new(nil, "github")
 
       OptionParser.new do |opts|
         opts.banner = 'Usage: slate [options] <file_or_directory>'
@@ -29,12 +31,20 @@ module Slate
           puts opts
           exit
         end
+
+        opts.on('-t', '--theme THEME', 'Theme to use') do |theme|
+          options.theme = theme
+        end
+
       end.parse!(argv)
 
+      unless THEMES.include?(options.theme)
+        abort "Unknown theme '#{options.theme}'. Available themes: #{THEMES.join(', ')}"
+      end
+
       path = argv.first
       if path.nil?
-        puts 'Error: You must provide a file or directory.'
-        puts opt_parser
+        puts 'Usage: slate [options] <file_or_directory>'
         exit
       end
 
@@ -48,16 +58,16 @@ module Slate
       end
     end
 
-    def self.convert(md_content, title)
+    def self.convert(md_content, title, theme)
       raw_html = Kramdown::Document.new(md_content, input: 'GFM').to_html
 
-      "<head>\n<title> #{title} </title>\n <link href='style.css' rel='stylesheet'>\n</head>\n<body class='markdown-body'>\n#{raw_html}\n</body>"
+      "<head>\n<title> #{title} </title>\n <link href='#{theme}.css' rel='stylesheet'>\n</head>\n<body class='markdown-body'>\n#{raw_html}\n</body>"
     end
 
-    def self.copy_css(dest)
+    def self.copy_css(dest, theme)
       FileUtils.mkdir_p(dest)
-      style_path = File.join(__dir__, '..', 'style.css')
-      FileUtils.cp(style_path, dest)
+      style_path = File.join(__dir__, '..','themes',"#{theme}.css")
+      FileUtils.cp(style_path, File.join(dest, "#{theme}.css"))
     end
 
     def self.save_file(path, options)
@@ -67,7 +77,7 @@ module Slate
 
       FileUtils.mkdir_p(dir)
       output_path = File.join(dir, "#{filename}.html")
-      final_html = convert(content, filename)
+      final_html = convert(content, filename, options.theme)
       File.write(output_path, final_html)
       puts "Saved #{filename}.html"
     end
@@ -75,14 +85,14 @@ module Slate
     def self.process_file(path, options)
       puts 'Argument seems to be a single file, Parsing it'
       dest = options.output_dir || File.dirname(path)
-      copy_css(dest)
+      copy_css(dest, options.theme)
       save_file(path, options)
     end
 
     def self.process_directory(path, options)
       puts 'Found a directory, gotta check all .md files!'
       dir = options.output_dir || path
-      copy_css(dir)
+      copy_css(dir, options.theme)
 
       files = Dir.glob(File.join(path, '*.md'))
 

data/{style.css → themes/github.css}

@@ -688,7 +688,7 @@
 
 .markdown-body span.float-right > span {
   display: block;
-  margin: 13px auto 0;
+  margin: 13px auto 0;  
   overflow: hidden;
   text-align: right;
 }

data/themes/minimal.css

@@ -0,0 +1,386 @@
+/* Classless.css v1.1
+
+Table of Contents:
+ 1. Theme Settings
+ 2. Reset
+ 3. Base Style
+ 4. Extras  (remove unwanted)
+ 5. Classes  (remove unwanted)
+*/
+
+/* 1. Theme Settings ––––––––––––––––––––-–––––––––––––– */
+
+
+:root, html[data-theme='light'] {
+	--rem: 12pt;
+	--width: 50rem;
+	--navpos: absolute;  /* fixed | absolute */
+	--font-p: 1em/1.7  'Open Sans', 'DejaVu Sans', FreeSans, Helvetica, sans-serif;
+	--font-h: .9em/1.5 'Open Sans', 'DejaVu Sans', FreeSans, Helvetica, sans-serif;
+	--font-c: .9em/1.4 'DejaVu Sans Mono', monospace;
+	--border: 1px solid var(--cmed);
+	--ornament: "‹‹‹ ›››";
+	/* foreground   | background color */
+	--cfg:   #433;    --cbg:    #fff;
+	--cdark: #888;    --clight: #f5f6f7;
+	--cmed:  #d1d1d1;
+	--clink: #07c;
+	--cemph: #088;    --cemphbg: #0881;
+}
+
+
+/* 2. Reset –––––––––––––––––––––––––––––––––––––––––––– */
+
+/* reset block elements  */
+* { box-sizing: border-box; border-spacing: 0; margin: 0; padding: 0; }
+header, footer, figure, video, details, blockquote,
+ul, ol, dl, fieldset, pre, pre > code {
+	display: block;
+	margin: .5rem 0 1rem;
+	width: 100%;
+	overflow: auto hidden;
+	text-align: left;
+}
+video, summary, input, select { outline: none; }
+
+/* reset clickable things  (FF Bug: select:hover prevents usage) */
+a, button, select, summary { color: var(--clink); cursor: pointer; }
+
+
+/* 3. Base Style ––––––––––––––––––––––––––––––––––––––– */
+html { font-size: var(--rem); background: var(--cbg); }
+body {
+	position: relative;
+	margin: auto;
+	max-width: var(--width);
+	font: var(--font-p);
+	color: var(--cfg);
+	padding: 3.0rem .6rem 0;
+	overflow-x: hidden;
+}
+body > footer { margin: 10rem 0 0; font-size: 90%; }
+p { margin: .6em 0; }
+
+/* links */
+a[href]{ text-decoration: underline solid 1.5px var(--cmed); text-underline-position: under; }
+a[href^="#"] {text-decoration: none; }
+a:hover, button:not([disabled]):hover, summary:hover, select:hover {
+	filter: brightness(92%); color: var(--cemph); border-color: var(--cemph);
+}
+
+/* lists */
+ul, ol, dl { margin: 1rem 0; padding: 0 0 0 2em; }
+li:not(:last-child), dd:not(:last-child) { margin-bottom: .5rem; }
+dt { font-weight: bold; }
+
+/* headings */
+h1, h2, h3, h4, h5 { margin: 1.5em 0 .5rem; font: var(--font-h); line-height: 1.2em; clear: both; }
+h1+h2, h2+h3, h3+h4, h4+h5 { margin-top: .5em; padding-top: 0; }  /* non-clashing headings */
+h1 { font-size: 2.2em; font-weight: 300; }
+h2 { font-size: 2.0em; font-weight: 300; font-variant: small-caps; }
+h3 { font-size: 1.5em; font-weight: 400; }
+h4 { font-size: 1.1em; font-weight: 700; }
+h5 { font-size: 1.2em; font-weight: 400; color: var(--cfg); }
+h6 { font-size: 1.0em; font-weight: 700; font-style: italic; display: inline; }
+h6 + p { display: inline; }
+
+/* tables */
+td, th {
+  padding: .5em .8em;
+  text-align: right;
+  border-bottom: var(--border);
+  white-space: nowrap;
+  font-size: 95%;
+}
+thead th[colspan] { padding: .2em .8em; text-align: center; }
+thead tr:not(:only-child) td { padding: .2em .8em;}
+thead+tbody tr:first-child td { border-top: var(--border); }
+td:first-child, th:first-child { text-align: left; }
+tr:hover{ background-color: var(--clight); }
+table img { display: block; }
+
+/* figures */
+img, svg { max-width: 100%; vertical-align: text-top; object-fit: cover; }
+p>img:not(:only-child) { float: right; margin: 0 0 .5em .5em; }
+figure > img { display: inline-block; width: auto; }
+figure > img:only-of-type, figure > svg:only-of-type { max-width: 100%; display: block; margin: 0 auto .4em; }
+figure > *:not(:last-child) { margin-bottom: .4rem; }
+
+/* captions */
+figcaption, caption { text-align: left; font: var(--font-h); color: var(--cdark); width: 100%; }
+figcaption > *:first-child, caption > *:first-child { display: inline-block; margin: 0; }
+table caption:last-child { caption-side: bottom; margin: .5em 0;}
+
+/* code */
+pre > code {
+  margin: 0;
+  position: relative;
+  padding: .8em;
+  border-left: .4rem solid var(--cemph);
+}
+code, kbd, samp {
+	padding: .2em;
+	font: var(--font-c);
+	background: var(--clight);
+	border-radius: 4px;
+}
+kbd { border: 1px solid var(--cmed); }
+
+/* misc */
+blockquote { border-left: .4rem solid var(--cmed); padding: 0 0 0 1rem;  }
+time{ color: var(--cdark); }
+hr { border: 0; border-top: .1rem solid var(--cmed); }
+nav { width: 100%; background-color: var(--clight); }
+::selection, mark { background: var(--clink); color: var(--cbg); }
+
+
+/* 4. Extra Style –––––––––––––––––––––––––––––––––––––– */
+
+/* Auto Numbering: figure/tables/headings/cite */
+article { counter-reset: h2 0 h3 0 tab 0 fig 0 lst 0 ref 0 eq 0; }
+article figure figcaption:before {
+	color: var(--cemph);
+	counter-increment: fig;
+	content: "Figure " counter(fig) ": ";
+}
+
+/* subfigures */
+figure { counter-reset: subfig 0 }
+article figure figure { counter-reset: none; }
+article figure > figure { display: inline-grid; width: auto; }
+figure > figure:not(:last-of-type) { padding-right: 1rem; }
+article figure figure figcaption:before {
+	counter-increment: subfig 1;
+	content: counter(subfig, lower-alpha) ": ";
+}
+
+/* listings */
+article figure pre + figcaption:before {
+	counter-increment: lst 1;
+	content: "Listing " counter(lst) ": ";
+}
+
+/* tables */
+figure > table:only-of-type { margin: .5em auto !important; width: fit-content; }
+article figure > table caption { display: table-caption; caption-side: bottom; }
+article figure > table + figcaption:before,
+article table caption:before {
+	color: var(--cemph);
+	counter-increment: tab 1;
+	content: "Table " counter(tab) ": ";
+}
+
+/* headings */
+article h2, h3 { position: relative; }
+article h2:before,
+article h3:before {
+	display: inline-block;
+	position: relative;
+	font-size: .6em;
+	text-align: right;
+	vertical-align: baseline;
+	left: -1rem;
+	width: 2.5em;
+	margin-left: -2.5em;
+}
+article h1 { counter-set: h2; }
+article h2:before { counter-increment: h2; content: counter(h2) ". "; counter-set: h3; }
+article h3:before { counter-increment: h3; content: counter(h2) "." counter(h3) ". ";}
+@media (max-width: 60rem) { h2:before, h3:before { display: none; } }
+
+/* tooltip + citation */
+article p>cite:before {
+	padding: 0 .5em 0 0;
+	counter-increment: ref; content: " [" counter(ref) "] ";
+	vertical-align: super; font-size: .6em;
+}
+article p>cite > *:only-child { display: none; }
+article p>cite:hover > *:only-child,
+[data-tooltip]:hover:before {
+	display: inline-block; z-index: 40;
+	white-space: pre-wrap;
+	position: absolute; left: 1rem; right: 1rem;
+	padding: 1em 2em;
+	text-align: center;
+	transform:translateY( calc(-100%) );
+	content: attr(data-tooltip);
+	color: var(--cbg);
+	background-color: var(--cemph);
+	box-shadow: 0 2px 10px 0 black;
+}
+[data-tooltip], article p>cite:before { 
+	color: var(--clink);
+	border: .8rem solid transparent; margin: -.8rem;
+}
+abbr[title], [data-tooltip] { cursor: help; }
+
+/* navbar */
+nav+* { margin-top: 3rem; }
+body>nav, header nav {
+	position: var(--navpos);
+	top: 0; left: 0; right: 0;
+	z-index: 41;
+	box-shadow: 0vw -50vw 0 50vw var(--clight), 0 calc(-50vw + 2px) 4px 50vw var(--cdark);
+}
+nav ul { list-style-type: none; }
+nav ul:first-child { margin: 0; padding: 0; overflow: visible; }
+nav ul:first-child > li {
+	display: inline-block;
+	margin: 0;
+	padding: .8rem .6rem;
+}
+nav ul > li > ul {
+	display: none;
+	width: auto;
+	position: absolute;
+	margin: .5rem 0;
+	padding: 1rem 2rem;
+	background-color: var(--clight);
+	border: var(--border);
+	border-radius: 4px;
+	z-index: 42;
+}
+nav ul > li > ul > li { white-space: nowrap; }
+nav ul > li:hover > ul { display: block; }
+@media (max-width: 40rem) {
+	nav ul:first-child > li:first-child:after { content: " \25BE"; }
+	nav ul:first-child > li:not(:first-child):not(.sticky) { display: none; }
+	nav ul:first-child:hover > li:not(:first-child):not(.sticky) { display: block; float: none !important; padding: .3rem .6rem; }
+}
+
+/* details/cards */
+summary>* { display: inline; }
+.card, details {
+	display: block;
+	margin: .5rem 0 1rem;
+	padding: 0 .6rem;
+	border-radius: 4px;
+	overflow: hidden;
+}
+.card, details[open] { outline: 1px solid var(--cmed); }
+.card>img:first-child { margin: -3px -.6rem; max-width: calc(100% + 1.2rem); }
+summary:hover, details[open] summary, .card>p:first-child {
+	box-shadow: inset 0 0 0 2em var(--clight), 0 -.8rem 0 .8rem var(--clight); 
+}
+.hint { --cmed: var(--cemph); --clight: var(--cemphbg); background-color: var(--clight); }
+.warn { --cmed: #c11; --clight: #e221; background-color: var(--clight); }
+
+/* big first letter */
+article > section:first-of-type > h2:first-of-type + p:first-letter,
+article > h2:first-of-type + p:first-letter, .lettrine {
+	float: left;
+	font-size: 3.5em;
+	padding: .1em .1em 0 0;
+	line-height: .68em;
+	color: var(--cemph);
+}
+
+/* ornaments */
+section:after {
+	display: block;
+	margin: 1em 0;
+	color: var(--cmed);
+	text-align: center;
+	font-size: 1.5em;
+	content: var(--ornament);
+}
+
+/* side menu (aside is not intended for use in a paragraph!) */
+main aside {
+	position: absolute;
+	width: 8rem;      right: -8.6rem;
+	font-size: .8em; line-height: 1.4em;
+}
+@media (max-width: 70rem) { main aside { display: none; } }
+
+/* forms and inputs  */
+textarea, input:not([type=range]), button, select {
+	font: var(--font-h);
+	border-radius: 4px;
+	border: 1.5px solid var(--cmed);
+	padding: .4em .8em;
+	color: var(--cfg);
+	background-color: var(--clight);
+}
+fieldset select, input:not([type=checkbox]):not([type=radio]) {
+	display: block;
+	width: 100%;
+	margin: 0 0 1rem;
+}
+button, select {
+	font-weight: bold;
+	margin: .5em;
+	border: 1.5px solid var(--clink);
+	color: var(--clink);
+}
+button { padding: .4em 1em; font-size: 85%; letter-spacing: .1em; }
+button[disabled] { color: var(--cdark); border-color: var(--cmed); }
+fieldset { border-radius: 4px; border: var(--border); padding: .5em 1em; }
+textarea:hover, input:not([type=checkbox]):not([type*='ra']):hover {
+  border: 1.5px solid var(--cemph);
+}
+textarea:focus, input:not([type=checkbox]):not([type*='ra']):focus {
+	border: 1.5px solid var(--clink);
+	box-shadow: 0 0 5px var(--clink);
+}
+p>button { padding: 0 .5em; margin: 0 .5em; }
+p>select { padding: 0;      margin: 0 .5em; }
+
+
+/* 5. Bootstrap-compatible classes ––––––––––––––––––––– */
+
+/* grid */
+.row { display: flex; margin: .5rem -.6rem; align-items: stretch; }
+.row [class^="col"] { padding: 0 .6rem; }
+.row .col   { flex: 0 4 100%; }
+.row .col-2 { flex: 0 2 16.66%; }
+.row .col-3 { flex: 0 3 25%; }
+.row .col-4 { flex: 0 4 33.33%; }
+.row .col-5 { flex: 0 5 41.66%; }
+.row .col-6 { flex: 0 6 50%; }
+@media (max-width: 40rem) { .row { flex-direction: column; } }
+
+/* align */
+.text-left   { text-align: left; }
+.text-right  { text-align: right; }
+.text-center { text-align: center; }
+.float-left  { float: left !important; }
+.float-right { float: right !important; }
+.clearfix    { clear: both; }
+
+/* colors */
+.text-black    { color: #000; }
+.text-white    { color: #fff; }
+.text-primary  { color: var(--cemph); }
+.text-secondary{ color: var(--cdark); }
+.bg-white    { background-color: #fff; }
+.bg-light    { background-color: var(--clight); }
+.bg-primary  { background-color: var(--cemph); }
+.bg-secondary{ background-color: var(--cmed); }
+
+/* margins */
+.mx-auto { margin-left: auto; margin-right: auto; }
+.m-0 { margin: 0 !important; }
+.m-1, .mx-1, .mr-1 { margin-right:  1.0rem !important; }
+.m-1, .mx-1, .ml-1 { margin-left:   1.0rem !important; }
+.m-1, .my-1, .mt-1 { margin-top:    1.0rem !important; }
+.m-1, .my-1, .mb-1 { margin-bottom: 1.0rem !important; }
+
+/* pading */
+.p-0 { padding: 0 !important; }
+.p-1, .px-1, .pr-1 { padding-right:  1.0rem !important; }
+.p-1, .px-1, .pl-1 { padding-left:   1.0rem !important; }
+.p-1, .py-1, .pt-1 { padding-top:    1.0rem !important; }
+.p-1, .py-1, .pb-1 { padding-bottom: 1.0rem !important; }
+
+/* be print friendly */
+@media print { 
+	@page { margin: 1.5cm 2cm; } 
+	html {font-size: 9pt!important; } 
+	body { max-width: 27cm; }
+	p { orphans: 2; widows: 2; }
+	caption, figcaption { page-break-before: avoid; }
+	h2, h3, h4, h5 { page-break-after: avoid;}
+	.noprint, body>nav, section:after { display: none; }
+	.row { flex-direction: row; }
+}