From: Fabrice Bellingard Date: Thu, 16 Jun 2011 13:15:35 +0000 (+0200) Subject: SONAR-2436 Improve the look&feel of html buttons X-Git-Tag: 2.9~55 X-Git-Url: https://source.dussan.org/?a=commitdiff_plain;h=a626e83fb7c793520382a412fd6ebfe209e618d6;p=sonarqube.git SONAR-2436 Improve the look&feel of html buttons --- diff --git a/sonar-server/src/main/webapp/stylesheets/style.css b/sonar-server/src/main/webapp/stylesheets/style.css index f2ec4559808..39bd63d2a1c 100644 --- a/sonar-server/src/main/webapp/stylesheets/style.css +++ b/sonar-server/src/main/webapp/stylesheets/style.css @@ -307,9 +307,54 @@ a.external { height: 16px; vertical-align: text-bottom; } -button, .button { - max-height: 20px; +button, .button, input[type="submit"], input[type="button"] { + font-weight: bold; + font-size:90%; + text-align: center; + text-decoration: none; + text-shadow: 0 1px 1px rgba(0,0,0,.3); + + cursor: pointer; + outline: none; + margin: 0 2px; + padding: 2px 10px; + -webkit-border-radius: .5em; + -moz-border-radius: .5em; + border-radius: .5em; + -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2); + -moz-box-shadow: 0 1px 2px rgba(0,0,0,.2); + box-shadow: 0 1px 2px rgba(0,0,0,.2); + + color: #d9eef7; + border: solid 1px #0076a3; + background: #0095cd; + background: -webkit-gradient(linear, left top, left bottom, from(#7BCFF5), to(#2B7FB5)); + background: -moz-linear-gradient(top, #7BCFF5, #2B7FB5); + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#7BCFF5', endColorstr='#2B7FB5'); + + vertical-align: baseline; + display: inline-block; + /* zoom and *display = ie7 hack for display:inline-block */ + zoom: 1; + *display: inline; +} +button:hover, .button:hover, input[type="submit"]:hover, input[type="button"]:hover { + text-decoration: none; + background: #007ead; + background: -webkit-gradient(linear, left top, left bottom, from(#0095cc), to(#00678e)); + background: -moz-linear-gradient(top, #0095cc, #00678e); + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0095cc', endColorstr='#00678e'); } +button:active, .button:active, input[type="submit"]:active, input[type="button"]:active { + position: relative; + top: 1px; + color: #80bed6; + background: -webkit-gradient(linear, left top, left bottom, from(#0078a5), to(#00adee)); + background: -moz-linear-gradient(top, #0078a5, #00adee); + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0078a5', endColorstr='#00adee'); +} + +*/ /* ------------------- PAGE ------------------- */ h1 { color: #444;