From 63351a8038b912aad91dd5898c57049b56d969ef Mon Sep 17 00:00:00 2001 From: Jhony Lucas Date: Thu, 16 Oct 2014 19:52:50 -0300 Subject: [PATCH] New style --- css/explaingit.css | 29 +++++++++++++++++++++++------ index.html | 32 ++++++++++++++++++++------------ 2 files changed, 43 insertions(+), 18 deletions(-) diff --git a/css/explaingit.css b/css/explaingit.css index f7d1c36..7108431 100644 --- a/css/explaingit.css +++ b/css/explaingit.css @@ -1,5 +1,19 @@ /* styles */ - +header { + padding-top: 20px; + padding-bottom: 20px; + margin-bottom: 20px; + background-color: #CE54DF; + color: #ffffff; + box-shadow: 0px 3px 0px rgba(169, 68, 183, 0.9); +} + + header h1{ + text-shadow: 0px 3px 0px rgba(169, 68, 183, 1); + } + header a h5 { color: #ffffff; display: inline;} + header i { color: #ffffff; } + body, html { height: 100%; } @@ -8,6 +22,9 @@ body, html { padding-top: 10px; } +a { text-decoration: none;} +p a { color: #CE54DF; } + a.openswitch { display: block; } @@ -19,9 +36,7 @@ a.openswitch.selected { .command-list, .example-list { margin-top: 10px; margin-bottom: 10px; - padding: 10px 0; - border-bottom: 2px dashed #888; - border-top: 2px dashed #888; + padding: 10px 10px; background-color: #EEE; } @@ -43,10 +58,12 @@ a.openswitch.selected { } span.cmd { - background-color: #222222; - color: #FFFFFF; + background-color: #F0F0F0; + color: #181818; font-family: Courier New; padding: 0 0.2em; + border-radius: 3px; + border: 1px solid #E4E4E4; } .svg-container { diff --git a/index.html b/index.html index c9df4d4..1b278be 100644 --- a/index.html +++ b/index.html @@ -4,20 +4,28 @@ Explain Git with D3 + + + + - - Fork me on GitHub - +
+
+
+

Explain Git visually

+ +
Fork-me
+
+
+
-

Visualizing Git Concepts with D3

+

This website is designed to help you understand some basic git concepts visually. This is my first attempt at using both SVG and D3. I hope it is helpful to you. @@ -35,32 +43,32 @@

Visualizing Git Concepts with D3

-

Basic Commands

+
Basic Commands
git commit git branch
-

Undo Commits

+
Undo Commits
git reset git revert
-

Combine Branches

+
Combine Branches
git merge git rebase
-

Remote Server

+
Remote Server
git fetch git pull
-

 

+
 
git push git tag