snappymail/dev/Styles/User/Compose.less

.mailvelope-icon {
	background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAACjElEQVQ4y2XTXWjVdRgH8M/vf457OUVJzc7U5myWmysrFROKjFyUgqasEsNIrFFetC5KYkXMdVP0chne1MVWUBGWnlAKcogLJmiGXciUkaPtHPYSWumo6XbOv4v/afbyXP14+H6/z8vv+Qb/iNijEdFK4p1Yh1sQ4WccJe4h9Ae54t+ccJW88VpSb+NZdZWVmm+muR4xgwVODzM0dQWfEb0Q7L80KxDbmCH6irDO82uCHZvIVJMfT9Tn11Askevlnd7YdOk4xYeCg5PpBBG9R2gB9bXkjrD/GIXLSYlsBetX0NZK/cLgue41pLrxeIhtuZP4R6uyvPoEVdUcOMKH3/tf3FXDx6/x6de89W1MfH+qS2MnxdVynYyeZzDPM1sYHeH2LJMX2XAHjTfSN8zkOO1P8v6hQLQgjRZLarlhLk/vxTW0b6XjKaoqmJomjslUsrqPjn28tIOVi/lh+O4Ii61dQmEs2WnrUobHad3DR4eoruCxPXz+DQ+sSDAD51jbBDdFYKZ0dc4Hl5EvkJ/itiwjBfKXqath4tfyn8ekEmqEIf3nWJBFKRml/3QCzFzH4VPl/Dy+G0jyyxroOwMTafT6aazJxUlefpjXe7gwnbTa2c0v5ff5C2y+l/saSQdODCGcSnVpzJPaJT0ZtG+j9ySDvyeVfpvhSpwInDzL8vnJZb7yAaN/ILSl3nB2vEtTjRP5eyzKsHs7188wMZaQ5wQWVbFpFQ31bN/L6J+wL8i9W77Emd2kb9XxxSMK48HW9WzbwMhYsrDaeZRKfHkYUYzjlHb+x0ytVRTfxC51ldWaF7K0jjkpzuQZmDXTJxRfDA5e+pdAIrI5Il5OaEMLGsqYsp31EI4FB2bt/Bf/WNuibWZY5gAAAABJRU5ErkJggg==') center/contain no-repeat;
	display: inline-block;
	height: 1em;
	width: 1em;
}

#V-PopupsCompose {
	height: calc(100vh - 52px);
	max-width: 1000px;
	width: 98%;

	.modal-body {
		padding: 0;
		display: flex;
		flex-direction: column;
		height: 100%;
	}

	.textAreaParent, .attachmentAreaParent {
		box-sizing: border-box;
		height: 100%;
		min-height: 200px;
		position: relative;
	}

	.textAreaParent {
		display: flex;
		flex-direction: column;
	}

	.attachmentAreaParent {
		border-top: 1px solid #ccc;
		overflow-y: auto;
		padding: 10px;
	}

	.attachmentName {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.no-attachments-desc {
		padding-top: 50px;
		text-align: center;
		font-size: 24px;
		color: #666;
		text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
	}

	header {

		background-color: rgba(0,0,0,0.8);

		.close, .minimize-custom {
			border-color: #eee;
			float: none;
			font-size: 24px;
			opacity: 1;
			line-height: 28px;
			margin-left: .7em;
		}

		.btn.disabled {
			&.button-delete {
				visibility: hidden;
			}
		}

		.button-save, .button-delete, .saved-text {
			margin-left: 8px;
		}

		.disabled.button-delete {
			margin-left: 0;
		}

		.pull-right * {
			vertical-align: top;
		}
	}

	.b-header {

		padding: 10px;
		background-color: rgba(128,128,128,0.2);;

		table {
			border-collapse: collapse;
			width: 100%;
		}
		td {
			vertical-align: baseline;
			padding: 2px 0;
		}
		td:first-child {
			padding: 0 10px 0 0;
			text-align: right;
			white-space: nowrap;
			width: 4em;
		}

		#identity-toggle {
			color: var(--main-color);
			margin-left: 6px;
			text-decoration: none;
		}
		#identity-toggle::after {
			content: '▼';
		}

		textarea, input[type="text"] {
			width: 100%;
		}
		textarea {
			height: 40px;
		}

		.error-desc {
			color: red;
		}

		.error-to {
			color: red;
			font-weight: bold;
		}
	}

	.b-attachment-button {
		display: inline-block;
	}

	.b-attachment-place {

		position: absolute;
		left: 5px;
		right: 5px;
		top: 5px;
		bottom: 5px;

		border: 2px #777 dashed;
		z-index: 300;

		line-height: 119px;
		text-align: center;
		background-color: #efefef;
		font-size: 24px;

		border-radius: 10px;

		&.dragAndDropOver {
			background-color: #fff;
		}
	}
}

@media screen and (max-width: 999px) {
	#V-PopupsCompose {
		border: 0;
		width: 100%;
	}
}

.minimize-custom {
	border: 0 solid #333;
	border-bottom-width: 3px;
	display: inline-block;
	height: 20px;
	width: 16px;
	cursor: pointer;
}