Branch page and misc css improvements (#15208) (#15274)

- Improve branches page, increase icon size, use octicons, use css vars
- Style placeholder color via css var
- Slightly increase contrast of input fields and active/hover states
- Add styling for select boxes in arc-green
This commit is contained in:
silverwind 2021-04-04 15:31:54 +02:00 committed by GitHub
parent 33c4e246fe
commit 4bc8dfc6a3
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 31 additions and 28 deletions

View file

@ -98,8 +98,8 @@
--color-navbar: #f8f8f8;
--color-light: #00000004;
--color-light-border: #0000001d;
--color-hover: #0000000d;
--color-active: #00000012;
--color-hover: #0000000f;
--color-active: #00000014;
--color-menu: #ffffff;
--color-card: #ffffff;
--color-markdown-table-row: #00000008;
@ -109,6 +109,7 @@
--color-markdown-code-block: #00000010;
--color-secondary-bg: #f4f4f4;
--color-expand-button: #d8efff;
--color-placeholder-text: #aaa;
/* backgrounds */
--checkbox-mask-checked: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="-1 -1 18 18" width="16" height="16"><path fill-rule="evenodd" d="M13.78 4.22a.75.75 0 010 1.06l-7.25 7.25a.75.75 0 01-1.06 0L2.22 9.28a.75.75 0 011.06-1.06L6 10.94l6.72-6.72a.75.75 0 011.06 0z"></path></svg>');
--checkbox-mask-indeterminate: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M2 7.75A.75.75 0 012.75 7h10a.75.75 0 010 1.5h-10A.75.75 0 012 7.75z"></path></svg>');
@ -188,12 +189,14 @@ table {
::selection,
.CodeMirror-selected {
background: var(--color-primary-light-1) !important;
color: #fff !important;
color: var(--color-white) !important;
}
::placeholder,
.CodeMirror-placeholder {
color: #aaa !important;
.CodeMirror-placeholder,
.ui.dropdown:not(.button) > .default.text,
.ui.default.dropdown:not(.button) > .text {
color: var(--color-placeholder-text) !important;
opacity: 1 !important;
}
@ -1972,7 +1975,7 @@ table th[data-sortt-desc] {
.ui.secondary.pointing.menu .dropdown.item:hover,
.ui.secondary.pointing.menu .link.item:hover,
.ui.secondary.pointing.menu a.item:hover {
color: var(--color-text);
color: var(--color-text-dark);
}
.ui.header {