@openui5/themelib_sap_belize 1.124.1 → 1.125.0

package/src/sap/ui/ux3/themes/sap_belize_base/QuickView.less

@@ -0,0 +1,55 @@
+/* ============================================= */
+/* CSS for controlsap.ui.ux3/QuickView.control   */
+/* ============================================= */
+
+.sapUiUx3QV {
+	padding: 9px;
+	width: 270px;
+	color: @sapUiBaseText;
+	background-color: @sapUiExtraLightBG;
+	border-width: 1px;
+	border-style: solid;
+	border-color: @sapUiMediumBorder;
+	box-sizing: border-box;
+}
+
+.sapUiUx3QVHeader {
+	white-space: nowrap;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	font: bold 14px Arial;
+	margin-bottom: 10px;
+	text-transform: uppercase;
+}
+
+.sapUiUx3QVHeading {
+	white-space: nowrap;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	position: relative;
+	min-height: 32px;
+	margin-bottom: 12px;
+}
+
+.sapUiUx3QVIcon {
+	position: absolute;
+	top: 0;
+	left: 0;
+	max-height: 32px;
+	max-width: 32px;
+	font-size: 28px;
+}
+
+.sapUiUx3QVTitle1 {
+	position: relative;
+	font: bold 16px Arial;
+	margin-left: 42px;
+}
+
+.sapUiUx3QVTitle2 {
+	margin: 3px 0 0 42px;
+	font: 13px Arial;
+}
+
+.sapUiUx3QVBody {
+}

package/src/sap/ui/ux3/themes/sap_belize_base/Shell.less

@@ -0,0 +1,611 @@
+/* ============================================= */
+/* CSS for sap.ui.ux3.Shell.control (base theme) */
+/* ============================================= */
+
+/* Define function to make user-select consistent across browsers */
+.userSelect(@value) {
+	-webkit-user-select: @value;  /* Chrome all / Safari all */
+	-moz-user-select: @value;     /* Firefox all */
+	-ms-user-select: @value;      /* IE 10+ */
+	user-select: @value;          /* Likely future */
+}
+
+.sapUiUx3Shell {
+	margin: 0;
+	padding: 0;
+	border:0;
+	font-family: Arial, Helvetica, sans-serif;
+	width: 100%;
+	overflow-x: hidden;
+	.userSelect(none);
+}
+
+.sapUiUx3ShellHeader {
+	cursor: default;
+	font-size: 13px;
+	color: @sapUiTextSelection;
+	height: 33px; /* may be removed by sapUiUx3ShellHeaderFlex, so having min-height as well makes sense */
+	padding: 12px 20px 0 20px;
+	box-sizing: border-box;
+	white-space: nowrap;
+}
+
+.sapUiUx3ShellHeader,
+.sapUiUx3ShellHeaderImg {
+	display: inline-block;
+	position: fixed;
+	top: 0;
+	left: 0;
+	right: 0;
+	z-index: 4;
+}
+
+.sapUiUx3ShellHeader.sapUiUx3ShellHeaderFlex,
+.sapUiUx3ShellHeaderImg.sapUiUx3ShellHeaderImgFlex {
+	height: auto;
+}
+
+.sapUiUx3ShellHeader > hr {
+	margin: 0;
+	position: absolute;
+	top: 0;
+	left: 0;
+	right: 0;
+	height: 8px;
+	background-color: @sapUiMediumBorder;
+	border: none;
+}
+
+.sapUiUx3ShellHeader > .sapUiUx3ShellHeaderTitleLeft {
+	display: block;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+	padding-top: 3px;
+}
+
+.sapUiUx3ShellHeader > .sapUiUx3ShellHeaderTitleLeft > span {
+	font-size: 0.75rem;
+	font-weight: bold;
+	.userSelect(none);
+}
+
+.sapUiUx3ShellHeader > .sapUiUx3ShellHeaderTitleLeft > img { /* the logo image */
+	vertical-align: top;
+	max-height: 18px;
+	margin-right: 3px;
+	margin-top: -3px;
+	.userSelect(none);
+}
+
+.sapUiUx3ShellHeader.sapUiUx3ShellHeaderFlex > .sapUiUx3ShellHeaderTitleLeft > img {
+	max-height: 40px;
+}
+
+.sapUiUx3ShellHeader .sapUiUx3ShellHeaderTitleRight {
+	float: right;
+}
+
+.sapUiUx3ShellBlockHeaderAccess .sapUiUx3ShellHeaderTitleRight {
+	display: none;
+}
+
+.sapUiUx3ShellHeaderButton {
+	cursor: pointer;
+	display: inline-block;
+	height: 16px;
+	width: 16px;
+	margin: 1px 2px 0;
+	background-position: center center;
+	background-repeat: no-repeat;
+	margin-top: 2px;
+}
+
+.sapUiUx3ShellHeaderSep {
+	display: inline-block;
+	vertical-align: top;
+	height: 10px;
+	width: 1px;
+	background-color: @sapUiMediumLine;
+	margin: 4px 6px 0 6px;
+}
+
+.sapUiUx3ShellHeader-logout:hover {
+	background-color: @sapUiUx3ShellHoverColor;
+}
+
+.sapUiUx3ShellHeader-logout:active {
+	background-color: @sapUiHighlight;
+}
+
+/* Workset area and items */
+.sapUiUx3ShellBg,
+.sapUiUx3ShellBgImg {
+	top: 0;
+	bottom: 0;
+	z-index: 0;
+	position: fixed;
+	width: 100%;
+	right: 0; /* required for Chrome in RTL case */
+	overflow: hidden;
+}
+
+.sapUiUx3ShellBgImg {
+	opacity: 1;
+}
+
+.sapUiUx3ShellWorksetBar {
+	position: absolute;
+	top: 0;
+	left: 0;
+	right: 0;
+	z-index: 1;
+	margin: 48px 40px 0 40px;
+	height: 50px;
+}
+
+/* tool palette area */
+.sapUiUx3ShellToolPaletteArea, .sapUiUx3ShellPaneBar {
+	position: fixed;
+	box-sizing: border-box;
+	bottom: 0;
+	width: @sapUiUx3ShellSideBarBaseWidth;
+	top: 108px;
+}
+
+.sapUiUx3ShellToolPaletteArea {
+	left: 0;
+	background-position: right top;
+	padding-top: 12px;
+	line-height: 1px;
+	.userSelect(none);
+	z-index: 1; /* must be in front of the right-hand side Pane, otherwise that one will overlap when the window is very narrow */
+}
+
+.sapUiUx3ShellNoTools .sapUiUx3ShellToolPaletteArea {
+	width: 0px;
+}
+
+.sapUiUx3ShellNoTools .sapUiUx3ShellToolPaletteArea > * {
+	display: none;
+}
+
+.sapUiUx3ShellNoTools .sapUiUx3ShellToolPaletteArea > .sapUiUx3ShellFocusDummy {
+	display: inline-block;
+}
+
+.sapUiUx3ShellTool {
+	cursor: pointer;
+	display: inline-block;
+	width: @sapUiUx3ShellSideBarBaseWidth;
+	height: 32px;
+	background-position: center center;
+	background-repeat: no-repeat;
+	margin-bottom: 4px;
+	text-align: center;
+	z-index: 0;
+}
+
+
+.sapUiUx3ShellToolFontIcon{
+	font-family: SAP-icons;
+	width: 32px;
+	height: 16px;
+	padding-top: 16px;
+	font-size: 18px;
+	color: @sapUiUx3ShellToolPaletteIconFontColor;
+}
+
+html[data-sap-ui-browser^="ff"] .sapUiUx3ShellToolFontIcon {
+	padding-top: 15px;
+}
+
+.sapUiUx3ShellToolSelected .sapUiUx3ShellToolFontIcon,
+.sapUiUx3ShellToolHover .sapUiUx3ShellToolFontIcon {
+	color: @sapUiTextInverted;
+}
+
+.sapUiUx3ShellTool:hover {
+	background-color: @sapUiUx3ShellHoverColor;
+}
+
+.sapUiUx3ShellTool:active,
+.sapUiUx3ShellTool.sapUiUx3ShellToolSelected {
+	background-color: @sapUiHighlight;
+}
+
+.sapUiUx3ShellTool > img {
+	max-width: 32px;
+	max-height: 32px;
+}
+
+.sapUiUx3ShellToolSep {
+	display: inline-block;
+	width: 20px;
+	height: 0px;
+	margin: 0 0 4px 10px;
+	border: 1px solid @sapUiMediumBorder;
+}
+
+.sapUiUx3TP.sapUiUx3TP-search {
+	padding: 10px 12px;
+}
+
+.sapUiUx3TP-search > .sapUiUx3TPContent > .sapUiSearchField {
+	margin: 0 6px;
+}
+
+.sapUiUx3TP.sapUiUx3TP-feeder {
+	padding: 0;
+}
+
+.sapUiUx3TP-feeder > .sapUiUx3TPContent > .sapUiFeeder {
+	width: 400px;
+	color: @sapUiBaseText;
+	background-color: transparent;
+	border: none;
+}
+
+.sapUiUx3TP-feeder > .sapUiUx3TPContent > .sapUiFeeder > img {
+	display: none;
+}
+
+.sapUiUx3TP-feeder > .sapUiUx3TPContent > .sapUiFeeder > .sapUiFeederInput {
+	margin-left: 0;
+}
+
+.sapUiUx3TP-feeder > .sapUiUx3TPArrow {
+	top: 10px;
+}
+
+.sapUiUx3ShellFocusDummy {
+	display: inline-block;
+	width: 0;
+	height: 0;
+	position: absolute;
+}
+
+.sapUiUx3ShellFocusDummy:focus {
+	outline: none;
+}
+
+
+/* pane bar */
+.sapUiUx3ShellPaneBar {
+	right: 0;
+	width: 292px;
+}
+
+.sapUiUx3ShellNoPane > .sapUiUx3ShellPaneBar {
+	display: none;
+}
+
+.sapUiUx3ShellPaneBar.sapUiUx3ShellPaneBarOpen {
+	width: 292px;
+}
+
+.sapUiUx3ShellPaneBarRight {
+	position: absolute;
+	right: 0px;
+	top: 0px;
+	width: @sapUiUx3ShellSideBarBaseWidth;
+	display: inline-block;
+	height: 100%;
+	box-sizing: border-box;
+	.userSelect(none);
+}
+
+/** Overflow button and menu**/
+
+.sapUiUx3ShellPaneBarRight > .sapUiUx3ShellPaneOverflowButton {
+    position: absolute;
+    display: none;
+    bottom: 0;
+    right: 0;
+    margin: 0;
+
+	box-sizing: border-box;
+	border-top: 1px solid lighten(@sapUiDarkBG, 20%);
+
+    width: @sapUiUx3ShellSideBarBaseWidth;
+    height: @sapUiUx3ShellPaneOverflowButtonHeight;
+
+    color: lighten(@sapUiMediumText, 10%);
+    cursor: pointer;
+    padding: 5px 0px 3px 0px;
+    text-align: center;
+    vertical-align: middle;
+
+	margin-bottom: 5px;
+}
+
+.sapUiUx3ShellPaneBarRight > .sapUiUx3ShellPaneOverflowButton > .sapUiUx3ShellPaneOverflowWrapper {
+    -webkit-transform: rotate(90deg);
+    transform: rotate(90deg);
+
+    -webkit-transform-origin: 0% 0;
+    transform-origin: 0% 0;
+
+    white-space: nowrap;
+    text-overflow: ellipsis;
+
+	position: absolute;
+	left: @sapUiUx3ShellSideBarBaseWidth;
+	height: @sapUiUx3ShellSideBarBaseWidth;
+    width: @sapUiUx3ShellPaneOverflowButtonHeight;
+	line-height: @sapUiUx3ShellSideBarBaseWidth;
+}
+
+.sapUiUx3ShellPaneBarRight > .sapUiUx3ShellPaneOverflowButton > div > .sapUiUx3ShellPaneOverflowText {
+	box-sizing: border-box;
+	text-align: right;
+	padding-right: 5px;
+	display: inline-block;
+	text-overflow: ellipsis;
+	overflow: hidden;
+}
+
+
+.sapUiUx3ShellPaneEntries {
+    -webkit-transform: rotate(90deg);
+    transform: rotate(90deg);
+    white-space: nowrap;
+    margin: 0;
+    line-height: @sapUiUx3ShellSideBarBaseWidth;
+    padding-left: 26px;
+}
+
+.sapUiUx3ShellPaneEntry {
+	font-size: 14px;
+	font-weight: bold;
+	color: lighten(@sapUiBaseText, 60%); /*#999999*/
+	cursor: pointer;
+	display: inline-block;
+	margin-right: 16px;
+	height: 36px;
+	vertical-align:top;
+	-webkit-transition-property: font-size, color;
+	-webkit-transition-duration: 0.3s;
+	transition-property: font-size, color;
+	transition-duration: 0.3s;
+}
+
+.sapUiUx3ShellPaneEntry:hover {
+	color: @sapUiUx3ShellHoverColor;
+	-webkit-transition-property: font-size, color;
+	-webkit-transition-duration: 0.3s;
+	transition-property: font-size, color;
+	transition-duration: 0.3s;
+}
+
+.sapUiUx3ShellPaneEntrySelected,
+.sapUiUx3ShellPaneEntrySelected:hover {
+	font-size: 18px;
+	color: @sapUiHighlight;
+	background-position: center top;
+	background-repeat: no-repeat;
+	-webkit-transition-property: font-size, color;
+	-webkit-transition-duration: 0.3s;
+	transition-property: font-size, color;
+	transition-duration: 0.3s;
+}
+
+.sapUiUx3ShellPaneEntry:active {
+	color: @sapUiHighlight;
+	-webkit-transition-property: font-size, color;
+	-webkit-transition-duration: 0.3s;
+	transition-property: font-size, color;
+	transition-duration: 0.3s;
+}
+
+.sapUiUx3ShellPaneBarContent {
+	display: none;
+	position: absolute;
+	top: 0;
+	bottom: 0;
+	right: @sapUiUx3ShellSideBarBaseWidth;
+	/* Do not finally hardcode the width here. This width is only the default and will be overwritten by script code. */
+	width: 250px;
+	overflow: auto;
+	box-sizing: border-box;
+	border-right: 2px solid @sapUiMediumBorder;
+	.userSelect(text);
+}
+
+.sapUiUx3ShellPaneBarOpen .sapUiUx3ShellPaneBarContent {
+	display: inline-block;
+}
+
+/* canvas */
+.sapUiUx3ShellCanvas {
+	position: absolute;
+	left: 40px;
+	right: 40px;
+	top: 98px;
+	padding: 24px 32px 2px 32px;
+	min-width: 96px; /* = padding plus some space for the remaining content */
+	background-color: @sapUiUx3ShellBackgroundColor;
+	z-index: 1;
+	overflow-x: auto;
+	overflow-y: hidden;
+}
+
+.sapUiUx3ShellFullHeightContent .sapUiUx3ShellCanvas {
+	bottom: 0px;
+}
+
+.sapUiUx3ShellNoContentPadding .sapUiUx3ShellCanvas {
+	padding: 0px 0px 0px 0px;
+}
+
+.sapUiUx3ShellCanvas > .sapUiUx3NavBar {
+	margin-bottom: 16px;
+}
+
+.sapUiUx3ShellContent {
+	width: 100%;
+	-webkit-overflow-scrolling: touch;
+	overflow-x: auto;
+	.userSelect(text);
+}
+
+.sapUiUx3ShellFullHeightContent .sapUiUx3ShellContent {
+	bottom: 0;
+	left: 32px;
+	position: absolute;
+	right: 32px;
+	top: 24px;
+	width: auto;
+}
+
+.sapUiUx3ShellCanvasBackground {
+	background-color: @sapUiUx3ShellBackgroundColor;
+	position: fixed;
+	z-index: 0;
+	left: 40px;
+	right: 40px;
+	padding: 0 32px; /* Should be as wide as the canvas padding, so when making the window very small, they stay in sync */
+	min-width: 96px; /* = padding plus some space for the remaining content */
+	bottom: 0px;
+	top: 108px;
+}
+
+.sapUiUx3ShellNoTools .sapUiUx3ShellCanvasBackground,
+.sapUiUx3ShellNoTools .sapUiUx3ShellCanvas {
+	left: 0;
+}
+
+.sapUiUx3ShellNoPane .sapUiUx3ShellCanvasBackground,
+.sapUiUx3ShellNoPane .sapUiUx3ShellCanvas {
+	right: 0;
+}
+
+.sapUiUx3Shell.sapUiUx3ShellHeadBrandOnly > .sapUiUx3ShellHeader {
+	height: 8px;
+	padding: 0;
+}
+
+.sapUiUx3Shell.sapUiUx3ShellHeadBrandOnly > .sapUiUx3ShellHeader > span > img,
+.sapUiUx3Shell.sapUiUx3ShellHeadBrandOnly > .sapUiUx3ShellHeader > h1,
+.sapUiUx3Shell.sapUiUx3ShellHeadBrandOnly > .sapUiUx3ShellHeader > span,
+.sapUiUx3Shell.sapUiUx3ShellHeadBrandOnly > .sapUiUx3ShellWorksetBar,
+.sapUiUx3Shell.sapUiUx3ShellHeadNoNav > .sapUiUx3ShellWorksetBar {
+	display: none;
+}
+
+.sapUiUx3Shell.sapUiUx3ShellHeadBrandOnly > .sapUiUx3ShellToolPaletteArea,
+.sapUiUx3Shell.sapUiUx3ShellHeadBrandOnly > .sapUiUx3ShellPaneBar,
+.sapUiUx3Shell.sapUiUx3ShellHeadBrandOnly > .sapUiUx3ShellCanvas,
+.sapUiUx3Shell.sapUiUx3ShellHeadBrandOnly > .sapUiUx3ShellCanvasBackground {
+	top: 8px;
+}
+
+.sapUiUx3Shell.sapUiUx3ShellHeadNoNavigation > .sapUiUx3ShellToolPaletteArea,
+.sapUiUx3Shell.sapUiUx3ShellHeadNoNavigation > .sapUiUx3ShellPaneBar,
+.sapUiUx3Shell.sapUiUx3ShellHeadNoNavigation > .sapUiUx3ShellCanvasBackground {
+	top: 43px;
+}
+
+.sapUiUx3Shell.sapUiUx3ShellHeadNoNavigation > .sapUiUx3ShellWorksetBar {
+	display: none;
+}
+
+.sapUiUx3Shell.sapUiUx3ShellHeadNoNavigation > .sapUiUx3ShellCanvas {
+	top: 33px;
+}
+
+.sapUiUx3Shell.sapUiUx3ShellHeadSlimNavigation > .sapUiUx3ShellWorksetBar > .sapUiUx3NavBar.sapUiUx3NavBarToplevel .sapUiUx3NavBarItem {
+	font-size: 16px;
+}
+
+.sapUiUx3Shell.sapUiUx3ShellHeadSlimNavigation > .sapUiUx3ShellWorksetBar > .sapUiUx3NavBar.sapUiUx3NavBarToplevel .sapUiUx3NavBarItem.sapUiUx3NavBarDummyItem{
+	font-size: 16px;
+}
+
+.sapUiUx3Shell.sapUiUx3ShellHeadSlimNavigation > .sapUiUx3ShellWorksetBar,
+.sapUiUx3Shell.sapUiUx3ShellHeadSlimNavigation > .sapUiUx3ShellWorksetBar > .sapUiUx3NavBar.sapUiUx3NavBarToplevel,
+.sapUiUx3Shell.sapUiUx3ShellHeadSlimNavigation > .sapUiUx3ShellWorksetBar > .sapUiUx3NavBar.sapUiUx3NavBarToplevel > .sapUiUx3NavBarList {
+	height: 30px;
+}
+
+.sapUiUx3Shell.sapUiUx3ShellHeadSlimNavigation > .sapUiUx3ShellWorksetBar > .sapUiUx3NavBar.sapUiUx3NavBarToplevel > .sapUiUx3NavBarList {
+	top: 0px;
+}
+
+.sapUiUx3Shell.sapUiUx3ShellHeadSlimNavigation > .sapUiUx3ShellWorksetBar > .sapUiUx3NavBar.sapUiUx3NavBarToplevel > .sapUiUx3NavBarList > li {
+	line-height: 25px;
+}
+
+.sapUiUx3Shell.sapUiUx3ShellHeadSlimNavigation > .sapUiUx3ShellWorksetBar {
+	margin-top: 35px;
+}
+
+.sapUiUx3Shell.sapUiUx3ShellHeadSlimNavigation > .sapUiUx3ShellToolPaletteArea,
+.sapUiUx3Shell.sapUiUx3ShellHeadSlimNavigation > .sapUiUx3ShellPaneBar,
+.sapUiUx3Shell.sapUiUx3ShellHeadSlimNavigation > .sapUiUx3ShellCanvasBackground {
+	top: 75px;
+}
+
+.sapUiUx3Shell.sapUiUx3ShellHeadSlimNavigation > .sapUiUx3ShellCanvas {
+	top: 65px;
+}
+
+/******** NotificationArea *********/
+.sapUiUx3ShellNotify {
+	display: inline-block;
+	position: fixed;
+	bottom: 0;
+	left: 40px;
+	right: 40px;
+	background-color: transparent;
+	height: 0px;
+	z-index: 2;
+}
+
+.sapUiUx3ShellNotify > .sapUiNotificationBar {
+	position: absolute;
+	bottom: 0;
+	left: 7px;
+	right: 7px;
+}
+
+.sapUiUx3ShellNotify > .sapUiUx3ShellNotifyBG {
+	position: absolute;
+	bottom: 0;
+	left: 0;
+	right: 0;
+	top: 0;
+	background-color: transparent;
+}
+
+.sapUiUx3Shell.sapUiUx3ShellNoTools > .sapUiUx3ShellNotify {
+	left: 0;
+}
+
+.sapUiUx3Shell.sapUiUx3ShellNoPane > .sapUiUx3ShellNotify {
+	right: 0;
+}
+
+.sapUiUx3ShellNotify.sapUiUx3ShellNotifyTI  > .sapUiUx3ShellNotifyBG,
+.sapUiUx3ShellNotify.sapUiUx3ShellNotifyOverlay > .sapUiUx3ShellNotifyBG {
+	background-color: transparent;
+}
+
+.sapUiUx3ShellNotifySpace {
+	display: none;
+	height: 45px;
+}
+
+.sapUiUx3Shell.sapUiUx3ShellNotifyVisible > .sapUiUx3ShellCanvas > .sapUiUx3ShellNotifySpace {
+	display: block;
+}
+
+/******** Outer Sidebar *********/
+.sapUiUx3ShellOuterSideBar {
+	display: inline-block;
+	position: fixed;
+	right: 0;
+	top: 0;
+	bottom: 0;
+	overflow: auto;
+}

package/src/sap/ui/ux3/themes/sap_belize_base/ShellColorPicker.less

@@ -0,0 +1,40 @@
+.sapUiUx3ShellColorPicker {
+	height: 158px;
+	width: 225px;
+	padding: 6px;
+	border: 2px solid @sapUiHighlight;
+	background-color: @sapUiExtraLightBG;
+	text-align: end;
+	position: relative;
+}
+
+.sapUiUx3ShellColorPickerMarker {
+	position: absolute;
+	display: block;
+	width: 12px;
+	height: 12px;
+	margin: -10px 0 0 -10px;
+	background-image: url(../base/img/color-marker.png);
+}
+
+.sapUiUx3ShellColorPickerGradient {
+	height: 8px;
+	margin: 0 0 10px;
+	border: 1px solid @sapUiMediumBorder;
+}
+
+.sapUiUx3ShellColorPickerPreview {
+	display: inline-block;
+	height: 20px;
+	width: 107px;
+	margin: 0 4px 0 0;
+	border: 1px solid @sapUiMediumLine;
+}
+
+.sapUiUx3ShellColorPicker .sapUiUx3ShellColorPickerPreview {
+	margin: 4px 4px 0 0;
+}
+
+.sapUiUx3ShellColorPicker .sapUiBtn {
+	margin: 4px 0 0 6px;
+}

package/src/sap/ui/ux3/themes/sap_belize_base/ShellPersonalization.less

@@ -0,0 +1,20 @@
+.sapUiUx3ShellP13nImgHolder {
+	width: 300px;
+	height: 200px;
+	border: 2px solid @sapUiMediumBorder;
+	background-color: @sapUiWhiteBG;
+	margin: 12px 0;
+	text-align: center;
+}
+
+.sapUiUx3ShellP13nImgHolder > img {
+	max-height: 200px;
+	max-width: 300px;
+	min-height: 16px;
+	min-width: 16px;
+}
+
+.sapUiUx3ShellP13n .sapUiSli {
+	padding: 9px 0 0 0;
+	height: 10px;
+}