Files
mediawiki-extensions-Univer…/resources/css/ext.uls.css
pginer 833f8f63d6 Fix to reduce the ammount of settings text
Settings text on the main ULS view can grow longer for some languages running out of space.
This change does the following to avoid that:
* Removes setting section explanations and shows them as a tooltip on hover.
* Adjusts style for adjusting space between setting sections.
* Keyboard image has been adjusted to match the display settings image.

Change-Id: I42ec5cb35b3d4df977a6eff28ad55891f4135356
2012-10-31 18:37:06 +05:30

191 lines
6.2 KiB
CSS

div#settings-block {
border-left: 1px solid #C9C9C9;
padding-left: 4px;
line-height: 1.2em;
}
#settings-block div.display-settings-block,
#settings-block div.input-settings-block {
margin: 8px 0;
color: #565656;
}
#settings-block div.display-settings-block:hover,
#settings-block div.input-settings-block:hover {
color: #252525;
}
.uls-ui-languages button {
width: 23%;
text-overflow: ellipsis;
margin-right: 15px;
}
.uls-ui-languages button#uls-more-languages {
width: auto;
}
.settings-title {
font-size: 11pt;
}
.settings-text {
color: #555555;
font-size: 9pt;
}
div.display-settings-block:hover .settings-text {
color: #252525;
}
button.button {
background-color: #E6E6E6;
background-image: -webkit-linear-gradient(top, #f0f0f0, #e6e6e6);
background-image: -moz-linear-gradient(center top, #F0F0F0, #E6E6E6);
background-image: linear-gradient(#F0F0F0, #E6E6E6);
border: 1px solid #C9C9C9;
border-radius: 3px 3px 3px 3px;
color: #252525;
cursor: pointer;
display: inline-block;
font: bold 0.813em/1 Arial, sans-serif;
padding: 0.4065em 1.2195em;
text-align: center;
text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
}
button.button:hover {
background-color: #F0F0F0;
background-image: -webkit-linear-gradient(top, #f8f8f8, #f0f0f0);
background-image: -moz-linear-gradient(center top, #F8F8F8, #F0F0F0);
background-image: linear-gradient(#F8F8F8, #F0F0F0);
border-color: #C9C9C9;
}
button.button:active,
button.button.down {
background-color: #D8D8D8;
background-image: -webkit-linear-gradient(top, #d3d3d3, #d8d8d8);
background-image: -moz-linear-gradient(center top, #D3D3D3, #D8D8D8);
background-image: linear-gradient(#D3D3D3, #D8D8D8);
border-color: #C9C9C9;
}
button.button:disabled,
button.button.hover:disabled,
button.button.disabled,
button.button.disabled:hover {
background-color: #F0F0F0;
background-image: -webkit-linear-gradient(top, #f0f0f0, #f0f0f0);
background-image: -moz-linear-gradient(center top, #F0F0F0, #F0F0F0);
background-image: linear-gradient(#F0F0F0, #F0F0F0);
border-color: #E3E3E3;
color: #C9C9C9;
cursor: default;
}
button.button.blue {
background-color: #3366BB;
background-image: -webkit-linear-gradient(top, #3670c8, #3366bb);
background-image: -moz-linear-gradient(center top, #3670C8, #3366BB);
background-image: -moz-linear-gradient(#3670C8, #3366BB);
border: 1px solid #33589F;
color: #FFFFFF;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}
button.button.blue:hover {
background-color: #3F77D7;
background-image: -webkit-linear-gradient(top, #4c84da, #3f77d7);
background-image: -moz-linear-gradient(center top, #4C84DA, #3F77D7);
background-image: -moz-linear-gradient(#4C84DA, #3F77D7);
}
button.button.blue:active,
button.button.blue.down:active {
background-color: #2A549C;
background-image: -webkit-linear-gradient(top, #2d5ea9, #2a549c);
background-image: -moz-linear-gradient(center top, #2D5EA9, #2A549C);
background-image: linear-gradient(#2D5EA9, #2A549C);
}
button.button.blue:disabled,
button.button.blue.hover:disabled,
button.button.blue.disabled,
button.button.blue.disabled:hover {
background-color: #7297D7;
background-image: -webkit-linear-gradient(top, #7297d7, #7297d7);
background-image: -moz-linear-gradient(center top, #7297D7, #7297D7);
background-image: linear-gradient(#7297D7, #7297D7);
border-color: #5E89D1;
color: white;
cursor: default;
text-shadow: none;
}
button.button.green {
color: #ffffff;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
background-color: #008740;
background-image: -ms-linear-gradient(top, #00974b, #008740);
background-image: -moz-linear-gradient(top, #00974b, #008740);
background-image: linear-gradient(#00974b, #008740);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #00974b),
color-stop(100%, #008740) );
background-image: -webkit-linear-gradient(top, #00974b, #008740);
border: 1px #0f9b3b solid;
-ms-filter:
"progid:DXImageTransform.Microsoft.gradient(startColorstr='#00974b', endColorstr='#008740', GradientType=0)";
filter: progid:dximagetransform.microsoft.gradient(startColorstr='#00974b',
endColorstr='#008740', GradientType=0 );
}
button.button.green:hover {
background-color: #119750;
background-image: -moz-linear-gradient(top, #10a65b, #119750);
background-image: -ms-linear-gradient(top, #10a65b, #119750);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #10a65b),
color-stop(100%, #119750) );
background-image: -webkit-linear-gradient(top, #10a65b, #119750);
background-image: linear-gradient(#10a65b, #119750);
-ms-filter:
"progid:DXImageTransform.Microsoft.gradient(startColorstr='#10a65b', endColorstr='#119750', GradientType=0)";
filter: progid:dximagetransform.microsoft.gradient(startColorstr='#10a65b',
endColorstr='#119750', GradientType=0 );
}
button.button.green:active {
background-color: #007236;
background-image: -moz-linear-gradient(top, #007236, #007236);
background-image: -ms-linear-gradient(top, #007236, #007236);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #007236),
color-stop(100%, #007236) );
background-image: -webkit-linear-gradient(top, #007236, #007236);
background-image: linear-gradient(#007236, #007236);
-ms-filter:
"progid:DXImageTransform.Microsoft.gradient(startColorstr='#007236', endColorstr='#007236', GradientType=0)";
filter: progid:dximagetransform.microsoft.gradient(startColorstr='#007236',
endColorstr='#007236', GradientType=0 );
}
button.button.green:disabled,
button.button.green:disabled.hover,
button.button.green.disabled,
button.button.green.disabled:hover
{
color: white;
text-shadow: none;
cursor: default;
background-color: #2ca368;
background-image: -moz-linear-gradient(top, #2ca368, #2ca368);
background-image: -ms-linear-gradient(top, #2ca368, #2ca368);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #2ca368),
color-stop(100%, #2ca368) );
background-image: -webkit-linear-gradient(top, #2ca368, #2ca368);
background-image: linear-gradient(#2ca368, #2ca368);
border-color: #278f5b;
-ms-filter:
"progid:DXImageTransform.Microsoft.gradient(startColorstr='#2ca368', endColorstr='#2ca368', GradientType=0)";
filter: progid:dximagetransform.microsoft.gradient(startColorstr='#2ca368',
endColorstr='#2ca368', GradientType=0 );
}