plate-tool/plate-tool-web/assets/scss/default_theme/components/_plates.scss

div.source_plate, div.dest_plate {
	padding: 3px 3px 3px 3px;
}

div.source_plate {
	border: 2px solid blue;
}
div.dest_plate {
	border: 2px solid red;
}

table, tr, td {
	user-select: none; /* Prevents dragging issue */
	border-spacing: 0px;
}
th {
	font-family: monospace;
}


td.plate_cell {
	background: none;
}

div.plate_cell_inner {
	aspect-ratio: 1 / 1;
	height: 90%;
	border-radius: 50%;
	border: 1px solid black;
}
td.plate_cell:hover div.plate_cell_inner {
	background: black !important;
}

td.plate_cell.in_transfer div.plate_cell_inner::after {
	content: "";
	width: 100%;
	height: 100%;
	display: block;
	border-radius: 50%;
	background-image: repeating-linear-gradient(
			45deg,
			rgba(0,0,0,0.8),
			rgba(0,0,0,0.8) 2px,
			transparent 2px,
			transparent 5px
	);
}

td.current_select div.plate_cell_inner {
	border: 3px solid black;
}


// Styles for specific plate types:

.W1536 {
	th {
		font-size: 0.9rem;
		line-height: 0px;
	}
	tr:first-child {
		th {
			line-height: inherit;
		}
	}
	td {
		padding: 0;
	}
	td.current_select div.plate_cell_inner {
		border: 2px solid black;
	}
}

.W3456 {
	th {
		font-size: 0.6rem;
		line-height: 0px;
	}
	tr:first-child {
		th {
			line-height: inherit;
		}
	}
	td {
		padding: 0;
	}
	td.current_select div.plate_cell_inner {
		border: 2px solid black;
	}
}