SAP/abapGit
1
0
Fork 0
mirror of https://github.com/abapGit/abapGit.git synced 2025-05-01 12:20:51 +08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

CSS adjustments (#5047)

Browse Source 
* CSS adjustments 

I made a few small CSS adjustments to make things a bit more consistent

- Repo overview: Adjust hightlight for current row 
- Repo: Add background color to table header to match staging
- Repo: Fix hightlight for current row 
- Staging: Slight color and table border adjustments
- Forms: Slight color adjustments for textarea placeholder
- DB Utility: Add hightlight for current row

* Update to dark theme

Co-authored-by: Lars Hvam <larshp@hotmail.com>
This commit is contained in:
Marc Bernard 2021-10-25 09:50:01 -04:00 committed by GitHub
parent ea0c834992
commit 91f77324ea
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 89 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/ui/zabapgit_css_common.w3mi.data.css
View File

@ -322,8 +322,8 @@ table.repo_tab {
}
.repo_tab tr:first-child td { border-top: 0px; }
.repo_tab tr:hover {
background-color: var(--theme-greyscale-dark) !important;
.repo_tab tr:hover td {
background-image: linear-gradient(rgba(0, 0, 0, 0.075), rgba(0, 0, 0, 0.075));
}
@ -347,6 +347,7 @@ input.stage-filter { width: 18em; }
text-align: left;
font-weight: normal;
padding: 4px 0.5em;
border-bottom: 1px solid;
}
.stage_tab td.status {
width: 2em;
@ -356,8 +357,10 @@ input.stage-filter { width: 18em; }
font-weight: bold;
}
.stage_tab tr:hover {
background-color: rgb(245, 245, 245) !important;
.stage_tab tr:first-child td { border-top: 0px; }
.stage_tab tr:hover td {
background-image: linear-gradient(rgba(0, 0, 0, 0.075), rgba(0, 0, 0, 0.075));
}
.stage_tab td.cmd { cursor: pointer; }

67
src/ui/zabapgit_css_theme_dark.w3mi.data.css
View File

@ -41,6 +41,7 @@ a:hover { color: var(--theme-link-color-hover); }
div#toc .favorites a { opacity: 1; }
.nav-container ul a:hover { text-decoration: underline; }
.nav-container ul ul { background-color: #555555; }
.nav-container ul li:hover { background-color: #555555; }
.nav-container ul ul li:hover { background-color: var(--theme-list-hover-background-color); }
table.repo_tab {
border-color: var(--theme-container-background-color);
@ -92,6 +93,7 @@ span.branch_branch {
.repo_tab th {
border-top-color: var(--theme-greyscale-dark);
background-color: black;
}
.repo_tab td {
border-top-color: var(--theme-greyscale-dark);
@ -102,6 +104,10 @@ span.branch_branch {
border-color: var(--theme-greyscale-dark);
background-color: var(--theme-background-color);
}
.stage_tab th {
border-top-color: var(--theme-greyscale-dark);
background-color: black;
}
.stage_tab td {
color: var(--theme-primary-font-color);
border-top-color: var(--theme-greyscale-dark);
@ -176,3 +182,64 @@ table.db_tab tr.selected {
div.log { color: var(--theme-greyscale-dark); }
.close-btn, .message-panel, .message-panel-commands a { color: var(--theme-greyscale-dark); }
.message-panel-commands a:hover { color: var(--theme-greyscale-dark); }
/* DIALOGS */
.dialog {
color: var(--theme-primary-font-color-reduced);
background-color: var(--theme-container-background-color);
}
.dialog li.dialog-commands a {
border-color: #ccc;
background-color: var(--theme-greyscale-dark);
}
.dialog li.dialog-commands input[type="submit"] {
border-color: #ccc;
background-color: var(--theme-greyscale-dark);
}
.dialog li.dialog-commands input[type="submit"].main {
background-color: #64a8ff;
color: #fff;
}
.dialog label {
color: var(--theme-primary-font-color);
}
.dialog label em {
color: #64a8ff;
}
.dialog li.error small {
color: #ff5959;
}
.dialog li.error input[type="number"],
.dialog li.error input[type="text"] {
border-color: #ff5959;
}
.dialog .radio-container {
border-color: #ddd;
background-color: var(--theme-greyscale-dark);
}
.dialog .radio-container input[type="radio"] + label {
color: #808080;
}
.dialog .radio-container input[type="radio"]:checked + label {
background-color: #64a8ff;
color: #fff;
}
.dialog li.with-command input[type="submit"]:hover {
background-color: #64a8ff;
color: #fff;
}
.dialog fieldset {
border-color: #dfdfdf;
}
.dialog fieldset legend {
color: var(--theme-primary-font-color);
}
.dialog input:read-only {
background-color: var(--theme-greyscale-medium);
color: var(--theme-greyscale-dark);
}
/* for IE */
.dialog input[readonly] {
background-color: var(--theme-greyscale-medium);
color: var(--theme-greyscale-dark);
}

25
src/ui/zabapgit_css_theme_default.w3mi.data.css
View File

@ -137,6 +137,7 @@ table.repo_tab {
}
.repo_tab th {
color: var(--theme-link-color);
background-color: #edf2f9;
border-bottom-color: #ddd;
}
.repo_tab td {
@ -180,22 +181,21 @@ table.repo_tab {
border-color: #ddd;
background-color: #fff;
}
.stage_tab td {
color: #333;
border-top-color: var(--theme-table-border-color);
}
.stage_tab th {
color: var(--theme-greyscale-medium);
color: var(--theme-greyscale-dark);
background-color: #edf2f9;
border-bottom-color: #ddd;
}
.stage_tab td {
color: var(--theme-greyscale-medium);
border-top-color: var(--theme-table-border-color);
}
.stage_tab td.status {
color: var(--theme-primary-font-color-reduced);
background-color: #fafafa;
}
.stage_tab td.highlight { color: #444 !important; }
.stage_tab td.method { color: var(--theme-primary-font-color-reduced); }
.stage_tab td.user { color: var(--theme-greyscale-medium); }
.stage_tab td.type { color: var(--theme-greyscale-medium); }
.stage_tab td.method { font-weight: bold; }
.stage_tab mark {
color: white;
background-color: #79a0d2;
@ -355,7 +355,12 @@ div.debug_container {
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 tbody tr:hover td {
background-image: linear-gradient(rgba(0, 0, 0, 0.075), rgba(0, 0, 0, 0.075));
}
table.db_tab tbody tr:active td {
background-color: #f4f4f4;
}
table.db_tab th {
color: var(--theme-link-color);
border-bottom-color: #ddd;
@ -488,8 +493,8 @@ table.settings_tab input:focus {
/* HTML FORMS */
.dialog input::placeholder { color: #ccc }
.dialog input:-ms-input-placeholder { color: #ccc }
.dialog textarea::placeholder { color: #ccc }
.dialog input:-ms-input-placeholder { color: #ccc }
.dialog textarea:-ms-input-placeholder { color: #ccc }
.dialog {
border-color: #ccc;