mirror of
https://gerrit.wikimedia.org/r/mediawiki/extensions/VisualEditor
synced 2024-09-27 12:16:51 +00:00
b0b832a796
Assumption about toolbar height never exceeding 88px is not correct. At least in Chrome, after setting in advanced configuration font size to "Large" instead of "Medium", the toolbar's height is 110px and part of it is transparent. Because it is transparent user can see content behind it when scrolled down, which makes for a not really good experience. Change-Id: Ibdc2410cc4ab29bfe774961fc062d172386975d4
105 lines
1.9 KiB
CSS
105 lines
1.9 KiB
CSS
/*!
|
|
* VisualEditor UserInterface Toolbar styles.
|
|
*
|
|
* @copyright 2011-2013 VisualEditor Team and others; see AUTHORS.txt
|
|
* @license The MIT License (MIT); see LICENSE.txt
|
|
*/
|
|
|
|
.ve-ui-toolbar {
|
|
clear: both;
|
|
}
|
|
|
|
.ve-ui-toolbar-bottom {
|
|
position: static;
|
|
}
|
|
|
|
.ve-ui-toolbar-bar {
|
|
border-bottom: solid 1px #ccc;
|
|
position: relative;
|
|
/* @embed */
|
|
background-color: white;
|
|
background-image: url(images/fade-up.png);
|
|
background-position: left bottom;
|
|
background-repeat: repeat-x;
|
|
padding-bottom: 1px;
|
|
line-height: 1em;
|
|
}
|
|
|
|
.ve-ui-toolbar-floating .ve-ui-toolbar-bar {
|
|
top: 0;
|
|
position: fixed;
|
|
border-radius: 0;
|
|
z-index: 100;
|
|
border-top: none;
|
|
}
|
|
|
|
.ve-ui-toolbar-bottom .ve-ui-toolbar-bar {
|
|
position: absolute;
|
|
}
|
|
|
|
.ve-ui-toolbar-actions {
|
|
float: right;
|
|
padding: 0.25em;
|
|
font-size: 0.8em;
|
|
}
|
|
|
|
.ve-ui-toolbar-tools {
|
|
float: left;
|
|
}
|
|
|
|
.ve-ui-toolbar-tools,
|
|
.ve-ui-toolbar-actions,
|
|
.ve-ui-toolbar-shadow {
|
|
-webkit-user-select: none;
|
|
-moz-user-select: none;
|
|
-ms-user-select: none;
|
|
-o-user-select: none;
|
|
user-select: none;
|
|
}
|
|
|
|
.ve-ui-toolbar-group {
|
|
display: inline-block;
|
|
padding: 0.25em;
|
|
border-right: solid 1px #f0f3f5;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.ve-ui-toolbar-divider {
|
|
display: inline-block;
|
|
width: 1px;
|
|
height: 24px;
|
|
margin: 0.5em 0 0.5em 0.5em;
|
|
background-color: #ddd;
|
|
}
|
|
|
|
.ve-ui-toolbar-label {
|
|
display: inline-block;
|
|
padding: 0.5em 0.75em;
|
|
line-height: 22px;
|
|
font-size: 0.8em;
|
|
color: #555;
|
|
vertical-align: top;
|
|
}
|
|
|
|
.ve-ui-toolbar-shadow {
|
|
/* @embed */
|
|
background-image: url(images/toolbar-shadow.png);
|
|
background-position: left top;
|
|
background-repeat: repeat-x;
|
|
position: absolute;
|
|
bottom: -9px;
|
|
height: 9px;
|
|
width: 100%;
|
|
pointer-events: none;
|
|
-webkit-transition: opacity 500ms ease-in-out;
|
|
-moz-transition: opacity 500ms ease-in-out;
|
|
-ms-transition: opacity 500ms ease-in-out;
|
|
-o-transition: opacity 500ms ease-in-out;
|
|
transition: opacity 500ms ease-in-out;
|
|
opacity: 0.125;
|
|
}
|
|
|
|
.ve-ui-toolbar-floating .ve-ui-toolbar-shadow {
|
|
opacity: 0.5;
|
|
}
|