mirror of
https://github.com/abapGit/abapGit.git
synced 2025-04-30 20:03:20 +08:00
Ui themes support (#2700)
* settings ui_theme * theme css rendering * theme split * linetr fix
This commit is contained in:
parent
f9f8adcf9e
commit
6845fe3ea4
|
@ -5,29 +5,24 @@
|
|||
/* GLOBALS */
|
||||
|
||||
body {
|
||||
font-family: Arial,Helvetica,sans-serif;
|
||||
font-size: 12pt;
|
||||
background: #E8E8E8;
|
||||
overflow-x: hidden;
|
||||
font-family: Arial,Helvetica,sans-serif;
|
||||
font-size: 12pt;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
a, a:visited {
|
||||
color: #4078c0;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a:hover, a:active {
|
||||
cursor: pointer;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
#abapGitLogo {
|
||||
outline: none;
|
||||
img {
|
||||
border-width: 0px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
img { border: 0px; vertical-align: middle; }
|
||||
table { border-collapse: collapse; }
|
||||
pre { display: inline; }
|
||||
table { border-collapse: collapse; }
|
||||
pre { display: inline; }
|
||||
sup {
|
||||
vertical-align: top;
|
||||
position: relative;
|
||||
|
@ -37,107 +32,83 @@ sup {
|
|||
|
||||
input, textarea, select {
|
||||
padding: 3px 6px;
|
||||
border: 1px solid #ddd;
|
||||
border: 1px solid;
|
||||
}
|
||||
|
||||
input:focus, textarea:focus {
|
||||
border: 1px solid #8cadd9;
|
||||
border: 1px solid;
|
||||
}
|
||||
|
||||
/* COLOR PALETTE */
|
||||
.grey { color: lightgrey !important; }
|
||||
.grey70 { color: #b3b3b3 !important; }
|
||||
.grey80 { color: #ccc !important; }
|
||||
.bgorange { background-color: orange; }
|
||||
.darkgrey { color: #808080 !important; }
|
||||
.attention { color: red !important; }
|
||||
.error { color: #d41919 !important; }
|
||||
.warning { color: #efb301 !important; }
|
||||
.success { color: green !important; }
|
||||
.blue { color: #5e8dc9 !important; }
|
||||
.red { color: red !important; }
|
||||
.white { color: white !important; }
|
||||
|
||||
/* MODIFIERS */
|
||||
.emphasis { font-weight: bold !important; }
|
||||
.crossout { text-decoration: line-through !important; }
|
||||
.right { text-align:right; }
|
||||
.center { text-align:center; }
|
||||
.paddings { padding: 0.5em 0.5em; }
|
||||
.pad-sides { padding-left: 0.3em; padding-right: 0.3em; }
|
||||
.margin-v5 { margin-top: 0.5em; margin-bottom: 0.5em; }
|
||||
.indent5em { padding-left: 0.5em; }
|
||||
.pad4px { padding: 4px; }
|
||||
.w100 { width: 100%; }
|
||||
.wmin { width: 1%; }
|
||||
.w40 { width: 40%; }
|
||||
.float-right { float: right; }
|
||||
.pad-right { padding-right: 6px; }
|
||||
.inline { display: inline; }
|
||||
.emphasis { font-weight: bold !important; }
|
||||
.crossout { text-decoration: line-through !important; }
|
||||
.right { text-align:right; }
|
||||
.center { text-align:center; }
|
||||
.paddings { padding: 0.5em 0.5em; }
|
||||
.pad-sides { padding-left: 0.3em; padding-right: 0.3em; }
|
||||
.margin-v5 { margin-top: 0.5em; margin-bottom: 0.5em; }
|
||||
.indent5em { padding-left: 0.5em; }
|
||||
.pad4px { padding: 4px; }
|
||||
.w100 { width: 100%; }
|
||||
.wmin { width: 1%; }
|
||||
.w40 { width: 40%; }
|
||||
.float-right { float: right; }
|
||||
.pad-right { padding-right: 6px; }
|
||||
.inline { display: inline; }
|
||||
.hidden { visibility: hidden; }
|
||||
|
||||
/* PANELS */
|
||||
div.panel {
|
||||
border-radius: 3px;
|
||||
}
|
||||
div.panel.success {
|
||||
color: #589a58 !important;
|
||||
background: #c5eac5;
|
||||
}
|
||||
/* TODO: add warning and error colors */
|
||||
|
||||
/* STRUCTURE DIVS, HEADER & FOOTER */
|
||||
div#header {
|
||||
padding: 0.5em 0.5em;
|
||||
border-bottom: 3px double lightgrey;
|
||||
}
|
||||
div#header td.logo { width: 164px; }
|
||||
div#header td:not(.logo) { padding-top: 11px; } /* align with logo H */
|
||||
div#header span.page_title {
|
||||
font-weight: normal;
|
||||
font-size: 18pt;
|
||||
color: #bbb;
|
||||
padding-left: 0.4em;
|
||||
}
|
||||
|
||||
div#toc {
|
||||
padding: 0.5em 1em;
|
||||
background-color: #f2f2f2;
|
||||
}
|
||||
div#toc .favorites a { opacity: 0.5; }
|
||||
div#toc .favorites:hover a { opacity: 1; }
|
||||
|
||||
div#footer {
|
||||
padding: 0.5em 1em;
|
||||
border-top: 3px double lightgrey;
|
||||
text-align: center;
|
||||
}
|
||||
div#footer span.version {
|
||||
display: block;
|
||||
color: grey;
|
||||
margin-top: 0.3em;
|
||||
}
|
||||
|
||||
#debug-output {
|
||||
text-align: right;
|
||||
padding-right: 0.5em;
|
||||
color: #ccc;
|
||||
font-style: italic;
|
||||
font-size: small;
|
||||
}
|
||||
|
||||
div.dummydiv {
|
||||
background-color: #f2f2f2;
|
||||
padding: 0.5em 1em;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* STRUCTURE DIVS, HEADER & FOOTER */
|
||||
#abapGitLogo { outline: none; }
|
||||
|
||||
div#header {
|
||||
padding: 0.5em 0.5em;
|
||||
border-bottom: 3px double;
|
||||
}
|
||||
div#header td:not(.logo) { padding-top: 11px; } /* align with logo H */
|
||||
div#header td.logo { width: 164px; }
|
||||
div#header td:not(.logo) { padding-top: 11px; } /* align with logo H */
|
||||
div#header span.page_title {
|
||||
font-weight: normal;
|
||||
font-size: 18pt;
|
||||
padding-left: 0.4em;
|
||||
}
|
||||
|
||||
div#toc { padding: 0.5em 1em; }
|
||||
div#toc .favorites a { opacity: 0.5; }
|
||||
div#toc .favorites:hover a { opacity: 1; }
|
||||
|
||||
div#footer {
|
||||
padding: 0.5em 1em;
|
||||
border-top: 3px double;
|
||||
text-align: center;
|
||||
}
|
||||
div#footer span.version {
|
||||
display: block;
|
||||
margin-top: 0.3em;
|
||||
}
|
||||
|
||||
/* ERROR LOG */
|
||||
|
||||
div.log {
|
||||
padding: 6px;
|
||||
margin: 4px;
|
||||
background-color: #fee6e6;
|
||||
border: 1px #fdcece solid;
|
||||
border: 1px solid;
|
||||
border-radius: 4px;
|
||||
}
|
||||
div.log > span { display:block; }
|
||||
|
@ -145,23 +116,19 @@ div.log .icon { padding-right: 6px; }
|
|||
|
||||
/* REPOSITORY */
|
||||
div.repo {
|
||||
margin-top: 3px;
|
||||
background-color: #f2f2f2;
|
||||
margin-top: 3px;
|
||||
padding: 0.5em 1em 0.5em 1em;
|
||||
position: relative;
|
||||
}
|
||||
.repo_name span.name {
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
font-size: 14pt;
|
||||
}
|
||||
.repo_name a.url {
|
||||
color: #ccc;
|
||||
font-size: 12pt;
|
||||
margin-left: 0.5em;
|
||||
}
|
||||
.repo_name span.url {
|
||||
color: #ccc;
|
||||
font-size: 12pt;
|
||||
margin-left: 0.5em;
|
||||
}
|
||||
|
@ -169,7 +136,6 @@ div.repo {
|
|||
padding-right: 4px;
|
||||
}
|
||||
.repo_attr {
|
||||
color: grey;
|
||||
font-size: 12pt;
|
||||
}
|
||||
.repo_attr span {
|
||||
|
@ -177,26 +143,15 @@ div.repo {
|
|||
margin-right: 0.5em;
|
||||
}
|
||||
.repo_attr span.bg_marker {
|
||||
border: 1px solid #d2d2d2;
|
||||
border: 1px solid;
|
||||
border-radius: 3px;
|
||||
background: #d8d8d8;
|
||||
color: #fff;
|
||||
font-size: 8pt;
|
||||
padding: 4px 2px 3px 2px;
|
||||
}
|
||||
.repo_attr span.branch {
|
||||
padding: 2px 4px;
|
||||
border: 1px solid #d9d9d9;
|
||||
border: 1px solid;
|
||||
border-radius: 4px;
|
||||
background-color: #e2e2e2;
|
||||
}
|
||||
.repo_attr span.branch_head {
|
||||
border-color: #d8dff3;
|
||||
background-color: #eceff9;
|
||||
}
|
||||
.repo_attr span.branch_branch {
|
||||
border-color: #e7d9b1;
|
||||
background-color: #f8f0d8;
|
||||
}
|
||||
|
||||
/* MISC AND REFACTOR */
|
||||
|
@ -222,15 +177,13 @@ div.repo_banner {
|
|||
}
|
||||
|
||||
table.repo_tab {
|
||||
border: 1px solid #DDD;
|
||||
border: 1px solid;
|
||||
border-radius: 3px;
|
||||
background: #fff;
|
||||
width: 100%;
|
||||
}
|
||||
.repo_tab td {
|
||||
border-top: 1px solid #eee;
|
||||
border-top: 1px solid;
|
||||
vertical-align: middle;
|
||||
color: #333;
|
||||
padding-top: 2px;
|
||||
padding-bottom: 2px;
|
||||
}
|
||||
|
@ -258,10 +211,7 @@ table.repo_tab {
|
|||
padding-left: 0.5em;
|
||||
padding-right: 0.7em;
|
||||
}
|
||||
.repo_tab tr.unsupported { color: lightgrey; }
|
||||
.repo_tab tr.modified { background: #fbf7e9; }
|
||||
.repo_tab tr:first-child td { border-top: 0px; }
|
||||
.repo_tab td.current_dir { color: #ccc; }
|
||||
.repo_tab td.cmd span.state-block {
|
||||
margin-left: 1em;
|
||||
font-family: Consolas, Lucida Console, Courier, monospace;
|
||||
|
@ -273,84 +223,43 @@ table.repo_tab {
|
|||
.repo_tab td.cmd span.state-block span {
|
||||
display: inline-block;
|
||||
padding: 0px 2px;
|
||||
border: 1px solid #000;
|
||||
border: 1px solid;
|
||||
}
|
||||
.repo_tab td.cmd span.state-block span.added {
|
||||
background-color: #69ad74;
|
||||
border-color: #579e64;
|
||||
color: white;
|
||||
}
|
||||
.repo_tab td.cmd span.state-block span.changed {
|
||||
background-color: #e0c150;
|
||||
border-color: #d4af25;
|
||||
color: white;
|
||||
}
|
||||
.repo_tab td.cmd span.state-block span.mixed {
|
||||
background-color: #e0c150;
|
||||
border-color: #579e64;
|
||||
color: #69ad74;
|
||||
}
|
||||
.repo_tab td.cmd span.state-block span.deleted {
|
||||
background-color: #c76861;
|
||||
border-color: #b8605a;
|
||||
color: white;
|
||||
}
|
||||
.repo_tab td.cmd span.state-block span.none {
|
||||
background-color: #e8e8e8;
|
||||
border-color: #dbdbdb;
|
||||
color: #c8c8c8;
|
||||
}
|
||||
.repo_tab .inactive { color: orange; }
|
||||
|
||||
/* STAGE */
|
||||
div.stage-container { width: 850px; }
|
||||
input.stage-filter { width: 18em; }
|
||||
|
||||
.stage_tab {
|
||||
border: 1px solid #DDD;
|
||||
background: #fff;
|
||||
border: 1px solid;
|
||||
margin-top: 0.2em;
|
||||
}
|
||||
.stage_tab td {
|
||||
border-top: 1px solid #eee;
|
||||
color: #333;
|
||||
border-top: 1px solid;
|
||||
vertical-align: middle;
|
||||
padding: 2px 0.5em;
|
||||
}
|
||||
.stage_tab th {
|
||||
color: #BBB;
|
||||
text-align: left;
|
||||
font-weight: normal;
|
||||
background-color: #edf2f9;
|
||||
padding: 4px 0.5em;
|
||||
}
|
||||
.stage_tab td.status {
|
||||
width: 2em;
|
||||
text-align: center;
|
||||
color: #ccc;
|
||||
background-color: #fafafa;
|
||||
}
|
||||
.stage_tab td.highlight {
|
||||
color: #444 !important;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.stage_tab td.cmd { cursor: pointer; }
|
||||
.stage_tab td.cmd a { padding: 0px 4px; }
|
||||
.stage_tab th.cmd a { padding: 0px 4px; }
|
||||
.stage_tab td.method { color: #ccc; }
|
||||
.stage_tab td.user { color: #aaa; }
|
||||
.stage_tab td.type { color: #aaa; }
|
||||
.stage_tab tbody tr:first-child td { padding-top: 0.5em; }
|
||||
.stage_tab tbody tr:last-child td { padding-bottom: 0.5em; }
|
||||
.stage_tab mark {
|
||||
color: white;
|
||||
background-color: #79a0d2;
|
||||
}
|
||||
|
||||
/* COMMIT */
|
||||
div.form-container {
|
||||
background-color: #F8F8F8;
|
||||
padding: 1em 1em;
|
||||
}
|
||||
|
||||
|
@ -360,7 +269,6 @@ form.aligned-form {
|
|||
}
|
||||
|
||||
form.aligned-form label {
|
||||
color: #BBB;
|
||||
padding-right: 1em;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
@ -371,7 +279,6 @@ form.aligned-form select {
|
|||
}
|
||||
|
||||
form.aligned-form span.sub-title {
|
||||
color: #BBB;
|
||||
font-size: smaller;
|
||||
padding-top: 8px;
|
||||
}
|
||||
|
@ -386,8 +293,6 @@ form.aligned-form span.cell { display: table-cell; }
|
|||
div.settings_container {
|
||||
padding: 0.5em;
|
||||
font-size: 10pt;
|
||||
color: #444;
|
||||
background-color: #f2f2f2;
|
||||
}
|
||||
|
||||
div.settings_section {
|
||||
|
@ -396,7 +301,6 @@ div.settings_section {
|
|||
|
||||
/* DIFF */
|
||||
div.diff {
|
||||
background-color: #f2f2f2;
|
||||
padding: 0.7em
|
||||
}
|
||||
div.diff_head {
|
||||
|
@ -404,21 +308,15 @@ div.diff_head {
|
|||
}
|
||||
span.diff_name {
|
||||
padding-left: 0.5em;
|
||||
color: grey;
|
||||
}
|
||||
span.diff_changed_by {
|
||||
color: grey;
|
||||
float: right;
|
||||
}
|
||||
span.diff_changed_by span.user {
|
||||
border-radius: 3px;
|
||||
border: solid 1px #c2d4ea;
|
||||
background-color: #d9e4f2;
|
||||
border: solid 1px;
|
||||
padding: 1px 0.4em;
|
||||
}
|
||||
span.diff_name strong {
|
||||
color: #333;
|
||||
}
|
||||
span.diff_banner {
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
|
@ -426,22 +324,9 @@ span.diff_banner {
|
|||
padding-left: 0.3em;
|
||||
padding-right: 0.3em;
|
||||
}
|
||||
.diff_ins {
|
||||
border-color: #abf2ab;
|
||||
background-color: #e0ffe0;
|
||||
}
|
||||
.diff_del {
|
||||
border-color: #ff667d;
|
||||
background-color: #ffccd4;
|
||||
}
|
||||
.diff_upd {
|
||||
border-color: #dada00;
|
||||
background-color: #ffffcc;
|
||||
}
|
||||
div.diff_content {
|
||||
background: #fff;
|
||||
border-top: 1px solid #DDD;
|
||||
border-bottom: 1px solid #DDD;
|
||||
border-top: 1px solid;
|
||||
border-bottom: 1px solid;
|
||||
}
|
||||
|
||||
div.diff_content tbody tr td{
|
||||
|
@ -458,32 +343,7 @@ div.diff_head span.state-block {
|
|||
div.diff_head span.state-block span {
|
||||
display: inline-block;
|
||||
padding: 0px 4px;
|
||||
border: 1px solid #000;
|
||||
}
|
||||
div.diff_head span.state-block span.added {
|
||||
background-color: #69ad74;
|
||||
border-color: #579e64;
|
||||
color: white;
|
||||
}
|
||||
div.diff_head span.state-block span.changed {
|
||||
background-color: #e0c150;
|
||||
border-color: #d4af25;
|
||||
color: white;
|
||||
}
|
||||
div.diff_head span.state-block span.mixed {
|
||||
background-color: #e0c150;
|
||||
border-color: #579e64;
|
||||
color: #69ad74;
|
||||
}
|
||||
div.diff_head span.state-block span.deleted {
|
||||
background-color: #c76861;
|
||||
border-color: #b8605a;
|
||||
color: white;
|
||||
}
|
||||
div.diff_head span.state-block span.none {
|
||||
background-color: #e8e8e8;
|
||||
border-color: #dbdbdb;
|
||||
color: #c8c8c8;
|
||||
border: 1px solid;
|
||||
}
|
||||
|
||||
/* DIFF TABLE */
|
||||
|
@ -493,7 +353,6 @@ table.diff_tab {
|
|||
width: 100%;
|
||||
}
|
||||
table.diff_tab td,th {
|
||||
color: #444;
|
||||
padding-left: 0.5em;
|
||||
padding-right: 0.5em;
|
||||
}
|
||||
|
@ -504,28 +363,19 @@ table.diff_tab th {
|
|||
padding-bottom: 3px;
|
||||
}
|
||||
table.diff_tab thead.header th {
|
||||
color: #EEE;
|
||||
background-color: #BBB;
|
||||
text-align: left;
|
||||
font-weight: bold;
|
||||
padding-left: 0.5em;
|
||||
font-size: 9pt;
|
||||
}
|
||||
table.diff_tab thead.nav_line {
|
||||
background-color: #edf2f9;
|
||||
}
|
||||
table.diff_tab thead.nav_line th {
|
||||
color: #bbb;
|
||||
}
|
||||
table.diff_tab td.num, th.num {
|
||||
width: 1%;
|
||||
min-width: 2em;
|
||||
padding-right: 8px;
|
||||
padding-left: 8px;
|
||||
text-align: right !important;
|
||||
color: #ccc;
|
||||
border-left: 1px solid #eee;
|
||||
border-right: 1px solid #eee;
|
||||
border-left: 1px solid;
|
||||
border-right: 1px solid;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
@ -535,9 +385,8 @@ table.diff_tab td.patch, th.patch {
|
|||
padding-right: 8px;
|
||||
padding-left: 8px;
|
||||
text-align: right !important;
|
||||
color: #ccc;
|
||||
border-left: 1px solid #eee;
|
||||
border-right: 1px solid #eee;
|
||||
border-left: 1px solid;
|
||||
border-right: 1px solid;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
cursor: pointer;
|
||||
|
@ -558,19 +407,10 @@ table.diff_tab td.code {
|
|||
table.diff_tab tbody tr:first-child td { padding-top: 0.5em; }
|
||||
table.diff_tab tbody tr:last-child td { padding-bottom: 0.5em; }
|
||||
|
||||
/* STYLES for Syntax Highlighting */
|
||||
.syntax-hl span.keyword { color: #0a69ce; }
|
||||
.syntax-hl span.text { color: #48ce4f; }
|
||||
.syntax-hl span.comment { color: #808080; font-style: italic; }
|
||||
.syntax-hl span.xml_tag { color: #457ce3; }
|
||||
.syntax-hl span.attr { color: #b777fb; }
|
||||
.syntax-hl span.attr_val { color: #7a02f9; }
|
||||
|
||||
/* DEBUG INFO STYLES */
|
||||
div.debug_container {
|
||||
padding: 0.5em;
|
||||
font-size: 10pt;
|
||||
color: #444;
|
||||
font-family: Consolas, Courier, monospace;
|
||||
}
|
||||
|
||||
|
@ -580,7 +420,6 @@ div.debug_container p {
|
|||
|
||||
/* DB ENTRIES */
|
||||
div.db_list {
|
||||
background-color: #fff;
|
||||
padding: 0.5em;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
@ -596,28 +435,20 @@ table.db_tab pre {
|
|||
|
||||
table.db_tab tr.firstrow td { padding-top: 0.5em; }
|
||||
table.db_tab th {
|
||||
color: #888888;
|
||||
text-align: left;
|
||||
padding: 0.5em;
|
||||
border-bottom: 1px #ddd solid;
|
||||
border-bottom: 1px solid;
|
||||
}
|
||||
table.db_tab td {
|
||||
color: #333;
|
||||
padding: 4px 8px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
table.db_tab td.data {
|
||||
color: #888;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
table.db_tab tbody tr:hover, tr:active {
|
||||
background-color: #f4f4f4;
|
||||
}
|
||||
|
||||
/* DB ENTRY DISPLAY */
|
||||
div.db_entry {
|
||||
background-color: #f2f2f2;
|
||||
padding: 0.5em;
|
||||
}
|
||||
|
||||
|
@ -627,65 +458,43 @@ div.db_entry pre {
|
|||
overflow: hidden;
|
||||
word-wrap:break-word;
|
||||
white-space: pre-wrap;
|
||||
background-color: #fcfcfc;
|
||||
border: 1px #eaeaea solid;
|
||||
border: 1px solid;
|
||||
border-radius: 3px;
|
||||
padding: 0.5em;
|
||||
margin: 0.5em 0em;
|
||||
width: 60em;
|
||||
}
|
||||
|
||||
div.db_entry textarea { margin: 0.5em 0em; }
|
||||
div.db_entry table.toolbar {
|
||||
width: 50em;
|
||||
}
|
||||
|
||||
table.tag {
|
||||
display: inline-block;
|
||||
border: 1px #b3c1cc solid;
|
||||
background-color: #eee;
|
||||
border: 1px solid;
|
||||
border-radius: 3px;
|
||||
margin-right: 0.5em;
|
||||
}
|
||||
table.tag td { padding: 0.2em 0.5em; }
|
||||
table.tag td.label { background-color: #b3c1cc; }
|
||||
|
||||
/* DB ENTRY DISPLAY */
|
||||
div.db_entry textarea { margin: 0.5em 0em; }
|
||||
table.tag {
|
||||
display: inline-block;
|
||||
border: 1px #b3c1cc solid;
|
||||
background-color: #eee;
|
||||
border-radius: 3px;
|
||||
margin-right: 0.5em;
|
||||
}
|
||||
table.tag td { padding: 0.2em 0.5em; }
|
||||
table.tag td.label { background-color: #b3c1cc; }
|
||||
|
||||
/* TUTORIAL */
|
||||
|
||||
div.tutorial {
|
||||
margin-top: 3px;
|
||||
background-color: #f2f2f2;
|
||||
padding: 0.5em 1em 0.5em 1em;
|
||||
}
|
||||
|
||||
div.tutorial hr { border-color: #CCC; }
|
||||
div.tutorial li { margin: 2px 0px }
|
||||
div.tutorial h1 {
|
||||
font-size: 18pt;
|
||||
color: #404040;
|
||||
}
|
||||
div.tutorial h2 {
|
||||
font-size: 14pt;
|
||||
color: #404040;
|
||||
}
|
||||
div.tutorial h1 { font-size: 18pt; }
|
||||
div.tutorial h2 { font-size: 14pt;}
|
||||
|
||||
/* NEW MENU */
|
||||
/* MENU */
|
||||
/* Special credits to example at https://codepen.io/philhoyt/pen/ujHzd */
|
||||
/* container div, aligned left,
|
||||
but with .float-right modifier alignes right */
|
||||
.nav-container ul
|
||||
{
|
||||
|
||||
.nav-container ul {
|
||||
list-style: none;
|
||||
position: relative;
|
||||
float: left;
|
||||
|
@ -696,8 +505,7 @@ div.tutorial h2 {
|
|||
}
|
||||
.nav-container.float-right ul { float: right; }
|
||||
|
||||
.nav-container ul a
|
||||
{
|
||||
.nav-container ul a {
|
||||
display: block;
|
||||
text-decoration: none;
|
||||
line-height: 30px;
|
||||
|
@ -709,57 +517,45 @@ div.tutorial h2 {
|
|||
|
||||
/* submenues align to left or right border of the active item
|
||||
depending on .float-right modifier */
|
||||
.nav-container ul li
|
||||
{
|
||||
.nav-container ul li {
|
||||
position: relative;
|
||||
float: left;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.nav-container.float-right ul ul { left: auto; right: 0; }
|
||||
|
||||
.nav-container ul li.current-menu-item { font-weight: 700; }
|
||||
.nav-container ul li.block ul { display: block; }
|
||||
.nav-container ul li:hover > ul { display: block; }
|
||||
.nav-container ul ul li:hover { background-color: #f6f6f6; }
|
||||
|
||||
/* special selection style for 1st level items (see also .corner below) */
|
||||
.nav-container > ul > li:hover > a {
|
||||
background-color: rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
|
||||
.nav-container ul ul
|
||||
{
|
||||
.nav-container ul ul {
|
||||
display: none;
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
left: 0;
|
||||
z-index: 1;
|
||||
background: #fff;
|
||||
padding: 0;
|
||||
box-shadow: 1px 1px 3px 0px #bbb;
|
||||
}
|
||||
|
||||
.nav-container ul ul li
|
||||
{
|
||||
.nav-container ul ul li {
|
||||
float: none;
|
||||
min-width: 160px;
|
||||
}
|
||||
|
||||
.nav-container ul ul a
|
||||
{
|
||||
.nav-container ul ul a {
|
||||
line-height: 120%;
|
||||
padding: 8px 15px;
|
||||
}
|
||||
|
||||
.nav-container ul ul ul
|
||||
{
|
||||
.nav-container ul ul ul {
|
||||
top: 0;
|
||||
left: 100%;
|
||||
}
|
||||
|
||||
.nav-container.float-right ul ul ul
|
||||
{
|
||||
.nav-container.float-right ul ul ul {
|
||||
left: auto;
|
||||
right: 100%;
|
||||
}
|
||||
|
@ -801,21 +597,17 @@ div.tutorial h2 {
|
|||
position: absolute;
|
||||
right: 0px;
|
||||
}
|
||||
.nav-container.corner > ul > li:hover > a { background-color: inherit; }
|
||||
|
||||
/* Toolbar separator style */
|
||||
.nav-container ul ul li.separator
|
||||
{
|
||||
.nav-container ul ul li.separator {
|
||||
font-size: x-small;
|
||||
text-align: center;
|
||||
padding: 4px 0;
|
||||
text-transform: uppercase;
|
||||
color: #bbb;
|
||||
border-bottom: 1px solid #eee;
|
||||
border-top: 1px solid #eee;
|
||||
border-bottom: 1px solid;
|
||||
border-top: 1px solid;
|
||||
}
|
||||
.nav-container ul ul li.separator:first-child { border-top: none; }
|
||||
.nav-container ul ul li.separator:hover { background-color: inherit; }
|
||||
|
||||
/* News Announcement */
|
||||
|
||||
|
@ -826,7 +618,6 @@ div.info-panel {
|
|||
left: 50%;
|
||||
width: 40em;
|
||||
margin-left: -20em;
|
||||
background-color: white;
|
||||
box-shadow: 1px 1px 3px 2px #dcdcdc;
|
||||
}
|
||||
|
||||
|
@ -840,7 +631,6 @@ div.info-panel div.info-hint {
|
|||
font-size: small;
|
||||
padding: 8px 6px 0px;
|
||||
text-align: center;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
div.info-panel div.info-title {
|
||||
|
@ -848,12 +638,9 @@ div.info-panel div.info-title {
|
|||
font-size: small;
|
||||
padding: 6px;
|
||||
text-align: center;
|
||||
color: #f8f8f8;
|
||||
background-color: #888;
|
||||
}
|
||||
|
||||
div.info-panel div.info-title a.close-btn {
|
||||
color: #d8d8d8;
|
||||
padding-left: 12px;
|
||||
padding-right: 2px;
|
||||
position: relative;
|
||||
|
@ -862,7 +649,6 @@ div.info-panel div.info-title a.close-btn {
|
|||
|
||||
div.info-panel div.info-list {
|
||||
padding: 0.8em 0.7em 1em;
|
||||
color: #444;
|
||||
}
|
||||
|
||||
div.info-panel li {
|
||||
|
@ -880,29 +666,20 @@ div.info-panel h1 {
|
|||
}
|
||||
|
||||
div.info-panel .version-marker {
|
||||
color: white;
|
||||
display: inline-block;
|
||||
margin-left: 20px;
|
||||
border-radius: 3px;
|
||||
padding: 0px 6px;
|
||||
border: #c0c0c0 1px solid;
|
||||
background-color: #ccc;
|
||||
border: 1px solid;
|
||||
}
|
||||
|
||||
div.info-panel .update {
|
||||
border: #e8ba30 1px solid;
|
||||
background-color: #f5c538;
|
||||
}
|
||||
|
||||
div.info-panel div.info-list td {
|
||||
padding-right: 1em
|
||||
}
|
||||
div.info-panel .update { border: 1px solid; }
|
||||
div.info-panel div.info-list td { padding-right: 1em }
|
||||
|
||||
/* Tooltip text */
|
||||
.tooltiptext {
|
||||
line-height: 15px;
|
||||
width: 60px;
|
||||
color: #000;
|
||||
text-align: center;
|
||||
padding: 5px 0;
|
||||
border-radius: 6px;
|
||||
|
@ -918,10 +695,6 @@ div.info-panel div.info-list td {
|
|||
transition: opacity 0.3s;
|
||||
}
|
||||
|
||||
.hidden {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
/* Tooltip arrow */
|
||||
.tooltiptext::after {
|
||||
content: "";
|
||||
|
@ -931,7 +704,6 @@ div.info-panel div.info-list td {
|
|||
margin-left: -5px;
|
||||
border-width: 5px;
|
||||
border-style: solid;
|
||||
border-color: #555 transparent transparent transparent;
|
||||
}
|
||||
|
||||
/* HOTKEYS */
|
||||
|
@ -943,8 +715,7 @@ ul.hotkeys {
|
|||
}
|
||||
|
||||
ul.hotkeys span.key-id {
|
||||
background: #f0f0f0;
|
||||
border: 1px solid #dcdcdc;
|
||||
border: 1px solid;
|
||||
border-radius: 3px;
|
||||
padding: 1px 7px;
|
||||
width: 0.5em;
|
||||
|
@ -961,13 +732,11 @@ div.corner-hint {
|
|||
position: fixed;
|
||||
bottom: 10px;
|
||||
right: 10px;
|
||||
color: #aaa;
|
||||
border: 1px solid #ccc;
|
||||
border: 1px solid;
|
||||
border-radius: 3px;
|
||||
padding: 4px;
|
||||
font-size: smaller;
|
||||
opacity: 0.5;
|
||||
background: white;
|
||||
z-index: 99;
|
||||
}
|
||||
|
||||
|
@ -978,21 +747,13 @@ table.commit tr .title {
|
|||
}
|
||||
|
||||
/* Repo overview */
|
||||
.repo-overview {
|
||||
font-size: smaller;
|
||||
}
|
||||
|
||||
.repo-overview tbody td {
|
||||
height: 2em;
|
||||
}
|
||||
|
||||
.ro-detail {
|
||||
display: none;
|
||||
}
|
||||
.repo-overview { font-size: smaller; }
|
||||
.repo-overview tbody td { height: 2em; }
|
||||
.ro-detail { display: none; }
|
||||
|
||||
/* Branch Overview Page */
|
||||
.gitGraph-scrollWrapper, .gitGraph-Wrapper{
|
||||
overflow-y:hidden;
|
||||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
.gitGraph-scrollWrapper{
|
||||
|
@ -1010,20 +771,10 @@ table.commit tr .title {
|
|||
}
|
||||
|
||||
/* code inspector */
|
||||
.ci-head {
|
||||
background-color: #f2f2f2;
|
||||
padding: 0.5em 1em;
|
||||
}
|
||||
.ci-head .package-name span {
|
||||
margin-left: 0.3em;
|
||||
color: grey;
|
||||
}
|
||||
.ci-variant {
|
||||
font-weight: bold;
|
||||
color: #444;
|
||||
}
|
||||
.ci-head { padding: 0.5em 1em; }
|
||||
.ci-head .package-name span { margin-left: 0.3em; }
|
||||
.ci-variant { font-weight: bold; }
|
||||
.ci-result {
|
||||
background-color: #f6f6f6;
|
||||
padding: 6px;
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
@ -1031,25 +782,12 @@ table.commit tr .title {
|
|||
list-style-type: none;
|
||||
padding: 0.3em 0.8em;
|
||||
margin-top: 6px;
|
||||
color: #444;
|
||||
}
|
||||
.ci-result li:first-child {
|
||||
margin-top: 0px;
|
||||
}
|
||||
.ci-result li.ci-error {
|
||||
border-left: 4px solid #cd5353;
|
||||
}
|
||||
.ci-result li.ci-warning {
|
||||
border-left: 4px solid #ecd227;
|
||||
}
|
||||
.ci-result li.ci-info {
|
||||
border-left: 4px solid #acacac;
|
||||
}
|
||||
.ci-result li span {
|
||||
display: block;
|
||||
border-left: 4px solid;
|
||||
}
|
||||
.ci-result li:first-child { margin-top: 0px; }
|
||||
.ci-result li span { display: block; }
|
||||
|
||||
/* Floating buttons and color sets */
|
||||
/* Floating buttons */
|
||||
|
||||
.floating-button {
|
||||
position: fixed;
|
||||
|
@ -1062,13 +800,3 @@ table.commit tr .title {
|
|||
box-shadow: 2px 2px 6px 0px #ccc;
|
||||
cursor: pointer;
|
||||
}
|
||||
.blue-set {
|
||||
border-color: #abc3e3;
|
||||
color: #5e8dc9;
|
||||
background-color: #d9e4f2;
|
||||
}
|
||||
.grey-set {
|
||||
border-color: #c7c7c7;
|
||||
color: #808080;
|
||||
background-color: #e6e6e6;
|
||||
}
|
||||
|
|
339
src/ui/zabapgit_css_theme_default.w3mi.data.css
Normal file
339
src/ui/zabapgit_css_theme_default.w3mi.data.css
Normal file
|
@ -0,0 +1,339 @@
|
|||
/*
|
||||
* ABAPGIT COLOR THEME CSS - DEFAULT
|
||||
*/
|
||||
|
||||
/* GLOBALS */
|
||||
body { background-color: #E8E8E8; }
|
||||
a, a:visited { color: #4078c0; }
|
||||
input, textarea, select { border-color: #ddd; }
|
||||
input:focus, textarea:focus { border-color: #8cadd9; }
|
||||
|
||||
/* COLOR PALETTE */
|
||||
.grey { color: lightgrey !important; }
|
||||
.grey70 { color: #b3b3b3 !important; }
|
||||
.grey80 { color: #ccc !important; }
|
||||
.bgorange { background-color: orange; }
|
||||
.darkgrey { color: #808080 !important; }
|
||||
.attention { color: red !important; }
|
||||
.error { color: #d41919 !important; }
|
||||
.warning { color: #efb301 !important; }
|
||||
.success { color: green !important; }
|
||||
.blue { color: #5e8dc9 !important; }
|
||||
.red { color: red !important; }
|
||||
.white { color: white !important; }
|
||||
|
||||
/* Floating buttons and color sets */
|
||||
.blue-set {
|
||||
border-color: #abc3e3;
|
||||
color: #5e8dc9;
|
||||
background-color: #d9e4f2;
|
||||
}
|
||||
.grey-set {
|
||||
border-color: #c7c7c7;
|
||||
color: #808080;
|
||||
background-color: #e6e6e6;
|
||||
}
|
||||
|
||||
/* PANELS */
|
||||
/* TODO: add warning and error colors */
|
||||
div.panel.success {
|
||||
color: #589a58 !important;
|
||||
background-color: #c5eac5;
|
||||
}
|
||||
#debug-output { color: #ccc; }
|
||||
div.dummydiv { background-color: #f2f2f2; }
|
||||
|
||||
/* STRUCTURE DIVS, HEADER & FOOTER */
|
||||
div#header { border-bottom-color: lightgrey; }
|
||||
div#header span.page_title { color: #bbb; }
|
||||
div#toc { background-color: #f2f2f2; }
|
||||
div#footer span.version { color: grey; }
|
||||
div#footer { border-top-color: lightgrey; }
|
||||
|
||||
/* ERROR LOG */
|
||||
div.log {
|
||||
background-color: #fee6e6;
|
||||
border-color: #fdcece;
|
||||
}
|
||||
|
||||
/* REPOSITORY */
|
||||
div.repo { background-color: #f2f2f2; }
|
||||
.repo_name span.name { color: #333; }
|
||||
.repo_name span.url { color: #ccc; }
|
||||
.repo_name a.url { color: #ccc; }
|
||||
.repo_attr { color: grey; }
|
||||
|
||||
.repo_attr span.bg_marker {
|
||||
border-color: #d2d2d2;
|
||||
background-color: #d8d8d8;
|
||||
color: #fff;
|
||||
}
|
||||
.repo_attr span.branch {
|
||||
border-color: #d9d9d9;
|
||||
background-color: #e2e2e2;
|
||||
}
|
||||
.repo_attr span.branch_head {
|
||||
border-color: #d8dff3;
|
||||
background-color: #eceff9;
|
||||
}
|
||||
.repo_attr span.branch_branch {
|
||||
border-color: #e7d9b1;
|
||||
background-color: #f8f0d8;
|
||||
}
|
||||
|
||||
/* REPOSITORY TABLE*/
|
||||
table.repo_tab {
|
||||
border-color: #ddd;
|
||||
background-color: #fff;
|
||||
}
|
||||
.repo_tab td {
|
||||
color: #333;
|
||||
border-top-color: #eee;
|
||||
}
|
||||
.repo_tab .inactive { color: orange; }
|
||||
.repo_tab tr.unsupported { color: lightgrey; }
|
||||
.repo_tab tr.modified { background-color: #fbf7e9; }
|
||||
.repo_tab td.current_dir { color: #ccc; }
|
||||
.repo_tab td.cmd span.state-block span { border-color: #000; }
|
||||
|
||||
.repo_tab td.cmd span.state-block span.added {
|
||||
background-color: #69ad74;
|
||||
border-color: #579e64;
|
||||
color: white;
|
||||
}
|
||||
.repo_tab td.cmd span.state-block span.changed {
|
||||
background-color: #e0c150;
|
||||
border-color: #d4af25;
|
||||
color: white;
|
||||
}
|
||||
.repo_tab td.cmd span.state-block span.mixed {
|
||||
background-color: #e0c150;
|
||||
border-color: #579e64;
|
||||
color: #69ad74;
|
||||
}
|
||||
.repo_tab td.cmd span.state-block span.deleted {
|
||||
background-color: #c76861;
|
||||
border-color: #b8605a;
|
||||
color: white;
|
||||
}
|
||||
.repo_tab td.cmd span.state-block span.none {
|
||||
background-color: #e8e8e8;
|
||||
border-color: #dbdbdb;
|
||||
color: #c8c8c8;
|
||||
}
|
||||
|
||||
/* STAGE */
|
||||
.stage_tab {
|
||||
border-color: #ddd;
|
||||
background-color: #fff;
|
||||
}
|
||||
.stage_tab td {
|
||||
color: #333;
|
||||
border-top-color: #eee;
|
||||
}
|
||||
.stage_tab th {
|
||||
color: #bbb;
|
||||
background-color: #edf2f9;
|
||||
}
|
||||
.stage_tab td.status {
|
||||
color: #ccc;
|
||||
background-color: #fafafa;
|
||||
}
|
||||
.stage_tab td.highlight { color: #444 !important; }
|
||||
.stage_tab td.method { color: #ccc; }
|
||||
.stage_tab td.user { color: #aaa; }
|
||||
.stage_tab td.type { color: #aaa; }
|
||||
.stage_tab mark {
|
||||
color: white;
|
||||
background-color: #79a0d2;
|
||||
}
|
||||
|
||||
/* COMMIT */
|
||||
div.form-container { background-color: #F8F8F8; }
|
||||
form.aligned-form label { color: #bbb; }
|
||||
form.aligned-form span.sub-title { color: #bbb; }
|
||||
|
||||
/* SETTINGS STYLES */
|
||||
div.settings_container {
|
||||
color: #444;
|
||||
background-color: #f2f2f2;
|
||||
}
|
||||
|
||||
/* DIFF */
|
||||
div.diff { background-color: #f2f2f2; }
|
||||
span.diff_name { color: grey; }
|
||||
span.diff_name strong { color: #333; }
|
||||
span.diff_changed_by { color: grey; }
|
||||
span.diff_changed_by span.user {
|
||||
border-color: #c2d4ea;
|
||||
background-color: #d9e4f2;
|
||||
}
|
||||
.diff_ins {
|
||||
border-color: #abf2ab;
|
||||
background-color: #e0ffe0;
|
||||
}
|
||||
.diff_del {
|
||||
border-color: #ff667d;
|
||||
background-color: #ffccd4;
|
||||
}
|
||||
.diff_upd {
|
||||
border-color: #dada00;
|
||||
background-color: #ffffcc;
|
||||
}
|
||||
div.diff_content {
|
||||
background-color: #fff;
|
||||
border-top-color: #ddd;
|
||||
border-bottom-color: #ddd;
|
||||
}
|
||||
div.diff_head span.state-block span {
|
||||
border-color: #000;
|
||||
}
|
||||
div.diff_head span.state-block span.added {
|
||||
background-color: #69ad74;
|
||||
border-color: #579e64;
|
||||
color: white;
|
||||
}
|
||||
div.diff_head span.state-block span.changed {
|
||||
background-color: #e0c150;
|
||||
border-color: #d4af25;
|
||||
color: white;
|
||||
}
|
||||
div.diff_head span.state-block span.mixed {
|
||||
background-color: #e0c150;
|
||||
border-color: #579e64;
|
||||
color: #69ad74;
|
||||
}
|
||||
div.diff_head span.state-block span.deleted {
|
||||
background-color: #c76861;
|
||||
border-color: #b8605a;
|
||||
color: white;
|
||||
}
|
||||
div.diff_head span.state-block span.none {
|
||||
background-color: #e8e8e8;
|
||||
border-color: #dbdbdb;
|
||||
color: #c8c8c8;
|
||||
}
|
||||
|
||||
/* DIFF TABLE */
|
||||
table.diff_tab td,th {
|
||||
color: #444;
|
||||
}
|
||||
table.diff_tab thead.header th {
|
||||
color: #eee;
|
||||
background-color: #bbb;
|
||||
}
|
||||
table.diff_tab thead.nav_line {
|
||||
background-color: #edf2f9;
|
||||
}
|
||||
table.diff_tab thead.nav_line th {
|
||||
color: #bbb;
|
||||
}
|
||||
table.diff_tab td.num, th.num {
|
||||
color: #ccc;
|
||||
border-left-color: #eee;
|
||||
border-right-color: #eee;
|
||||
}
|
||||
table.diff_tab td.patch, th.patch {
|
||||
color: #ccc;
|
||||
border-left-color: #eee;
|
||||
border-right-color: #eee;
|
||||
}
|
||||
|
||||
/* STYLES for Syntax Highlighting */
|
||||
.syntax-hl span.keyword { color: #0a69ce; }
|
||||
.syntax-hl span.text { color: #48ce4f; }
|
||||
.syntax-hl span.comment { color: #808080; font-style: italic; }
|
||||
.syntax-hl span.xml_tag { color: #457ce3; }
|
||||
.syntax-hl span.attr { color: #b777fb; }
|
||||
.syntax-hl span.attr_val { color: #7a02f9; }
|
||||
|
||||
/* DEBUG INFO STYLES */
|
||||
div.debug_container { color: #444; }
|
||||
|
||||
/* DB ENTRIES */
|
||||
div.db_list { background-color: #fff; }
|
||||
table.db_tab td { color: #333; }
|
||||
table.db_tab td.data { color: #888; }
|
||||
table.db_tab tbody tr:hover, tr:active { background-color: #f4f4f4; }
|
||||
table.db_tab th {
|
||||
color: #888888;
|
||||
border-bottom-color: #ddd;
|
||||
}
|
||||
|
||||
/* DB ENTRY DISPLAY */
|
||||
div.db_entry {
|
||||
background-color: #f2f2f2;
|
||||
}
|
||||
div.db_entry pre {
|
||||
background-color: #fcfcfc;
|
||||
border-color: #eaeaea;
|
||||
}
|
||||
table.tag {
|
||||
border-color: #b3c1cc;
|
||||
background-color: #eee;
|
||||
}
|
||||
table.tag td.label { background-color: #b3c1cc; }
|
||||
|
||||
/* TUTORIAL */
|
||||
div.tutorial { background-color: #f2f2f2; }
|
||||
div.tutorial hr { border-color: #ccc; }
|
||||
div.tutorial h1, h2 { color: #404040; }
|
||||
|
||||
/* MENU */
|
||||
.nav-container ul ul li:hover { background-color: #f6f6f6; }
|
||||
.nav-container > ul > li:hover > a { background-color: #ffffff80; }
|
||||
.nav-container ul ul { background-color: #fff; }
|
||||
.nav-container.corner > ul > li:hover > a { background-color: inherit; }
|
||||
|
||||
/* Toolbar separator style */
|
||||
.nav-container ul ul li.separator {
|
||||
color: #bbb;
|
||||
border-bottom-color: #eee;
|
||||
border-top-color: #eee;
|
||||
}
|
||||
.nav-container ul ul li.separator:hover { background-color: inherit; }
|
||||
|
||||
/* News Announcement */
|
||||
div.info-panel { background-color: white; }
|
||||
div.info-panel div.info-hint { color: #ccc; }
|
||||
div.info-panel div.info-title {
|
||||
color: #f8f8f8;
|
||||
background-color: #888;
|
||||
}
|
||||
div.info-panel div.info-title a.close-btn { color: #d8d8d8; }
|
||||
div.info-panel div.info-list { color: #444; }
|
||||
div.info-panel .version-marker {
|
||||
color: white;
|
||||
border-color: #c0c0c0;
|
||||
background-color: #ccc;
|
||||
}
|
||||
div.info-panel .update {
|
||||
border-color: #e8ba30;
|
||||
background-color: #f5c538;
|
||||
}
|
||||
|
||||
/* Tooltips text */
|
||||
.tooltiptext { color: #000; }
|
||||
/* Tooltip arrow */
|
||||
.tooltiptext::after { border-color: #555 transparent transparent transparent; }
|
||||
|
||||
/* HOTKEYS */
|
||||
ul.hotkeys span.key-id {
|
||||
background-color: #f0f0f0;
|
||||
border-color: #dcdcdc;
|
||||
}
|
||||
div.corner-hint {
|
||||
color: #aaa;
|
||||
border-color: #ccc;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
/* code inspector */
|
||||
.ci-head { background-color: #f2f2f2; }
|
||||
.ci-head .package-name span { color: grey; }
|
||||
.ci-variant { color: #444; }
|
||||
.ci-result { background-color: #f6f6f6; }
|
||||
.ci-result li { color: #444; }
|
||||
.ci-result li.ci-error { border-left-color: #cd5353; }
|
||||
.ci-result li.ci-warning { border-left-color: #ecd227; }
|
||||
.ci-result li.ci-info { border-left-color: #acacac; }
|
29
src/ui/zabapgit_css_theme_default.w3mi.xml
Normal file
29
src/ui/zabapgit_css_theme_default.w3mi.xml
Normal file
|
@ -0,0 +1,29 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<abapGit version="v1.0.0" serializer="LCL_OBJECT_W3MI" serializer_version="v2.0.0">
|
||||
<asx:abap xmlns:asx="http://www.sap.com/abapxml" version="1.0">
|
||||
<asx:values>
|
||||
<NAME>ZABAPGIT_CSS_THEME_DEFAULT</NAME>
|
||||
<TEXT>abapGit default color theme</TEXT>
|
||||
<PARAMS>
|
||||
<WWWPARAMS>
|
||||
<RELID>MI</RELID>
|
||||
<OBJID>ZABAPGIT_CSS_THEME_DEFAULT</OBJID>
|
||||
<NAME>fileextension</NAME>
|
||||
<VALUE>.CSS</VALUE>
|
||||
</WWWPARAMS>
|
||||
<WWWPARAMS>
|
||||
<RELID>MI</RELID>
|
||||
<OBJID>ZABAPGIT_CSS_THEME_DEFAULT</OBJID>
|
||||
<NAME>filename</NAME>
|
||||
<VALUE>THEME-default.CSS</VALUE>
|
||||
</WWWPARAMS>
|
||||
<WWWPARAMS>
|
||||
<RELID>MI</RELID>
|
||||
<OBJID>ZABAPGIT_CSS_THEME_DEFAULT</OBJID>
|
||||
<NAME>mimetype</NAME>
|
||||
<VALUE>text/css</VALUE>
|
||||
</WWWPARAMS>
|
||||
</PARAMS>
|
||||
</asx:values>
|
||||
</asx:abap>
|
||||
</abapGit>
|
|
@ -87,32 +87,7 @@ ENDCLASS.
|
|||
|
||||
|
||||
|
||||
CLASS zcl_abapgit_gui_page IMPLEMENTATION.
|
||||
|
||||
|
||||
METHOD insert_hotkeys_to_page.
|
||||
|
||||
DATA: lv_json TYPE string.
|
||||
|
||||
FIELD-SYMBOLS: <ls_hotkey> LIKE LINE OF mt_hotkeys.
|
||||
|
||||
lv_json = `{`.
|
||||
|
||||
LOOP AT mt_hotkeys ASSIGNING <ls_hotkey>.
|
||||
|
||||
IF sy-tabix > 1.
|
||||
lv_json = lv_json && |,|.
|
||||
ENDIF.
|
||||
|
||||
lv_json = lv_json && | "{ <ls_hotkey>-hotkey }" : "{ <ls_hotkey>-action }" |.
|
||||
|
||||
ENDLOOP.
|
||||
|
||||
lv_json = lv_json && `}`.
|
||||
|
||||
io_html->add( |setKeyBindings({ lv_json });| ).
|
||||
|
||||
ENDMETHOD.
|
||||
CLASS ZCL_ABAPGIT_GUI_PAGE IMPLEMENTATION.
|
||||
|
||||
|
||||
METHOD call_browser.
|
||||
|
@ -146,6 +121,37 @@ CLASS zcl_abapgit_gui_page IMPLEMENTATION.
|
|||
ENDMETHOD.
|
||||
|
||||
|
||||
METHOD define_hotkeys.
|
||||
|
||||
DATA: lo_settings TYPE REF TO zcl_abapgit_settings,
|
||||
lt_user_defined_hotkeys TYPE zif_abapgit_definitions=>tty_hotkey.
|
||||
|
||||
FIELD-SYMBOLS: <ls_hotkey> TYPE zif_abapgit_gui_page_hotkey=>ty_hotkey_with_name,
|
||||
<ls_user_defined_hotkey> LIKE LINE OF lt_user_defined_hotkeys.
|
||||
|
||||
rt_hotkeys = get_default_hotkeys( ).
|
||||
|
||||
" Override default hotkeys with user defined
|
||||
lo_settings = zcl_abapgit_persist_settings=>get_instance( )->read( ).
|
||||
lt_user_defined_hotkeys = lo_settings->get_hotkeys( ).
|
||||
|
||||
LOOP AT rt_hotkeys ASSIGNING <ls_hotkey>.
|
||||
|
||||
READ TABLE lt_user_defined_hotkeys ASSIGNING <ls_user_defined_hotkey>
|
||||
WITH TABLE KEY action
|
||||
COMPONENTS action = <ls_hotkey>-action.
|
||||
IF sy-subrc = 0.
|
||||
<ls_hotkey>-hotkey = <ls_user_defined_hotkey>-hotkey.
|
||||
ELSEIF lines( lt_user_defined_hotkeys ) > 0.
|
||||
" User removed the hotkey
|
||||
DELETE TABLE rt_hotkeys FROM <ls_hotkey>.
|
||||
ENDIF.
|
||||
|
||||
ENDLOOP.
|
||||
|
||||
ENDMETHOD.
|
||||
|
||||
|
||||
METHOD footer.
|
||||
|
||||
CREATE OBJECT ro_html.
|
||||
|
@ -165,6 +171,26 @@ CLASS zcl_abapgit_gui_page IMPLEMENTATION.
|
|||
ENDMETHOD.
|
||||
|
||||
|
||||
METHOD get_default_hotkeys.
|
||||
|
||||
DATA: lt_page_hotkeys LIKE mt_hotkeys.
|
||||
|
||||
rt_default_hotkeys = get_global_hotkeys( ).
|
||||
|
||||
TRY.
|
||||
CALL METHOD me->('ZIF_ABAPGIT_GUI_PAGE_HOTKEY~GET_HOTKEY_ACTIONS')
|
||||
RECEIVING
|
||||
rt_hotkey_actions = lt_page_hotkeys.
|
||||
|
||||
INSERT LINES OF lt_page_hotkeys INTO TABLE rt_default_hotkeys.
|
||||
|
||||
CATCH cx_root.
|
||||
" Current page doesn't implement hotkey interface, do nothing
|
||||
ENDTRY.
|
||||
|
||||
ENDMETHOD.
|
||||
|
||||
|
||||
METHOD get_global_hotkeys.
|
||||
|
||||
" these are the global shortcuts active on all pages
|
||||
|
@ -190,6 +216,16 @@ CLASS zcl_abapgit_gui_page IMPLEMENTATION.
|
|||
|
||||
ro_html->add( '<title>abapGit</title>' ). "#EC NOTEXT
|
||||
ro_html->add( '<link rel="stylesheet" type="text/css" href="css/common.css">' ).
|
||||
|
||||
CASE mo_settings->get_ui_theme( ).
|
||||
WHEN zcl_abapgit_settings=>c_ui_theme-dark.
|
||||
ro_html->add( '<link rel="stylesheet" type="text/css" href="css/theme-default.css">' ). "TODO
|
||||
WHEN zcl_abapgit_settings=>c_ui_theme-belize.
|
||||
ro_html->add( '<link rel="stylesheet" type="text/css" href="css/theme-default.css">' ). "TODO
|
||||
WHEN OTHERS.
|
||||
ro_html->add( '<link rel="stylesheet" type="text/css" href="css/theme-default.css">' ).
|
||||
ENDCASE.
|
||||
|
||||
ro_html->add( '<link rel="stylesheet" type="text/css" href="css/ag-icons.css">' ).
|
||||
ro_html->add( '<script type="text/javascript" src="js/common.js"></script>' ). "#EC NOTEXT
|
||||
|
||||
|
@ -205,6 +241,31 @@ CLASS zcl_abapgit_gui_page IMPLEMENTATION.
|
|||
ENDMETHOD.
|
||||
|
||||
|
||||
METHOD insert_hotkeys_to_page.
|
||||
|
||||
DATA: lv_json TYPE string.
|
||||
|
||||
FIELD-SYMBOLS: <ls_hotkey> LIKE LINE OF mt_hotkeys.
|
||||
|
||||
lv_json = `{`.
|
||||
|
||||
LOOP AT mt_hotkeys ASSIGNING <ls_hotkey>.
|
||||
|
||||
IF sy-tabix > 1.
|
||||
lv_json = lv_json && |,|.
|
||||
ENDIF.
|
||||
|
||||
lv_json = lv_json && | "{ <ls_hotkey>-hotkey }" : "{ <ls_hotkey>-action }" |.
|
||||
|
||||
ENDLOOP.
|
||||
|
||||
lv_json = lv_json && `}`.
|
||||
|
||||
io_html->add( |setKeyBindings({ lv_json });| ).
|
||||
|
||||
ENDMETHOD.
|
||||
|
||||
|
||||
METHOD link_hints.
|
||||
|
||||
DATA: lv_link_hint_key TYPE char01,
|
||||
|
@ -340,56 +401,4 @@ CLASS zcl_abapgit_gui_page IMPLEMENTATION.
|
|||
ro_html->add( '</html>' ). "#EC NOTEXT
|
||||
|
||||
ENDMETHOD.
|
||||
|
||||
|
||||
METHOD define_hotkeys.
|
||||
|
||||
DATA: lo_settings TYPE REF TO zcl_abapgit_settings,
|
||||
lt_user_defined_hotkeys TYPE zif_abapgit_definitions=>tty_hotkey.
|
||||
|
||||
FIELD-SYMBOLS: <ls_hotkey> TYPE zif_abapgit_gui_page_hotkey=>ty_hotkey_with_name,
|
||||
<ls_user_defined_hotkey> LIKE LINE OF lt_user_defined_hotkeys.
|
||||
|
||||
rt_hotkeys = get_default_hotkeys( ).
|
||||
|
||||
" Override default hotkeys with user defined
|
||||
lo_settings = zcl_abapgit_persist_settings=>get_instance( )->read( ).
|
||||
lt_user_defined_hotkeys = lo_settings->get_hotkeys( ).
|
||||
|
||||
LOOP AT rt_hotkeys ASSIGNING <ls_hotkey>.
|
||||
|
||||
READ TABLE lt_user_defined_hotkeys ASSIGNING <ls_user_defined_hotkey>
|
||||
WITH TABLE KEY action
|
||||
COMPONENTS action = <ls_hotkey>-action.
|
||||
IF sy-subrc = 0.
|
||||
<ls_hotkey>-hotkey = <ls_user_defined_hotkey>-hotkey.
|
||||
ELSEIF lines( lt_user_defined_hotkeys ) > 0.
|
||||
" User removed the hotkey
|
||||
DELETE TABLE rt_hotkeys FROM <ls_hotkey>.
|
||||
ENDIF.
|
||||
|
||||
ENDLOOP.
|
||||
|
||||
ENDMETHOD.
|
||||
|
||||
|
||||
METHOD get_default_hotkeys.
|
||||
|
||||
DATA: lt_page_hotkeys LIKE mt_hotkeys.
|
||||
|
||||
rt_default_hotkeys = get_global_hotkeys( ).
|
||||
|
||||
TRY.
|
||||
CALL METHOD me->('ZIF_ABAPGIT_GUI_PAGE_HOTKEY~GET_HOTKEY_ACTIONS')
|
||||
RECEIVING
|
||||
rt_hotkey_actions = lt_page_hotkeys.
|
||||
|
||||
INSERT LINES OF lt_page_hotkeys INTO TABLE rt_default_hotkeys.
|
||||
|
||||
CATCH cx_root.
|
||||
" Current page doesn't implement hotkey interface, do nothing
|
||||
ENDTRY.
|
||||
|
||||
ENDMETHOD.
|
||||
|
||||
ENDCLASS.
|
||||
|
|
|
@ -44,6 +44,9 @@ CLASS zcl_abapgit_gui_page_settings DEFINITION
|
|||
METHODS render_icon_scaling
|
||||
RETURNING
|
||||
VALUE(ro_html) TYPE REF TO zcl_abapgit_html .
|
||||
METHODS render_ui_theme
|
||||
RETURNING
|
||||
VALUE(ro_html) TYPE REF TO zcl_abapgit_html .
|
||||
METHODS render_adt_jump_enabled
|
||||
RETURNING
|
||||
VALUE(ro_html) TYPE REF TO zcl_abapgit_html .
|
||||
|
@ -108,7 +111,7 @@ ENDCLASS.
|
|||
|
||||
|
||||
|
||||
CLASS zcl_abapgit_gui_page_settings IMPLEMENTATION.
|
||||
CLASS ZCL_ABAPGIT_GUI_PAGE_SETTINGS IMPLEMENTATION.
|
||||
|
||||
|
||||
METHOD constructor.
|
||||
|
@ -246,6 +249,13 @@ CLASS zcl_abapgit_gui_page_settings IMPLEMENTATION.
|
|||
mo_settings->set_icon_scaling( '' ).
|
||||
ENDIF.
|
||||
|
||||
READ TABLE mt_post_fields ASSIGNING <ls_post_field> WITH KEY name = 'ui_theme'.
|
||||
IF sy-subrc = 0.
|
||||
mo_settings->set_ui_theme( <ls_post_field>-value ).
|
||||
ELSE.
|
||||
mo_settings->set_ui_theme( zcl_abapgit_settings=>c_ui_theme-default ).
|
||||
ENDIF.
|
||||
|
||||
post_hotkeys( ).
|
||||
|
||||
ENDMETHOD.
|
||||
|
@ -421,6 +431,7 @@ CLASS zcl_abapgit_gui_page_settings IMPLEMENTATION.
|
|||
ro_html->add( render_start_up( ) ).
|
||||
ro_html->add( render_max_lines( ) ).
|
||||
ro_html->add( render_icon_scaling( ) ).
|
||||
ro_html->add( render_ui_theme( ) ).
|
||||
ro_html->add( |<hr>| ).
|
||||
ro_html->add( render_adt_jump_enabled( ) ).
|
||||
ro_html->add( |<hr>| ).
|
||||
|
@ -713,6 +724,46 @@ CLASS zcl_abapgit_gui_page_settings IMPLEMENTATION.
|
|||
ENDMETHOD.
|
||||
|
||||
|
||||
METHOD render_ui_theme.
|
||||
|
||||
" TODO: unify with render_icon_scaling, make list component
|
||||
|
||||
DATA:
|
||||
BEGIN OF ls_sel,
|
||||
default TYPE string,
|
||||
dark TYPE string,
|
||||
belize TYPE string,
|
||||
END OF ls_sel.
|
||||
|
||||
CASE mo_settings->get_ui_theme( ).
|
||||
WHEN zcl_abapgit_settings=>c_ui_theme-default.
|
||||
ls_sel-default = ' selected'.
|
||||
WHEN zcl_abapgit_settings=>c_ui_theme-dark.
|
||||
ls_sel-dark = ' selected'.
|
||||
WHEN zcl_abapgit_settings=>c_ui_theme-belize.
|
||||
ls_sel-belize = ' selected'.
|
||||
ENDCASE.
|
||||
|
||||
CREATE OBJECT ro_html.
|
||||
|
||||
ro_html->add( |<h2>UI Theme</h2>| ).
|
||||
ro_html->add( |<label for="ui_theme">UI Theme</label>| ).
|
||||
ro_html->add( |<br>| ).
|
||||
ro_html->add( |<select name="ui_theme" size="3">| ).
|
||||
ro_html->add( |<option value="{ zcl_abapgit_settings=>c_ui_theme-default }"{
|
||||
ls_sel-default }>{ zcl_abapgit_settings=>c_ui_theme-default }</option>| ).
|
||||
ro_html->add( |<option value="{ zcl_abapgit_settings=>c_ui_theme-dark }"{
|
||||
ls_sel-dark }>{ zcl_abapgit_settings=>c_ui_theme-dark }</option>| ).
|
||||
ro_html->add( |<option value="{ zcl_abapgit_settings=>c_ui_theme-belize }"{
|
||||
ls_sel-belize }>{ zcl_abapgit_settings=>c_ui_theme-belize }</option>| ).
|
||||
ro_html->add( |</select>| ).
|
||||
|
||||
ro_html->add( |<br>| ).
|
||||
ro_html->add( |<br>| ).
|
||||
|
||||
ENDMETHOD.
|
||||
|
||||
|
||||
METHOD validate_settings.
|
||||
|
||||
IF ( mo_settings->get_proxy_url( ) IS NOT INITIAL AND mo_settings->get_proxy_port( ) IS INITIAL ) OR
|
||||
|
|
|
@ -129,6 +129,17 @@ CLASS ZCL_ABAPGIT_UI_FACTORY IMPLEMENTATION.
|
|||
iv_mime_name = 'ZABAPGIT_CSS_COMMON'
|
||||
iv_inline = concat_lines_of( table = lt_inline sep = cl_abap_char_utilities=>newline ) ).
|
||||
|
||||
CLEAR lt_inline.
|
||||
" @@abapmerge include zabapgit_css_theme_default.w3mi.data.css > _inline '$$'.
|
||||
ro_asset_man->register_asset(
|
||||
iv_url = 'css/theme-default.css'
|
||||
iv_type = 'text/css'
|
||||
iv_mime_name = 'ZABAPGIT_CSS_THEME_DEFAULT'
|
||||
iv_inline = concat_lines_of( table = lt_inline sep = cl_abap_char_utilities=>newline ) ).
|
||||
|
||||
" TODO theme-dark
|
||||
" TODO theme belize
|
||||
|
||||
CLEAR lt_inline.
|
||||
" @@abapmerge include zabapgit_js_common.w3mi.data.js > _inline '$$'.
|
||||
ro_asset_man->register_asset(
|
||||
|
|
|
@ -10,6 +10,13 @@ CLASS zcl_abapgit_settings DEFINITION PUBLIC CREATE PUBLIC.
|
|||
small TYPE c VALUE 'S',
|
||||
END OF c_icon_scaling.
|
||||
|
||||
CONSTANTS:
|
||||
BEGIN OF c_ui_theme,
|
||||
default TYPE string VALUE 'default',
|
||||
dark TYPE string VALUE 'dark',
|
||||
belize TYPE string VALUE 'belize',
|
||||
END OF c_ui_theme.
|
||||
|
||||
METHODS:
|
||||
set_proxy_url
|
||||
IMPORTING
|
||||
|
@ -128,7 +135,13 @@ CLASS zcl_abapgit_settings DEFINITION PUBLIC CREATE PUBLIC.
|
|||
VALUE(rv_scaling) TYPE zif_abapgit_definitions=>ty_s_user_settings-icon_scaling,
|
||||
set_icon_scaling
|
||||
IMPORTING
|
||||
iv_scaling TYPE zif_abapgit_definitions=>ty_s_user_settings-icon_scaling.
|
||||
iv_scaling TYPE zif_abapgit_definitions=>ty_s_user_settings-icon_scaling,
|
||||
get_ui_theme
|
||||
RETURNING
|
||||
VALUE(rv_ui_theme) TYPE zif_abapgit_definitions=>ty_s_user_settings-ui_theme,
|
||||
set_ui_theme
|
||||
IMPORTING
|
||||
iv_ui_theme TYPE zif_abapgit_definitions=>ty_s_user_settings-ui_theme.
|
||||
PROTECTED SECTION.
|
||||
PRIVATE SECTION.
|
||||
TYPES: BEGIN OF ty_s_settings,
|
||||
|
@ -152,7 +165,7 @@ ENDCLASS.
|
|||
|
||||
|
||||
|
||||
CLASS zcl_abapgit_settings IMPLEMENTATION.
|
||||
CLASS ZCL_ABAPGIT_SETTINGS IMPLEMENTATION.
|
||||
|
||||
|
||||
METHOD get_adt_jump_enabled.
|
||||
|
@ -250,6 +263,11 @@ CLASS zcl_abapgit_settings IMPLEMENTATION.
|
|||
ENDMETHOD.
|
||||
|
||||
|
||||
METHOD get_ui_theme.
|
||||
rv_ui_theme = ms_user_settings-ui_theme.
|
||||
ENDMETHOD.
|
||||
|
||||
|
||||
METHOD get_user_settings.
|
||||
rs_settings = ms_user_settings.
|
||||
ENDMETHOD.
|
||||
|
@ -367,6 +385,16 @@ CLASS zcl_abapgit_settings IMPLEMENTATION.
|
|||
ENDMETHOD.
|
||||
|
||||
|
||||
METHOD set_ui_theme.
|
||||
ms_user_settings-ui_theme = iv_ui_theme.
|
||||
IF ms_user_settings-ui_theme <> c_ui_theme-default
|
||||
AND ms_user_settings-ui_theme <> c_ui_theme-dark
|
||||
AND ms_user_settings-ui_theme <> c_ui_theme-belize.
|
||||
ms_user_settings-ui_theme = c_ui_theme-default. " Reset to default
|
||||
ENDIF.
|
||||
ENDMETHOD.
|
||||
|
||||
|
||||
METHOD set_user_settings.
|
||||
ms_user_settings = is_user_settings.
|
||||
|
||||
|
|
|
@ -340,6 +340,7 @@ INTERFACE zif_abapgit_definitions
|
|||
hotkeys TYPE tty_hotkey,
|
||||
parallel_proc_disabled TYPE abap_bool,
|
||||
icon_scaling TYPE c LENGTH 1,
|
||||
ui_theme TYPE string,
|
||||
END OF ty_s_user_settings .
|
||||
TYPES:
|
||||
tty_dokil TYPE STANDARD TABLE OF dokil
|
||||
|
|
Loading…
Reference in New Issue
Block a user