@openui5/sap.m
Version:
OpenUI5 UI Library sap.m
78 lines (66 loc) • 1.68 kB
text/less
/* =========================== */
/* CSS for control sap.m/Tile */
/* Base theme */
/* =========================== */
.sapMTile {
display: inline-block;
-webkit-transition-property: transform3d;
-webkit-transition-duration: 0.2s;
transition-property: transform3d;
transition-duration: 0.2s;
width: 12rem;
height: 14rem;
margin: 0.5rem;
-webkit-touch-callout: none;
background-color: @sapUiTileBackground;
border: 1px solid @sapUiTileBorderColor;
border-radius: 0.125rem;
box-shadow: @sapUiShadowLevel0;
/*margin:0.6em;*/ /* in case of some behavior problems uncomment this line, it was comment because the margin causes the blurring of the focus rectangle in IE9*/
}
.sapMTile * { /* FIXME!!! (star rule with any-parent selector...) */
-webkit-user-select: none;
-webkit-user-drag: none;
-moz-user-select: -moz-none;
-ms-user-select: none;
}
.sapMTCEditable .sapMTile {
background-color: fade(@sapUiTileBackground, 50);
}
html[data-sap-ui-browser*='ie'] .sapMTile {
transition-property: transform;
}
.sapMTile.sapMTileActive{
background: @sapUiHighlight;
}
html.sap-phone .sapMTile {
width: 8.5rem;
height: 10rem;
margin: 0.5rem;
}
html.sap-phone .sapMTileContent {
width: 8.5rem;
height: 10rem;
}
.sapMTileContent {
overflow: hidden;
width: 12rem;
height: 14rem;
}
.sapMTileDrag {
opacity : 0.8;
z-index : 10;
-webkit-transition-property : none;
transition-property: none;
}
.sapMNavItemFlipping .sapMTile {
opacity: 0.01;
}
.sapMTile:focus {
outline: 1px dotted @sapUiContentFocusColor;
position: relative;
}
.sapMTile .sapMTileDrag {
opacity : 0.6;
box-shadow: 0px 1px 3px fade(@sapUiContentShadowColor,60);
}