Skip to content

Commit 85811c1

Browse files
MattMSbuzzdecafe
authored andcommitted
Update Pug templates (#175)
* Add new blocks to layout.pug and base for links * Add main tag to index template * Add extra fields to make index script * Add midline to REPL styles * Remove header style breaking REPL * Add new REPL template * Move REPL styles to Less
1 parent 6cbafb0 commit 85811c1

10 files changed

Lines changed: 161 additions & 16 deletions

File tree

index.pug

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
extends layout.pug
22

33
block main
4-
article!= readme
4+
main.container
5+
article!= readme

layout.pug

Lines changed: 22 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
doctype html
2-
html.home-page
2+
html(class=html_class)
3+
- base_link = ('home' == page ? '.' : '..')
4+
35
head
46
meta(charset="UTF-8")
57
meta(
@@ -9,12 +11,17 @@ html.home-page
911

1012
title Ramda Documentation
1113

14+
- href = base_link + "/style.css"
1215
link(
13-
href="style.css"
16+
href=href
1417
rel="stylesheet"
1518
type="text/css"
1619
)
1720

21+
block styles
22+
23+
block scripts
24+
1825
body
1926
input#open-nav(type="checkbox")
2027
header.navbar.navbar-fixed-top.navbar-inverse.container-fluid
@@ -23,19 +30,26 @@ html.home-page
2330
label.open-nav(for="open-nav")
2431
a.navbar-brand(href="#")
2532
strong Ramda
26-
span.version v#{version}
33+
span.version v#{version}
2734

2835
ul.nav.navbar-nav.navbar-left
29-
li.active: a(href="#") Home
30-
li: a(href="docs") Documentation
31-
li: a(href="/repl?v=#{version}") Try Ramda
36+
- active = ('home' == page) ? 'active' : ''
37+
- href = base_link + "/"
38+
li(class=active): a(href=href) Home
39+
40+
- active = ('docs' == page) ? 'active' : ''
41+
- href = base_link + "/docs/"
42+
li(class=active): a(href=href) Documentation
43+
44+
- active = ('repl' == page) ? 'active' : ''
45+
- href = base_link + "/repl/"
46+
li(class=active): a(href=href) Try Ramda
3247

3348
ul.nav.navbar-nav.navbar-right
3449
li: a(href="https://github.com/ramda/ramda") GitHub
3550
li: a(href="https://gitter.im/ramda/ramda") Discuss
3651

37-
main.container
38-
block main
52+
block main
3953

4054
script.
4155
window.gitter = {

less/layout.less

Lines changed: 0 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -8,13 +8,6 @@
88
padding-top: @padding;
99
}
1010

11-
header {
12-
position: fixed;
13-
width: 100%;
14-
top: 0;
15-
right: 0;
16-
}
17-
1811
.forkme {
1912
margin-top: 10px;
2013
}

less/ramda.less

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@
66
@import "sidebar";
77
@import "card";
88
@import "hljs";
9+
@import "repl";
910

1011
.navbar-fixed-top {
1112
box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.20);

less/repl.less

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
html.repl-page
2+
, html.repl-page > body
3+
{
4+
background-color: #282a36;
5+
height: 100%;
6+
}
7+
8+
.ramda-repl-wrapper {
9+
height: 100%;
10+
padding-top: 3.7em;
11+
}
12+
13+
.repl-midline {
14+
background-color: #44475a;
15+
bottom: 0;
16+
left: 50%;
17+
position: absolute;
18+
top: 0;
19+
width: 2px;
20+
z-index: 1;
21+
}

make_index_html.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,8 @@ get_ramda_file('README.md')
1717
var make_html = pug.compileFile('index.pug')
1818

1919
var html = make_html({
20+
html_class: 'home-page',
21+
page: 'home',
2022
readme: readme_html,
2123
version: version
2224
})

make_repl_index_html.js

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
var fs = require('fs')
2+
3+
var pug = require('pug')
4+
5+
var version = require('./package.json').devDependencies.ramda
6+
7+
8+
var make_html = pug.compileFile('repl/index.pug')
9+
10+
var html = make_html({
11+
html_class: 'repl-page',
12+
page: 'repl',
13+
version: version
14+
})
15+
16+
fs.writeFileSync('repl/index.html', html, {encoding: 'utf8'})

repl/css/page.css

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -33,3 +33,13 @@ html, body {
3333
border : 0;
3434
resize : none;
3535
}
36+
37+
.repl-midline {
38+
background-color: #44475a;
39+
position: absolute;
40+
left: 50%;
41+
top: 0;
42+
bottom: 0;
43+
width: 2px;
44+
z-index: 1;
45+
}

repl/index.js

Lines changed: 74 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,74 @@
1+
document.addEventListener('DOMContentLoaded', function () {
2+
// Regex for matching version strings
3+
// Example match: "0.21.123"
4+
var rx = /^\d+\.\d+(\.\d+)?$/
5+
6+
// :: String, String -> String
7+
function toVersion (acc, pair) {
8+
var splitPair = pair.split('=')
9+
10+
return splitPair[0] === 'v' && rx.test(splitPair[1]) ? splitPair[1] : acc
11+
}
12+
13+
var version = location.search.substr(1).split('&').reduce(toVersion, 'latest')
14+
15+
var ramdaUrl = '//cdn.jsdelivr.net/ramda/' + version + '/ramda.min.js'
16+
17+
18+
ramdaRepl(document.querySelector('.ramda-repl-target'), {
19+
apiUrl: 'https://www.googleapis.com/urlshortener/v1/url?key=AIzaSyDhbAvT5JqkxFPkoeezJp19-S_mAJudxyk',
20+
21+
// If unset, initialValue will use the value or textcontent of the
22+
// target element.
23+
initialValue: URI.decode(window.location.hash).substring(2),
24+
25+
// Called with the pre-compiled content
26+
onChange: function (code) {
27+
window.location.hash = '?' + URI.encode(code)
28+
},
29+
30+
// The following config defines scripts that will be dynamically
31+
// loaded upon creating the REPL. Each has the following properties:
32+
//
33+
// src - The source of the script, a URL
34+
// global - (Optional) a name of a global that the script introduces
35+
// exposeAs - (Optional) a name that can alias the global
36+
// expose - (Optional) a list of methods to expose globally
37+
38+
// Required.
39+
// As ramda may be a dependency for other scripts, it will
40+
// be intentionally loaded before any other script.
41+
ramdaScript: {
42+
global: 'R',
43+
src: ramdaUrl
44+
},
45+
46+
returnUrl: 'http://ramdajs.com/repl/',
47+
48+
// Optional.
49+
// Here we can declare a list of libraries that we wish to have
50+
// loaded and exposed in the repl.
51+
scripts: [
52+
{
53+
exposeAs: 'S',
54+
global: 'sanctuary',
55+
src: '//wzrd.in/standalone/sanctuary@latest'
56+
},
57+
{
58+
expose: [
59+
'Either',
60+
'Future',
61+
'Identity',
62+
'IO',
63+
'lift2',
64+
'lift3',
65+
'Maybe',
66+
'Reader',
67+
'Tuple'
68+
],
69+
global: 'ramdaFantasy',
70+
src: '//wzrd.in/standalone/ramda-fantasy@latest'
71+
}
72+
]
73+
})
74+
}, false)

repl/index.pug

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
extends ../layout.pug
2+
3+
block main
4+
.ramda-repl-wrapper
5+
textarea.ramda-repl-target
6+
7+
block scripts
8+
script(src="https://cdnjs.cloudflare.com/ajax/libs/URI.js/1.18.1/URI.min.js")
9+
script(src="https://cdn.rawgit.com/ramda/repl/master/dist/bundle.js")
10+
script(src="index.js")
11+
12+
block styles
13+
link(href="https://cdn.rawgit.com/ramda/repl/master/dist/bundle.css" rel="stylesheet")

0 commit comments

Comments
 (0)