# HG changeset patch # User Steve Losh # Date 1276906081 14400 # Node ID 5f877e7ce4d7c8fbe19f40c42e22a745adaaf75e # Parent f61b33b27999bf4871aac4a673843f9218ce58c7 web: minor button style changes diff -r f61b33b27999 -r 5f877e7ce4d7 review/static/extra.css --- a/review/static/extra.css Tue Jun 15 20:50:22 2010 -0400 +++ b/review/static/extra.css Fri Jun 18 20:08:01 2010 -0400 @@ -4,14 +4,29 @@ left bottom, left top, color-stop(0.00, rgba(0, 0, 0, 0.15)), - color-stop(1, rgba(255, 255, 255, 0.0)) + color-stop(1, rgba(0, 0, 0, 0.0)) ); background: -moz-linear-gradient( center bottom, rgba(0, 0, 0, 0.15) 0%, - rgba(255, 255, 255, 0.0) 100% + rgba(0, 0, 0, 0.0) 100% ); } +a.button:active span { + background: -webkit-gradient( + linear, + left bottom, + left top, + color-stop(0.00, rgba(0, 0, 0, 0.1)), + color-stop(1, rgba(0, 0, 0, 0.0)) + ); + background: -moz-linear-gradient( + center bottom, + rgba(0, 0, 0, 0.1) 0%, + rgba(0, 0, 0, 0.0) 100% + ); +} + #index .content table tr:nth-child(even) td.node { background: -webkit-gradient( diff -r f61b33b27999 -r 5f877e7ce4d7 review/static/style.css --- a/review/static/style.css Tue Jun 15 20:50:22 2010 -0400 +++ b/review/static/style.css Fri Jun 18 20:08:01 2010 -0400 @@ -87,19 +87,15 @@ border-left: 1px solid #a9a883; border-bottom: 1px solid #989772; } -body .header .remotes form a:active { - margin-top: 1px; - margin-bottom: -1px; -} body .header .remotes form a:focus { - box-shadow: 0px 0px 3px rgba(100, 100, 200, 0.9); - -moz-box-shadow: 0px 0px 3px rgba(100, 100, 200, 0.9); - -webkit-box-shadow: 0px 0px 3px rgba(100, 100, 200, 0.9); + box-shadow: 0px 0px 4px rgba(100, 100, 100, 0.9); + -moz-box-shadow: 0px 0px 4px rgba(100, 100, 100, 0.9); + -webkit-box-shadow: 0px 0px 4px rgba(100, 100, 100, 0.9); } body .header .remotes form a span { display: inline-block; padding: 0 6px; - text-shadow: 0px 1px 1px #fefdd8; + text-shadow: 0px 1px 1px #e5e4bf; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; @@ -109,10 +105,10 @@ border-right: 1px solid #c8c695; border-left: 1px solid #c8c695; border-bottom: 1px solid #aead83; - background-color: #fefdd8; + background-color: #edecc7; } body .header .remotes form a:hover span { - background-color: #fefdd8; + background-color: #edecc7; } body .content { border-top: 1px solid #f8f7e8; @@ -276,19 +272,15 @@ border-left: 1px solid #a6a6a6; border-bottom: 1px solid #959595; } -#changeset .content a.submit:active { - margin-top: 1px; - margin-bottom: -1px; -} #changeset .content a.submit:focus { - box-shadow: 0px 0px 3px rgba(100, 100, 200, 0.9); - -moz-box-shadow: 0px 0px 3px rgba(100, 100, 200, 0.9); - -webkit-box-shadow: 0px 0px 3px rgba(100, 100, 200, 0.9); + box-shadow: 0px 0px 4px rgba(100, 100, 100, 0.9); + -moz-box-shadow: 0px 0px 4px rgba(100, 100, 100, 0.9); + -webkit-box-shadow: 0px 0px 4px rgba(100, 100, 100, 0.9); } #changeset .content a.submit span { display: inline-block; padding: 0 6px; - text-shadow: 0px 1px 1px #fbfbfb; + text-shadow: 0px 1px 1px #e2e2e2; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; @@ -298,10 +290,10 @@ border-right: 1px solid #bbbbbb; border-left: 1px solid #bbbbbb; border-bottom: 1px solid #a4a4a4; - background-color: #fbfbfb; + background-color: #eaeaea; } #changeset .content a.submit:hover span { - background-color: #fbfbfb; + background-color: #eaeaea; } #changeset .content a.cancel, #changeset .content a.cancel-line { cursor: pointer; @@ -323,19 +315,15 @@ border-left: 1px solid #a6a6a6; border-bottom: 1px solid #959595; } -#changeset .content a.cancel:active, #changeset .content a.cancel-line:active { - margin-top: 1px; - margin-bottom: -1px; -} #changeset .content a.cancel:focus, #changeset .content a.cancel-line:focus { - box-shadow: 0px 0px 3px rgba(100, 100, 200, 0.9); - -moz-box-shadow: 0px 0px 3px rgba(100, 100, 200, 0.9); - -webkit-box-shadow: 0px 0px 3px rgba(100, 100, 200, 0.9); + box-shadow: 0px 0px 4px rgba(100, 100, 100, 0.9); + -moz-box-shadow: 0px 0px 4px rgba(100, 100, 100, 0.9); + -webkit-box-shadow: 0px 0px 4px rgba(100, 100, 100, 0.9); } #changeset .content a.cancel span, #changeset .content a.cancel-line span { display: inline-block; padding: 0 6px; - text-shadow: 0px 1px 1px #fbfbfb; + text-shadow: 0px 1px 1px #e2e2e2; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; @@ -345,10 +333,10 @@ border-right: 1px solid #bbbbbb; border-left: 1px solid #bbbbbb; border-bottom: 1px solid #a4a4a4; - background-color: #fbfbfb; + background-color: #eaeaea; } #changeset .content a.cancel:hover span, #changeset .content a.cancel-line:hover span { - background-color: #fbfbfb; + background-color: #eaeaea; } #changeset .content .navigation .middle { display: inline-block; @@ -428,19 +416,15 @@ border-left: 1px solid #a6a6a6; border-bottom: 1px solid #959595; } -#changeset .content .activate a:active { - margin-top: 1px; - margin-bottom: -1px; -} #changeset .content .activate a:focus { - box-shadow: 0px 0px 3px rgba(100, 100, 200, 0.9); - -moz-box-shadow: 0px 0px 3px rgba(100, 100, 200, 0.9); - -webkit-box-shadow: 0px 0px 3px rgba(100, 100, 200, 0.9); + box-shadow: 0px 0px 4px rgba(100, 100, 100, 0.9); + -moz-box-shadow: 0px 0px 4px rgba(100, 100, 100, 0.9); + -webkit-box-shadow: 0px 0px 4px rgba(100, 100, 100, 0.9); } #changeset .content .activate a span { display: inline-block; padding: 0 6px; - text-shadow: 0px 1px 1px #fbfbfb; + text-shadow: 0px 1px 1px #e2e2e2; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; @@ -450,10 +434,10 @@ border-right: 1px solid #bbbbbb; border-left: 1px solid #bbbbbb; border-bottom: 1px solid #a4a4a4; - background-color: #fbfbfb; + background-color: #eaeaea; } #changeset .content .activate a:hover span { - background-color: #fbfbfb; + background-color: #eaeaea; } #changeset .content .togglebox form { float: left; diff -r f61b33b27999 -r 5f877e7ce4d7 review/static/style.less --- a/review/static/style.less Tue Jun 15 20:50:22 2010 -0400 +++ b/review/static/style.less Fri Jun 18 20:08:01 2010 -0400 @@ -52,26 +52,22 @@ .box-shadow(0px, 1px, 3px, rgba(0,0,0,0.1)); .border-radius(4px); .multi-border((@bgcolor - #333), (@bgcolor - #444), (@bgcolor - #555)); - &:active { - margin-top: 1px; - margin-bottom: -1px; - } &:focus { - .box-shadow(0px, 0px, 3px, rgba(100,100,200,0.9)); + .box-shadow(0px, 0px, 4px, rgba(100,100,100,0.9)); } } .button-span(@bgcolor: #ddd, @fcolor: #000000, @fsize: 14px, @lheight: 1.75) { display: inline-block; padding: 0 @fsize/2; - text-shadow: 0px 1px 1px (@bgcolor + #111); + text-shadow: 0px 1px 1px (@bgcolor - #080808); .border-radius(3px); } .button-hover(@bgcolor: #ddd, @fcolor: #000000, @fsize: 14px, @lheight: 1.75) { .multi-border(desaturate(darken(@bgcolor, 10%), 10%), desaturate(darken(@bgcolor, 20%), 20%), desaturate(darken(@bgcolor, 30%), 30%)); - background-color: @bgcolor + #111; + background-color: @bgcolor; } .button-hover-span(@bgcolor: #ddd, @fcolor: #000000, @fsize: 14px, @lheight: 1.75) { - background-color: @bgcolor + #111; + background-color: @bgcolor; } .group:after {