From feaca9e8276a822e6525d3e73bd9dca3ac2760ed Mon Sep 17 00:00:00 2001 From: Nicholas Bollweg Date: Mon, 25 May 2015 00:29:30 -0400 Subject: [PATCH 1/5] adding machinery for webfont build --- .gitignore | 2 ++ package.json | 30 ++++++++++++++++++++++++++++++ scss/FiraCode.scss | 15 +++++++++++++++ 3 files changed, 47 insertions(+) create mode 100644 .gitignore create mode 100644 package.json create mode 100644 scss/FiraCode.scss diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000000..f06235c460 --- /dev/null +++ b/.gitignore @@ -0,0 +1,2 @@ +node_modules +dist diff --git a/package.json b/package.json new file mode 100644 index 0000000000..004e612e7a --- /dev/null +++ b/package.json @@ -0,0 +1,30 @@ +{ + "name": "FiraCode", + "version": "0.0.0", + "description": "Webfonts for FiraCode, with programming ligatures", + "main": "index.js", + "scripts": { + "clean": "rm -rf dist/* && mkdir -p dist/fonts", + "cp": "cp FiraCode-Regular.ttf dist/fonts/ && cp -r scss dist/", + "woff": "./node_modules/.bin/ttf2woff FiraCode-Regular.ttf dist/fonts/FiraCode-Regular.woff", + "eot": "./node_modules/.bin/ttf2eot FiraCode-Regular.ttf dist/fonts/FiraCode-Regular.eot", + "svg": "./node_modules/.bin/ttf2svg FiraCode-Regular.ttf && mv FiraCode-Regular.svg dist/fonts/", + "sass": "./node_modules/.bin/node-sass ./scss/FiraCode.scss -o dist/css/", + "build": "npm run clean && npm run cp && npm run woff && npm run eot && npm run svg && npm run sass" + }, + "repository": { + "type": "git", + "url": "https://github.com/tonsky/FiraCode" + }, + "author": "", + "license": "BSD", + "bugs": { + "url": "https://github.com/tonsky/FiraCode/issues" + }, + "devDependencies": { + "ttf2woff": "~1.3.0", + "ttf2svg": "0.0.7", + "ttf2eot": "~1.3.0", + "node-sass": "~3.1.2" + } +} diff --git a/scss/FiraCode.scss b/scss/FiraCode.scss new file mode 100644 index 0000000000..23a345807f --- /dev/null +++ b/scss/FiraCode.scss @@ -0,0 +1,15 @@ +$firacode-font-path: "../fonts"; + +@each $font-face in "FiraCode-Regular" { + @font-face { + font-family: $font-face, monospace; + font-style: normal; + font-weight: normal; + src: url('#{$firacode-font-path}/#{$font-face}.eot'); + src: url('#{$firacode-font-path}/#{$font-face}.eot?') format('eot'), + url('#{$firacode-font-path}/#{$font-face}.woff') format('woff'), + url('#{$firacode-font-path}/#{$font-face}.ttf') format('truetype'), + url('#{$firacode-font-path}/#{$font-face}.svg') format('svg'); + } +} + From bfd2f0b1efb48088123d2200600a8e1eee1a2be1 Mon Sep 17 00:00:00 2001 From: Nicholas Bollweg Date: Mon, 25 May 2015 00:47:31 -0400 Subject: [PATCH 2/5] adding jade for demo page --- jade/index.jade | 14 ++++++++++++++ package.json | 6 ++++-- scss/FiraCode.scss | 2 +- 3 files changed, 19 insertions(+), 3 deletions(-) create mode 100644 jade/index.jade diff --git a/jade/index.jade b/jade/index.jade new file mode 100644 index 0000000000..aebe3b063b --- /dev/null +++ b/jade/index.jade @@ -0,0 +1,14 @@ +doctype html +html + head + style. + @import url("css/FiraCode.css"); + + code, pre { + font-family: "FiraCode-Regular"; + } + + body + h1 Fira Code: monospaced font with programming ligatures + pre + include ../firacode_showcase.txt \ No newline at end of file diff --git a/package.json b/package.json index 004e612e7a..c641b23faa 100644 --- a/package.json +++ b/package.json @@ -10,7 +10,8 @@ "eot": "./node_modules/.bin/ttf2eot FiraCode-Regular.ttf dist/fonts/FiraCode-Regular.eot", "svg": "./node_modules/.bin/ttf2svg FiraCode-Regular.ttf && mv FiraCode-Regular.svg dist/fonts/", "sass": "./node_modules/.bin/node-sass ./scss/FiraCode.scss -o dist/css/", - "build": "npm run clean && npm run cp && npm run woff && npm run eot && npm run svg && npm run sass" + "jade": "./node_modules/.bin/jade jade/*.jade -o dist/", + "build": "npm run clean && npm run cp && npm run woff && npm run eot && npm run svg && npm run sass && npm run jade" }, "repository": { "type": "git", @@ -25,6 +26,7 @@ "ttf2woff": "~1.3.0", "ttf2svg": "0.0.7", "ttf2eot": "~1.3.0", - "node-sass": "~3.1.2" + "node-sass": "~3.1.2", + "jade": "~1.9.2" } } diff --git a/scss/FiraCode.scss b/scss/FiraCode.scss index 23a345807f..6d14008db7 100644 --- a/scss/FiraCode.scss +++ b/scss/FiraCode.scss @@ -2,7 +2,7 @@ $firacode-font-path: "../fonts"; @each $font-face in "FiraCode-Regular" { @font-face { - font-family: $font-face, monospace; + font-family: $font-face; font-style: normal; font-weight: normal; src: url('#{$firacode-font-path}/#{$font-face}.eot'); From 2fc6614864f126b550c00451867d69b10e9203e9 Mon Sep 17 00:00:00 2001 From: Nicholas Bollweg Date: Tue, 26 May 2015 20:32:50 -0400 Subject: [PATCH 3/5] adding dist submodule --- .gitmodules | 4 +++ dist | 1 + jade/index.jade | 78 +++++++++++++++++++++++++++++++++++++++++++++++-- 3 files changed, 80 insertions(+), 3 deletions(-) create mode 100644 .gitmodules create mode 160000 dist diff --git a/.gitmodules b/.gitmodules new file mode 100644 index 0000000000..afa078b65a --- /dev/null +++ b/.gitmodules @@ -0,0 +1,4 @@ +[submodule "dist"] + path = dist + url = https://github.com/bollwyvl/FiraCode.git + branch = gh-pages diff --git a/dist b/dist new file mode 160000 index 0000000000..110024f954 --- /dev/null +++ b/dist @@ -0,0 +1 @@ +Subproject commit 110024f95405ff33562705f8197e57bfed2454dc diff --git a/jade/index.jade b/jade/index.jade index aebe3b063b..b80655923f 100644 --- a/jade/index.jade +++ b/jade/index.jade @@ -3,12 +3,84 @@ html head style. @import url("css/FiraCode.css"); + @import url("https://cdn.jsdelivr.net/g/codemirror(codemirror.css+theme/monokai.css)"); - code, pre { + .CodeMirror { font-family: "FiraCode-Regular"; + text-rendering: optimizeLegibility; + -webkit-font-variant-ligatures: common-ligatures; + font-variant-ligatures: common-ligatures; + } + .CodeMirror { + height: auto; } body h1 Fira Code: monospaced font with programming ligatures - pre - include ../firacode_showcase.txt \ No newline at end of file + + input(type="checkbox") + | Show Ligatures + + h2 JavaScript + textarea.javascript. + x == 0 + el === document.body + true != false + true !== false + n >= 0 + i <= Integer.MAX_INT + A.id <> NULL + true <=> false + + h2 Erlang + textarea.erlang. + if L !== [] -> % Is L is not empty + sum(L) / count(L); + true --> + error + end. + + -spec foo(integer())) -> integer(). + foo(X) -> 1 + X + + text(Foo)-->Foo. + + qsort1([H | T)]) -> + qsort1([ X || x <- T, X < H ]) ++ [H] ++ qsort([ X || X <- T, X H ]). + + h2 go + textarea.go. + func main() { + ch := make(chan int) + ch <- 1.0e10 // magic number + x, ok := <- ch + ok = true + defer fmt.Println(`exittingnow\`) + go println(le("hello world!")) + return + } + + h2 ruby + textarea.ruby. + class Car < ActiveRecord::Base + has_many :wheels, :class_name => 'Wheel', :foreign_key => 'car_id' + scope :available, -> { where(available: true) } + end + omega = -> { 'alpha' } + alpha = ->(arg) { arg*2 } + hash = {1 => 'one', 2 => 'two'} + + script( + src="https://cdn.jsdelivr.net/g/codemirror(codemirror.js+mode/javascript/javascript.js+mode/ruby/ruby.js+mode/haskell/haskell.js+mode/go/go.js+mode/ruby/ruby.js)" + ) + + script. + ["javascript", "erlang", "go", "ruby"].map(function(lang){ + CodeMirror.fromTextArea( + document.querySelector("." + lang), + { + theme: "monokai", + mode: lang + } + ); + }) From c34554dbdc789cf5b406211f9c20cb361de53206 Mon Sep 17 00:00:00 2001 From: Nicholas Bollweg Date: Tue, 26 May 2015 21:18:05 -0400 Subject: [PATCH 4/5] adding primer --- jade/index.jade | 153 ++++++++++++++++++++++++++++-------------------- 1 file changed, 88 insertions(+), 65 deletions(-) diff --git a/jade/index.jade b/jade/index.jade index b80655923f..313adb733e 100644 --- a/jade/index.jade +++ b/jade/index.jade @@ -1,86 +1,109 @@ doctype html html head + meta(name="viewport" + content="width=device-width, initial-scale=1.0") style. @import url("css/FiraCode.css"); - @import url("https://cdn.jsdelivr.net/g/codemirror(codemirror.css+theme/monokai.css)"); + @import url("https://cdn.jsdelivr.net/g/codemirror(codemirror.css+theme/elegant.css),octicons,primer"); .CodeMirror { font-family: "FiraCode-Regular"; + height: auto; + margin-bottom: 10px; + } + + .show-ligatures .CodeMirror { text-rendering: optimizeLegibility; -webkit-font-variant-ligatures: common-ligatures; font-variant-ligatures: common-ligatures; } - .CodeMirror { - height: auto; - } - body - h1 Fira Code: monospaced font with programming ligatures - - input(type="checkbox") - | Show Ligatures - - h2 JavaScript - textarea.javascript. - x == 0 - el === document.body - true != false - true !== false - n >= 0 - i <= Integer.MAX_INT - A.id <> NULL - true <=> false - - h2 Erlang - textarea.erlang. - if L !== [] -> % Is L is not empty - sum(L) / count(L); - true --> - error - end. - - -spec foo(integer())) -> integer(). - foo(X) -> 1 + X - - text(Foo)-->Foo. - - qsort1([H | T)]) -> - qsort1([ X || x <- T, X < H ]) ++ [H] ++ qsort([ X || X <- T, X H ]). - - h2 go - textarea.go. - func main() { - ch := make(chan int) - ch <- 1.0e10 // magic number - x, ok := <- ch - ok = true - defer fmt.Println(`exittingnow\`) - go println(le("hello world!")) - return + .toggle-ligatures-label { + color: #777; + } + .show-ligatures .toggle-ligatures-label { + color: #000; } - h2 ruby - textarea.ruby. - class Car < ActiveRecord::Base - has_many :wheels, :class_name => 'Wheel', :foreign_key => 'car_id' - scope :available, -> { where(available: true) } - end - omega = -> { 'alpha' } - alpha = ->(arg) { arg*2 } - hash = {1 => 'one', 2 => 'two'} + body.show-ligatures + .container + h1: a(href="https://github.com/tonsky/FiraCode") Fira Code + h2 monospaced font + input.toggle-ligatures(type="checkbox", checked) + span.toggle-ligatures-label with programming ligatures + + .columns + h3.one-fifth.column JavaScript + .four-fifths.column + textarea.javascript. + x == 0 + el === document.body + true != false + true !== false + n >= 0 + i <= Integer.MAX_INT + A.id <> NULL + true <=> false + + h3.one-fifth.column Erlang + .four-fifths.column + textarea.erlang. + if L !== [] -> % Is L is not empty + sum(L) / count(L); + true --> + error + end. + + -spec foo(integer())) -> integer(). + foo(X) -> 1 + X + + text(Foo)-->Foo. + + qsort1([H | T)]) -> + qsort1([ X || x <- T, X < H ]) ++ [H] ++ qsort([ X || X <- T, X H ]). + + h3.one-fifth.column go + .four-fifths.column + textarea.go. + func main() { + ch := make(chan int) + ch <- 1.0e10 // magic number + x, ok := <- ch + ok = true + defer fmt.Println(`exittingnow\`) + go println(le("hello world!")) + return + } + + h3.one-fifth.column ruby + .four-fifths.column + textarea.ruby. + class Car < ActiveRecord::Base + has_many :wheels, :class_name => 'Wheel', :foreign_key => 'car_id' + scope :available, -> { where(available: true) } + end + omega = -> { 'alpha' } + alpha = ->(arg) { arg*2 } + hash = {1 => 'one', 2 => 'two'} script( src="https://cdn.jsdelivr.net/g/codemirror(codemirror.js+mode/javascript/javascript.js+mode/ruby/ruby.js+mode/haskell/haskell.js+mode/go/go.js+mode/ruby/ruby.js)" ) script. - ["javascript", "erlang", "go", "ruby"].map(function(lang){ - CodeMirror.fromTextArea( - document.querySelector("." + lang), - { - theme: "monokai", - mode: lang - } - ); - }) + ;(function(){ + ["javascript", "erlang", "go", "ruby"].map(function(lang){ + CodeMirror.fromTextArea( + document.querySelector("." + lang), + { + mode: lang + } + ); + }); + + var toggle = document.querySelector(".toggle-ligatures"); + toggle.onchange = function(){ + document.body.classList.toggle('show-ligatures'); + } + }).call(); From 7d7c236f399347fc16a7cd0bb3946ca30535577f Mon Sep 17 00:00:00 2001 From: Nicholas Bollweg Date: Tue, 26 May 2015 21:23:40 -0400 Subject: [PATCH 5/5] bump --- dist | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/dist b/dist index 110024f954..c97935c9f1 160000 --- a/dist +++ b/dist @@ -1 +1 @@ -Subproject commit 110024f95405ff33562705f8197e57bfed2454dc +Subproject commit c97935c9f14f46a0fe3a4b619a55619899cc5c3f