jodit/src/styles/plugins/table.less

Jodit is awesome and usefully wysiwyg editor with filebrowser

/*!
 * Jodit Editor (https://xdsoft.net/jodit/)
 * Licensed under GNU General Public License version 2 or later or a commercial license or MIT;
 * For GPL see LICENSE-GPL.txt in the project root for license information.
 * For MIT see LICENSE-MIT.txt in the project root for license information.
 * For commercial licenses see https://xdsoft.net/jodit/commercial/
 * Copyright (c) 2013-2019 Valeriy Chupurnov. All rights reserved. https://xdsoft.net
 */

.jodit_table_resizer {
	cursor: col-resize;
	position: absolute;
	z-index: 3;
	padding-left: 5px;
	padding-right: 5px;
	margin-left: -5px;

	&:after {
		content: '';
		display: block;
		height: 100%;
		width: 0;
		border: 1px solid transparent;
		border-width: 0 1px 0 0;
	}

	&-moved {
		z-index: 2;
		&:after {
			border-color: @color-border-moved;
		}
	}
}

.jodit_wysiwyg {
	table {
		width: 100%;
		border: none;
		border-collapse: collapse;
		table-layout: fixed;
		empty-cells: show;
		max-width: 100%;

		tr {
			user-select: none;
			th,
			td {
				border: 1px solid #ddd;
				text-align: left;
				vertical-align: middle;
				user-select: text;
				&[data-jodit-selected-cell] {
					border: 1px double @color-border-selected;
				}
			}
		}
	}
}

.jodit_form_inserter {
	.jodit_form-table-creator-box {
		font-size: 0;
		.jodit_form-container {
			display: inline-block;
			vertical-align: top;
			padding: 0;
			margin: 0;
			min-width: 180px;
			font-size: 0;
			> div {
				width: @width_element_default;
				height: @height_element_default;
				box-sizing: border-box;
				display: inline-block;
				position: relative;
				vertical-align: top;
				&:after {
					content: '';
					position: absolute;
					top: 0px;
					left: 0px;
					display: inline-block;
					width: 12px;
					height: 12px;
					border: 1px solid #ccc;
				}
				&.hovered:after {
					background: @color-background-hover;
					border: solid 1px @color-border-active;
				}
			}
		}
		.jodit_form-options {
			font-size: @font-size-default;
			display: inline-block;
			vertical-align: top;
			label {
				text-align: left;
				padding-top: 0;
				input {
					margin-right: @padding-default;
				}
			}
		}
	}

	label {
		text-align: center;
		font-size: 14px;
		padding: 8px;
		display: block;
		margin: 0;
	}
}