﻿/* -------------------------------------------------------工具栏 */

/* 工具栏 */
Toolbar
{
	height: var(--metrics-pixels-40);
	padding: var(--metrics-pixels-4);

	background-color: var(--colors-dark-grey-5);
	justify-content: space-between;
}

/* 工具栏 > 子元素 */
Toolbar > VisualElement
{
	flex-direction: row;
}

/* -------------------------------------------------------按钮 */

/* 按钮 */
Button
{
	padding-left: var(--metrics-pixels-8);
	padding-right: var(--metrics-pixels-8);

	background-color:  var(--colors-dark-grey-7);
	border-color:  var(--colors-dark-grey-1);
}

/* 按钮（悬停时） */
Button:hover
{
	background-color:  var(--colors-dark-grey-8);
}

/* 按钮（按下时） */
Button:active
{
	background-color:  var(--colors-dark-grey-6);
	color: var(--colors-yellow);
}

/* 按钮（选中时） */
.button__selected
{
	color: var(--colors-yellow);
}

/* -------------------------------------------------------文本字段 */

/* 文本字段 */
TextField
{
	min-width: var(--metrics-pixels-200);
}

/* 文本字段 > 标签 */
TextField > Label
{
	min-width: 66px;

	margin: var(--metrics-0);
	padding: var(--metrics-0);

	-unity-text-align: middle-center;
	font-size: var(--metrics-pixels-14);
}

/* 文本字段（聚焦时） > 标签 */
TextField:focus > Label
{
	color: var(--colors-yellow);
}

/* 文本字段 > 输入框 */
TextField > TextInput
{
	padding: var(--metrics-pixels-4) var(--metrics-pixels-2);
	
	border-color:  var(--colors-dark-grey-7);
	border-radius: var(--metrics-pixels-4);
	background-color:  var(--colors-dark-grey-1);
	font-size: var(--metrics-pixels-14);
}

/* 文本字段（聚焦时） > 输入框 */
TextField:focus > TextInput
{
	border-color: var(--colors-yellow);
}