[ticket/10431] Adjustments for large buttons

Changing CSS for large buttons to display better on Mac browsers.
Fixing tabs.

PHPBB3-10431
This commit is contained in:
Vjacheslav Trushkin 2013-01-15 23:12:44 +02:00
parent 8e700f7e2b
commit 63b037b4bd

View file

@ -18,56 +18,57 @@
/* Rolloff state */ /* Rolloff state */
.buttons div a { .buttons div a {
display: inline-block; display: inline-block;
line-height: 16px; line-height: 17.5px;
font-size: 13px; height: 18px;
font-size: 13px;
white-space: nowrap; white-space: nowrap;
border: 1px solid #c7c3bf; border: 1px solid #c7c3bf;
border-radius: 4px; border-radius: 4px;
background: #fff none 0 0 repeat-x; background: #fff none 0 0 repeat-x;
background-image: -moz-linear-gradient(top, #fff, #e9e9e9); background-image: -moz-linear-gradient(top, #fff, #e9e9e9);
background-image: -webkit-linear-gradient(top, #fff, #e9e9e9); background-image: -webkit-linear-gradient(top, #fff, #e9e9e9);
background-image: -o-linear-gradient(top, #fff, #e9e9e9); background-image: -o-linear-gradient(top, #fff, #e9e9e9);
background-image: linear-gradient(to bottom, #fff, #e9e9e9); background-image: linear-gradient(to bottom, #fff, #e9e9e9);
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#ffffff', EndColorStr='#e9e9e9')"; -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#ffffff', EndColorStr='#e9e9e9')";
box-shadow: 0 0 0 1px #fff inset; box-shadow: 0 0 0 1px #fff inset;
-webkit-box-shadow: 0 0 0 1px #fff inset; -webkit-box-shadow: 0 0 0 1px #fff inset;
text-shadow: 1px 1px 0 #fff, -1px -1px 1px rgba(188, 42, 77, 0.25); padding: 2px 22px 2px 8px;
padding: 3px 22px 3px 8px; font-family: Verdana, Arial, Helvetica;
font-family: "Futura-Medium", Verdana, Arial, Helvetica; color: #bc2a4d !important;
color: #bc2a4d !important; position: relative;
position: relative; text-decoration: none !important;
text-decoration: none !important; outline-style: none !important;
outline-style: none !important; vertical-align: bottom;
*padding-right: 8px; *padding-right: 8px;
} }
.buttons div span { display: none; } .buttons div span { display: none; }
.buttons div a:hover { .buttons div a:hover {
border-color: #0a8ed0; border-color: #0a8ed0;
background-image: -moz-linear-gradient(top, #e9e9e9, #fff); background-image: -moz-linear-gradient(top, #e9e9e9, #fff);
background-image: -webkit-linear-gradient(top, #e9e9e9, #fff); background-image: -webkit-linear-gradient(top, #e9e9e9, #fff);
background-image: -o-linear-gradient(top, #e9e9e9, #fff); background-image: -o-linear-gradient(top, #e9e9e9, #fff);
background-image: linear-gradient(to bottom, #e9e9e9, #fff); background-image: linear-gradient(to bottom, #e9e9e9, #fff);
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#e9e9e9', EndColorStr='#ffffff')"; -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#e9e9e9', EndColorStr='#ffffff')";
text-shadow: 1px 1px 0 #fff, -1px -1px 0 #fff, -1px -1px 0 rgba(188, 42, 77, 0.2); text-shadow: 1px 1px 0 #fff, -1px -1px 0 #fff, -1px -1px 0 rgba(188, 42, 77, 0.2);
} }
.buttons div a:after { .buttons div a:after {
content: ''; content: '';
display: block; display: block;
position: absolute; position: absolute;
top: 50%; top: 50%;
right: 6px; right: 6px;
width: 12px; width: 12px;
height: 12px; height: 12px;
margin-top: -6px; margin-top: -6px;
background: url("images/buttons.png") 0px 0 no-repeat; background: url("images/buttons.png") 0px 0 no-repeat;
} }
.buttons div a:hover:after { .buttons div a:hover:after {
background-position: 0 -20px; background-position: 0 -20px;
} }
/* Big button images */ /* Big button images */
.buttons div.reply-icon a:after, .buttons div.pmreply-icon a:after { background-position: -20px 0; } .buttons div.reply-icon a:after, .buttons div.pmreply-icon a:after { background-position: -20px 0; }