@import "var";

.views{
	.container{
		display: flex;
		flex: 1;
		flex-direction: column;

		.header-bar{
			padding: 1px;
			border-bottom: 1px solid $--pane-border-color;
			display: flex;
			flex-direction: row;

			a{
				padding: 0 5px;
			}

			.menu-item + .menu-item{
				border-left: 2px solid $--pane-border-color;
			}

			.import-file{

			}
		}

		.tree-scrollbar {
			width: 100%;
			flex: 1;
		}

		.el-tree-node__content:hover{
			& > .tree-node > .more-button{
				visibility: visible;
			}
		}

		.tree-node{
			flex: 1;
			flex-direction: row;
			display: flex;
			padding-right: 10px;

			.node-name{
				flex: 1;
				width: 0;
				text-overflow: ellipsis;
				overflow: hidden;
				font-size: 14px;
			}

			.more-button{
				visibility: hidden;
			}
		}
	}
}

.select-design-mode-dialog{
	.wrapper {
		display: flex;
		justify-content: space-around;
		padding: 10px;

		.item {
			display: flex;
			flex-direction: column;
			align-items: center;
			padding: 10px;
			border-radius: 10px;
			border: 2px solid transparent;
		}

		.item.selected{
			border-color: $--color-primary;
		}
	}

}