Skip to content
This repository

Minor cosmetic changes #27

Merged
merged 4 commits into from over 1 year ago

2 participants

Paolo "Nusco" Perrotta Anthony Grimes
Paolo "Nusco" Perrotta

The one more visible change: I replaced links to GH with a GH banner. The banner doesn't work under IE, though. If you like the change but you care about IE at all, then I can fix that as well (I borrowed the banner from simonwhitaker/github-fork-ribbon-css so that I could customize the colour).

Anthony Grimes Raynes merged commit 2f2f59c into from
Anthony Grimes
Owner

Merged. Love the banner.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
This page is out of date. Refresh to see the latest.
1  .gitignore
@@ -3,3 +3,4 @@ pom.xml
3 3 lib
4 4 classes
5 5 *~
  6 +.lein-deps-sum
4 project.clj
@@ -2,9 +2,7 @@
2 2 :description "A simple web-based Clojure REPL for trying out Clojure without having to install it."
3 3 :dependencies [[org.clojure/clojure "1.4.0"]
4 4 [noir "1.3.0-beta10"]
5   - [commons-lang/commons-lang "2.5"]
  5 + [commons-lang/commons-lang "2.5"]
6 6 [clojail "1.0.1"]]
7 7 :jvm-opts ["-Djava.security.policy=example.policy""-Xmx80M"]
8 8 :main tryclojure.server)
9   -
10   -
74 resources/public/css/gh-fork-ribbon.css
... ... @@ -0,0 +1,74 @@
  1 +/* From https://github.com/simonwhitaker/github-fork-ribbon-css */
  2 +
  3 +/* Left will inherit from right (so we don't need to duplicate code */
  4 +.github-fork-ribbon {
  5 + /* The right and left lasses determine the side we attach our banner to */
  6 + position: absolute;
  7 +
  8 + /* Add a bit of padding to give some substance outside the "stitching" */
  9 + padding: 2px 0;
  10 +
  11 + /* Set the base colour */
  12 + background-color: #5881d8;
  13 +
  14 + /* Set a gradient: transparent black at the top to almost-transparent black at the bottom */
  15 + background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.00)), to(rgba(0, 0, 0, 0.15)));
  16 + background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.00), rgba(0, 0, 0, 0.15));
  17 + background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.00), rgba(0, 0, 0, 0.15));
  18 + background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.00), rgba(0, 0, 0, 0.15));
  19 + background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0.00), rgba(0, 0, 0, 0.15));
  20 + background-image: linear-gradient(top, rgba(0, 0, 0, 0.00), rgba(0, 0, 0, 0.15));
  21 + filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#000000', EndColorStr='#000000');
  22 +
  23 + /* Add a drop shadow */
  24 + -webkit-box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.5);
  25 + box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.5);
  26 +}
  27 +.github-fork-ribbon a {
  28 + /* Set the font */
  29 + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  30 + font-size: 13px;
  31 + font-weight: 700;
  32 + color: white;
  33 +
  34 + /* Set the text properties */
  35 + text-decoration: none;
  36 + text-shadow: 0 -1px rgba(0,0,0,0.5);
  37 + text-align: center;
  38 +
  39 + /* Set the geometry. If you fiddle with these you'll also need to tweak the top and right values in #github-fork-ribbon. */
  40 + width: 200px;
  41 + line-height: 20px;
  42 +
  43 + /* Set the layout properties */
  44 + display: inline-block;
  45 + padding: 2px 0;
  46 +
  47 + /* Add "stitching" effect */
  48 + border-width: 1px 0;
  49 + border-style: dotted;
  50 + border-color: rgba(255,255,255,0.7);
  51 +}
  52 +
  53 +.github-fork-ribbon-wrapper {
  54 + width: 150px;
  55 + height: 150px;
  56 + position: absolute;
  57 + overflow: hidden;
  58 + top: 0;
  59 +}
  60 +
  61 +.github-fork-ribbon-wrapper.right {
  62 + right: 0;
  63 +}
  64 +
  65 +.github-fork-ribbon-wrapper.right .github-fork-ribbon {
  66 + top: 42px;
  67 + right: -43px;
  68 +
  69 + /* Rotate the banner 45 degrees */
  70 + -webkit-transform: rotate(45deg);
  71 + -moz-transform: rotate(45deg);
  72 + -o-transform: rotate(45deg);
  73 + transform: rotate(45deg);
  74 +}
22 src/tryclojure/views/home.clj
@@ -24,10 +24,6 @@
24 24 "The sandbox will automatically be wiped after 15 minutes and if you evaluate more after that,"
25 25 "It'll be in an entirely new namespace/sandbox."]
26 26 [:p.bottom
27   - "You can find the site's source and such on its "
28   - (link-to "http://github.com/Raynes/tryclojure" "github")
29   - " page."]
30   - [:p.bottom
31 27 "TryClojure is written in Clojure and JavaScript (JQuery), powered by "
32 28 (link-to "https://github.com/flatland/clojail" "clojail")
33 29 " and Chris Done's "
@@ -38,22 +34,24 @@
38 34 [:p.bottom
39 35 "Welcome to Try Clojure. See that little box up there? That's a Clojure repl. You can type "
40 36 "expressions and see their results right here in your browser. We also have a brief tutorial to "
41   - "give you a taste of Clojure. Try it out by typing " [:code.expr "tutorial"] " in the console!"]
42   - [:p.bottom
43   - "Check out the site's source on "
44   - (link-to "http://github.com/Raynes/tryclojure" "github")
45   - "!"])
  37 + "give you a taste of Clojure. Try it out by typing " [:code.expr "tutorial"] " in the console!"])
46 38
47 39 (defn root-html []
48 40 (html5
49 41 [:head
50   - (include-css "/resources/public/css/tryclojure.css")
  42 + (include-css "/resources/public/css/tryclojure.css"
  43 + "/resources/public/css/gh-fork-ribbon.css")
51 44 (include-js "http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"
52 45 "/resources/public/javascript/jquery-console/jquery.console.js"
53 46 "/resources/public/javascript/tryclojure.js")
54 47 [:title "Try Clojure"]]
55 48 [:body
56 49 [:div#wrapper
  50 + [:div.github-fork-ribbon-wrapper.right
  51 + [:div.github-fork-ribbon
  52 + (link-to "https://github.com/Raynes/tryclojure" "Fork me on GitHub")
  53 + ]
  54 + ]
57 55 [:div#content
58 56 [:div#header
59 57 [:h1
@@ -67,9 +65,7 @@
67 65 [:a#about.buttons.last "about"]]
68 66 [:div#changer (home-html)]]
69 67 [:div.footer
70   - [:p.bottom "©2011 Anthony Grimes and numerous contributors"]
71   - [:p.bottom
72   - "Built with "
  68 + [:p.bottom "©2011-2012 Anthony Grimes and numerous contributors. Built with "
73 69 (link-to "http://webnoir.org" "Noir")
74 70 "."]]
75 71 (javascript-tag

Tip: You can add notes to lines in a file. Hover to the left of a line to make a note

Something went wrong with that request. Please try again.