From 4c43e2c5785a5fd7cab85b19c62a0122cb60b3f0 Mon Sep 17 00:00:00 2001 From: Teddy Wing Date: Sun, 10 Nov 2013 05:11:32 -0500 Subject: Style the '+' URL button --- assets/css/application.css | 52 ++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 52 insertions(+) (limited to 'assets') diff --git a/assets/css/application.css b/assets/css/application.css index 369aa9b..074f5fb 100644 --- a/assets/css/application.css +++ b/assets/css/application.css @@ -25,4 +25,56 @@ header { #samples { margin: 3em 2em; +} + + +/* . Buttons . */ +.button { + border-width: 1px; + border-style: solid; + cursor: pointer; + padding: 0.05em 0.4em 0.2em; + position: relative; + top: -0.07em; + -webkit-border-radius: 3px; + border-radius: 3px; + -webkit-box-shadow: 0px 4px 1px 0px rgba(40, 150, 44, 1); + box-shadow: 0px 4px 1px 0px rgba(40, 150, 44, 1); + -webkit-transition: all 150ms linear; + -moz-transition: all 150ms linear; + -o-transition: all 150ms linear; + -ms-transition: all 150ms linear; + transition: all 150ms linear; +} + +.button:active { + top: 0; + -webkit-box-shadow: 0px 0px 1px 0px rgba(40, 150, 44, 1); + box-shadow: 0px 0px 1px 0px rgba(40, 150, 44, 1); +} + +.button:focus { + outline: none; +} + +.button.green { + background-color: #34bf39; + border-color: #2faf34; + color: #eee; + text-shadow: 0px 1px 2px rgba(0,0,0,0.9); +} + +.button.green:hover { + background-color: #39d740; + color: #fff; +} + +.button.green:active { + background-color: #2ea732; + color: #ddd; +} + +.button.green.large { + font-size: 2em; + line-height: 1; } \ No newline at end of file -- cgit v1.2.3