@openui5/sap.m/src/sap/m/themes/sap_hcb/Button.less

OpenUI5 UI Library sap.m

/* ============================= */
/* CSS for control sap.m/Button  */
/* High Contrast Black theme     */
/* ============================= */

.sapMBtn {
	background-color: transparent;
}

.sapMBtnInner {
	border-radius: 0.375rem;
}

.sapUiSizeCompact .sapMBar-CTX .sapMBtnInner:not(.sapMBtnDisabled) {
	border-color: @sapUiButtonBorderColor;
}

span.sapMBtnInner.sapMBtnEmphasized {
	border-width: 0.125rem;
}

.sapMBtn:not(.sapMBtnDisabled):hover .sapMBtnCritical,
.sapMBtn:not(.sapMBtnDisabled):hover .sapMBtnNegative,
.sapMBtn:not(.sapMBtnDisabled):hover .sapMBtnSuccess,
.sapMBtn:not(.sapMBtnDisabled):hover .sapMBtnNeutral{
	background: @sapUiButtonHoverBackground;
	border: 1px solid @sapUiButtonHoverBorderColor;
}

.sapMBtn:not(.sapMBtnDisabled) .sapMBtnCritical:not(.sapMToggleBtnPressed),
.sapMBtn:not(.sapMBtnDisabled) .sapMBtnNegative:not(.sapMToggleBtnPressed),
.sapMBtn:not(.sapMBtnDisabled) .sapMBtnSuccess:not(.sapMToggleBtnPressed),
.sapMBtn:not(.sapMBtnDisabled) .sapMBtnNeutral:not(.sapMToggleBtnPressed){
	background: @sapUiButtonBackground;
	border-color: @sapUiButtonBorderColor;
	border-width: @sapUiButtonBorderWidth;
}

.sapMBtn:not(.sapMBtnDisabled) .sapMBtnCritical.sapMBtnActive,
.sapMBtn:not(.sapMBtnDisabled) .sapMBtnNegative.sapMBtnActive,
.sapMBtn:not(.sapMBtnDisabled) .sapMBtnSuccess.sapMBtnActive,
.sapMBtn:not(.sapMBtnDisabled) .sapMBtnNeutral.sapMBtnActive{
	background: @sapUiButtonActiveBackground;
	border-color: @sapUiButtonActiveBorderColor;
	border-width: @sapUiButtonBorderWidth;
}

.sapMBtn:not(.sapMBtnDisabled):hover .sapMBtnCritical.sapMBtnActive,
.sapMBtn:not(.sapMBtnDisabled):hover .sapMBtnNegative.sapMBtnActive,
.sapMBtn:not(.sapMBtnDisabled):hover .sapMBtnSuccess.sapMBtnActive,
.sapMBtn:not(.sapMBtnDisabled):hover .sapMBtnNeutral.sapMBtnActive{
	background: @sapUiButtonHoverBackground;
	border: 1px solid @sapUiButtonHoverBorderColor;
}

.sapMBtn:not(.sapMBtnDisabled):hover .sapMBtnCritical,
.sapMBtn:not(.sapMBtnDisabled):hover .sapMBtnNegative,
.sapMBtn:not(.sapMBtnDisabled):hover .sapMBtnSuccess,
.sapMBtn:not(.sapMBtnDisabled):hover .sapMBtnNeutral,
.sapMBtn:not(.sapMBtnDisabled) .sapMBtnCritical,
.sapMBtn:not(.sapMBtnDisabled) .sapMBtnNegative,
.sapMBtn:not(.sapMBtnDisabled) .sapMBtnSuccess,
.sapMBtn:not(.sapMBtnDisabled) .sapMBtnNeutral{
	.sapMBtnContent{
		color: @sapUiButtonTextColor;
	}
}

/* --------------------------------------------------------------------- */
/* Custom focus outline:                                                 */
/* --------------------------------------------------------------------- */

html.sap-desktop .sapMBtn:focus > .sapMFocusable {
	outline: 0.125rem dotted @sapUiContentFocusColor;
	outline-offset: -0.125rem;
	border-color: transparent;
	border-radius: 0;
}

html.sap-desktop .sapMBtn:focus > .sapMFocusable:not(.sapMBtnActive) {
	border-radius: 0;
}

/* ---------------------------------------------------------------------*/
/* Disabled state                                                       */
/* ---------------------------------------------------------------------*/

.sapMBtnDisabled {
	cursor: default;
}

.sapMBtnDisabled .sapMBtnInner,
.sapUiSizeCompact .sapMBar-CTX .sapMBtnDisabled > .sapMBtnInner {
	border-color: @sapUiHcReducedForeground;
	color: @sapUiContentDisabledTextColor;
}

.sapMBtnDisabled > span.sapMBtnInner.sapMBtnAccept,
.sapMBtnDisabled > span.sapMBtnInner.sapMBtnReject,
.sapMBtnDisabled > span.sapMBtnInner.sapMBtnAttention,
.sapMBtnDisabled > span.sapMBtnInner.sapMBtnEmphasized {
	border-color: @sapUiHcReducedForeground;
	color: @sapUiContentDisabledTextColor;
}

.sapMBtnDisabled .sapMBtnInner .sapMBtnIcon {
	border-color: @sapUiHcReducedForeground;
	color: @sapUiContentDisabledTextColor;
}

.sapMBtnDisabled .sapMBtnActive {
	background-color: @sapUiButtonBackground;
}

.sapMBtnDisabled .sapMBtnCritical,
.sapMBtnDisabled .sapMBtnNegative,
.sapMBtnDisabled .sapMBtnSuccess,
.sapMBtnDisabled .sapMBtnNeutral{
	background-color: @sapUiButtonBackground;
	border-color: @sapUiHcReducedForeground;
}
.sapMBtnDisabled .sapMBtnCritical,
.sapMBtnDisabled .sapMBtnNegative,
.sapMBtnDisabled .sapMBtnSuccess,
.sapMBtnDisabled .sapMBtnNeutral{
	.sapMBtnContent{
		color: @sapUiContentDisabledTextColor;
	}
}