@openui5/sap.m/src/sap/m/themes/base/UploadSet.less

OpenUI5 UI Library sap.m

/**
 * @file
 * @deprecated As of version 1.129, together with sap.m.upload.UploadSet
 */
/* ================================ */
/* CSS for control sap.m/UploadSet  */
/* Base theme                       */
/* ================================ */

.sapMUSFileName {
	flex-shrink: 0;
}

.sapMUSObjectMarkerContainer {
	display: inline-block;
	flex: none;
}

.sapMUSProgressBox {
	min-width: 120px;
	padding-left: 1rem;
}

.sapMUSProgressIndicator {
	padding: 5px;
}

.sapMUSTextInnerContainer {
	display: flex;
}

.sapMUSTFileUploaderVisibility {
	visibility: hidden;
	display: none !important;
}

.sapMUSObjectMarkersAsStatusContainer {
	display: flex;
	gap: 0.5rem;
	align-items: end;
	margin-left: 0.5rem;
}

.image-scale {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%; /* Fit within the viewport height */
}

@media(min-width: 30rem) {

	.sapMUSButtonContainer {
		white-space: nowrap; /* so that buttons are displayed in a row */
		padding-left: 1rem;
		padding-top: 0;
		align-self: center; /* for buttons alignment at the center */
		flex: none;
		order: 3;
	}
}

@media(max-width: 30rem) {

	.sapMUSButtonContainer {
		padding-top: 0.75rem;
	}
}

.sapMUSButtonContainer > .sapMBtn {
	padding-top: 0; /* the padding of the sap.m.Button should be removed */
	padding-bottom: 0; /* the padding of the sap.m.Button should be removed */
	height: 2.5rem;
}

/*compact form */
.sapUiSizeCompact .sapMUSButtonContainer > .sapMBtn {
	height: 1.625rem;
}

/*for width > 30rem the buttons should be displayed as buttons of type transparent */
@media(min-width: 30rem) {

	.sapMUSButtonContainer > .sapMBtn > .sapMBtnInner {
		background-image: none;
		background-color: var(--sapButton_Lite_Background);
		border-color: var(--sapButton_Lite_BorderColor);
		text-shadow: none;
	}
}

/* an edit and delete button in a hover state; it should look like a transparent button in a hover state */
@media(min-width: 30rem) {

	.sapMUCEditBtn:hover > .sapMBtnHoverable,
	.sapMUCDeleteBtn:hover > .sapMBtnHoverable {
		background-color: var(--sapButton_Lite_Hover_Background);
		border-color: var(--sapButton_Lite_Hover_BorderColor);
	}
}

/*an edit and delete button in a pressed state; it should look like a transparent button in a pressed state */
@media(min-width: 30rem) {

	:not(.sapMBtnDisabled).sapMUCEditBtn > .sapMBtnActive,
	:not(.sapMBtnDisabled).sapMUCEditBtn:hover > .sapMBtnActive,
	:not(.sapMBtnDisabled).sapMUCDeleteBtn > .sapMBtnActive,
	:not(.sapMBtnDisabled).sapMUCDeleteBtn:hover > .sapMBtnActive {
		background-color: var(--sapButton_Lite_Active_Background);
		border-color: var(--sapButton_Lite_Active_BorderColor);
	}
}