fish-shell/share/tools/web_config/fishconfig.css
Aaron Gyes 00e32a0909 Use fonts found on terminals for the web config.
Instead of just using Courier New across the board, have the
browser try several likely available fonts before defaulting
to the system's "monospace".

Thanks @MarkGriffiths
Fixes #2924
2016-05-18 11:21:14 -07:00

525 lines
9.5 KiB
CSS

body {
background-color: #292929;
font-family: "Source Code Pro", "DejaVu Sans Mono", Menlo, "Ubuntu Mono", Consolas, Monaco, "Lucida Console", monospace, fixed;
color: white;
}
#ancestor {
width: 80%;
margin-left: auto;
margin-right: auto;
margin-top: 25px;
}
#parent {
width: 100%;
min-height: 480px;
margin-top: 12px;
}
#tab_parent {
display: table;
width: 100%;
height: 50px;
}
.tab {
display: table-cell;
border: 1px solid #111;
border-right: none;
padding-bottom: 15px;
padding-top: 15px;
padding-left: 8px;
padding-right: 8px;
font-size: 17pt;
text-align: center;
width: 15%;
background-color: #292929;
cursor: pointer;
}
#tab_parent :first-child {
border-top-left-radius: 8px;
}
#tab_parent :last-child {
border-right: 1px solid #111;
border-top-right-radius: 8px;
}
.tab_first {
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
}
.tab_last {
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
}
.selected_tab {
background-color: black;
border-color: black;
}
#tab_contents {
padding-top: 35px;
width: 100%;
background-color: black;
border-bottom-left-radius: 8px;
border-bottom-right-radius: 8px;
margin-bottom: 20px;
}
.footer {
clear: both;
height: 30px;
}
.master_detail_table {
display: table;
margin-top: 10px;
margin-left: 12px;
margin-right: 12px;
}
.master {
display: table-cell;
text-align: right;
min-width: 200px;
font-size: 16pt;
padding-bottom: 20px;
padding-top: 35px;
vertical-align: top;
}
.detail {
display: table-cell;
border: 1px solid #555;
background-color: #181818;
padding-top: 30px;
padding-bottom: 20px;
padding-left: 30px;
padding-right: 30px;
border-radius: 5;
width: 100%;
}
.detail_function {
white-space: pre-wrap;
width: 100%;
font-size: 11pt;
color: #BBB;
}
.master_element {
cursor: pointer;
padding-top: 6px;
padding-bottom: 11px;
padding-left: 5px;
padding-right: 22px;
font-size: 12pt;
/* Make our border overlap the detail, even if we're unselected (so it doesn't jump when selected) */
position: relative;
left: 1px;
border-bottom-style: solid;
border-bottom-width: 0px;
}
.selected_master_elem {
border: 1px solid #555;
border-right: none;
background-color: #181818;
border-top-left-radius: 5;
border-bottom-left-radius: 5;
/* Pad one less than .master_element, to accomodate our border. */
padding-top: 5px;
padding-bottom: 10px;
padding-left: 4px;
}
.master_element_text {
text-decoration: none;
padding-bottom: 1px;
border-bottom-style: inherit;
border-bottom-color: inherit;
border-bottom-width: 1px;
}
.master_element_description {
text-decoration: none;
padding-top: 15px;
font-size: 10pt;
border-bottom-style: inherit;
border-bottom-color: inherit;
border-bottom-width: 1px;
display: none;
}
.selected_master_elem > .master_element_description {
display: inline;
}
/* We have a newline between the label and description; hide it initially, but show it when it's selected */
.master_element > br { display: none; }
.selected_master_elem > br { display: inherit; }
/* Set this class to suppress the border bottom on master_element_texts with visible descriptions */
.master_element_no_border { border-bottom-width: 0 }
.colorpicker_term256 {
border: solid #444 1px;
border-collapse: collapse;
}
.colorpicker_modifiers {
margin-top: 10px;
display:inline-block;
margin-left: auto;
margin-right: auto;
color: #AAA;
font-size: smaller;
}
.colorpicker_modifier_cell {
cursor: pointer;
display:inline-block;
text-align: center;
border: groove #333 2px;
padding: 5px;
margin-top: 5px;
margin-left: auto;
margin-right: auto;
}
.modifier_cell_selected {
color: #CCC;
border-color: #AAA;
background-color: #444;
}
.data_table {
table-layout:fixed;
color: #CCC;
width: 100%;
padding-left: 10px;
padding-right: 10px;
}
.data_table_row {
}
.data_table_cell {
padding-top: 5px;
padding-bottom: 5px;
vertical-align: top;
overflow:hidden;
border-bottom: #444 dotted 1px;
word-wrap: break-word;
}
.history_text {
padding-top: 5px;
padding-bottom: 5px;
vertical-align: top;
overflow:hidden;
border-bottom: #444 dotted 1px;
word-wrap: break-word;
}
.history_delete {
width: 20px;
border-bottom: #444 dotted 1px;
}
.abbreviation_actions {
width: 8em;
text-align: right;
border-bottom: #444 dotted 1px;
}
.abbreviation_input {
background-color: #111;
border: solid 1px #777;
height: 1.5em;
color: white;
font: inherit;
padding: 3px;
margin: 0;
}
/* The CSS we apply when a table row is filtered */
.data_table_row_filtered {
display: none;
}
.no_overflow {
text-overflow: ellipsis;
white-space: nowrap;
}
.colorpicker_target {
margin: 0 0 -50px 0;
position: relative;
bottom: 47px;
float: left; /* for some reason this makes the cells that it overlaps (before adjusting its bottom) clickable in Safari */
}
.colorpicker_target_tab {
cursor: pointer;
color: #555;
border: solid 1px #555;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 7px;
padding-right: 7px;
display: inline-block;
background-color: black;
margin-right: -2px;
min-width: 110px;
text-align: center;
}
.colorpicker_target_selected {
background-color: #181818; /* same as #detail */
color: white;
}
.colorpicker_term256_row {
padding: 0;
}
.colorpicker_term256_cell {
width: 18px;
height: 18px;
border: solid black 1px;
padding: 0;
}
.colorpicker_term256_selection_indicator {
width: 18px;
height: 16px;
margin: -4px;
border: solid white 4px;
position: relative;
z-index: 2;
}
.colorpicker_cell_selected {
width: 12px;
height: 12px;
}
.colorpicker_text_sample, .colorpicker_text_sample_tight {
font-size: 12pt;
padding: 25px;
margin: 5px 20px 25px 20px; /* top right bottom left */
cursor: pointer;
line-height: 1.8em;
border: solid #777 1px;
position: relative; /* so that our absolutely positioned elements work */
}
.cs_clickable {
border: dotted 1px #777;
padding: 4px;
margin: -5px;
}
.cs_editing {
border: solid 3px #3399FF;
padding: 4px;
margin: -7px;
}
.colorpicker_text_sample_tight {
font-size: 10pt;
line-height: 1.2em;
margin: 0px 6px;
max-width: 220px;
padding: 5px;
white-space:nowrap;
overflow: hidden;
text-overflow: clip;
}
.color_picker_background_cells {
position: absolute;
right: 0px;
top: 0px;
}
.color_picker_background_cells div {
width: 24px;
height: 24px;
border-style: solid;
border-color: #777;
border-width: 0 0 1px 1px; /* top right bottom left */
float: left;
}
.color_picker_background_cells span {
float: left;
font-size: 12pt;
padding-top: 2px;
padding-right: 8px;
cursor: pointer;
}
.color_scheme_choice_label, .prompt_demo_choice_label {
margin-left: 10px;
margin-bottom: 3px;
cursor: pointer;
font-size: 12pt;
white-space: normal;
color: #AAA;
}
.color_scheme_choices_scrollview, .prompt_choices_scrollview {
border-top: 1px solid #333;
padding-top: 5px;
overflow: scroll;
max-height: 30em; /* about two and a half boxes */
}
.color_scheme_choices_list, .prompt_choices_list {
overflow-y: hidden; /* makes our height account for floats */
padding: 0 10px 15px 10px; /* top right bottom left */
bottom: 0px;
}
.color_scheme_choice_container {
float: left;
padding: 5px;
}
.fake_cursor {
background-color: #999;
}
.error_msg {
color: red;
font-size: 12pt;
margin-left: 24pt;
margin-top: 5pt;
margin-bottom: 5pt;
}
img.delete_icon {
width: 20px;
height: 20px;
cursor: pointer;
text-decoration: none;
border: none;
}
#table_filter_container {
/* top right bottom left*/
padding: 0 10 10 30;
text-align: right;
position: relative;
bottom: 10px;
}
.filter_text_box {
width: 250px;
padding: 5 10 5 10;
background-color: #888;
border: #222 solid 3px;
border-radius: 15px;
font-size: 12pt;
color: white;
font-weight: bold;
}
.text_box_transient {
color: #C8C8C8;
}
.prompt_demo, .current_prompt {
font-size: 12pt;
padding: 10px;
margin: 5px 5px 25px 5px; /* top right bottom left */
cursor: pointer;
line-height: 1.8em;
border: solid #333 1px;
position: relative; /* so that our absolutely positioned elements work */
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.prompt_demo {
white-space: pre;
}
.unbordered {
border: none;
padding-top: 0;
padding-bottom: 0;
}
.save_button, .prompt_save_button, .colors_close_button, .customize_theme_button, .generic_button {
border-radius: 5px;
border: solid rgba(71,71,71,0.5) 1px;
padding: 5px 8px;
font-size: 13pt;
display: inline-block;
margin-top: 12px;
background-color: rgba(128,128,128,0.2);
color: #FFF;
cursor: pointer;
}
.save_button:hover, .customize_theme_button:hover, .generic_button:hover {
border-color: rgba(71,71,71,0.9);
}
.button_highlight {
background-color: rgba(128,128,128,0.6)
}
.prompt_save_button {
background-color: #333;
border: solid #525252 1px;
color: #ffffff;
margin: 2px 20px 25px; /* top right bottom left */
font-size: 12pt;
}
.prompt_demo_text {
white-space: pre;
line-height: 170%;
padding: 4px 12px;
font-size: 14pt;
top: 0px;
bottom: 0px;
vertical-align: middle;
display: table-cell;
height: 72px; /* this is really the min height */
}
.prompt_function {
display: block;
border: 1px solid #555;
background-color: #181818;
margin: 5px 20px 5px;
border-radius: 5;
}
.prompt_function_text {
white-space: pre-wrap;
padding: 15px 3px;
width: 100%;
height: 25%;
overflow: auto;
}
.external_link_img {
width: 16px;
height: 16px;
vertical-align: text-top;
margin-left: 10px;
};