Skip to content

Commit 3a59325

Browse files
committed
Update theme to match purescript.org
1 parent ef9ddac commit 3a59325

File tree

6 files changed

+128
-78
lines changed

6 files changed

+128
-78
lines changed

Main.hs

Lines changed: 26 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,7 @@ import Control.Monad (when, forM_)
3333
import Control.Monad.Trans
3434
import qualified Data.Map as M
3535
import Text.Blaze.Html
36+
import Text.Blaze.Internal
3637
import Text.Blaze.Html.Renderer.Text
3738
import qualified Text.Blaze.Html5 as H
3839
import qualified Text.Blaze.Html5.Attributes as A
@@ -76,9 +77,6 @@ str = id
7677
mono :: H.Html -> H.Html
7778
mono h = h ! A.class_ "mono"
7879

79-
examplesJs :: String
80-
examplesJs = BU.toString $(embedFile "assets/examples.js")
81-
8280
css :: String
8381
css = BU.toString $(embedFile "assets/style.css")
8482

@@ -114,7 +112,7 @@ page ex input res = html $ renderHtml $ do
114112
H.head $ do
115113
H.title $ H.toHtml $ str "Try PureScript!"
116114
H.meta ! A.name "viewport" ! A.content "width=device-width, initial-scale=1.0"
117-
H.link ! A.rel "stylesheet" ! A.type_ "text/css" ! A.href "http://fonts.googleapis.com/css?family=Lato:300,400,700"
115+
H.link ! A.rel "stylesheet" ! A.type_ "text/css" ! A.href "http://fonts.googleapis.com/css?family=PT+Serif:400,700"
118116
H.link ! A.rel "stylesheet" ! A.type_ "text/css" ! A.href "http://fonts.googleapis.com/css?family=Ubuntu+Mono"
119117
H.style $ H.toHtml $ str css
120118
H.script ! A.type_ "text/javascript" $ preEscapedToHtml gaq
@@ -123,40 +121,33 @@ page ex input res = html $ renderHtml $ do
123121
H.script ! A.type_ "text/javascript" ! A.src "//cdnjs.cloudflare.com/ajax/libs/ace/1.1.01/mode-haskell.js" $ mempty
124122
H.script ! A.type_ "text/javascript" ! A.src "//cdnjs.cloudflare.com/ajax/libs/ace/1.1.01/theme-dawn.js" $ mempty
125123
H.body $ do
126-
H.div ! A.class_ "header" $ do
127-
H.div ! A.class_ "center" $ do
124+
H.a ! A.href "https://github.com/purescript" $
125+
H.img ! A.style "position: absolute; top: 0; right: 0; border: 0;"
126+
! A.src "https://github-camo.global.ssl.fastly.net/365986a132ccd6a44c23a9169022c0b5c890c387/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f7265645f6161303030302e706e67"
127+
! A.alt "Fork me on GitHub"
128+
! customAttribute "data-canonical-src" "https://s3.amazonaws.com/github/ribbons/forkme_right_red_aa0000.png"
129+
H.div ! A.class_ "wrapper" $ do
130+
H.div ! A.class_ "header" $ do
128131
H.h1 $ H.toHtml $ str "Try PureScript!"
129-
H.p $ H.toHtml $ str "Type PureScript code below and press 'Compile' to view the compiled Javascript."
130-
H.p $ mconcat [ H.a ! A.href "http://functorial.com/purescript" $ H.toHtml $ str "Documentation"
131-
, H.toHtml $ str ", "
132-
, H.a ! A.href "http://github.com/paf31/purescript" $ H.toHtml $ str "Compiler Source"
133-
, H.toHtml $ str ", "
134-
, H.a ! A.href "http://github.com/paf31/trypurescript" $ H.toHtml $ str "Try PureScript Source" ]
135-
H.div ! A.class_ "splitter" $ mempty
136-
H.div ! A.class_ "main" $ do
137-
H.div ! A.class_ "center" $ do
132+
H.div ! A.class_ "body" $ do
133+
H.p $ H.toHtml $ str "Type PureScript code below and press 'Compile', or select one of the examples below:"
134+
135+
H.h2 $ H.toHtml $ str "Examples"
136+
H.ul $ do
137+
forM_ examples $ \(name, (title, _)) ->
138+
H.li $ H.a ! A.href (fromString $ "/example/" ++ name) $ H.toHtml title
139+
138140
let (success, text) = responseToJs res
139-
H.div $ do
140-
H.select ! A.style "float: right;" ! A.id "examples" $ do
141-
H.option ! A.value "" $ "Examples"
142-
H.option ! A.value "" $ ""
143-
forM_ examples $ \(name, (title, _)) -> case () of
144-
_ | ex == Just name -> H.option ! A.value (fromString name) ! A.selected "selected" $ H.toHtml title
145-
_ -> H.option ! A.value (fromString name) $ H.toHtml title
146-
H.script ! A.type_ "text/javascript" $ preEscapedToHtml examplesJs
147-
H.div ! A.style "clear: right;" $ mempty
148-
H.div ! A.style "position: relative; "$ do
149-
H.div ! A.style "position: absolute; width: 50%;" $ do
150-
H.h2 $ H.toHtml $ str "PureScript Code"
151-
H.form ! A.action "/compile" ! A.method "POST" $ do
152-
H.div ! A.id "code" $ mempty
153-
H.textarea ! A.name "code" ! A.id "textarea" ! A.style "display: none;" $ maybe mempty (H.toHtml . str) input
154-
H.div $ H.button ! A.type_ "submit" $ H.toHtml $ str "Compile"
155-
H.div ! A.style "position: absolute; width: 50%; left: 50%;" $ do
156-
H.h2 $ H.toHtml $ str "Generated Javascript"
157-
H.div ! A.id "js" $ H.toHtml . str $ text
158-
H.script ! A.type_ "text/javascript" $ preEscapedToHtml $ str $ "var compiledSuccessfully = " ++ if success then "true;" else "false;"
141+
142+
H.h2 $ H.toHtml $ str "PureScript Code"
143+
H.form ! A.action "/compile" ! A.method "POST" $ do
144+
H.div ! A.id "code" $ mempty
145+
H.textarea ! A.name "code" ! A.id "textarea" ! A.style "display: none;" $ maybe mempty (H.toHtml . str) input
146+
H.div $ H.button ! A.type_ "submit" $ H.toHtml $ str "Compile"
159147
H.script ! A.type_ "text/javascript" $ preEscapedToHtml ace
148+
149+
H.h2 $ H.toHtml $ str "Generated Javascript"
150+
H.pre $ H.code $ H.toHtml . str $ text
160151

161152
responseToJs :: Maybe Response -> (Bool, String)
162153
responseToJs Nothing = (False, "")

assets/ace.js

Lines changed: 5 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,30 +1,15 @@
11
var editor = ace.edit('code');
2+
23
editor.setTheme('ace/theme/dawn');
34
editor.renderer.setShowGutter(false);
5+
46
var session = editor.getSession();
7+
58
session.setMode('ace/mode/haskell');
69
session.setValue($('#textarea').val());
710
session.setUseWrapMode(true);
811
session.on('change', function(){
912
$('#textarea').val(editor.getSession().getValue());
1013
});
11-
if ($('#js')[0]) {
12-
var js = ace.edit('js');
13-
js.setTheme('ace/theme/dawn');
14-
js.renderer.setShowGutter(false);
15-
js.setReadOnly(true);
16-
var session = js.getSession();
17-
session.setUseWrapMode(true);
18-
if (compiledSuccessfully) {
19-
session.setMode('ace/mode/javascript');
20-
}
21-
}
22-
function setHeight() {
23-
var top = $('#code').offset().top;
24-
var tot = $(window).height();
25-
var height = Math.max(tot - top - 50, 200);
26-
$('#code').height(height + 'px');
27-
$('#js').height(height + 'px');
28-
}
29-
$(setHeight);
30-
$(window).on('resize', setHeight);
14+
15+
$('#code').height('250px');

assets/examples.js

Lines changed: 0 additions & 6 deletions
This file was deleted.

assets/style.css

Lines changed: 92 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,92 @@
1-
body { font-family: 'Lato', sans-serif; color: #404040; margin: 0; }
2-
.mono { font-family: 'Ubuntu Mono', monospace; white-space: pre; word-break: break-all; word-wrap: break-word; }
3-
.header { margin: 0; background: #202028; box-shadow: 0 0 10px #808080; color: #E0E0E0; }
4-
.splitter { margin: 0; height: 5px; background: #606068; }
5-
.center { margin: 0 auto; padding: 20px; }
6-
a { color: #808080; }
7-
button { background: #d0d0d0; color: #606060; padding-top: 3px; padding-bottom: 3px; font-weight: bold; border-radius: 1px; border: 1px solid #c0c0c0; box-shadow: 1px 1px 0 0 #ffffff inset; padding-left: 15px; padding-right: 15px; cursor: pointer; }
8-
button:hover { background: #e0e0e0; }
9-
#code, #js { margin: 10px; }
1+
/* Page layout */
2+
3+
.wrapper {
4+
max-width: 750px;
5+
margin: 0 auto;
6+
padding: 20px;
7+
}
8+
9+
.header {
10+
border-bottom: 1px solid #ddd;
11+
}
12+
13+
.footer {
14+
margin: 40px 0 20px 0;
15+
border-top: 1px solid #ddd;
16+
font-size: 12px;
17+
}
18+
19+
/* Typography */
20+
21+
body
22+
{
23+
font: 18px "PT Serif", Georgia, Times, Serif;
24+
line-height: 150%;
25+
color: #404040;
26+
margin: 0;
27+
}
28+
29+
h1, h2, h3 {
30+
line-height: 110%;
31+
}
32+
33+
h1 {
34+
margin: 40px 0 20px 0;
35+
}
36+
37+
h2, h3 {
38+
margin: 40px 0 10px 0;
39+
}
40+
41+
.info {
42+
margin-top: -6px;
43+
font-size: 12px;
44+
font-variant: small-caps;
45+
}
46+
47+
blockquote {
48+
font-style: italic;
49+
display: block;
50+
padding: 10px 40px;
51+
margin: 0;
52+
}
53+
54+
pre {
55+
overflow: auto;
56+
}
57+
58+
pre, code {
59+
font: 14px Consolas, "Liberation Mono", Courier, monospace;
60+
background: #f8f8f8;
61+
border: 1px solid #eee;
62+
border-radius: 3px;
63+
padding: 2px 4px;
64+
}
65+
66+
pre code {
67+
background: none;
68+
border: 0;
69+
padding: 0;
70+
}
71+
72+
a {
73+
color: #800000;
74+
}
75+
76+
button {
77+
background: #d0d0d0;
78+
color: #606060;
79+
padding-top: 3px;
80+
padding-bottom: 3px;
81+
font-weight: bold;
82+
border-radius: 1px;
83+
border: 1px solid #c0c0c0;
84+
box-shadow: 1px 1px 0 0 #ffffff inset;
85+
padding-left: 15px;
86+
padding-right: 15px;
87+
cursor: pointer;
88+
}
89+
90+
button:hover {
91+
background: #e0e0e0;
92+
}

examples/default.purs

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,3 @@
1-
-- Type PureScript code here and click 'Compile' ...
2-
--
3-
-- Or select an example from the list at the top right of the page
4-
51
module Main where
62

73
import Debug.Trace

trypurescript.cabal

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -13,10 +13,11 @@ author: Phil Freeman
1313
data-dir: ""
1414

1515
executable trypurescript
16-
build-depends: bytestring >=0.10.0.2 && <0.11, base ==4.*,
17-
scotty -any, purescript ==0.4.10.1, containers -any, mtl -any,
18-
blaze-html -any, cmdtheline -any, monad-unify >=0.2.1 && <0.3,
19-
utf8-string -any, file-embed >=0.0.6
16+
build-depends: blaze-markup >=0.5.1.5 && <0.6,
17+
bytestring >=0.10.0.2 && <0.11, base ==4.*, scotty -any,
18+
purescript ==0.4.10.1, containers -any, mtl -any, blaze-html -any,
19+
cmdtheline -any, monad-unify >=0.2.1 && <0.3, utf8-string -any,
20+
file-embed >=0.0.6
2021
main-is: Main.hs
2122
buildable: True
2223
other-modules: Main

0 commit comments

Comments
 (0)