com.phloxui/styles/lib/theme/material/component/dataview/input/MaterialFileSelector.less

PhloxUI Ng2+ Framework

material-file-selector {
	cursor: pointer;

	.material-file-selector {
		position: relative;
		border: 2px dashed;
		border-color: extract(@CLR_1, 5);
		display: flex;
		justify-content: center;
		align-items: center;
		color: extract(@CLR_0, 7);
		.FH2L();
		overflow: hidden;

		> .material-file-selector-box {
			display: flex;
			flex-direction: column;

			> div:last-child {
				margin-bottom: 20pt;
			}

			.icon-clouds {
				display: flex;
				align-items: center;
				justify-content: center;
				position: relative;
				height: 120pt;

				&:before {
					color: #c2c2c2;
					font-family: 'PhloxGlyphicons';
					// font-size: 120pt;
					font-size: calc(5vw + 4vh + 3vmin);
					content: "1";
				}

				> div {
					align-items: center;
				}

				> .icon-clouds-text {
					.FH1L();
					position: absolute;
					font-family: 'Kanit';
					color: #FFF;
					display: flex;
					padding-top: 8pt;

					> .icon-clouds-text-type {
						.FH1L();
						padding-top: 1pt;
						padding-left: 2pt;
					}
				}
			}
		}
	}
}