Files
gf-core/src/www/gfse/editor.css
hallgren be311aeb07 gfse: more readable layout for not so simple grammars + bug fix
To make definitions that span multiple lines more readable in guided mode,
preserve line breaks and indentation when lin and oper definitions are
displayed and edited in guided mode.

Bug fix: moving the cursor by clicking and selecting text by dragging did
not work in textareas and input fields, because those mouse event were
intercepted by the sort-by-drag-and-drop handler.
2012-11-26 14:11:12 +00:00

165 lines
5.0 KiB
CSS

body { color: black; background: #eee; }
h1 { font-size: 175%; }
h1,h2,h3,h4,small { font-family: sans-serif;}
h1,h2,h3,h4 { color: #303030; text-shadow: rgba(0,0,0,0.25) 3px 3px 5px; }
h1:first-child, h2:first-child { margin-top: 0; margin-bottom: 1ex; }
h1 img { float: right; border: 0; max-width: 50%; }
h1 img.nofloat { float: none; }
#editor {
/* This allows the div to grow wider than the window if necessary to
accommodate the contents. Otherwise, wide things inside can poke
through the border. */
display: table;
width: 100%;
}
div.home, div.grammar { border: 1px solid black; background: #9df; }
div.home { padding: 5px; }
div.files { margin: 0 8px 8px 8px; position: relative; }
td.public_grammars { padding-left: 2em; }
.no_publish .publish { display: none; }
div#file, table.extension td, table.extension th { border: 2px solid #009; }
div#file { border-top-width: 0; }
pre.plain { border: 2px solid #009; }
div#file, pre.plain, table.matrixview td { background: white; padding: 0.6ex; }
table.extension { border-collapse: collapse; background: white; }
table.extension td, table.extension th { padding: 1ex; }
table.extension th { border-right-width: 0; color: #009; }
table.extension td { border-left-width: 0; min-width: 30em; }
.slideshow .hidden { display: none; }
img.cloud, img.right, div.right, div.modtime { float: right; }
.modtime { color: #999; white-space: nowrap; }
table.grammar_list { border-collapse: collapse; margin-left: 1.0em; }
table.grammar_list td { padding: 0.4ex 0.25em; }
div.namebar { background: #9df; }
div.namebar table { width: 100%; }
.namebar h3, .sheet h3 { margin: 0; color: #009; }
.home h3 { margin-top: 0; color: #009; }
div.comment:before { content: "-- "; }
div.comment { color: #009; margin-left: 1em; }
td.right { text-align: right; }
td.center { text-align: center; }
.kw { font-weight: bold; font-family: sans-serif; color: #009; }
.sep { font-weight: bold; color: #009; }
div.indent { padding-left: 1em; min-width: 1em; min-height: 1em; }
div.fun:hover, div.param:hover, div.lincat:hover, div.oper:hover, div.lin:hover,
div.template:hover
{ background: #def;}
.exb_linbuttons input[type=button] { float: right; clear: right; margin: 0; }
.exb_output { background: #dfd; float: right; margin: 0 10px; }
.more, .delete { font-weight: bold; font-family: sans-serif; }
.more, .delete, .edit, *[onclick], .onclick { cursor: pointer; }
.onclick:hover, .ident[onclick]:hover { text-decoration: underline; }
.hover .more, .hover .delete, .hover .edit { visibility: hidden }
.hover .hidden, .nohover .ifhover { display: none; }
.editable:hover, .deletable:hover { background: #ff9; }
.extensible:hover .more,.editable:hover > .edit ,.deletable:hover > .delete,
tr.deletable:hover .delete
{ visibility: visible; }
.editable { white-space: pre; }
div.lin span.editable { display: inline-block; vertical-align: top; }
.more { color: green; }
.edit { color: orange; }
.delete { color: red; }
.error_message,.inError { color: red; }
.template, .template .sep, .unimportant { color: #999; }
form { display: inline-block; }
table.tabs {
width: 100%;
border-width: 0; border-spacing: 0; empty-cells: show;
}
table.tabs td { text-align: center; border: 2px solid #009; padding: 2px; white-space: nowrap; }
table.tabs td.active { background: white; border-bottom-width: 0; }
table.tabs td.inactive {
background: #cef;
border-top-color: #66c; border-left-color: #66c; border-right-color: #66c;
}
table.matrixview th { background: #cef; color: #009; }
table.tabs td.gap
{ border-top-width: 0; border-left-width: 0; border-right-width: 0; }
table.tabs input[type=button], table.matrixview th input[type=button] {
border: 0;
background: inherit;
color: #009;
font-size: inherit;
font-weight: bold;
/*text-decoration: underline;*/
}
.string_edit { font-family: inherit; font-size: inherit; }
textarea.string_edit { vertical-align: top; }
ul.languages { -moz-column-width: 20em; }
li { margin-top: 0.5ex; margin-bottom: 0.5ex; }
#sharing h1, #sharing .footer { display: none; }
div.compiler_output .back_to_editor { display: none; }
textarea.text_mode {
/*font-family: inherit; font-size: inherit;*/
width: 99%;
}
div#minibar {
border: 1px solid black;
padding: 5px;
background: #ccc url("../minibar/brushed-metal.png");
}
table.page_overlay {
position: absolute;
top: 0; left: 0;
width: 100%; height: 100%;
background: rgba(0,0,0,0.5);
}
table.page_overlay>tr>td { text-align: center; vertical-align: middle; }
div.grammar_extension {
display: inline-block;
border: 1px solid black;
background: #9df;
padding: 2ex;
margin: 2ex;
box-shadow: 10px 10px 10px rgba(0,0,0,0.3);
}
div.sheet {
position: relative;
background: white;
padding: 1ex;
margin: 2ex;
box-shadow: 5px 5px 15px rgba(0,0,0,0.5);
transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-webkit-transition: all 0.5s ease-in-out;
}