diff --git a/src/ui/zabapgit_css_common.w3mi.data.css b/src/ui/zabapgit_css_common.w3mi.data.css
index 933c63a1b..4d2076b7a 100644
--- a/src/ui/zabapgit_css_common.w3mi.data.css
+++ b/src/ui/zabapgit_css_common.w3mi.data.css
@@ -1,1074 +1,802 @@
-/*
- * ABAPGIT COMMON CSS
- */
-
-/* GLOBALS */
-
-body {
- font-family: Arial,Helvetica,sans-serif;
- font-size: 12pt;
- background: #E8E8E8;
- 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: 0px; vertical-align: middle; }
-table { border-collapse: collapse; }
-pre { display: inline; }
-sup {
- vertical-align: top;
- position: relative;
- top: -0.5em;
- font-size: 75%;
-}
-
-input, textarea, select {
- padding: 3px 6px;
- border: 1px solid #ddd;
-}
-
-input:focus, textarea:focus {
- border: 1px solid #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; }
-
-/* 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; }
-
-/* 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;
-}
-
-/* ERROR LOG */
-
-div.log {
- padding: 6px;
- margin: 4px;
- background-color: #fee6e6;
- border: 1px #fdcece solid;
- border-radius: 4px;
-}
-div.log > span { display:block; }
-div.log .icon { padding-right: 6px; }
-
-/* REPOSITORY */
-div.repo {
- margin-top: 3px;
- background-color: #f2f2f2;
- 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;
-}
-.repo_name .icon {
- padding-right: 4px;
-}
-.repo_attr {
- color: grey;
- font-size: 12pt;
-}
-.repo_attr span {
- margin-left: 0.2em;
- margin-right: 0.5em;
-}
-.repo_attr span.bg_marker {
- border: 1px solid #d2d2d2;
- 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-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 */
-.hidden-submit {
- border: 0 none;
- height: 0;
- width: 0;
- padding: 0;
- margin: 0;
- overflow: hidden;
-}
-
-/* REPOSITORY TABLE*/
-div.repo_container {
- position: relative;
-}
-
-div.repo_banner {
- margin: 0em 1.2em 1em;
- padding: 0.5em 0.5em;
- text-align: center;
- font-size: 85%;
-}
-
-table.repo_tab {
- border: 1px solid #DDD;
- border-radius: 3px;
- background: #fff;
- width: 100%;
-}
-.repo_tab td {
- border-top: 1px solid #eee;
- vertical-align: middle;
- color: #333;
- padding-top: 2px;
- padding-bottom: 2px;
-}
-.repo_tab td.icon {
- width: 1px;
- text-align: center;
- padding-left: 8px;
- padding-right: 4px;
-}
-.repo_tab td.icon:not(:first-child) {
- width: 26px;
- text-align: left;
-}
-.repo_tab td.type {
- width: 3em;
-}
-.repo_tab td.object {
- padding-left: 0.5em;
-}
-.repo_tab td.files {
- padding-left: 0.5em;
-}
-.repo_tab td.cmd {
- text-align: right;
- 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;
- font-size: x-small;
- vertical-align: 13%;
- display: inline-block;
- text-align: center;
-}
-.repo_tab td.cmd span.state-block span {
- display: inline-block;
- padding: 0px 2px;
- border: 1px solid #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;
-}
-.repo_tab .inactive { color: orange; }
-
-/* STAGE */
-div.stage-container { width: 850px; }
-input.stage-filter { width: 18em; }
-
-.stage_tab {
- border: 1px solid #DDD;
- background: #fff;
- margin-top: 0.2em;
-}
-.stage_tab td {
- border-top: 1px solid #eee;
- color: #333;
- 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;
-}
-
-form.aligned-form {
- display: table;
- border-spacing: 2px;
-}
-
-form.aligned-form label {
- color: #BBB;
- padding-right: 1em;
- vertical-align: middle;
-}
-
-form.aligned-form select {
- padding-right: 1em;
- vertical-align: middle;
-}
-
-form.aligned-form span.sub-title {
- color: #BBB;
- font-size: smaller;
- padding-top: 8px;
-}
-
-form.aligned-form div.row { display: table-row; }
-form.aligned-form label { display: table-cell; }
-form.aligned-form input { display: table-cell; }
-form.aligned-form input[type="text"] { width: 25em; }
-form.aligned-form span.cell { display: table-cell; }
-
-/* SETTINGS STYLES */
-div.settings_container {
- padding: 0.5em;
- font-size: 10pt;
- color: #444;
- background-color: #f2f2f2;
-}
-
-div.settings_section {
- margin-left:50px
-}
-
-/* DIFF */
-div.diff {
- background-color: #f2f2f2;
- padding: 0.7em
-}
-div.diff_head {
- padding-bottom: 0.7em;
-}
-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;
- padding: 1px 0.4em;
-}
-span.diff_name strong {
- color: #333;
-}
-span.diff_banner {
- border-style: solid;
- border-width: 1px;
- border-radius: 3px;
- 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;
-}
-
-div.diff_content tbody tr td{
- width: 50%;
- vertical-align: top
-}
-
-div.diff_head span.state-block {
- margin-left: 0.5em;
- font-family: Consolas, Lucida Console, Courier, monospace;
- display: inline-block;
- text-align: center;
-}
-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;
-}
-
-/* DIFF TABLE */
-table.diff_tab {
- font-family: Consolas, Courier, monospace;
- font-size: 10pt;
- width: 100%;
-}
-table.diff_tab td,th {
- color: #444;
- padding-left: 0.5em;
- padding-right: 0.5em;
-}
-table.diff_tab th {
- text-align: left;
- font-weight: normal;
- padding-top: 3px;
- 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;
- -ms-user-select: none;
- user-select: none;
-}
-table.diff_tab td.patch, th.patch {
- width: 1%;
- min-width: 1.5em;
- padding-right: 8px;
- padding-left: 8px;
- text-align: right !important;
- color: #ccc;
- border-left: 1px solid #eee;
- border-right: 1px solid #eee;
- -ms-user-select: none;
- user-select: none;
- cursor: pointer;
-}
-table.diff_tab td.num::before {
- content: attr(line-num);
-}
-table.diff_tab code {
- font-family: inherit;
- white-space: pre;
-}
-table.diff_tab td.code {
- word-wrap: break-word;
- white-space: pre-wrap;
- overflow: visible;
-}
-
-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;
-}
-
-div.debug_container p {
- margin: 0px;
-}
-
-/* DB ENTRIES */
-div.db_list {
- background-color: #fff;
- padding: 0.5em;
- overflow-x: auto;
-}
-
-table.db_tab pre {
- display: inline-block;
- overflow: hidden;
- word-wrap:break-word;
- white-space: pre-wrap;
- margin: 0px;
- width: 30em;
-}
-
-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;
-}
-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;
-}
-
-div.db_entry pre {
- display: block;
- font-size: 10pt;
- overflow: hidden;
- word-wrap:break-word;
- white-space: pre-wrap;
- background-color: #fcfcfc;
- border: 1px #eaeaea solid;
- border-radius: 3px;
- padding: 0.5em;
- margin: 0.5em 0em;
- width: 60em;
-}
-
-div.db_entry table.toolbar {
- width: 50em;
-}
-
-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; }
-
-/* 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;
-}
-
-/* NEW 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
-{
- list-style: none;
- position: relative;
- float: left;
- margin: 0;
- padding: 0;
- white-space: nowrap;
- text-align: left;
-}
-.nav-container.float-right ul { float: right; }
-
-.nav-container ul a
-{
- display: block;
- text-decoration: none;
- line-height: 30px;
- padding: 0 12px;
-}
-
-/* clearfix https://css-tricks.com/snippets/css/clear-fix/ */
-.nav-container:after { clear: both; display: block; content: ""; }
-
-/* submenues align to left or right border of the active item
- depending on .float-right modifier */
-.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
-{
- 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
-{
- float: none;
- min-width: 160px;
-}
-
-.nav-container ul ul a
-{
- line-height: 120%;
- padding: 8px 15px;
-}
-
-.nav-container ul ul ul
-{
- top: 0;
- left: 100%;
-}
-
-.nav-container.float-right ul ul ul
-{
- left: auto;
- right: 100%;
-}
-
-/* Minizone to extent hover area,
- aligned to the left or to the right of the selected item
- depending on .float-right modifier */
-.nav-container > ul > li > div.minizone {
- display: none;
- z-index: 1;
- position: absolute;
- padding: 0px;
- width: 16px;
- height: 100%;
- bottom: 0px;
- left: 100%;
-}
-.nav-container > ul > li:hover div.minizone { display: block; }
-.nav-container.float-right > ul > li > div.minizone {
- left: auto;
- right: 100%;
-}
-
-/* icons - text-align strictly left - otherwise look ugly
- + bite a bit of left padding for nicer look
- + forbids item text wrapping (maybe can be done differently) */
-.nav-container ul ul li a .icon {
- padding-right: 10px;
- margin-left: -3px;
-}
-.nav-container ul.with-icons li {
- text-align: left;
- white-space: nowrap;
-}
-
-/* Special .corner modifier - hangs menu at the top right corner
- and cancels 1st level background coloring */
-.nav-container.corner {
- position: absolute;
- right: 0px;
-}
-.nav-container.corner > ul > li:hover > a { background-color: inherit; }
-
-/* Toolbar separator style */
-.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;
-}
-.nav-container ul ul li.separator:first-child { border-top: none; }
-.nav-container ul ul li.separator:hover { background-color: inherit; }
-
-/* News Announcement */
-
-div.info-panel {
- position: absolute;
- z-index: 99;
- top: 36px;
- left: 50%;
- width: 40em;
- margin-left: -20em;
- background-color: white;
- box-shadow: 1px 1px 3px 2px #dcdcdc;
-}
-
-div.info-panel-fixed {
- position: fixed;
- top: 15%;
-}
-
-div.info-panel div.info-hint {
- text-transform: uppercase;
- font-size: small;
- padding: 8px 6px 0px;
- text-align: center;
- color: #ccc;
-}
-
-div.info-panel div.info-title {
- text-transform: uppercase;
- 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;
- bottom: 1px;
-}
-
-div.info-panel div.info-list {
- padding: 0.8em 0.7em 1em;
- color: #444;
-}
-
-div.info-panel li {
- padding-left: 10px;
- list-style-type: none;
-}
-
-div.info-panel h1:first-child { margin: auto; }
-div.info-panel h1 {
- font-size: inherit;
- padding: 6px 4px;
- margin: 4px auto auto;
- text-decoration: underline;
- font-weight: normal;
-}
-
-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;
-}
-
-div.info-panel .update {
- border: #e8ba30 1px solid;
- background-color: #f5c538;
-}
-
-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;
-
- /* Position the tooltip text */
- position: absolute;
- z-index: 1;
- margin-left: -60px;
- margin-top: -30px;
-
- /* Fade in tooltip */
- opacity: 1;
- transition: opacity 0.3s;
-}
-
-.hidden {
- visibility: hidden;
-}
-
-/* Tooltip arrow */
-.tooltiptext::after {
- content: "";
- position: absolute;
- top: 100%;
- left: 50%;
- margin-left: -5px;
- border-width: 5px;
- border-style: solid;
- border-color: #555 transparent transparent transparent;
-}
-
-/* HOTKEYS */
-ul.hotkeys {
- list-style-type: none;
- padding: 0;
- margin: 0;
- font-size: smaller;
-}
-
-ul.hotkeys span.key-id {
- background: #f0f0f0;
- border: 1px solid #dcdcdc;
- border-radius: 3px;
- padding: 1px 7px;
- width: 0.5em;
- display: inline-block;
- text-align: center;
- margin-top: 0.2em;
-}
-
-ul.hotkeys span.key-descr {
- margin-left: 1.2em;
-}
-
-div.corner-hint {
- position: fixed;
- bottom: 10px;
- right: 10px;
- color: #aaa;
- border: 1px solid #ccc;
- border-radius: 3px;
- padding: 4px;
- font-size: smaller;
- opacity: 0.5;
- background: white;
- z-index: 99;
-}
-
-/* Commit popup */
-table.commit tr .title {
- font-weight: bold;
- vertical-align: top;
-}
-
-/* Repo overview */
-.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;
-}
-
-.gitGraph-scrollWrapper{
- overflow-x: auto;
- height: 20px;
-}
-
-.gitGraph-Wrapper{
- overflow-x: hidden;
-}
-
-.gitGraph-HTopScroller {
- width:1000px;
- height: 20px;
-}
-
-/* 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-result {
- background-color: #f6f6f6;
- padding: 6px;
- margin-top: 4px;
-}
-.ci-result li {
- 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;
-}
-
-/* Floating buttons and color sets */
-
-.floating-button {
- position: fixed;
- top: 6em;
- right: 2.8em;
- padding: 1em 1.8em;
- border-radius: 4px;
- border-width: 1px;
- border-style: solid;
- 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;
-}
+/*
+ * ABAPGIT COMMON CSS
+ */
+
+/* GLOBALS */
+
+body {
+ font-family: Arial,Helvetica,sans-serif;
+ font-size: 12pt;
+ overflow-x: hidden;
+}
+a, a:visited {
+ text-decoration: none;
+}
+a:hover, a:active {
+ cursor: pointer;
+ text-decoration: underline;
+}
+
+img {
+ border-width: 0px;
+ vertical-align: middle;
+}
+table { border-collapse: collapse; }
+pre { display: inline; }
+sup {
+ vertical-align: top;
+ position: relative;
+ top: -0.5em;
+ font-size: 75%;
+}
+
+input, textarea, select {
+ padding: 3px 6px;
+ border: 1px solid;
+}
+input:focus, textarea:focus {
+ border: 1px solid;
+}
+
+/* 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; }
+.hidden { visibility: hidden; }
+
+/* PANELS */
+div.panel {
+ border-radius: 3px;
+}
+
+#debug-output {
+ text-align: right;
+ padding-right: 0.5em;
+ font-style: italic;
+ font-size: small;
+}
+
+div.dummydiv {
+ 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;
+ border: 1px solid;
+ border-radius: 4px;
+}
+div.log > span { display:block; }
+div.log .icon { padding-right: 6px; }
+
+/* REPOSITORY */
+div.repo {
+ margin-top: 3px;
+ padding: 0.5em 1em 0.5em 1em;
+ position: relative;
+}
+.repo_name span.name {
+ font-weight: bold;
+ font-size: 14pt;
+}
+.repo_name a.url {
+ font-size: 12pt;
+ margin-left: 0.5em;
+}
+.repo_name span.url {
+ font-size: 12pt;
+ margin-left: 0.5em;
+}
+.repo_name .icon {
+ padding-right: 4px;
+}
+.repo_attr {
+ font-size: 12pt;
+}
+.repo_attr span {
+ margin-left: 0.2em;
+ margin-right: 0.5em;
+}
+.repo_attr span.bg_marker {
+ border: 1px solid;
+ border-radius: 3px;
+ font-size: 8pt;
+ padding: 4px 2px 3px 2px;
+}
+.repo_attr span.branch {
+ padding: 2px 4px;
+ border: 1px solid;
+ border-radius: 4px;
+}
+
+/* MISC AND REFACTOR */
+.hidden-submit {
+ border: 0 none;
+ height: 0;
+ width: 0;
+ padding: 0;
+ margin: 0;
+ overflow: hidden;
+}
+
+/* REPOSITORY TABLE*/
+div.repo_container {
+ position: relative;
+}
+
+div.repo_banner {
+ margin: 0em 1.2em 1em;
+ padding: 0.5em 0.5em;
+ text-align: center;
+ font-size: 85%;
+}
+
+table.repo_tab {
+ border: 1px solid;
+ border-radius: 3px;
+ width: 100%;
+}
+.repo_tab td {
+ border-top: 1px solid;
+ vertical-align: middle;
+ padding-top: 2px;
+ padding-bottom: 2px;
+}
+.repo_tab td.icon {
+ width: 1px;
+ text-align: center;
+ padding-left: 8px;
+ padding-right: 4px;
+}
+.repo_tab td.icon:not(:first-child) {
+ width: 26px;
+ text-align: left;
+}
+.repo_tab td.type {
+ width: 3em;
+}
+.repo_tab td.object {
+ padding-left: 0.5em;
+}
+.repo_tab td.files {
+ padding-left: 0.5em;
+}
+.repo_tab td.cmd {
+ text-align: right;
+ padding-left: 0.5em;
+ padding-right: 0.7em;
+}
+.repo_tab tr:first-child td { border-top: 0px; }
+.repo_tab td.cmd span.state-block {
+ margin-left: 1em;
+ font-family: Consolas, Lucida Console, Courier, monospace;
+ font-size: x-small;
+ vertical-align: 13%;
+ display: inline-block;
+ text-align: center;
+}
+.repo_tab td.cmd span.state-block span {
+ display: inline-block;
+ padding: 0px 2px;
+ border: 1px solid;
+}
+
+/* STAGE */
+div.stage-container { width: 850px; }
+input.stage-filter { width: 18em; }
+
+.stage_tab {
+ border: 1px solid;
+ margin-top: 0.2em;
+}
+.stage_tab td {
+ border-top: 1px solid;
+ vertical-align: middle;
+ padding: 2px 0.5em;
+}
+.stage_tab th {
+ text-align: left;
+ font-weight: normal;
+ padding: 4px 0.5em;
+}
+.stage_tab td.status {
+ width: 2em;
+ text-align: center;
+}
+.stage_tab td.highlight {
+ 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 tbody tr:first-child td { padding-top: 0.5em; }
+.stage_tab tbody tr:last-child td { padding-bottom: 0.5em; }
+
+/* COMMIT */
+div.form-container {
+ padding: 1em 1em;
+}
+
+form.aligned-form {
+ display: table;
+ border-spacing: 2px;
+}
+
+form.aligned-form label {
+ padding-right: 1em;
+ vertical-align: middle;
+}
+
+form.aligned-form select {
+ padding-right: 1em;
+ vertical-align: middle;
+}
+
+form.aligned-form span.sub-title {
+ font-size: smaller;
+ padding-top: 8px;
+}
+
+form.aligned-form div.row { display: table-row; }
+form.aligned-form label { display: table-cell; }
+form.aligned-form input { display: table-cell; }
+form.aligned-form input[type="text"] { width: 25em; }
+form.aligned-form span.cell { display: table-cell; }
+
+/* SETTINGS STYLES */
+div.settings_container {
+ padding: 0.5em;
+ font-size: 10pt;
+}
+
+div.settings_section {
+ margin-left:50px
+}
+
+/* DIFF */
+div.diff {
+ padding: 0.7em
+}
+div.diff_head {
+ padding-bottom: 0.7em;
+}
+span.diff_name {
+ padding-left: 0.5em;
+}
+span.diff_changed_by {
+ float: right;
+}
+span.diff_changed_by span.user {
+ border-radius: 3px;
+ border: solid 1px;
+ padding: 1px 0.4em;
+}
+span.diff_banner {
+ border-style: solid;
+ border-width: 1px;
+ border-radius: 3px;
+ padding-left: 0.3em;
+ padding-right: 0.3em;
+}
+div.diff_content {
+ border-top: 1px solid;
+ border-bottom: 1px solid;
+}
+
+div.diff_content tbody tr td{
+ width: 50%;
+ vertical-align: top
+}
+
+div.diff_head span.state-block {
+ margin-left: 0.5em;
+ font-family: Consolas, Lucida Console, Courier, monospace;
+ display: inline-block;
+ text-align: center;
+}
+div.diff_head span.state-block span {
+ display: inline-block;
+ padding: 0px 4px;
+ border: 1px solid;
+}
+
+/* DIFF TABLE */
+table.diff_tab {
+ font-family: Consolas, Courier, monospace;
+ font-size: 10pt;
+ width: 100%;
+}
+table.diff_tab td,th {
+ padding-left: 0.5em;
+ padding-right: 0.5em;
+}
+table.diff_tab th {
+ text-align: left;
+ font-weight: normal;
+ padding-top: 3px;
+ padding-bottom: 3px;
+}
+table.diff_tab thead.header th {
+ text-align: left;
+ font-weight: bold;
+ padding-left: 0.5em;
+ font-size: 9pt;
+}
+table.diff_tab td.num, th.num {
+ width: 1%;
+ min-width: 2em;
+ padding-right: 8px;
+ padding-left: 8px;
+ text-align: right !important;
+ border-left: 1px solid;
+ border-right: 1px solid;
+ -ms-user-select: none;
+ user-select: none;
+}
+table.diff_tab td.patch, th.patch {
+ width: 1%;
+ min-width: 1.5em;
+ padding-right: 8px;
+ padding-left: 8px;
+ text-align: right !important;
+ border-left: 1px solid;
+ border-right: 1px solid;
+ -ms-user-select: none;
+ user-select: none;
+ cursor: pointer;
+}
+table.diff_tab td.num::before {
+ content: attr(line-num);
+}
+table.diff_tab code {
+ font-family: inherit;
+ white-space: pre;
+}
+table.diff_tab td.code {
+ word-wrap: break-word;
+ white-space: pre-wrap;
+ overflow: visible;
+}
+
+table.diff_tab tbody tr:first-child td { padding-top: 0.5em; }
+table.diff_tab tbody tr:last-child td { padding-bottom: 0.5em; }
+
+/* DEBUG INFO STYLES */
+div.debug_container {
+ padding: 0.5em;
+ font-size: 10pt;
+ font-family: Consolas, Courier, monospace;
+}
+
+div.debug_container p {
+ margin: 0px;
+}
+
+/* DB ENTRIES */
+div.db_list {
+ padding: 0.5em;
+ overflow-x: auto;
+}
+
+table.db_tab pre {
+ display: inline-block;
+ overflow: hidden;
+ word-wrap:break-word;
+ white-space: pre-wrap;
+ margin: 0px;
+ width: 30em;
+}
+
+table.db_tab tr.firstrow td { padding-top: 0.5em; }
+table.db_tab th {
+ text-align: left;
+ padding: 0.5em;
+ border-bottom: 1px solid;
+}
+table.db_tab td {
+ padding: 4px 8px;
+ vertical-align: middle;
+}
+table.db_tab td.data {
+ font-style: italic;
+}
+
+/* DB ENTRY DISPLAY */
+div.db_entry {
+ padding: 0.5em;
+}
+
+div.db_entry pre {
+ display: block;
+ font-size: 10pt;
+ overflow: hidden;
+ word-wrap:break-word;
+ white-space: pre-wrap;
+ 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 solid;
+ border-radius: 3px;
+ margin-right: 0.5em;
+}
+table.tag td { padding: 0.2em 0.5em; }
+
+/* TUTORIAL */
+
+div.tutorial {
+ margin-top: 3px;
+ padding: 0.5em 1em 0.5em 1em;
+}
+
+div.tutorial li { margin: 2px 0px }
+div.tutorial h1 { font-size: 18pt; }
+div.tutorial h2 { font-size: 14pt;}
+
+/* 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 {
+ list-style: none;
+ position: relative;
+ float: left;
+ margin: 0;
+ padding: 0;
+ white-space: nowrap;
+ text-align: left;
+}
+.nav-container.float-right ul { float: right; }
+
+.nav-container ul a {
+ display: block;
+ text-decoration: none;
+ line-height: 30px;
+ padding: 0 12px;
+}
+
+/* clearfix https://css-tricks.com/snippets/css/clear-fix/ */
+.nav-container:after { clear: both; display: block; content: ""; }
+
+/* submenues align to left or right border of the active item
+ depending on .float-right modifier */
+.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; }
+
+/* special selection style for 1st level items (see also .corner below) */
+
+.nav-container ul ul {
+ display: none;
+ position: absolute;
+ top: 100%;
+ left: 0;
+ z-index: 1;
+ padding: 0;
+ box-shadow: 1px 1px 3px 0px #bbb;
+}
+
+.nav-container ul ul li {
+ float: none;
+ min-width: 160px;
+}
+
+.nav-container ul ul a {
+ line-height: 120%;
+ padding: 8px 15px;
+}
+
+.nav-container ul ul ul {
+ top: 0;
+ left: 100%;
+}
+
+.nav-container.float-right ul ul ul {
+ left: auto;
+ right: 100%;
+}
+
+/* Minizone to extent hover area,
+ aligned to the left or to the right of the selected item
+ depending on .float-right modifier */
+.nav-container > ul > li > div.minizone {
+ display: none;
+ z-index: 1;
+ position: absolute;
+ padding: 0px;
+ width: 16px;
+ height: 100%;
+ bottom: 0px;
+ left: 100%;
+}
+.nav-container > ul > li:hover div.minizone { display: block; }
+.nav-container.float-right > ul > li > div.minizone {
+ left: auto;
+ right: 100%;
+}
+
+/* icons - text-align strictly left - otherwise look ugly
+ + bite a bit of left padding for nicer look
+ + forbids item text wrapping (maybe can be done differently) */
+.nav-container ul ul li a .icon {
+ padding-right: 10px;
+ margin-left: -3px;
+}
+.nav-container ul.with-icons li {
+ text-align: left;
+ white-space: nowrap;
+}
+
+/* Special .corner modifier - hangs menu at the top right corner
+ and cancels 1st level background coloring */
+.nav-container.corner {
+ position: absolute;
+ right: 0px;
+}
+
+/* Toolbar separator style */
+.nav-container ul ul li.separator {
+ font-size: x-small;
+ text-align: center;
+ padding: 4px 0;
+ text-transform: uppercase;
+ border-bottom: 1px solid;
+ border-top: 1px solid;
+}
+.nav-container ul ul li.separator:first-child { border-top: none; }
+
+/* News Announcement */
+
+div.info-panel {
+ position: absolute;
+ z-index: 99;
+ top: 36px;
+ left: 50%;
+ width: 40em;
+ margin-left: -20em;
+ box-shadow: 1px 1px 3px 2px #dcdcdc;
+}
+
+div.info-panel-fixed {
+ position: fixed;
+ top: 15%;
+}
+
+div.info-panel div.info-hint {
+ text-transform: uppercase;
+ font-size: small;
+ padding: 8px 6px 0px;
+ text-align: center;
+}
+
+div.info-panel div.info-title {
+ text-transform: uppercase;
+ font-size: small;
+ padding: 6px;
+ text-align: center;
+}
+
+div.info-panel div.info-title a.close-btn {
+ padding-left: 12px;
+ padding-right: 2px;
+ position: relative;
+ bottom: 1px;
+}
+
+div.info-panel div.info-list {
+ padding: 0.8em 0.7em 1em;
+}
+
+div.info-panel li {
+ padding-left: 10px;
+ list-style-type: none;
+}
+
+div.info-panel h1:first-child { margin: auto; }
+div.info-panel h1 {
+ font-size: inherit;
+ padding: 6px 4px;
+ margin: 4px auto auto;
+ text-decoration: underline;
+ font-weight: normal;
+}
+
+div.info-panel .version-marker {
+ display: inline-block;
+ margin-left: 20px;
+ border-radius: 3px;
+ padding: 0px 6px;
+ border: 1px solid;
+}
+
+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;
+ text-align: center;
+ padding: 5px 0;
+ border-radius: 6px;
+
+ /* Position the tooltip text */
+ position: absolute;
+ z-index: 1;
+ margin-left: -60px;
+ margin-top: -30px;
+
+ /* Fade in tooltip */
+ opacity: 1;
+ transition: opacity 0.3s;
+}
+
+/* Tooltip arrow */
+.tooltiptext::after {
+ content: "";
+ position: absolute;
+ top: 100%;
+ left: 50%;
+ margin-left: -5px;
+ border-width: 5px;
+ border-style: solid;
+}
+
+/* HOTKEYS */
+ul.hotkeys {
+ list-style-type: none;
+ padding: 0;
+ margin: 0;
+ font-size: smaller;
+}
+
+ul.hotkeys span.key-id {
+ border: 1px solid;
+ border-radius: 3px;
+ padding: 1px 7px;
+ width: 0.5em;
+ display: inline-block;
+ text-align: center;
+ margin-top: 0.2em;
+}
+
+ul.hotkeys span.key-descr {
+ margin-left: 1.2em;
+}
+
+div.corner-hint {
+ position: fixed;
+ bottom: 10px;
+ right: 10px;
+ border: 1px solid;
+ border-radius: 3px;
+ padding: 4px;
+ font-size: smaller;
+ opacity: 0.5;
+ z-index: 99;
+}
+
+/* Commit popup */
+table.commit tr .title {
+ font-weight: bold;
+ vertical-align: top;
+}
+
+/* Repo overview */
+.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;
+}
+
+.gitGraph-scrollWrapper{
+ overflow-x: auto;
+ height: 20px;
+}
+
+.gitGraph-Wrapper{
+ overflow-x: hidden;
+}
+
+.gitGraph-HTopScroller {
+ width:1000px;
+ height: 20px;
+}
+
+/* code inspector */
+.ci-head { padding: 0.5em 1em; }
+.ci-head .package-name span { margin-left: 0.3em; }
+.ci-variant { font-weight: bold; }
+.ci-result {
+ padding: 6px;
+ margin-top: 4px;
+}
+.ci-result li {
+ list-style-type: none;
+ padding: 0.3em 0.8em;
+ margin-top: 6px;
+ border-left: 4px solid;
+}
+.ci-result li:first-child { margin-top: 0px; }
+.ci-result li span { display: block; }
+
+/* Floating buttons */
+
+.floating-button {
+ position: fixed;
+ top: 6em;
+ right: 2.8em;
+ padding: 1em 1.8em;
+ border-radius: 4px;
+ border-width: 1px;
+ border-style: solid;
+ box-shadow: 2px 2px 6px 0px #ccc;
+ cursor: pointer;
+}
diff --git a/src/ui/zabapgit_css_theme_default.w3mi.data.css b/src/ui/zabapgit_css_theme_default.w3mi.data.css
new file mode 100644
index 000000000..4ae8b0058
--- /dev/null
+++ b/src/ui/zabapgit_css_theme_default.w3mi.data.css
@@ -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; }
diff --git a/src/ui/zabapgit_css_theme_default.w3mi.xml b/src/ui/zabapgit_css_theme_default.w3mi.xml
new file mode 100644
index 000000000..55e01b71a
--- /dev/null
+++ b/src/ui/zabapgit_css_theme_default.w3mi.xml
@@ -0,0 +1,29 @@
+
+
+
+
+ ZABAPGIT_CSS_THEME_DEFAULT
+ abapGit default color theme
+
+
+ MI
+ ZABAPGIT_CSS_THEME_DEFAULT
+ fileextension
+ .CSS
+
+
+ MI
+ ZABAPGIT_CSS_THEME_DEFAULT
+ filename
+ THEME-default.CSS
+
+
+ MI
+ ZABAPGIT_CSS_THEME_DEFAULT
+ mimetype
+ text/css
+
+
+
+
+
diff --git a/src/ui/zcl_abapgit_gui_page.clas.abap b/src/ui/zcl_abapgit_gui_page.clas.abap
index 7857b3630..9671aaa4b 100644
--- a/src/ui/zcl_abapgit_gui_page.clas.abap
+++ b/src/ui/zcl_abapgit_gui_page.clas.abap
@@ -87,32 +87,7 @@ ENDCLASS.
-CLASS zcl_abapgit_gui_page IMPLEMENTATION.
-
-
- METHOD insert_hotkeys_to_page.
-
- DATA: lv_json TYPE string.
-
- FIELD-SYMBOLS: LIKE LINE OF mt_hotkeys.
-
- lv_json = `{`.
-
- LOOP AT mt_hotkeys ASSIGNING .
-
- IF sy-tabix > 1.
- lv_json = lv_json && |,|.
- ENDIF.
-
- lv_json = lv_json && | "{ -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: TYPE zif_abapgit_gui_page_hotkey=>ty_hotkey_with_name,
+ 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 .
+
+ READ TABLE lt_user_defined_hotkeys ASSIGNING
+ WITH TABLE KEY action
+ COMPONENTS action = -action.
+ IF sy-subrc = 0.
+ -hotkey = -hotkey.
+ ELSEIF lines( lt_user_defined_hotkeys ) > 0.
+ " User removed the hotkey
+ DELETE TABLE rt_hotkeys FROM .
+ 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( 'abapGit' ). "#EC NOTEXT
ro_html->add( '' ).
+
+ CASE mo_settings->get_ui_theme( ).
+ WHEN zcl_abapgit_settings=>c_ui_theme-dark.
+ ro_html->add( '' ). "TODO
+ WHEN zcl_abapgit_settings=>c_ui_theme-belize.
+ ro_html->add( '' ). "TODO
+ WHEN OTHERS.
+ ro_html->add( '' ).
+ ENDCASE.
+
ro_html->add( '' ).
ro_html->add( '' ). "#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: LIKE LINE OF mt_hotkeys.
+
+ lv_json = `{`.
+
+ LOOP AT mt_hotkeys ASSIGNING .
+
+ IF sy-tabix > 1.
+ lv_json = lv_json && |,|.
+ ENDIF.
+
+ lv_json = lv_json && | "{ -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( '