.application_NavigationView { box-sizing: border-box; display: flex; flex-direction: row; align-items: stretch; background-color: hsl(0, 0%, 10%); border-bottom: solid 2px var(--bg-color); } .application_NavigationView_spacer { flex: 1; } .application_NavigationView_server { display: flex; align-items: center; } .application_NavigationView_server > * { margin: 0 2px; } .application_NavigationView_github { display: flex; flex-direction: row; align-items: center; justify-content: center; width: 30px; font-size: 16px; color: var(--control-text-color); } .application_NavigationView_github:hover { color: var(--control-text-color-hover); } .application_NavigationButton input { display: none; } .application_NavigationButton label { box-sizing: border-box; display: inline-flex; flex-direction: row; align-items: center; font-size: 13px; height: 100%; padding: 0 20px; color: hsl(0, 0%, 65%); } .application_NavigationButton label:hover { color: hsl(0, 0%, 85%); background-color: hsl(0, 0%, 12%); } .application_NavigationButton input:checked + label { color: hsl(0, 0%, 85%); background-color: var(--bg-color); } .core_Label.disabled { color: var(--text-color-disabled); } .core_Select { position: relative; display: inline-flex; width: 160px; } .core_Select .core_Button { flex: 1; } .core_Select .core_Menu { top: 25px; left: 0; min-width: 100%; } .core_Button { display: inline-flex; flex-direction: row; align-items: stretch; align-content: stretch; box-sizing: border-box; height: 26px; padding: 0; border: var(--control-border); color: var(--control-text-color); outline: none; font-size: 13px; font-family: var(--font-family); overflow: hidden; } .core_Button .core_Button_inner { flex: 1; display: inline-flex; flex-direction: row; align-items: center; box-sizing: border-box; background-color: var(--control-bg-color); height: 24px; padding: 3px 5px; border: var(--control-inner-border); overflow: hidden; } .core_Button:hover .core_Button_inner { background-color: var(--control-bg-color-hover); border-color: hsl(0, 0%, 40%); color: var(--control-text-color-hover); } .core_Button:active .core_Button_inner { background-color: hsl(0, 0%, 20%); border-color: hsl(0, 0%, 30%); color: hsl(0, 0%, 75%); } .core_Button:disabled .core_Button_inner { background-color: hsl(0, 0%, 15%); border-color: hsl(0, 0%, 25%); color: hsl(0, 0%, 55%); } .core_Button_inner > * { display: inline-block; margin: 0 3px; } .core_Button_center { flex: 1; text-align: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .core_Button_left, .core_Button_right { display: inline-flex; align-content: center; font-size: 11px; } .core_Menu { z-index: 1000; position: absolute; box-sizing: border-box; outline: none; border: var(--control-border); --scrollbar-color: hsl(0, 0%, 18%); --scrollbar-thumb-color: hsl(0, 0%, 22%); } .core_Menu > .core_Menu_inner { overflow: auto; background-color: var(--control-bg-color); max-height: 500px; border: var(--control-inner-border); } .core_Menu > .core_Menu_inner > * { padding: 4px 8px; white-space: nowrap; } .core_Menu > .core_Menu_inner > .core_Menu_hovered { background-color: var(--control-bg-color-hover); color: var(--control-text-color-hover); } .core_TabContainer_Bar { box-sizing: border-box; padding: 3px 3px 0 3px; border-bottom: var(--border); } .core_TabContainer_Tab { box-sizing: border-box; display: inline-flex; align-items: center; height: calc(100% + 1px); padding: 0 10px; border: var(--border); margin: 0 1px -1px 1px; background-color: hsl(0, 0%, 12%); color: hsl(0, 0%, 75%); font-size: 13px; } .core_TabContainer_Tab:hover { background-color: hsl(0, 0%, 18%); color: hsl(0, 0%, 85%); } .core_TabContainer_Tab.active { background-color: var(--bg-color); color: hsl(0, 0%, 90%); border-bottom-color: var(--bg-color); } .viewer_Model3DView_container { display: flex; flex-direction: row; } .core_ToolBar { box-sizing: border-box; display: flex; flex-direction: row; align-items: center; border-bottom: var(--border); } .core_ToolBar > * { margin: 2px 1px; } .core_ToolBar > .core_ToolBar_group { margin: 2px 3px; display: flex; flex-direction: row; align-items: center; } .core_ToolBar > .core_ToolBar_group > * { margin: 0 2px; } .core_ToolBar .core_Input { height: 26px; } .core_FileButton_input { overflow: hidden; clip: rect(0, 0, 0, 0); position: absolute; width: 1px; height: 1px; border: none; padding: 0; } .core_Input { display: inline-block; box-sizing: border-box; height: 24px; border: var(--input-border); } .core_Input .core_Input_inner { box-sizing: border-box; width: 100%; height: 100%; padding: 0 3px; border: var(--input-inner-border); background-color: var(--input-bg-color); color: var(--input-text-color); outline: none; font-size: 13px; } .core_Input:hover { border: var(--input-border-hover); } .core_Input:focus-within { border: var(--input-border-focus); } .core_Input.disabled { border: var(--input-border-disabled); } .core_Input.disabled .core_Input_inner { color: var(--input-text-color-disabled); background-color: var(--input-bg-color-disabled); } .core_NumberInput .core_NumberInput_inner { padding-right: 1px; } .viewer_Model3DSelectListView { box-sizing: border-box; list-style: none; padding: 0; margin: 0; overflow: auto; } .viewer_Model3DSelectListView li { padding: 4px 8px; } .viewer_Model3DSelectListView li:hover { color: hsl(0, 0%, 90%); background-color: hsl(0, 0%, 18%); } .viewer_Model3DSelectListView li.active { color: hsl(0, 0%, 90%); background-color: hsl(0, 0%, 21%); } .core_DropDown { position: relative; } .core_DropDown .core_Menu { top: 25px; left: 0; min-width: 100%; } .core_TextArea { box-sizing: border-box; display: inline-block; border: var(--input-border); } .core_TextArea .core_TextArea_inner { box-sizing: border-box; vertical-align: top; padding: 3px; border: var(--input-inner-border); margin: 0; background-color: var(--input-bg-color); color: var(--input-text-color); outline: none; font-size: 13px; } .core_TextArea:hover { border: var(--input-border-hover); } .core_TextArea:focus-within { border: var(--input-border-focus); } .core_TextArea.disabled { border: var(--input-border-disabled); } .core_TextArea.disabled .core_TextArea_inner { color: var(--input-text-color-disabled); background-color: var(--input-bg-color-disabled); } .quest_editor_QuestInfoView { box-sizing: border-box; padding: 3px; overflow: auto; outline: none; } .quest_editor_QuestInfoView table { width: 100%; } .quest_editor_QuestInfoView th { text-align: left; } .quest_editor_QuestInfoView .core_TextInput { width: 100%; } .quest_editor_QuestInfoView .core_TextArea { width: 100%; } .quest_editor_QuestInfoView textarea { width: 100%; } .quest_editor_DisabledView { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; } #root .lm_header { box-sizing: border-box; padding: 3px 0 0 0; border-bottom: var(--border); } #root .lm_tabs { padding: 0 3px; } #root .lm_tab { cursor: default; display: inline-flex; align-items: center; height: 23px; padding: 0 10px; border: var(--border); margin: 0 1px -1px 1px; background-color: hsl(0, 0%, 12%); color: hsl(0, 0%, 75%); font-size: 13px; } #root .lm_tab:hover { background-color: hsl(0, 0%, 18%); color: hsl(0, 0%, 85%); } #root .lm_tab.lm_active { background-color: var(--bg-color); color: hsl(0, 0%, 90%); border-bottom-color: var(--bg-color); } #root .lm_header .lm_controls > li { cursor: default; } #root .lm_content { overflow: visible; } #root .lm_splitter { box-sizing: border-box; background-color: hsl(0, 0%, 20%); } #root .lm_splitter.lm_vertical { border-top: var(--border); border-bottom: var(--border); } #root .lm_splitter.lm_horizontal { border-left: var(--border); border-right: var(--border); } body .lm_dropTargetIndicator { box-sizing: border-box; background-color: hsla(0, 0%, 100%, 0.2); } .quest_editor_NpcCountsView { box-sizing: border-box; padding: 3px; overflow: auto; } .quest_editor_NpcCountsView table { user-select: text; width: 100%; max-width: 300px; margin: 0 auto; } .quest_editor_NpcCountsView th { cursor: text; text-align: left; } .quest_editor_NpcCountsView td { cursor: text; } .quest_editor_EntityInfoView { outline: none; box-sizing: border-box; padding: 3px; overflow: auto; } .quest_editor_EntityInfoView table { table-layout: fixed; width: 100%; max-width: 300px; margin: 0 auto; } .quest_editor_EntityInfoView th { width: 80px; text-align: left; } .quest_editor_EntityInfoView td { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .quest_editor_EntityInfoView th.quest_editor_EntityInfoView_coord { padding-left: 10px; } .quest_editor_EntityListView { overflow: auto; } .quest_editor_EntityListView_entity_list { display: grid; grid-template-columns: repeat(auto-fill, 100px); grid-column-gap: 6px; grid-row-gap: 6px; justify-content: center; margin: 6px; } .quest_editor_EntityListView_entity { box-sizing: border-box; display: flex; flex-direction: column; text-align: center; } .quest_editor_EventsView { box-sizing: border-box; overflow-y: auto; display: flex; flex-direction: row; flex-wrap: wrap; align-items: start; justify-content: center; padding: 4px; } .quest_editor_EventsView_dag { position: relative; display: flex; flex-direction: column; align-items: stretch; } .quest_editor_EventsView_event { display: flex; flex-direction: column; align-items: center; padding: 6px 12px; border: var(--border); margin: 4px; background-color: hsl(0, 0%, 17%); } .quest_editor_EventsView_event th { text-align: left; } .quest_editor_EventsView_edge_container { position: absolute; } .quest_editor_EventsView_edge { box-sizing: border-box; position: absolute; border-left: solid 2px var(--border-color); border-top: solid 2px var(--border-color); border-bottom: solid 2px var(--border-color); } .hunt_optimizer_WantedItemsView { display: flex; flex-direction: column; align-items: stretch; padding: 0 6px; min-width: 200px; } .hunt_optimizer_WantedItemsView .hunt_optimizer_WantedItemsView_table_wrapper { flex: 1; width: calc(100% + 6px); overflow: auto; margin: 4px -3px; } .hunt_optimizer_WantedItemsView .hunt_optimizer_WantedItemsView_table_wrapper table { width: 100%; border-collapse: collapse; } .hunt_optimizer_WantedItemsView .hunt_optimizer_WantedItemsView_table_wrapper td { padding: 1px 3px; } .core_ComboBox { box-sizing: border-box; position: relative; } .core_ComboBox_inner { box-sizing: border-box; display: flex; align-items: center; } .core_ComboBox_inner input { flex: 1; padding: 0; border: none; margin: 0; color: var(--input-text-color); background-color: transparent; outline: none; } .core_ComboBox.disabled input { color: var(--input-text-color-disabled); } .core_ComboBox .core_Menu { top: 23px; left: -2px; min-width: calc(100% + 4px); } .core_ComboBox_button { padding: 0 2px; } .hunt_optimizer_OptimizerView { display: flex; align-items: stretch; overflow: hidden; } .hunt_optimizer_OptimizerView div:nth-child(2) { flex: 1; overflow: hidden; } .core_Table { position: relative; display: block; box-sizing: border-box; overflow: auto; background-color: var(--bg-color); border-collapse: collapse; } .core_Table tr { display: flex; align-items: stretch; } .core_Table thead { position: sticky; display: inline-block; top: 0; z-index: 2; } .core_Table thead tr { position: sticky; top: 0; } .core_Table thead th { display: flex; flex-direction: column; justify-content: center; overflow: hidden; } .core_Table th, .core_Table td { box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; padding: 3px 6px; border-right: var(--border); border-bottom: var(--border); background-color: var(--bg-color); } .core_Table tbody { user-select: text; cursor: text; } .core_Table tbody th, .core_Table tbody td { white-space: nowrap; } .core_Table tbody th, .core_Table tfoot th { text-align: left; } .core_Table th.fixed { position: sticky; text-align: left; } .core_Table th.input { padding: 0; overflow: visible; } .core_Table th.input .core_DurationInput { z-index: 0; height: 100%; width: 100%; border: none; } .core_Table th.input .core_DurationInput:hover, .core_Table th.input .core_DurationInput:focus-within { margin: -1px; height: calc(100% + 2px); width: calc(100% + 2px); } .core_Table th.input .core_DurationInput:hover { z-index: 4; border: var(--input-border-hover); } .core_Table th.input .core_DurationInput:focus-within { z-index: 6; border: var(--input-border-focus); } .hunt_optimizer_OptimizationResultView { display: flex; flex-direction: column; } .hunt_optimizer_OptimizationResultView_table { flex: 1; border-top: var(--border); border-left: var(--border); } .hunt_optimizer_MethodsForEpisodeView_table { width: 100%; height: 100%; } .core_DurationInput input { text-align: center; } .hunt_optimizer_HelpView p { margin: 1em; max-width: 600px; } :root { /* Basic view variables */ --bg-color: hsl(0, 0%, 15%); --text-color: hsl(0, 0%, 80%); --text-color-disabled: hsl(0, 0%, 55%); --font-family: Verdana, Geneva, sans-serif; --border-color: hsl(0, 0%, 25%); --border: solid 1px var(--border-color); /* Scrollbars */ --scrollbar-color: hsl(0, 0%, 13%); --scrollbar-thumb-color: hsl(0, 0%, 17%); /* Controls */ --control-bg-color: hsl(0, 0%, 20%); --control-bg-color-hover: hsl(0, 0%, 25%); --control-text-color: hsl(0, 0%, 80%); --control-text-color-hover: hsl(0, 0%, 90%); --control-border: solid 1px hsl(0, 0%, 10%); --control-inner-border: solid 1px hsl(0, 0%, 35%); /* Inputs */ --input-bg-color: hsl(0, 0%, 12%); --input-bg-color-disabled: hsl(0, 0%, 15%); --input-text-color: hsl(0, 0%, 75%); --input-text-color-disabled: var(--text-color-disabled); --input-border: solid 1px hsl(0, 0%, 25%); --input-border-hover: solid 1px hsl(0, 0%, 30%); --input-border-focus: solid 1px hsl(0, 0%, 40%); --input-border-disabled: solid 1px hsl(0, 0%, 20%); --input-inner-border: solid 1px hsl(0, 0%, 5%); } * { scrollbar-color: var(--scrollbar-thumb-color) var(--scrollbar-color); } ::-webkit-scrollbar { background-color: var(--scrollbar-color); } ::-webkit-scrollbar-track { background-color: var(--scrollbar-color); } ::-webkit-scrollbar-thumb { background-color: var(--scrollbar-thumb-color); } ::-webkit-scrollbar-corner { background-color: var(--scrollbar-color); } body { cursor: default; user-select: none; overflow: hidden; margin: 0; font-size: 13px; background-color: var(--bg-color); color: var(--text-color); font-family: var(--font-family); } h2 { font-size: 1.1em; margin: 0.5em 0; } #root *[hidden] { display: none; }