feat: vendor gitea 1.16.2
This commit is contained in:
@@ -6,14 +6,6 @@
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
.runner-container .runner-new-text {
|
||||
color: var(--color-white);
|
||||
}
|
||||
|
||||
.runner-container #runner-new:hover .runner-new-text {
|
||||
color: var(--color-white) !important;
|
||||
}
|
||||
|
||||
.runner-container .task-status-success {
|
||||
background-color: var(--color-green);
|
||||
color: var(--color-white);
|
||||
|
||||
@@ -49,3 +49,11 @@
|
||||
gap: 1rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.web-banner-content-editor .render-content.render-preview {
|
||||
/* use the styles from ".ui.message" */
|
||||
padding: 1em 1.5em;
|
||||
border: 1px solid var(--color-info-border);
|
||||
background: var(--color-info-bg);
|
||||
color: var(--color-text);
|
||||
}
|
||||
|
||||
@@ -12,12 +12,15 @@
|
||||
--font-weight-medium: 500;
|
||||
--font-weight-semibold: 600;
|
||||
--font-weight-bold: 700;
|
||||
/* line-height: use the default value as "modules/normalize.css" */
|
||||
--line-height-default: normal;
|
||||
--line-height-default: normal; /* line-height: use the default value as "modules/normalize.css" */
|
||||
--line-height-code: 20px; /* line-height for code, also used by the editor */
|
||||
/* images */
|
||||
--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>');
|
||||
--checkbox-mask-checked: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="9" viewBox="0 0 12 9"><path fill-rule="evenodd" d="M11.78.22a.75.75 0 0 1 0 1.061L4.52 8.541a.75.75 0 0 1-1.062 0L.202 5.285a.75.75 0 0 1 1.061-1.061l2.725 2.723L10.718.22a.75.75 0 0 1 1.062 0"/></svg>');
|
||||
--checkbox-mask-indeterminate: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="10" height="2" viewBox="0 0 10 2"><path fill-rule="evenodd" d="M0 1a1 1 0 0 1 1-1h8a1 1 0 1 1 0 2H1a1 1 0 0 1-1-1" clip-rule="evenodd"/></svg>');
|
||||
--octicon-alert-fill: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path d="M6.457 1.047c.659-1.234 2.427-1.234 3.086 0l6.082 11.378A1.75 1.75 0 0 1 14.082 15H1.918a1.75 1.75 0 0 1-1.543-2.575ZM8 5a.75.75 0 0 0-.75.75v2.5a.75.75 0 0 0 1.5 0v-2.5A.75.75 0 0 0 8 5Zm1 6a1 1 0 1 0-2 0 1 1 0 0 0 2 0Z"/></svg>');
|
||||
--octicon-chevron-right: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path d="M6.22 3.22a.75.75 0 0 1 1.06 0l4.25 4.25a.75.75 0 0 1 0 1.06l-4.25 4.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L9.94 8 6.22 4.28a.75.75 0 0 1 0-1.06Z"></path></svg>');
|
||||
--octicon-x: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path d="M3.72 3.72a.75.75 0 0 1 1.06 0L8 6.94l3.22-3.22a.749.749 0 0 1 1.275.326.75.75 0 0 1-.215.734L9.06 8l3.22 3.22a.749.749 0 0 1-.326 1.275.75.75 0 0 1-.734-.215L8 9.06l-3.22 3.22a.75.75 0 0 1-1.042-.018.75.75 0 0 1-.018-1.042L6.94 8 3.72 4.78a.75.75 0 0 1 0-1.06"/></svg>');
|
||||
--select-arrows: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path d="m4.074 9.427 3.396 3.396a.25.25 0 0 0 .354 0l3.396-3.396A.25.25 0 0 0 11.043 9H4.251a.25.25 0 0 0-.177.427m0-1.957L7.47 4.073a.25.25 0 0 1 .354 0L11.22 7.47a.25.25 0 0 1-.177.426H4.251a.25.25 0 0 1-.177-.426"/></svg>');
|
||||
/* other variables */
|
||||
--border-radius: 4px;
|
||||
--border-radius-medium: 6px;
|
||||
@@ -26,13 +29,14 @@
|
||||
--height-loading: 16rem;
|
||||
--min-height-textarea: 132px; /* padding + 6 lines + border = calc(1.57142em + 6lh + 2px), but lh is not fully supported */
|
||||
--tab-size: 4;
|
||||
--checkbox-size: 15px; /* height and width of checkbox and radio inputs */
|
||||
--checkbox-size: 14px; /* height and width of checkbox and radio inputs */
|
||||
--page-spacing: 16px; /* space between page elements */
|
||||
--page-margin-x: 32px; /* minimum space on left and right side of page */
|
||||
--page-space-bottom: 64px; /* space between last page element and footer */
|
||||
--transition-hover-fade: opacity 0.2s ease; /* fade transition for elements that show on hover */
|
||||
|
||||
/* z-index */
|
||||
--z-index-modal: 1001; /* modal dialog, hard-coded from Fomantic modal.css */
|
||||
--z-index-modal: 1001; /* modal dialog */
|
||||
--z-index-toast: 1002; /* should be larger than modal */
|
||||
|
||||
--font-size-label: 12px; /* font size of individual labels */
|
||||
@@ -40,7 +44,8 @@
|
||||
--gap-inline: 0.25rem; /* gap for inline texts and elements, for example: the spaces for sentence with labels, button text, etc */
|
||||
--gap-block: 0.5rem; /* gap for element blocks, for example: spaces between buttons, menu image & title, header icon & title etc */
|
||||
|
||||
--background-view-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAG0lEQVQYlWN4+vTpf3SMDTAMBYXYBLFpHgoKAeiOf0SGE9kbAAAAAElFTkSuQmCC") right bottom var(--color-primary-light-7);
|
||||
--background-view-image: repeating-conic-gradient(var(--color-transparency-grid-dark) 0 25%, var(--color-transparency-grid-light) 0 50%) 0 0 / 18px 18px;
|
||||
--box-shadow-kbd: inset 0 -1px 0 var(--color-secondary);
|
||||
}
|
||||
|
||||
@media (min-width: 768px) and (max-width: 1200px) {
|
||||
@@ -97,19 +102,18 @@ samp {
|
||||
|
||||
pre,
|
||||
code,
|
||||
kbd,
|
||||
samp,
|
||||
.tw-font-mono {
|
||||
font-size: 0.95em; /* compensate for monospace fonts being usually slightly larger */
|
||||
}
|
||||
|
||||
/* there are many <code> blocks in non-markup(.markup code) / non-code-diff(code.code-inner) containers (for example: translation strings, etc),
|
||||
so we need to make <code> have default global styles, ".markup code" has its own styles and doesn't conflict, but `.code-inner` is special.
|
||||
TODO: in the future, we should use `div` instead of `code` for `.code-inner` because it is a container for highlighted code line */
|
||||
code:not(.code-inner) {
|
||||
/* there are many <code> blocks in non-markup(.markup code) / non-code-diff(code.code-inner) containers, for example: translation strings, etc,
|
||||
so we need to make <code> have default global styles, ".markup code" has its own styles and these styles sometimes conflict.
|
||||
TODO: in the future, we should use `div` instead of `code` for `.code-inner` because it is a container for highlighted code line, then drop this ":not" patch */
|
||||
code:where(:not(.code-inner)) {
|
||||
padding: 1px 4px;
|
||||
border-radius: var(--border-radius);
|
||||
background-color: var(--color-label-bg);
|
||||
background-color: var(--color-markup-code-inline);
|
||||
}
|
||||
|
||||
b,
|
||||
@@ -236,14 +240,13 @@ progress::-moz-progress-bar {
|
||||
background: var(--color-hover);
|
||||
}
|
||||
|
||||
::selection {
|
||||
::selection,
|
||||
relative-time::part(root)::selection {
|
||||
background: var(--color-primary-light-1);
|
||||
color: var(--color-white);
|
||||
}
|
||||
|
||||
::placeholder,
|
||||
.ui.dropdown:not(.button) > .default.text,
|
||||
.ui.default.dropdown:not(.button) > .text {
|
||||
::placeholder {
|
||||
color: var(--color-placeholder-text) !important;
|
||||
opacity: 1 !important;
|
||||
}
|
||||
@@ -260,6 +263,12 @@ progress::-moz-progress-bar {
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.container-disabled {
|
||||
opacity: var(--opacity-disabled);
|
||||
pointer-events: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
@@ -308,35 +317,34 @@ a.label,
|
||||
text-decoration-line: none !important;
|
||||
}
|
||||
|
||||
.ui.search > .results {
|
||||
background: var(--color-body);
|
||||
border-color: var(--color-secondary);
|
||||
overflow-wrap: anywhere; /* allow text to wrap as fomantic limits this to 18em width */
|
||||
.native-select {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.ui.search > .results .result {
|
||||
background: var(--color-body);
|
||||
border-color: var(--color-secondary);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.native-select > select {
|
||||
appearance: none; /* hide default triangle */
|
||||
padding: 6px 26px 6px 10px;
|
||||
border: 1px solid var(--color-light-border) !important;
|
||||
color: var(--color-text);
|
||||
border-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
.ui.search > .results .result .title {
|
||||
color: var(--color-text-dark);
|
||||
}
|
||||
|
||||
.ui.search > .results .result .description {
|
||||
color: var(--color-text-light-2);
|
||||
}
|
||||
|
||||
.ui.search > .results .result .image {
|
||||
width: auto;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.ui.search > .results .result:hover,
|
||||
.ui.category.search > .results .category .result:hover {
|
||||
background: var(--color-hover);
|
||||
/* ::before and ::after pseudo elements don't work on select elements,
|
||||
so we need to put it on the parent wrapper element. */
|
||||
.native-select::after {
|
||||
position: absolute;
|
||||
pointer-events: none; /* make the click event can pass through the svg to the select element */
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
right: 5px;
|
||||
content: "";
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
mask-size: cover;
|
||||
-webkit-mask-size: cover;
|
||||
mask-image: var(--select-arrows);
|
||||
-webkit-mask-image: var(--select-arrows);
|
||||
background: currentcolor;
|
||||
}
|
||||
|
||||
.empty-placeholder {
|
||||
@@ -367,81 +375,6 @@ a.label,
|
||||
color: var(--color-text-light-2);
|
||||
}
|
||||
|
||||
.ui.dropdown .menu {
|
||||
background: var(--color-menu);
|
||||
border-color: var(--color-secondary);
|
||||
}
|
||||
|
||||
.ui.dropdown .menu > .header {
|
||||
text-transform: none; /* reset fomantic's "uppercase" */
|
||||
}
|
||||
|
||||
.ui.dropdown .menu > .header:not(.ui) {
|
||||
color: var(--color-text);
|
||||
font-size: 0.95em; /* reset fomantic's small font-size */
|
||||
}
|
||||
|
||||
.ui.dropdown .menu > .item {
|
||||
color: var(--color-text);
|
||||
line-height: var(--line-height-default);
|
||||
}
|
||||
|
||||
.ui.dropdown .menu > .item:hover {
|
||||
color: var(--color-text);
|
||||
background: var(--color-hover);
|
||||
}
|
||||
|
||||
.ui.dropdown .menu > .item:active {
|
||||
color: var(--color-text);
|
||||
background: var(--color-active);
|
||||
}
|
||||
|
||||
.ui.dropdown .menu .active.item {
|
||||
color: var(--color-text);
|
||||
background: var(--color-active);
|
||||
border-radius: 0;
|
||||
font-weight: var(--font-weight-normal);
|
||||
}
|
||||
|
||||
/* fix misaligned images in webhook dropdown */
|
||||
.ui.dropdown .menu > .item > img {
|
||||
margin-top: -0.25rem;
|
||||
margin-bottom: -0.25rem;
|
||||
}
|
||||
.ui.dropdown .menu > .item > svg {
|
||||
margin-right: .78rem; /* use the same margin as for <img> */
|
||||
}
|
||||
|
||||
.ui.selection.dropdown .menu > .item {
|
||||
border-color: var(--color-secondary);
|
||||
}
|
||||
|
||||
.ui.selection.visible.dropdown > .text:not(.default) {
|
||||
color: var(--color-text);
|
||||
}
|
||||
|
||||
.ui.dropdown.selected,
|
||||
.ui.dropdown .menu .selected.item {
|
||||
color: var(--color-text);
|
||||
background: var(--color-hover);
|
||||
}
|
||||
|
||||
.ui.dropdown .menu > .message:not(.ui) {
|
||||
color: var(--color-text-light-2);
|
||||
}
|
||||
|
||||
/* extend fomantic style '.ui.dropdown > .text > img' to include svg.img */
|
||||
.ui.dropdown > .text > .img {
|
||||
margin-left: 0;
|
||||
float: none;
|
||||
margin-right: 0.78571429rem;
|
||||
}
|
||||
|
||||
.ui.dropdown > .text > .description,
|
||||
.ui.dropdown .menu > .item > .description {
|
||||
color: var(--color-text-light-2);
|
||||
}
|
||||
|
||||
/* styles from removed fomantic transition module */
|
||||
.hidden.transition {
|
||||
visibility: hidden;
|
||||
@@ -452,36 +385,6 @@ a.label,
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
.ui.selection.active.dropdown,
|
||||
.ui.selection.active.dropdown:hover,
|
||||
.ui.selection.active.dropdown .menu,
|
||||
.ui.selection.active.dropdown:hover .menu {
|
||||
border-color: var(--color-primary);
|
||||
}
|
||||
|
||||
.ui.pointing.dropdown > .menu:not(.hidden)::after {
|
||||
background: var(--color-menu);
|
||||
box-shadow: -1px -1px 0 0 var(--color-secondary);
|
||||
}
|
||||
|
||||
.ui.pointing.upward.dropdown .menu::after,
|
||||
.ui.top.pointing.upward.dropdown .menu::after {
|
||||
box-shadow: 1px 1px 0 0 var(--color-secondary);
|
||||
}
|
||||
|
||||
.ui.comments .comment .text {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.ui.comments .comment .text,
|
||||
.ui.comments .comment .author {
|
||||
color: var(--color-text);
|
||||
}
|
||||
|
||||
.ui.comments .comment a.author:hover {
|
||||
color: var(--color-primary);
|
||||
}
|
||||
|
||||
.ui.comments .comment .metadata {
|
||||
color: var(--color-text-light-2);
|
||||
}
|
||||
@@ -494,12 +397,6 @@ img.ui.avatar,
|
||||
aspect-ratio: 1;
|
||||
}
|
||||
|
||||
.ui.error.message .header,
|
||||
.ui.warning.message .header {
|
||||
color: inherit;
|
||||
filter: saturate(2);
|
||||
}
|
||||
|
||||
.full.height {
|
||||
flex-grow: 1;
|
||||
padding-bottom: var(--page-space-bottom);
|
||||
@@ -534,87 +431,6 @@ img.ui.avatar,
|
||||
margin-top: calc(var(--page-spacing) - 1rem);
|
||||
}
|
||||
|
||||
.text.primary {
|
||||
color: var(--color-primary) !important;
|
||||
}
|
||||
|
||||
.text.red {
|
||||
color: var(--color-red) !important;
|
||||
}
|
||||
|
||||
.text.orange {
|
||||
color: var(--color-orange) !important;
|
||||
}
|
||||
|
||||
.text.yellow {
|
||||
color: var(--color-yellow) !important;
|
||||
}
|
||||
|
||||
.text.green {
|
||||
color: var(--color-green) !important;
|
||||
}
|
||||
|
||||
.text.blue {
|
||||
color: var(--color-blue) !important;
|
||||
}
|
||||
|
||||
.text.purple {
|
||||
color: var(--color-purple) !important;
|
||||
}
|
||||
|
||||
.text.black {
|
||||
color: var(--color-text) !important;
|
||||
}
|
||||
|
||||
.text.grey {
|
||||
color: var(--color-text-light) !important;
|
||||
}
|
||||
|
||||
.text.light {
|
||||
color: var(--color-text-light) !important;
|
||||
}
|
||||
|
||||
.text.light-2 {
|
||||
color: var(--color-text-light-2) !important;
|
||||
}
|
||||
|
||||
.text.light-3 {
|
||||
color: var(--color-text-light-3) !important;
|
||||
}
|
||||
|
||||
.text.light.grey {
|
||||
color: var(--color-grey-light) !important;
|
||||
}
|
||||
|
||||
.text.gold {
|
||||
color: var(--color-gold) !important;
|
||||
}
|
||||
|
||||
.text.small {
|
||||
font-size: 0.75em;
|
||||
}
|
||||
|
||||
/* popover box shadows */
|
||||
.ui.dropdown .menu,
|
||||
.ui.upward.dropdown > .menu,
|
||||
.ui.menu .dropdown.item .menu,
|
||||
.ui.selection.active.dropdown .menu,
|
||||
.ui.upward.selection.dropdown .menu,
|
||||
.ui.selection.active.dropdown:hover .menu,
|
||||
.ui.upward.active.selection.dropdown:hover .menu {
|
||||
box-shadow: 0 6px 18px var(--color-shadow);
|
||||
}
|
||||
.ui.floating.dropdown .menu {
|
||||
box-shadow: 0 6px 18px var(--color-shadow) !important;
|
||||
}
|
||||
|
||||
.ui .text.truncate {
|
||||
overflow-x: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.ui .message.flash-message {
|
||||
text-align: center;
|
||||
}
|
||||
@@ -666,27 +482,11 @@ img.ui.avatar,
|
||||
border: 1px solid;
|
||||
}
|
||||
|
||||
.ui.dropdown .menu.context-user-switch .scrolling.menu {
|
||||
border-radius: 0 !important;
|
||||
box-shadow: none !important;
|
||||
border-bottom: 1px solid var(--color-secondary);
|
||||
max-width: 80vw;
|
||||
}
|
||||
|
||||
.user-menu > .item {
|
||||
width: 100%;
|
||||
border-radius: 0 !important;
|
||||
}
|
||||
|
||||
.scrolling.menu .item.selected {
|
||||
font-weight: var(--font-weight-semibold) !important;
|
||||
}
|
||||
|
||||
.ui.dropdown .scrolling.menu {
|
||||
border-color: var(--color-secondary);
|
||||
border-radius: 0 0 var(--border-radius) var(--border-radius) !important;
|
||||
}
|
||||
|
||||
.color-preview {
|
||||
display: inline-block;
|
||||
margin-left: 0.4em;
|
||||
@@ -700,10 +500,10 @@ img.ui.avatar,
|
||||
}
|
||||
|
||||
blockquote.attention-note {
|
||||
border-left-color: var(--color-blue-dark-1);
|
||||
border-left-color: var(--color-info-text);
|
||||
}
|
||||
strong.attention-note, svg.attention-note {
|
||||
color: var(--color-blue-dark-1);
|
||||
color: var(--color-info-text);
|
||||
}
|
||||
|
||||
blockquote.attention-tip {
|
||||
@@ -714,10 +514,10 @@ strong.attention-tip, svg.attention-tip {
|
||||
}
|
||||
|
||||
blockquote.attention-important {
|
||||
border-left-color: var(--color-violet-dark-1);
|
||||
border-left-color: var(--color-priority-text);
|
||||
}
|
||||
strong.attention-important, svg.attention-important {
|
||||
color: var(--color-violet-dark-1);
|
||||
color: var(--color-priority-text);
|
||||
}
|
||||
|
||||
blockquote.attention-warning {
|
||||
@@ -728,10 +528,10 @@ strong.attention-warning, svg.attention-warning {
|
||||
}
|
||||
|
||||
blockquote.attention-caution {
|
||||
border-left-color: var(--color-red-dark-1);
|
||||
border-left-color: var(--color-error-text);
|
||||
}
|
||||
strong.attention-caution, svg.attention-caution {
|
||||
color: var(--color-red-dark-1);
|
||||
color: var(--color-error-text);
|
||||
}
|
||||
|
||||
/* FIXME: this is a longstanding dirty patch since 2015, it only makes the pages more messy and shouldn't be used */
|
||||
@@ -742,6 +542,58 @@ strong.attention-caution, svg.attention-caution {
|
||||
overflow-menu {
|
||||
border-bottom: 1px solid var(--color-secondary) !important;
|
||||
display: flex;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
overflow-menu .overflow-menu-popup {
|
||||
position: absolute;
|
||||
top: calc(100% + 8px);
|
||||
right: 0;
|
||||
z-index: 100;
|
||||
background-color: var(--color-menu);
|
||||
color: var(--color-text);
|
||||
border: 1px solid var(--color-secondary);
|
||||
border-radius: var(--border-radius);
|
||||
box-shadow: 0 6px 18px var(--color-shadow);
|
||||
padding: 4px 0;
|
||||
}
|
||||
|
||||
overflow-menu .overflow-menu-popup::before,
|
||||
overflow-menu .overflow-menu-popup::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
border: 8px solid transparent;
|
||||
}
|
||||
|
||||
overflow-menu .overflow-menu-popup::before {
|
||||
bottom: 100%;
|
||||
border-bottom-color: var(--color-secondary);
|
||||
}
|
||||
|
||||
overflow-menu .overflow-menu-popup::after {
|
||||
bottom: calc(100% - 1px);
|
||||
border-bottom-color: var(--color-menu);
|
||||
}
|
||||
|
||||
overflow-menu .overflow-menu-popup > .item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 9px 18px !important;
|
||||
color: var(--color-text) !important;
|
||||
background: transparent !important;
|
||||
text-decoration: none;
|
||||
gap: 10px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
overflow-menu .overflow-menu-popup > .item:hover,
|
||||
overflow-menu .overflow-menu-popup > .item:focus {
|
||||
background: var(--color-hover) !important;
|
||||
}
|
||||
|
||||
overflow-menu .overflow-menu-popup > .item.active {
|
||||
background: var(--color-active) !important;
|
||||
}
|
||||
|
||||
overflow-menu .overflow-menu-items {
|
||||
@@ -791,10 +643,6 @@ overflow-menu .ui.label {
|
||||
color: var(--color-primary-contrast);
|
||||
}
|
||||
|
||||
.archived-icon {
|
||||
color: var(--color-secondary-dark-2) !important;
|
||||
}
|
||||
|
||||
.oauth2-authorize-application-box {
|
||||
margin-top: 3em !important;
|
||||
}
|
||||
@@ -818,13 +666,9 @@ overflow-menu .ui.label {
|
||||
min-width: 50px;
|
||||
}
|
||||
|
||||
.lines-num span.bottom-line::after {
|
||||
border-bottom: 1px solid var(--color-secondary);
|
||||
}
|
||||
|
||||
.lines-num span::after {
|
||||
content: attr(data-line-number);
|
||||
line-height: 20px !important;
|
||||
line-height: var(--line-height-code) !important;
|
||||
padding: 0 10px;
|
||||
display: block;
|
||||
}
|
||||
@@ -835,10 +679,11 @@ overflow-menu .ui.label {
|
||||
}
|
||||
|
||||
.lines-num,
|
||||
.lines-escape,
|
||||
.lines-code {
|
||||
font-size: 12px;
|
||||
font-family: var(--fonts-monospace);
|
||||
line-height: 20px;
|
||||
line-height: var(--line-height-code);
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
vertical-align: top;
|
||||
@@ -895,7 +740,7 @@ overflow-menu .ui.label {
|
||||
width: min(26vw, 300px);
|
||||
display: block;
|
||||
padding: 0 0 0 6px;
|
||||
line-height: 20px;
|
||||
line-height: var(--line-height-code);
|
||||
box-sizing: content-box;
|
||||
}
|
||||
|
||||
@@ -919,7 +764,7 @@ overflow-menu .ui.label {
|
||||
.blame-avatar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-right: 4px;
|
||||
margin-right: 6px;
|
||||
}
|
||||
|
||||
tr.top-line-blame {
|
||||
@@ -930,11 +775,6 @@ tr.top-line-blame:first-of-type {
|
||||
border-top: none; /* merge code lines belonging to the same commit into one block */
|
||||
}
|
||||
|
||||
.lines-code .bottom-line,
|
||||
.lines-commit .bottom-line {
|
||||
border-bottom: 1px solid var(--color-secondary);
|
||||
}
|
||||
|
||||
.migrate .svg.gitea-git {
|
||||
color: var(--color-git);
|
||||
}
|
||||
@@ -962,22 +802,6 @@ table th[data-sortt-desc] .svg {
|
||||
margin-left: 0.25rem;
|
||||
}
|
||||
|
||||
.ui.dropdown .menu .item {
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.ui.dropdown .menu .item:first-of-type {
|
||||
border-radius: var(--border-radius) var(--border-radius) 0 0;
|
||||
}
|
||||
|
||||
.ui.dropdown .menu .item:last-of-type {
|
||||
border-radius: 0 0 var(--border-radius) var(--border-radius);
|
||||
}
|
||||
|
||||
.ui.multiple.dropdown > .label {
|
||||
box-shadow: 0 0 0 1px var(--color-secondary) inset;
|
||||
}
|
||||
|
||||
/* for "image" emojis like ":git:" ":gitea:" and ":github:" (see CUSTOM_EMOJIS config option) */
|
||||
.emoji img {
|
||||
border-width: 0 !important;
|
||||
@@ -1026,60 +850,9 @@ table th[data-sortt-desc] .svg {
|
||||
min-height: 0;
|
||||
}
|
||||
|
||||
.ui.dropdown:not(.button) {
|
||||
line-height: var(--line-height-default); /* the dropdown doesn't have default line-height, use this to make the dropdown icon align with plain dropdown */
|
||||
}
|
||||
|
||||
/* dropdown has some kinds of icons:
|
||||
- "> .dropdown.icon": the arrow for opening the dropdown
|
||||
- "> .remove.icon": the "x" icon for clearing the dropdown, only used in selection dropdown
|
||||
- "> .ui.label > .delete.icon": the "x" icon for removing a label item in multiple selection dropdown
|
||||
*/
|
||||
|
||||
.ui.dropdown.mini.button,
|
||||
.ui.dropdown.tiny.button {
|
||||
padding-right: 20px;
|
||||
}
|
||||
.ui.dropdown.button {
|
||||
padding-right: 22px;
|
||||
}
|
||||
.ui.dropdown.large.button {
|
||||
padding-right: 24px;
|
||||
}
|
||||
|
||||
/* Gitea uses SVG images instead of Fomantic builtin "<i>" font icons, so we need to reset the icon styles */
|
||||
.ui.ui.dropdown > .icon.icon {
|
||||
position: initial; /* plain dropdown and button dropdown use flex layout for icons */
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.ui.ui.dropdown > .icon.icon:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.ui.ui.button.dropdown > .icon.icon,
|
||||
.ui.ui.selection.dropdown > .icon.icon {
|
||||
position: absolute; /* selection dropdown uses absolute layout for icons */
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
.ui.ui.dropdown > .dropdown.icon {
|
||||
right: 0.5em;
|
||||
}
|
||||
|
||||
.ui.ui.dropdown > .remove.icon {
|
||||
right: 2em;
|
||||
}
|
||||
|
||||
.btn,
|
||||
.ui.ui.button,
|
||||
.ui.ui.dropdown,
|
||||
.flex-text-inline,
|
||||
.flex-text-inline > a,
|
||||
.flex-text-inline > span {
|
||||
.flex-text-inline {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: var(--gap-inline);
|
||||
@@ -1087,24 +860,13 @@ table th[data-sortt-desc] .svg {
|
||||
min-width: 0; /* make ellipsis work */
|
||||
}
|
||||
|
||||
.ui.multiple.selection.dropdown {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.ui.ui.dropdown.selection {
|
||||
min-width: 14em; /* match the default min width */
|
||||
}
|
||||
|
||||
.ui.dropdown .ui.label .svg {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.ui.ui.labeled.button {
|
||||
gap: 0;
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
.ui.list.flex-items-block > .item,
|
||||
.ui.vertical.menu.flex-items-block > .item,
|
||||
.ui.form .field > label.flex-text-block, /* override fomantic "block" style */
|
||||
.flex-items-block > .item,
|
||||
.flex-text-block {
|
||||
@@ -1114,44 +876,11 @@ table th[data-sortt-desc] .svg {
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.ui.dropdown > .ui.button,
|
||||
.flex-text-block > .ui.button,
|
||||
.flex-text-inline > .ui.button {
|
||||
margin: 0; /* fomantic buttons have default margin, when we use them in a flex container with gap, we do not need these margins */
|
||||
}
|
||||
|
||||
/* to override Fomantic's default display: block for ".menu .item", and use a slightly larger gap for menu item content
|
||||
the "!important" is necessary to override Fomantic UI menu item styles, meanwhile we should keep the "hidden" items still hidden */
|
||||
.ui.dropdown .menu.flex-items-menu > .item:not(.hidden, .filtered, .tw-hidden) {
|
||||
display: flex !important;
|
||||
align-items: center;
|
||||
gap: var(--gap-block);
|
||||
min-width: 0;
|
||||
}
|
||||
.ui.dropdown .menu.flex-items-menu > .item img,
|
||||
.ui.dropdown .menu.flex-items-menu > .item svg {
|
||||
margin: 0; /* use gap, but not margin */
|
||||
}
|
||||
|
||||
.ui.dropdown.ellipsis-text-items {
|
||||
/* reset y padding and use the line-height below instead, to avoid the "overflow: hidden" clips the larger image in the "text" element */
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.ui.dropdown.ellipsis-text-items > .text {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
line-height: 2.71; /* matches fomantic dropdown's default min-height */
|
||||
}
|
||||
|
||||
.ui.dropdown.ellipsis-text-items .menu > .item {
|
||||
white-space: nowrap !important;
|
||||
overflow: hidden !important;
|
||||
text-overflow: ellipsis !important;
|
||||
}
|
||||
|
||||
.svg.octicon-file-directory-fill,
|
||||
.svg.octicon-file-directory-open-fill,
|
||||
.svg.octicon-file-submodule {
|
||||
|
||||
@@ -1,46 +0,0 @@
|
||||
/* LineTableTD */
|
||||
.chroma .lntd {
|
||||
vertical-align: top;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
/* LineTable */
|
||||
.chroma .lntable {
|
||||
border-spacing: 0;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
border: 0;
|
||||
width: auto;
|
||||
overflow: auto;
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* LineHighlight */
|
||||
.chroma .hl {
|
||||
display: block;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* LineNumbersTable */
|
||||
.chroma .lnt {
|
||||
margin-right: 0.4em;
|
||||
padding: 0 0.4em;
|
||||
}
|
||||
|
||||
/* LineNumbers */
|
||||
.chroma .ln {
|
||||
margin-right: 0.4em;
|
||||
padding: 0 0.4em;
|
||||
}
|
||||
|
||||
/* GenericStrong */
|
||||
.chroma .gs {
|
||||
font-weight: var(--font-weight-semibold);
|
||||
}
|
||||
|
||||
/* GenericUnderline */
|
||||
.chroma .gl {
|
||||
text-decoration: underline;
|
||||
}
|
||||
@@ -1,76 +0,0 @@
|
||||
/* https://github.com/alecthomas/chroma/blob/6428fb4e65f3c1493491571c8a6a8f1add1da822/types.go#L208 */
|
||||
.chroma .bp { color: #fabd2f; } /* NameBuiltinPseudo */
|
||||
.chroma .c { color: #777e94; } /* Comment */
|
||||
.chroma .c1 { color: #777e94; } /* CommentSingle */
|
||||
.chroma .ch { color: #777e94; } /* CommentHashbang */
|
||||
.chroma .cm { color: #777e94; } /* CommentMultiline */
|
||||
.chroma .cp { color: #8ec07c; } /* CommentPreproc */
|
||||
.chroma .cpf { color: #649bc4; } /* CommentPreprocFile */
|
||||
.chroma .cs { color: #9075cd; } /* CommentSpecial */
|
||||
.chroma .dl { color: #649bc4; } /* LiteralStringDelimiter */
|
||||
.chroma .fm {} /* NameFunctionMagic */
|
||||
.chroma .g {} /* Generic */
|
||||
.chroma .gd { color: #ffffff; background-color: #5f3737; } /* GenericDeleted */
|
||||
.chroma .ge { color: #ddee30; } /* GenericEmph */
|
||||
.chroma .gh { color: #ffaa10; } /* GenericHeading */
|
||||
.chroma .gi { color: #ffffff; background-color: #3a523a; } /* GenericInserted */
|
||||
.chroma .gl {} /* GenericUnderline */
|
||||
.chroma .go { color: #777e94; } /* GenericOutput */
|
||||
.chroma .gp { color: #ebdbb2; } /* GenericPrompt */
|
||||
.chroma .gr { color: #ff4433; } /* GenericError */
|
||||
.chroma .gs { color: #ebdbb2; } /* GenericStrong */
|
||||
.chroma .gt { color: #ff7540; } /* GenericTraceback */
|
||||
.chroma .gu { color: #b8bb26; } /* GenericSubheading */
|
||||
.chroma .il { color: #649bc4; } /* LiteralNumberIntegerLong */
|
||||
.chroma .k { color: #ff7540; } /* Keyword */
|
||||
.chroma .kc { color: #649bc4; } /* KeywordConstant */
|
||||
.chroma .kd { color: #ff7540; } /* KeywordDeclaration */
|
||||
.chroma .kn { color: #ffaa10; } /* KeywordNamespace */
|
||||
.chroma .kp { color: #5f8700; } /* KeywordPseudo */
|
||||
.chroma .kr { color: #ff7540; } /* KeywordReserved */
|
||||
.chroma .kt { color: #ff7b72; } /* KeywordType */
|
||||
.chroma .l {} /* Literal */
|
||||
.chroma .ld {} /* LiteralDate */
|
||||
.chroma .m { color: #649bc4; } /* LiteralNumber */
|
||||
.chroma .mb { color: #649bc4; } /* LiteralNumberBin */
|
||||
.chroma .mf { color: #649bc4; } /* LiteralNumberFloat */
|
||||
.chroma .mh { color: #649bc4; } /* LiteralNumberHex */
|
||||
.chroma .mi { color: #649bc4; } /* LiteralNumberInteger */
|
||||
.chroma .mo { color: #649bc4; } /* LiteralNumberOct */
|
||||
.chroma .n { color: #c9d1d9; } /* Name */
|
||||
.chroma .na { color: #fabd2f; } /* NameAttribute */
|
||||
.chroma .nb { color: #fabd2f; } /* NameBuiltin */
|
||||
.chroma .nc { color: #ffaa10; } /* NameClass */
|
||||
.chroma .nd { color: #8ec07c; } /* NameDecorator */
|
||||
.chroma .ne { color: #ff7540; } /* NameException */
|
||||
.chroma .nf { color: #fabd2f; } /* NameFunction */
|
||||
.chroma .ni { color: #fabd2f; } /* NameEntity */
|
||||
.chroma .nl { color: #ff7540; } /* NameLabel */
|
||||
.chroma .nn { color: #c9d1d9; } /* NameNamespace */
|
||||
.chroma .no { color: #649bc4; } /* NameConstant */
|
||||
.chroma .nt { color: #ff7540; } /* NameTag */
|
||||
.chroma .nv { color: #ebdbb2; } /* NameVariable */
|
||||
.chroma .nx { color: #b6bac5; } /* NameOther */
|
||||
.chroma .o { color: #ff7540; } /* Operator */
|
||||
.chroma .ow { color: #5f8700; } /* OperatorWord */
|
||||
.chroma .p { color: #d2d4db; } /* Punctuation */
|
||||
.chroma .py {} /* NameProperty */
|
||||
.chroma .s { color: #b8bb26; } /* LiteralString */
|
||||
.chroma .s1 { color: #b8bb26; } /* LiteralStringSingle */
|
||||
.chroma .s2 { color: #b8bb26; } /* LiteralStringDouble */
|
||||
.chroma .sa { color: #ffaa10; } /* LiteralStringAffix */
|
||||
.chroma .sb { color: #b8bb26; } /* LiteralStringBacktick */
|
||||
.chroma .sc { color: #ffaa10; } /* LiteralStringChar */
|
||||
.chroma .sd { color: #b8bb26; } /* LiteralStringDoc */
|
||||
.chroma .se { color: #ff8540; } /* LiteralStringEscape */
|
||||
.chroma .sh { color: #b8bb26; } /* LiteralStringHeredoc */
|
||||
.chroma .si { color: #ffaa10; } /* LiteralStringInterpol */
|
||||
.chroma .sr { color: #9075cd; } /* LiteralStringRegex */
|
||||
.chroma .ss { color: #ff8540; } /* LiteralStringSymbol */
|
||||
.chroma .sx { color: #ffaa10; } /* LiteralStringOther */
|
||||
.chroma .vc { color: #649bee; } /* NameVariableClass */
|
||||
.chroma .vg { color: #649bee; } /* NameVariableGlobal */
|
||||
.chroma .vi { color: #649bee; } /* NameVariableInstance */
|
||||
.chroma .vm {} /* NameVariableMagic */
|
||||
.chroma .w { color: #7f8699; } /* TextWhitespace */
|
||||
.chroma .err {/* not styled because Chroma uses it on too many things like JSX */} /* Error */
|
||||
@@ -1,76 +0,0 @@
|
||||
/* https://github.com/alecthomas/chroma/blob/6428fb4e65f3c1493491571c8a6a8f1add1da822/types.go#L208 */
|
||||
.chroma .bp { color: #999999; } /* NameBuiltinPseudo */
|
||||
.chroma .c { color: #6a737d; } /* Comment */
|
||||
.chroma .c1 { color: #6a737d; } /* CommentSingle */
|
||||
.chroma .ch { color: #6a737d; } /* CommentHashbang */
|
||||
.chroma .cm { color: #999988; } /* CommentMultiline */
|
||||
.chroma .cp { color: #109295; } /* CommentPreproc */
|
||||
.chroma .cpf { color: #4c4dbc; } /* CommentPreprocFile */
|
||||
.chroma .cs { color: #999999; } /* CommentSpecial */
|
||||
.chroma .dl { color: #106303; } /* LiteralStringDelimiter */
|
||||
.chroma .fm {} /* NameFunctionMagic */
|
||||
.chroma .g {} /* Generic */
|
||||
.chroma .gd { color: #000000; background-color: #ffdddd; } /* GenericDeleted */
|
||||
.chroma .ge { color: #000000; } /* GenericEmph */
|
||||
.chroma .gh { color: #999999; } /* GenericHeading */
|
||||
.chroma .gi { color: #000000; background-color: #ddffdd; } /* GenericInserted */
|
||||
.chroma .gl {} /* GenericUnderline */
|
||||
.chroma .go { color: #888888; } /* GenericOutput */
|
||||
.chroma .gp { color: #555555; } /* GenericPrompt */
|
||||
.chroma .gr { color: #aa0000; } /* GenericError */
|
||||
.chroma .gs {} /* GenericStrong */
|
||||
.chroma .gt { color: #aa0000; } /* GenericTraceback */
|
||||
.chroma .gu { color: #aaaaaa; } /* GenericSubheading */
|
||||
.chroma .il { color: #009999; } /* LiteralNumberIntegerLong */
|
||||
.chroma .k { color: #d73a49; } /* Keyword */
|
||||
.chroma .kc { color: #d73a49; } /* KeywordConstant */
|
||||
.chroma .kd { color: #d73a49; } /* KeywordDeclaration */
|
||||
.chroma .kn { color: #d73a49; } /* KeywordNamespace */
|
||||
.chroma .kp { color: #d73a49; } /* KeywordPseudo */
|
||||
.chroma .kr { color: #d73a49; } /* KeywordReserved */
|
||||
.chroma .kt { color: #445588; } /* KeywordType */
|
||||
.chroma .l {} /* Literal */
|
||||
.chroma .ld {} /* LiteralDate */
|
||||
.chroma .m { color: #009999; } /* LiteralNumber */
|
||||
.chroma .mb { color: #009999; } /* LiteralNumberBin */
|
||||
.chroma .mf { color: #009999; } /* LiteralNumberFloat */
|
||||
.chroma .mh { color: #009999; } /* LiteralNumberHex */
|
||||
.chroma .mi { color: #009999; } /* LiteralNumberInteger */
|
||||
.chroma .mo { color: #009999; } /* LiteralNumberOct */
|
||||
.chroma .n {} /* Name */
|
||||
.chroma .na { color: #d73a49; } /* NameAttribute */
|
||||
.chroma .nb { color: #005cc5; } /* NameBuiltin */
|
||||
.chroma .nc { color: #445588; } /* NameClass */
|
||||
.chroma .nd { color: #3c5d5d; } /* NameDecorator */
|
||||
.chroma .ne { color: #990000; } /* NameException */
|
||||
.chroma .nf { color: #005cc5; } /* NameFunction */
|
||||
.chroma .ni { color: #6f42c1; } /* NameEntity */
|
||||
.chroma .nl { color: #990000; } /* NameLabel */
|
||||
.chroma .nn { color: #555555; } /* NameNamespace */
|
||||
.chroma .no { color: #008080; } /* NameConstant */
|
||||
.chroma .nt { color: #22863a; } /* NameTag */
|
||||
.chroma .nv { color: #008080; } /* NameVariable */
|
||||
.chroma .nx { color: #24292e; } /* NameOther */
|
||||
.chroma .o { color: #d73a49; } /* Operator */
|
||||
.chroma .ow { color: #d73a49; } /* OperatorWord */
|
||||
.chroma .p {} /* Punctuation */
|
||||
.chroma .py {} /* NameProperty */
|
||||
.chroma .s { color: #106303; } /* LiteralString */
|
||||
.chroma .s1 { color: #106303; } /* LiteralStringSingle */
|
||||
.chroma .s2 { color: #106303; } /* LiteralStringDouble */
|
||||
.chroma .sa { color: #cc7a00; } /* LiteralStringAffix */
|
||||
.chroma .sb { color: #106303; } /* LiteralStringBacktick */
|
||||
.chroma .sc { color: #cc7a00; } /* LiteralStringChar */
|
||||
.chroma .sd { color: #106303; } /* LiteralStringDoc */
|
||||
.chroma .se { color: #994400; } /* LiteralStringEscape */
|
||||
.chroma .sh { color: #106303; } /* LiteralStringHeredoc */
|
||||
.chroma .si { color: #cc7a00; } /* LiteralStringInterpol */
|
||||
.chroma .sr { color: #4c4dbc; } /* LiteralStringRegex */
|
||||
.chroma .ss { color: #994400; } /* LiteralStringSymbol */
|
||||
.chroma .sx { color: #106303; } /* LiteralStringOther */
|
||||
.chroma .vc { color: #008080; } /* NameVariableClass */
|
||||
.chroma .vg { color: #008080; } /* NameVariableGlobal */
|
||||
.chroma .vi { color: #008080; } /* NameVariableInstance */
|
||||
.chroma .vm {} /* NameVariableMagic */
|
||||
.chroma .w { color: #bbbbbb; } /* TextWhitespace */
|
||||
.chroma .err {/* not styled because Chroma uses it on too many things like JSX */} /* Error */
|
||||
@@ -1,49 +0,0 @@
|
||||
.ui .field:not(:last-child) .EasyMDEContainer .editor-statusbar {
|
||||
margin-bottom: -1em; /* when there is a statusbar, the "margin-bottom: 1em" of the "field" is not needed, because the statusbar is likely a blank line */
|
||||
}
|
||||
|
||||
.EasyMDEContainer .CodeMirror {
|
||||
color: var(--color-input-text);
|
||||
background-color: var(--color-input-background);
|
||||
border-color: var(--color-secondary);
|
||||
font: 14px var(--fonts-monospace);
|
||||
}
|
||||
|
||||
.EasyMDEContainer .CodeMirror.cm-s-default {
|
||||
border-radius: var(--border-radius);
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .CodeMirror.CodeMirror-fullscreen.CodeMirror-focused {
|
||||
border-right: 1px solid var(--color-primary) !important;
|
||||
}
|
||||
|
||||
.CodeMirror-cursor {
|
||||
border-color: var(--color-caret) !important;
|
||||
}
|
||||
|
||||
.CodeMirror .cm-comment {
|
||||
background: inherit !important;
|
||||
}
|
||||
|
||||
.CodeMirror .CodeMirror-code {
|
||||
font: 14px var(--fonts-monospace);
|
||||
}
|
||||
|
||||
.CodeMirror-selected {
|
||||
background: var(--color-primary-light-1) !important;
|
||||
color: var(--color-white) !important;
|
||||
}
|
||||
|
||||
.CodeMirror-placeholder {
|
||||
color: var(--color-placeholder-text) !important;
|
||||
opacity: 1 !important;
|
||||
}
|
||||
|
||||
.CodeMirror-focused {
|
||||
border-color: var(--color-primary) !important;
|
||||
}
|
||||
|
||||
.CodeMirror :focus {
|
||||
outline: none;
|
||||
}
|
||||
@@ -1,106 +0,0 @@
|
||||
.CodeMirror.cm-s-default .cm-property,
|
||||
.CodeMirror.cm-s-paper .cm-property {
|
||||
color: #a0cc75;
|
||||
}
|
||||
|
||||
.CodeMirror.cm-s-default .cm-header,
|
||||
.CodeMirror.cm-s-paper .cm-header {
|
||||
color: #9daccc;
|
||||
}
|
||||
|
||||
.CodeMirror.cm-s-default .cm-quote,
|
||||
.CodeMirror.cm-s-paper .cm-quote {
|
||||
color: #009900;
|
||||
}
|
||||
|
||||
.CodeMirror.cm-s-default .cm-keyword,
|
||||
.CodeMirror.cm-s-paper .cm-keyword {
|
||||
color: #cc8a61;
|
||||
}
|
||||
|
||||
.CodeMirror.cm-s-default .cm-atom,
|
||||
.CodeMirror.cm-s-paper .cm-atom {
|
||||
color: #ef5e77;
|
||||
}
|
||||
|
||||
.CodeMirror.cm-s-default .cm-number,
|
||||
.CodeMirror.cm-s-paper .cm-number {
|
||||
color: #ff5656;
|
||||
}
|
||||
|
||||
.CodeMirror.cm-s-default .cm-def,
|
||||
.CodeMirror.cm-s-paper .cm-def {
|
||||
color: #e4e4e4;
|
||||
}
|
||||
|
||||
.CodeMirror.cm-s-default .cm-variable-2,
|
||||
.CodeMirror.cm-s-paper .cm-variable-2 {
|
||||
color: #00bdbf;
|
||||
}
|
||||
|
||||
.CodeMirror.cm-s-default .cm-variable-3,
|
||||
.CodeMirror.cm-s-paper .cm-variable-3 {
|
||||
color: #008855;
|
||||
}
|
||||
|
||||
.CodeMirror.cm-s-default .cm-comment,
|
||||
.CodeMirror.cm-s-paper .cm-comment {
|
||||
color: #8e9ab3;
|
||||
}
|
||||
|
||||
.CodeMirror.cm-s-default .cm-string,
|
||||
.CodeMirror.cm-s-paper .cm-string {
|
||||
color: #a77272;
|
||||
}
|
||||
|
||||
.CodeMirror.cm-s-default .cm-string-2,
|
||||
.CodeMirror.cm-s-paper .cm-string-2 {
|
||||
color: #ff5500;
|
||||
}
|
||||
|
||||
.CodeMirror.cm-s-default .cm-meta,
|
||||
.CodeMirror.cm-s-paper .cm-meta,
|
||||
.CodeMirror.cm-s-default .cm-qualifier,
|
||||
.CodeMirror.cm-s-paper .cm-qualifier {
|
||||
color: #ffb176;
|
||||
}
|
||||
|
||||
.CodeMirror.cm-s-default .cm-builtin,
|
||||
.CodeMirror.cm-s-paper .cm-builtin {
|
||||
color: #b7c951;
|
||||
}
|
||||
|
||||
.CodeMirror.cm-s-default .cm-bracket,
|
||||
.CodeMirror.cm-s-paper .cm-bracket {
|
||||
color: #999977;
|
||||
}
|
||||
|
||||
.CodeMirror.cm-s-default .cm-tag,
|
||||
.CodeMirror.cm-s-paper .cm-tag {
|
||||
color: #f1d273;
|
||||
}
|
||||
|
||||
.CodeMirror.cm-s-default .cm-attribute,
|
||||
.CodeMirror.cm-s-paper .cm-attribute {
|
||||
color: #bfcc70;
|
||||
}
|
||||
|
||||
.CodeMirror.cm-s-default .cm-hr,
|
||||
.CodeMirror.cm-s-paper .cm-hr {
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.CodeMirror.cm-s-default .cm-url,
|
||||
.CodeMirror.cm-s-paper .cm-url {
|
||||
color: #c5cfd0;
|
||||
}
|
||||
|
||||
.CodeMirror.cm-s-default .cm-link,
|
||||
.CodeMirror.cm-s-paper .cm-link {
|
||||
color: #d8c792;
|
||||
}
|
||||
|
||||
.CodeMirror.cm-s-default .cm-error,
|
||||
.CodeMirror.cm-s-paper .cm-error {
|
||||
color: #dbdbeb;
|
||||
}
|
||||
@@ -1 +0,0 @@
|
||||
/* Placeholder, there is no light theme, it uses CM defaults */
|
||||
@@ -22,11 +22,6 @@
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.dashboard.feeds .filter.menu .item .text.truncate,
|
||||
.dashboard.issues .filter.menu .item .text.truncate {
|
||||
width: 75%;
|
||||
}
|
||||
|
||||
/* Sort */
|
||||
.dashboard.feeds .filter.menu .jump.item,
|
||||
.dashboard.issues .filter.menu .jump.item {
|
||||
|
||||
@@ -0,0 +1,465 @@
|
||||
/* Inlined styles from easymde.min.css (includes EasyMDE and CodeMirror base) */
|
||||
.EasyMDEContainer {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* CodeMirror base layout (from codemirror.css) */
|
||||
.EasyMDEContainer .CodeMirror {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
box-sizing: border-box;
|
||||
height: auto;
|
||||
border: 1px solid var(--color-input-border);
|
||||
border-bottom-left-radius: var(--border-radius);
|
||||
border-bottom-right-radius: var(--border-radius);
|
||||
padding: 10px;
|
||||
font: 14px var(--fonts-monospace);
|
||||
z-index: 0;
|
||||
overflow-wrap: break-word;
|
||||
color: var(--color-input-text);
|
||||
background-color: var(--color-input-background);
|
||||
direction: ltr;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .CodeMirror.cm-s-default {
|
||||
border-radius: var(--border-radius);
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .CodeMirror-lines {
|
||||
padding: 4px 0;
|
||||
cursor: text;
|
||||
min-height: 1px;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .CodeMirror pre.CodeMirror-line,
|
||||
.EasyMDEContainer .CodeMirror pre.CodeMirror-line-like {
|
||||
padding: 0 4px;
|
||||
border-radius: 0;
|
||||
border-width: 0;
|
||||
background: transparent;
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
margin: 0;
|
||||
white-space: pre;
|
||||
overflow-wrap: normal;
|
||||
line-height: inherit;
|
||||
color: inherit;
|
||||
z-index: 2;
|
||||
position: relative;
|
||||
overflow: visible;
|
||||
font-variant-ligatures: contextual;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .CodeMirror-wrap pre.CodeMirror-line,
|
||||
.EasyMDEContainer .CodeMirror-wrap pre.CodeMirror-line-like {
|
||||
overflow-wrap: break-word;
|
||||
white-space: pre-wrap;
|
||||
word-break: normal;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .CodeMirror-scroll {
|
||||
overflow: scroll !important; /* things will break if this is overridden */
|
||||
margin-bottom: -50px;
|
||||
margin-right: -50px;
|
||||
padding-bottom: 50px;
|
||||
height: 100%;
|
||||
outline: none;
|
||||
position: relative;
|
||||
z-index: 0;
|
||||
cursor: text;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .CodeMirror-sizer {
|
||||
position: relative;
|
||||
border-right: 50px solid transparent;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .CodeMirror-vscrollbar,
|
||||
.EasyMDEContainer .CodeMirror-hscrollbar,
|
||||
.EasyMDEContainer .CodeMirror-scrollbar-filler,
|
||||
.EasyMDEContainer .CodeMirror-gutter-filler {
|
||||
position: absolute;
|
||||
z-index: 6;
|
||||
display: none;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .CodeMirror-vscrollbar {
|
||||
right: 0;
|
||||
top: 0;
|
||||
overflow-x: hidden;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .CodeMirror-hscrollbar {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
overflow-y: hidden;
|
||||
overflow-x: scroll;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .CodeMirror-scrollbar-filler {
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
/* Cursor */
|
||||
.EasyMDEContainer .CodeMirror-cursor {
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
border-left: 1px solid var(--color-caret);
|
||||
border-right: none;
|
||||
width: 0;
|
||||
}
|
||||
|
||||
.EasyMDEContainer div.CodeMirror-cursors {
|
||||
visibility: hidden;
|
||||
position: relative;
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
.EasyMDEContainer div.CodeMirror-dragcursors {
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .CodeMirror-focused div.CodeMirror-cursors {
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
/* Selection */
|
||||
.EasyMDEContainer .CodeMirror-selected {
|
||||
background: var(--color-primary-light-1);
|
||||
}
|
||||
|
||||
.EasyMDEContainer .CodeMirror-focused .CodeMirror-selected {
|
||||
background: var(--color-primary-light-1);
|
||||
}
|
||||
|
||||
.EasyMDEContainer .CodeMirror-line::selection,
|
||||
.EasyMDEContainer .CodeMirror-line > span::selection,
|
||||
.EasyMDEContainer .CodeMirror-line > span > span::selection {
|
||||
background: var(--color-primary-light-1);
|
||||
}
|
||||
|
||||
/* Misc */
|
||||
.EasyMDEContainer .cm-tab {
|
||||
display: inline-block;
|
||||
text-decoration: inherit;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .CodeMirror-rtl pre {
|
||||
direction: rtl;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .CodeMirror-code {
|
||||
font: 14px var(--fonts-monospace);
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .CodeMirror-scroll,
|
||||
.EasyMDEContainer .CodeMirror-sizer {
|
||||
box-sizing: content-box;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .CodeMirror-measure {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 0;
|
||||
overflow: hidden;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .CodeMirror-measure pre {
|
||||
position: static;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .CodeMirror-composing {
|
||||
border-bottom: 2px solid;
|
||||
}
|
||||
|
||||
.EasyMDEContainer span.CodeMirror-selectedtext {
|
||||
background: none;
|
||||
}
|
||||
|
||||
@media print {
|
||||
.EasyMDEContainer .CodeMirror div.CodeMirror-cursors {
|
||||
visibility: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
/* Default theme overrides */
|
||||
.EasyMDEContainer .cm-header,
|
||||
.EasyMDEContainer .cm-strong {
|
||||
font-weight: var(--font-weight-bold);
|
||||
}
|
||||
|
||||
.EasyMDEContainer .cm-em {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .cm-link {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .cm-strikethrough {
|
||||
text-decoration: line-through;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .cm-comment {
|
||||
background: inherit;
|
||||
}
|
||||
|
||||
/* Placeholder */
|
||||
.EasyMDEContainer .CodeMirror-placeholder {
|
||||
color: var(--color-placeholder-text);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* Focus */
|
||||
.EasyMDEContainer .CodeMirror-focused {
|
||||
border-color: var(--color-primary);
|
||||
}
|
||||
|
||||
.EasyMDEContainer .CodeMirror :focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
/* Fullscreen */
|
||||
.EasyMDEContainer .CodeMirror-fullscreen {
|
||||
background: var(--color-body);
|
||||
position: fixed;
|
||||
inset: 50px 0 0;
|
||||
height: auto;
|
||||
z-index: 8;
|
||||
border-right: none;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .CodeMirror-fullscreen.CodeMirror-focused {
|
||||
border-right: 1px solid var(--color-primary);
|
||||
}
|
||||
|
||||
/* Statusbar */
|
||||
.ui .field:not(:last-child) .EasyMDEContainer .editor-statusbar {
|
||||
margin-bottom: -1em; /* when there is a statusbar, the "margin-bottom: 1em" of the "field" is not needed, because the statusbar is likely a blank line */
|
||||
}
|
||||
|
||||
/* Toolbar */
|
||||
.EasyMDEContainer .editor-toolbar {
|
||||
position: relative;
|
||||
user-select: none;
|
||||
padding: 9px 10px;
|
||||
border-top: 1px solid var(--color-input-border);
|
||||
border-left: 1px solid var(--color-input-border);
|
||||
border-right: 1px solid var(--color-input-border);
|
||||
border-top-left-radius: var(--border-radius);
|
||||
border-top-right-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
.EasyMDEContainer .editor-toolbar.fullscreen {
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
box-sizing: border-box;
|
||||
background: var(--color-body);
|
||||
border: 0;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
opacity: 1;
|
||||
z-index: 9;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .editor-toolbar button {
|
||||
background: transparent;
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
height: 30px;
|
||||
margin: 0;
|
||||
padding: 0 6px;
|
||||
border: none;
|
||||
border-radius: 3px;
|
||||
cursor: pointer;
|
||||
font-weight: var(--font-weight-bold);
|
||||
min-width: 30px;
|
||||
white-space: nowrap;
|
||||
color: var(--color-text-light);
|
||||
}
|
||||
|
||||
.EasyMDEContainer .editor-toolbar button:not(:hover) {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .editor-toolbar button:hover {
|
||||
background: var(--color-hover);
|
||||
}
|
||||
|
||||
.EasyMDEContainer .editor-toolbar button.active {
|
||||
background: var(--color-active);
|
||||
}
|
||||
|
||||
.EasyMDEContainer .editor-toolbar i.separator {
|
||||
display: inline-block;
|
||||
width: 0;
|
||||
border-left: none;
|
||||
border-right: 1px solid var(--color-input-border);
|
||||
color: transparent;
|
||||
text-indent: -10px;
|
||||
margin: 0 6px;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .editor-toolbar button::after {
|
||||
font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
|
||||
font-size: 65%;
|
||||
vertical-align: text-bottom;
|
||||
position: relative;
|
||||
top: 2px;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .editor-toolbar button.heading-1::after {
|
||||
content: "1";
|
||||
}
|
||||
|
||||
.EasyMDEContainer .editor-toolbar button.heading-2::after {
|
||||
content: "2";
|
||||
}
|
||||
|
||||
.EasyMDEContainer .editor-toolbar button.heading-3::after {
|
||||
content: "3";
|
||||
}
|
||||
|
||||
.EasyMDEContainer .editor-toolbar button.heading-bigger::after {
|
||||
content: "\25B2";
|
||||
}
|
||||
|
||||
.EasyMDEContainer .editor-toolbar button.heading-smaller::after {
|
||||
content: "\25BC";
|
||||
}
|
||||
|
||||
.EasyMDEContainer .editor-toolbar.disabled-for-preview button:not(.no-disable) {
|
||||
opacity: 0.6;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
/* hide preview button, we have the preview tab for this */
|
||||
.EasyMDEContainer .editor-toolbar:not(.fullscreen) .preview {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* hide revert button in fullscreen, it breaks the page */
|
||||
.EasyMDEContainer .editor-toolbar.fullscreen .revert-to-textarea {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 700px) {
|
||||
.EasyMDEContainer .editor-toolbar i.no-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* Statusbar */
|
||||
.EasyMDEContainer .editor-statusbar {
|
||||
padding: 8px 10px;
|
||||
font-size: 12px;
|
||||
color: var(--color-text-light);
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .editor-statusbar span {
|
||||
display: inline-block;
|
||||
min-width: 4em;
|
||||
margin-left: 1em;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .editor-statusbar .lines::before {
|
||||
content: "lines: ";
|
||||
}
|
||||
|
||||
.EasyMDEContainer .editor-statusbar .words::before {
|
||||
content: "words: ";
|
||||
}
|
||||
|
||||
.EasyMDEContainer .editor-statusbar .characters::before {
|
||||
content: "characters: ";
|
||||
}
|
||||
|
||||
/* Preview */
|
||||
.EasyMDEContainer .editor-preview-full {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 7;
|
||||
overflow: auto;
|
||||
display: none;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .editor-preview-side {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
width: 50%;
|
||||
top: 50px;
|
||||
right: 0;
|
||||
z-index: 9;
|
||||
overflow: auto;
|
||||
display: none;
|
||||
box-sizing: border-box;
|
||||
border: 1px solid var(--color-secondary);
|
||||
overflow-wrap: break-word;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .editor-preview-active-side {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .editor-preview-active {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .editor-preview {
|
||||
padding: 10px;
|
||||
background-color: var(--color-body);
|
||||
}
|
||||
|
||||
.EasyMDEContainer .editor-preview > p {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .editor-preview pre {
|
||||
background: var(--color-markup-code-block);
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .editor-preview table td,
|
||||
.EasyMDEContainer .editor-preview table th {
|
||||
border: 1px solid var(--color-secondary);
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.EasyMDEContainer .CodeMirror .cm-keyword { color: var(--color-syntax-keyword); }
|
||||
.EasyMDEContainer .CodeMirror .cm-atom { color: var(--color-syntax-keyword); }
|
||||
.EasyMDEContainer .CodeMirror .cm-number { color: var(--color-syntax-number); }
|
||||
.EasyMDEContainer .CodeMirror .cm-def { color: var(--color-syntax-name); }
|
||||
.EasyMDEContainer .CodeMirror .cm-variable-2 { color: var(--color-syntax-name); }
|
||||
.EasyMDEContainer .CodeMirror .cm-variable-3 { color: var(--color-syntax-type); }
|
||||
.EasyMDEContainer .CodeMirror .cm-property { color: var(--color-syntax-name); }
|
||||
.EasyMDEContainer .CodeMirror .cm-comment { color: var(--color-syntax-comment); }
|
||||
.EasyMDEContainer .CodeMirror .cm-string { color: var(--color-syntax-string); }
|
||||
.EasyMDEContainer .CodeMirror .cm-string-2 { color: var(--color-syntax-regexp); }
|
||||
.EasyMDEContainer .CodeMirror .cm-meta { color: var(--color-syntax-control); }
|
||||
.EasyMDEContainer .CodeMirror .cm-qualifier { color: var(--color-syntax-control); }
|
||||
.EasyMDEContainer .CodeMirror .cm-builtin { color: var(--color-syntax-keyword); }
|
||||
.EasyMDEContainer .CodeMirror .cm-bracket { color: var(--color-syntax-operator); }
|
||||
.EasyMDEContainer .CodeMirror .cm-tag { color: var(--color-syntax-type); }
|
||||
.EasyMDEContainer .CodeMirror .cm-attribute { color: var(--color-syntax-name); }
|
||||
.EasyMDEContainer .CodeMirror .cm-header { color: var(--color-syntax-type); }
|
||||
.EasyMDEContainer .CodeMirror .cm-quote { color: var(--color-syntax-comment); }
|
||||
.EasyMDEContainer .CodeMirror .cm-hr { color: var(--color-syntax-operator); }
|
||||
.EasyMDEContainer .CodeMirror .cm-url { color: var(--color-syntax-link); }
|
||||
.EasyMDEContainer .CodeMirror .cm-link { color: var(--color-syntax-link); }
|
||||
.EasyMDEContainer .CodeMirror .cm-error { color: var(--color-syntax-invalid); }
|
||||
@@ -1,76 +0,0 @@
|
||||
.repository.file.editor .tab[data-tab="write"] {
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
.repository.file.editor .tab[data-tab="write"] .editor-toolbar {
|
||||
border: 0 !important;
|
||||
}
|
||||
|
||||
.repository.file.editor .tab[data-tab="write"] .CodeMirror {
|
||||
border-left: 0;
|
||||
border-right: 0;
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
.repo-editor-header {
|
||||
display: flex;
|
||||
margin: 1rem 0;
|
||||
padding: 3px 0;
|
||||
}
|
||||
|
||||
.editor-toolbar {
|
||||
border-color: var(--color-secondary);
|
||||
}
|
||||
|
||||
.editor-toolbar.fullscreen {
|
||||
background: var(--color-body);
|
||||
}
|
||||
|
||||
.editor-toolbar button {
|
||||
border: none !important;
|
||||
color: var(--color-text-light);
|
||||
}
|
||||
|
||||
.editor-toolbar button:not(:hover) {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
.editor-toolbar i.separator {
|
||||
border-left: none;
|
||||
border-right-color: var(--color-secondary);
|
||||
}
|
||||
|
||||
.editor-toolbar button:hover {
|
||||
background: var(--color-hover);
|
||||
}
|
||||
|
||||
.editor-toolbar button.active {
|
||||
background: var(--color-active);
|
||||
}
|
||||
|
||||
/* hide preview button, we have the preview tab for this */
|
||||
.editor-toolbar:not(.fullscreen) .preview {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* hide revert button in fullscreen, it breaks the page */
|
||||
.editor-toolbar.fullscreen .revert-to-textarea {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.editor-preview {
|
||||
background-color: var(--color-body);
|
||||
}
|
||||
|
||||
.editor-preview-side {
|
||||
border-color: var(--color-secondary);
|
||||
}
|
||||
|
||||
.editor-statusbar {
|
||||
color: var(--color-text-light);
|
||||
}
|
||||
|
||||
.editor-loading {
|
||||
padding: 1rem;
|
||||
text-align: center;
|
||||
}
|
||||
@@ -0,0 +1,33 @@
|
||||
.m-captcha-style {
|
||||
width: 100%;
|
||||
height: 5em;
|
||||
vertical-align: middle;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.g-recaptcha-style,
|
||||
.h-captcha-style {
|
||||
margin: 0 auto !important;
|
||||
width: 304px;
|
||||
padding-left: 30px;
|
||||
}
|
||||
.g-recaptcha-style iframe,
|
||||
.h-captcha-style iframe {
|
||||
border-radius: var(--border-radius) !important;
|
||||
width: 302px !important;
|
||||
height: 76px !important;
|
||||
}
|
||||
.m-captcha-style {
|
||||
max-width: 450px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-height: 575px) {
|
||||
#rc-imageselect, /* google recaptcha */
|
||||
.g-recaptcha-style,
|
||||
.h-captcha-style {
|
||||
transform: scale(0.77);
|
||||
transform-origin: 0 0;
|
||||
}
|
||||
}
|
||||
@@ -1,42 +0,0 @@
|
||||
.monaco-editor-container,
|
||||
.editor-loading.is-loading {
|
||||
width: 100%;
|
||||
min-height: 200px;
|
||||
height: 90vh;
|
||||
}
|
||||
|
||||
.edit.githook .monaco-editor-container {
|
||||
border: 1px solid var(--color-secondary);
|
||||
height: 70vh;
|
||||
}
|
||||
|
||||
/* overwrite conflicting styles from fomantic */
|
||||
.monaco-editor-container .inputarea {
|
||||
min-height: 0 !important;
|
||||
margin: 0 !important;
|
||||
padding: 0 !important;
|
||||
resize: none !important;
|
||||
border: none !important;
|
||||
color: transparent !important;
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
.monaco-editor,
|
||||
.monaco-editor .overflow-guard {
|
||||
border-radius: 0 0 var(--border-radius) var(--border-radius);
|
||||
}
|
||||
|
||||
/* fomantic styles destroy this element only visible on IOS, restore it */
|
||||
.monaco-editor .iPadShowKeyboard {
|
||||
border: none !important;
|
||||
width: 58px !important;
|
||||
min-width: 0 !important;
|
||||
height: 36px !important;
|
||||
min-height: 0 !important;
|
||||
margin: 0 !important;
|
||||
padding: 0 !important;
|
||||
position: absolute !important;
|
||||
resize: none !important;
|
||||
overflow: hidden !important;
|
||||
border-radius: var(--border-radius-medium) !important;
|
||||
}
|
||||
@@ -46,10 +46,6 @@
|
||||
height: 20px;
|
||||
}
|
||||
|
||||
#git-graph-container li .author {
|
||||
color: var(--color-text-light);
|
||||
}
|
||||
|
||||
#git-graph-container li .time {
|
||||
color: var(--color-text-light-3);
|
||||
font-size: 80%;
|
||||
|
||||
@@ -1,312 +0,0 @@
|
||||
.ui .form .autofill-dummy {
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
overflow: hidden;
|
||||
z-index: -10000;
|
||||
}
|
||||
|
||||
.ui .form .sub.field {
|
||||
margin-left: 25px;
|
||||
}
|
||||
|
||||
.ui.form .fields.error .field textarea,
|
||||
.ui.form .fields.error .field select,
|
||||
.ui.form .fields.error .field input:not([type]),
|
||||
.ui.form .fields.error .field input[type="date"],
|
||||
.ui.form .fields.error .field input[type="datetime-local"],
|
||||
.ui.form .fields.error .field input[type="email"],
|
||||
.ui.form .fields.error .field input[type="number"],
|
||||
.ui.form .fields.error .field input[type="password"],
|
||||
.ui.form .fields.error .field input[type="search"],
|
||||
.ui.form .fields.error .field input[type="tel"],
|
||||
.ui.form .fields.error .field input[type="time"],
|
||||
.ui.form .fields.error .field input[type="text"],
|
||||
.ui.form .fields.error .field input[type="file"],
|
||||
.ui.form .fields.error .field input[type="url"],
|
||||
.ui.form .fields.error .field .ui.dropdown,
|
||||
.ui.form .fields.error .field .ui.dropdown .item,
|
||||
.ui.form .field.error .ui.dropdown,
|
||||
.ui.form .field.error .ui.dropdown .text,
|
||||
.ui.form .field.error .ui.dropdown .item,
|
||||
.ui.form .field.error textarea,
|
||||
.ui.form .field.error select,
|
||||
.ui.form .field.error input:not([type]),
|
||||
.ui.form .field.error input[type="date"],
|
||||
.ui.form .field.error input[type="datetime-local"],
|
||||
.ui.form .field.error input[type="email"],
|
||||
.ui.form .field.error input[type="number"],
|
||||
.ui.form .field.error input[type="password"],
|
||||
.ui.form .field.error input[type="search"],
|
||||
.ui.form .field.error input[type="tel"],
|
||||
.ui.form .field.error input[type="time"],
|
||||
.ui.form .field.error input[type="text"],
|
||||
.ui.form .field.error input[type="file"],
|
||||
.ui.form .field.error input[type="url"],
|
||||
.ui.form .field.error select:focus,
|
||||
.ui.form .field.error input:not([type]):focus,
|
||||
.ui.form .field.error input[type="date"]:focus,
|
||||
.ui.form .field.error input[type="datetime-local"]:focus,
|
||||
.ui.form .field.error input[type="email"]:focus,
|
||||
.ui.form .field.error input[type="number"]:focus,
|
||||
.ui.form .field.error input[type="password"]:focus,
|
||||
.ui.form .field.error input[type="search"]:focus,
|
||||
.ui.form .field.error input[type="tel"]:focus,
|
||||
.ui.form .field.error input[type="time"]:focus,
|
||||
.ui.form .field.error input[type="text"]:focus,
|
||||
.ui.form .field.error input[type="file"]:focus,
|
||||
.ui.form .field.error input[type="url"]:focus {
|
||||
background-color: var(--color-error-bg);
|
||||
border-color: var(--color-error-border);
|
||||
color: var(--color-error-text);
|
||||
}
|
||||
|
||||
.ui.form .fields.error .field .ui.dropdown,
|
||||
.ui.form .field.error .ui.dropdown,
|
||||
.ui.form .fields.error .field .ui.dropdown:hover,
|
||||
.ui.form .field.error .ui.dropdown:hover {
|
||||
border-color: var(--color-error-border) !important;
|
||||
}
|
||||
|
||||
.ui.form .fields.error .field .ui.dropdown .menu .item:hover,
|
||||
.ui.form .field.error .ui.dropdown .menu .item:hover {
|
||||
background-color: var(--color-error-bg-hover);
|
||||
}
|
||||
|
||||
.ui.form .fields.error .field .ui.dropdown .menu .active.item,
|
||||
.ui.form .field.error .ui.dropdown .menu .active.item {
|
||||
background-color: var(--color-error-bg-active) !important;
|
||||
}
|
||||
|
||||
.ui.form .fields.error .dropdown .menu,
|
||||
.ui.form .field.error .dropdown .menu {
|
||||
border-color: var(--color-error-border) !important;
|
||||
}
|
||||
|
||||
input:-webkit-autofill,
|
||||
input:-webkit-autofill:focus,
|
||||
input:-webkit-autofill:hover,
|
||||
input:-webkit-autofill:active,
|
||||
.ui.form .field.field input:-webkit-autofill,
|
||||
.ui.form .field.field input:-webkit-autofill:focus,
|
||||
.ui.form .field.field input:-webkit-autofill:hover,
|
||||
.ui.form .field.field input:-webkit-autofill:active {
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: var(--color-text);
|
||||
box-shadow: 0 0 0 100px var(--color-primary-light-6) inset !important;
|
||||
border-color: var(--color-primary-light-4) !important;
|
||||
}
|
||||
|
||||
.ui.form .field.muted {
|
||||
opacity: var(--opacity-disabled);
|
||||
}
|
||||
|
||||
.ui.form textarea:not([rows]) {
|
||||
height: var(--min-height-textarea); /* override fomantic default 12em */
|
||||
min-height: var(--min-height-textarea); /* override fomantic default 8em */
|
||||
}
|
||||
|
||||
.ui.input textarea,
|
||||
.ui.form textarea,
|
||||
.ui.form input:not([type]),
|
||||
.ui.form input[type="date"],
|
||||
.ui.form input[type="datetime-local"],
|
||||
.ui.form input[type="email"],
|
||||
.ui.form input[type="number"],
|
||||
.ui.form input[type="password"],
|
||||
.ui.form input[type="search"],
|
||||
.ui.form input[type="tel"],
|
||||
.ui.form input[type="time"],
|
||||
.ui.form input[type="text"],
|
||||
.ui.form input[type="file"],
|
||||
.ui.form input[type="url"] {
|
||||
transition: none;
|
||||
}
|
||||
|
||||
input,
|
||||
textarea,
|
||||
.ui.input > input,
|
||||
.ui.form input:not([type]),
|
||||
.ui.form select,
|
||||
.ui.form textarea,
|
||||
.ui.form input[type="date"],
|
||||
.ui.form input[type="datetime-local"],
|
||||
.ui.form input[type="email"],
|
||||
.ui.form input[type="file"],
|
||||
.ui.form input[type="number"],
|
||||
.ui.form input[type="password"],
|
||||
.ui.form input[type="search"],
|
||||
.ui.form input[type="tel"],
|
||||
.ui.form input[type="text"],
|
||||
.ui.form input[type="time"],
|
||||
.ui.form input[type="url"],
|
||||
.ui.selection.dropdown {
|
||||
background: var(--color-input-background);
|
||||
border-color: var(--color-input-border);
|
||||
color: var(--color-input-text);
|
||||
}
|
||||
|
||||
input:hover,
|
||||
textarea:hover,
|
||||
.ui.input input:hover,
|
||||
.ui.form input:not([type]):hover,
|
||||
.ui.form select:hover,
|
||||
.ui.form textarea:hover,
|
||||
.ui.form input[type="date"]:hover,
|
||||
.ui.form input[type="datetime-local"]:hover,
|
||||
.ui.form input[type="email"]:hover,
|
||||
.ui.form input[type="file"]:hover,
|
||||
.ui.form input[type="number"]:hover,
|
||||
.ui.form input[type="password"]:hover,
|
||||
.ui.form input[type="search"]:hover,
|
||||
.ui.form input[type="tel"]:hover,
|
||||
.ui.form input[type="text"]:hover,
|
||||
.ui.form input[type="time"]:hover,
|
||||
.ui.form input[type="url"]:hover,
|
||||
.ui.selection.dropdown:hover {
|
||||
background: var(--color-input-background);
|
||||
border-color: var(--color-input-border-hover);
|
||||
color: var(--color-input-text);
|
||||
}
|
||||
|
||||
input:focus,
|
||||
textarea:focus,
|
||||
.ui.input input:focus,
|
||||
.ui.form input:not([type]):focus,
|
||||
.ui.form select:focus,
|
||||
.ui.form textarea:focus,
|
||||
.ui.form input[type="date"]:focus,
|
||||
.ui.form input[type="datetime-local"]:focus,
|
||||
.ui.form input[type="email"]:focus,
|
||||
.ui.form input[type="file"]:focus,
|
||||
.ui.form input[type="number"]:focus,
|
||||
.ui.form input[type="password"]:focus,
|
||||
.ui.form input[type="search"]:focus,
|
||||
.ui.form input[type="tel"]:focus,
|
||||
.ui.form input[type="text"]:focus,
|
||||
.ui.form input[type="time"]:focus,
|
||||
.ui.form input[type="url"]:focus,
|
||||
.ui.selection.dropdown:focus {
|
||||
background: var(--color-input-background);
|
||||
border-color: var(--color-primary);
|
||||
color: var(--color-input-text);
|
||||
}
|
||||
|
||||
.ui.form .field > label,
|
||||
.ui.form .inline.fields > label,
|
||||
.ui.form .inline.fields .field > label,
|
||||
.ui.form .inline.fields .field > p,
|
||||
.ui.form .inline.field > label,
|
||||
.ui.form .inline.field > p {
|
||||
color: var(--color-text);
|
||||
}
|
||||
|
||||
.ui.form .required.fields:not(.grouped) > .field > label::after,
|
||||
.ui.form .required.fields.grouped > label::after,
|
||||
.ui.form .required.field > label::after,
|
||||
.ui.form label.required::after {
|
||||
color: var(--color-red);
|
||||
}
|
||||
|
||||
.ui.input {
|
||||
color: var(--color-input-text);
|
||||
}
|
||||
|
||||
.ui.form .field > .selection.dropdown {
|
||||
min-width: 14em; /* matches the default min width */
|
||||
}
|
||||
|
||||
.form .help {
|
||||
color: var(--color-secondary-dark-5);
|
||||
margin-top: 0.25em;
|
||||
padding-bottom: 0.6em;
|
||||
display: inline-block;
|
||||
text-wrap: balance;
|
||||
}
|
||||
|
||||
.form .help code {
|
||||
color: var(--color-text-light-1);
|
||||
}
|
||||
|
||||
.form .help pre.command-block {
|
||||
white-space: pre-wrap;
|
||||
overflow-wrap: anywhere;
|
||||
margin: 0.25em 0 0.25em 1em;
|
||||
}
|
||||
|
||||
.m-captcha-style {
|
||||
width: 100%;
|
||||
height: 5em;
|
||||
vertical-align: middle;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.g-recaptcha-style,
|
||||
.h-captcha-style {
|
||||
margin: 0 auto !important;
|
||||
width: 304px;
|
||||
padding-left: 30px;
|
||||
}
|
||||
.g-recaptcha-style iframe,
|
||||
.h-captcha-style iframe {
|
||||
border-radius: var(--border-radius) !important;
|
||||
width: 302px !important;
|
||||
height: 76px !important;
|
||||
}
|
||||
.m-captcha-style {
|
||||
max-width: 450px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-height: 575px) {
|
||||
#rc-imageselect, /* google recaptcha */
|
||||
.g-recaptcha-style,
|
||||
.h-captcha-style {
|
||||
transform: scale(0.77);
|
||||
transform-origin: 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
.ui.form.left-right-form .inline.field > label {
|
||||
text-align: right;
|
||||
width: 250px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.ui.form.left-right-form .inline.field > .help {
|
||||
display: block;
|
||||
margin-left: calc(250px + 15px);
|
||||
}
|
||||
|
||||
.ui.form.left-right-form .inline.field input:not([type="checkbox"], [type="radio"]),
|
||||
.ui.form.left-right-form .inline.field .ui.dropdown,
|
||||
.ui.form.left-right-form .inline.field textarea {
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.ui.form.left-right-form .inline.field .ui.dropdown input.search {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.ui.form.left-right-form .inline.field .inline-right {
|
||||
display: inline-flex;
|
||||
flex-direction: column;
|
||||
gap: 0.5em;
|
||||
}
|
||||
|
||||
@media (max-width: 767.98px) {
|
||||
.ui.form.left-right-form .inline.field > label {
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
text-align: left;
|
||||
}
|
||||
.ui.form.left-right-form .inline.field > .help {
|
||||
margin: 0;
|
||||
}
|
||||
.ui.form.left-right-form .inline.field input:not([type="checkbox"], [type="radio"]),
|
||||
.ui.form.left-right-form .inline.field .ui.dropdown,
|
||||
.ui.form.left-right-form .inline.field textarea {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
@@ -56,7 +56,7 @@
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 0.25em;
|
||||
gap: 0.5em;
|
||||
}
|
||||
|
||||
.page-footer .right-links {
|
||||
@@ -65,15 +65,34 @@
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 1em;
|
||||
}
|
||||
|
||||
.page-footer .right-links > a {
|
||||
border-left: 1px solid var(--color-secondary-dark-1);
|
||||
padding-left: 8px;
|
||||
margin-left: 5px;
|
||||
padding-left: 1em;
|
||||
}
|
||||
|
||||
.page-footer .ui.dropdown .menu.language-menu {
|
||||
/* the theme item is also used for the menu's "default text" display */
|
||||
.page-footer .ui.dropdown .theme-menu-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5em;
|
||||
}
|
||||
|
||||
/* Fomantic UI dropdown "remote items by API" can't change parent "item" element,
|
||||
so we use "theme-menu-item" in the "item" and add tooltip to the inner one.
|
||||
Then the inner one needs to get padding and parent "item" padding needs to be removed */
|
||||
.page-footer .menu.theme-menu > .item {
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
.page-footer .menu.theme-menu > .item > .theme-menu-item {
|
||||
padding: 11px 16px;
|
||||
}
|
||||
|
||||
.page-footer .ui.dropdown .menu.language-menu,
|
||||
.page-footer .ui.dropdown .menu.theme-menu {
|
||||
max-height: min(500px, calc(100vh - 60px));
|
||||
overflow-y: auto;
|
||||
margin-bottom: 10px;
|
||||
|
||||
@@ -18,7 +18,11 @@
|
||||
@import "./modules/checkbox.css";
|
||||
@import "./modules/dimmer.css";
|
||||
@import "./modules/modal.css";
|
||||
@import "./modules/search.css";
|
||||
@import "./modules/tab.css";
|
||||
@import "./modules/form.css";
|
||||
@import "./modules/dropdown.css";
|
||||
@import "./modules/shortcut.css";
|
||||
|
||||
@import "./modules/tippy.css";
|
||||
@import "./modules/breadcrumb.css";
|
||||
@@ -27,6 +31,9 @@
|
||||
@import "./modules/toast.css";
|
||||
@import "./modules/svg.css";
|
||||
@import "./modules/flexcontainer.css";
|
||||
@import "./modules/codeeditor.css";
|
||||
@import "./modules/chroma.css";
|
||||
@import "./modules/charescape.css";
|
||||
|
||||
@import "./shared/flex-list.css";
|
||||
@import "./shared/milestone.css";
|
||||
@@ -37,24 +44,21 @@
|
||||
@import "./features/gitgraph.css";
|
||||
@import "./features/heatmap.css";
|
||||
@import "./features/imagediff.css";
|
||||
@import "./features/codeeditor.css";
|
||||
@import "./features/projects.css";
|
||||
@import "./features/expander.css";
|
||||
@import "./features/cropper.css";
|
||||
@import "./features/console.css";
|
||||
@import "./features/captcha.css";
|
||||
|
||||
@import "./markup/content.css";
|
||||
@import "./markup/codecopy.css";
|
||||
@import "./markup/codeblock.css";
|
||||
@import "./markup/codepreview.css";
|
||||
@import "./markup/asciicast.css";
|
||||
|
||||
@import "./chroma/base.css";
|
||||
@import "./codemirror/base.css";
|
||||
@import "./font_i18n.css";
|
||||
@import "./base.css";
|
||||
@import "./home.css";
|
||||
@import "./install.css";
|
||||
@import "./form.css";
|
||||
|
||||
@import "./repo.css";
|
||||
@import "./repo/release-tag.css";
|
||||
@@ -72,7 +76,6 @@
|
||||
@import "./repo/commit-sign.css";
|
||||
@import "./repo/packages.css";
|
||||
|
||||
@import "./editor/fileeditor.css";
|
||||
@import "./editor/combomarkdowneditor.css";
|
||||
|
||||
@import "./org.css";
|
||||
|
||||
@@ -3,6 +3,8 @@
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.ap-terminal {
|
||||
/* Related: https://github.com/asciinema/asciinema-player/blob/develop/src/components/Terminal.js : <div class="ap-term" ...>
|
||||
Old PR: Fix UI regression of asciinema player https://github.com/go-gitea/gitea/pull/26159 */
|
||||
.ap-term {
|
||||
overflow: hidden !important;
|
||||
}
|
||||
|
||||
@@ -0,0 +1,10 @@
|
||||
.markup .ui.button.code-copy {
|
||||
top: 8px;
|
||||
right: 6px;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.markup .mermaid-block .view-controller {
|
||||
right: 6px;
|
||||
bottom: 5px;
|
||||
}
|
||||
@@ -1,30 +0,0 @@
|
||||
.markup .code-copy {
|
||||
position: absolute;
|
||||
top: 8px;
|
||||
right: 6px;
|
||||
padding: 9px;
|
||||
visibility: hidden;
|
||||
animation: fadeout 0.2s both;
|
||||
}
|
||||
|
||||
/* adjustments for comment content having only 14px font size */
|
||||
.repository.view.issue .comment-list .comment .markup .code-copy {
|
||||
right: 5px;
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
/* can not use regular transparent button colors for hover and active states because
|
||||
we need opaque colors here as code can appear behind the button */
|
||||
.markup .code-copy:hover {
|
||||
background: var(--color-secondary) !important;
|
||||
}
|
||||
|
||||
.markup .code-copy:active {
|
||||
background: var(--color-secondary-dark-1) !important;
|
||||
}
|
||||
|
||||
.markup .code-block-container:hover .code-copy,
|
||||
.markup .code-block:hover .code-copy {
|
||||
visibility: visible;
|
||||
animation: fadein 0.2s both;
|
||||
}
|
||||
@@ -24,8 +24,8 @@
|
||||
|
||||
.markup .anchor {
|
||||
float: left;
|
||||
padding-right: 4px;
|
||||
margin-left: -20px;
|
||||
padding-inline-end: 4px;
|
||||
margin-inline-start: -20px;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
@@ -151,31 +151,30 @@ In markup content, we always use bottom margin for all elements */
|
||||
|
||||
.markup ul,
|
||||
.markup ol {
|
||||
padding-left: 2em;
|
||||
}
|
||||
|
||||
.markup ul.no-list,
|
||||
.markup ol.no-list {
|
||||
padding: 0;
|
||||
list-style-type: none;
|
||||
padding-inline-start: 2em;
|
||||
}
|
||||
|
||||
.markup .task-list-item {
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
.markup .task-list-item > ul {
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
.markup .task-list-item p + ul {
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
.markup .task-list-item input[type="checkbox"] {
|
||||
margin: 0 .3em .25em -1.4em;
|
||||
margin-bottom: 0.25em;
|
||||
margin-inline: -1.4em 0.6em;
|
||||
vertical-align: middle;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.markup .task-list-item input[type="checkbox"] + p {
|
||||
margin-left: -0.2em;
|
||||
margin-inline-start: -0.2em;
|
||||
display: inline;
|
||||
}
|
||||
|
||||
@@ -188,48 +187,12 @@ In markup content, we always use bottom margin for all elements */
|
||||
}
|
||||
|
||||
.markup input[type="checkbox"] {
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
appearance: none;
|
||||
position: relative;
|
||||
border: 1px solid var(--color-secondary);
|
||||
border-radius: var(--border-radius);
|
||||
background: var(--color-input-background);
|
||||
height: 14px;
|
||||
width: 14px;
|
||||
margin-inline-end: .25em;
|
||||
margin-bottom: .25em;
|
||||
cursor: default;
|
||||
opacity: 1 !important; /* override fomantic on edit preview */
|
||||
pointer-events: auto !important; /* override fomantic on edit preview */
|
||||
vertical-align: middle !important; /* override fomantic on edit preview */
|
||||
-webkit-print-color-adjust: exact;
|
||||
color-adjust: exact;
|
||||
}
|
||||
|
||||
.markup input[type="checkbox"]:not([disabled]):hover,
|
||||
.markup input[type="checkbox"]:not([disabled]):active {
|
||||
border-color: var(--color-primary);
|
||||
}
|
||||
|
||||
.markup input[type="checkbox"]::after {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
pointer-events: none;
|
||||
background: var(--color-text);
|
||||
mask-size: cover;
|
||||
-webkit-mask-size: cover;
|
||||
}
|
||||
|
||||
.markup input[type="checkbox"]:checked::after {
|
||||
content: "";
|
||||
mask-image: var(--checkbox-mask-checked);
|
||||
-webkit-mask-image: var(--checkbox-mask-checked);
|
||||
-webkit-print-color-adjust: exact;
|
||||
color-adjust: exact;
|
||||
}
|
||||
|
||||
.markup input[type="checkbox"]:indeterminate::after {
|
||||
content: "";
|
||||
mask-image: var(--checkbox-mask-indeterminate);
|
||||
-webkit-mask-image: var(--checkbox-mask-indeterminate);
|
||||
}
|
||||
|
||||
.markup ul ul,
|
||||
@@ -271,7 +234,7 @@ In markup content, we always use bottom margin for all elements */
|
||||
}
|
||||
|
||||
.markup blockquote {
|
||||
margin-left: 0;
|
||||
margin-inline-start: 0;
|
||||
padding: 0 15px;
|
||||
color: var(--color-text-light-2);
|
||||
border-left: 0.25em solid var(--color-secondary);
|
||||
@@ -316,6 +279,18 @@ In markup content, we always use bottom margin for all elements */
|
||||
box-sizing: initial;
|
||||
}
|
||||
|
||||
/* GitHub-style dark/light image switching.
|
||||
These fragments are kept in the rendered HTML as part of the `src` attribute.
|
||||
We decide which to show via `data-gitea-theme-dark` on `<html>`, which is
|
||||
mirrored from `--is-dark-theme` in JS (so it also works with auto/custom themes).
|
||||
*/
|
||||
html[data-gitea-theme-dark="true"] .markup a[href*="#gh-light-mode-only"],
|
||||
html[data-gitea-theme-dark="true"] .markup img[src*="#gh-light-mode-only"],
|
||||
html[data-gitea-theme-dark="false"] .markup a[href*="#gh-dark-mode-only"],
|
||||
html[data-gitea-theme-dark="false"] .markup img[src*="#gh-dark-mode-only"] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.file-view.markup {
|
||||
padding: 1em 2em;
|
||||
font-size: 16px;
|
||||
@@ -340,12 +315,12 @@ In markup content, we always use bottom margin for all elements */
|
||||
|
||||
.markup img[align="right"],
|
||||
.markup video[align="right"] {
|
||||
padding-left: 20px;
|
||||
padding-inline-start: 20px;
|
||||
}
|
||||
|
||||
.markup img[align="left"],
|
||||
.markup video[align="left"] {
|
||||
padding-right: 28px;
|
||||
padding-inline-end: 28px;
|
||||
}
|
||||
|
||||
.markup span.frame {
|
||||
@@ -376,69 +351,6 @@ In markup content, we always use bottom margin for all elements */
|
||||
color: var(--color-text);
|
||||
}
|
||||
|
||||
.markup span.align-center {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.markup span.align-center > span {
|
||||
display: block;
|
||||
margin: 13px auto 0;
|
||||
overflow: hidden;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.markup span.align-center span img,
|
||||
.markup span.align-center span video {
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.markup span.align-right {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.markup span.align-right > span {
|
||||
display: block;
|
||||
margin: 13px 0 0;
|
||||
overflow: hidden;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.markup span.align-right span img,
|
||||
.markup span.align-right span video {
|
||||
margin: 0;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.markup span.float-left {
|
||||
display: block;
|
||||
float: left;
|
||||
margin-right: 13px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.markup span.float-left span {
|
||||
margin: 13px 0 0;
|
||||
}
|
||||
|
||||
.markup span.float-right {
|
||||
display: block;
|
||||
float: right;
|
||||
margin-left: 13px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.markup span.float-right > span {
|
||||
display: block;
|
||||
margin: 13px auto 0;
|
||||
overflow: hidden;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.markup code,
|
||||
.markup tt {
|
||||
padding: 0.2em 0.4em;
|
||||
@@ -524,13 +436,13 @@ In markup content, we always use bottom margin for all elements */
|
||||
background-color: var(--color-markup-code-inline);
|
||||
border: 1px solid var(--color-secondary);
|
||||
border-radius: var(--border-radius);
|
||||
box-shadow: inset 0 -1px 0 var(--color-secondary);
|
||||
box-shadow: var(--box-shadow-kbd);
|
||||
}
|
||||
|
||||
.markup .ui.list .list,
|
||||
.markup ol.ui.list ol,
|
||||
.markup ul.ui.list ul {
|
||||
padding-left: 2em;
|
||||
padding-inline-start: 2em;
|
||||
}
|
||||
|
||||
.markup details.frontmatter-content summary {
|
||||
@@ -546,8 +458,11 @@ In markup content, we always use bottom margin for all elements */
|
||||
}
|
||||
|
||||
.external-render-iframe {
|
||||
display: block; /* removes the inline baseline gap below the iframe */
|
||||
width: 100%;
|
||||
height: max(300px, 80vh);
|
||||
border: none;
|
||||
border-radius: 0 0 var(--border-radius) var(--border-radius);
|
||||
}
|
||||
|
||||
.markup-content-iframe {
|
||||
@@ -601,3 +516,40 @@ In markup content, we always use bottom margin for all elements */
|
||||
.file-view.markup.orgmode li.indeterminate > p {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
/* auto-hide-control is a control element or a container for control elements,
|
||||
it floats over the code-block and only shows when the code-block is hovered. */
|
||||
.markup .auto-hide-control {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
visibility: hidden; /* prevent from click events even opacity=0 */
|
||||
opacity: 0;
|
||||
transition: var(--transition-hover-fade);
|
||||
}
|
||||
|
||||
/* all rendered code-block elements are in their container,
|
||||
the manually written code-block elements on "packages" pages don't have the container */
|
||||
.markup .code-block-container:hover .auto-hide-control,
|
||||
.markup .code-block:hover .auto-hide-control {
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
@media (hover: none) {
|
||||
.markup .auto-hide-control {
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
/* can not use regular transparent button colors for hover and active states
|
||||
because we need opaque colors here as code can appear behind the button */
|
||||
.markup .auto-hide-control.ui.button:hover,
|
||||
.markup .auto-hide-control .ui.button:hover {
|
||||
background: var(--color-secondary) !important;
|
||||
}
|
||||
|
||||
.markup .auto-hide-control.ui.button:active,
|
||||
.markup .auto-hide-control .ui.button:active {
|
||||
background: var(--color-secondary-dark-1) !important;
|
||||
}
|
||||
|
||||
@@ -28,7 +28,7 @@
|
||||
aspect-ratio: 1;
|
||||
transform: translate(-50%, -50%);
|
||||
animation: isloadingspin 1000ms infinite linear;
|
||||
border-width: 4px;
|
||||
border-width: 3px;
|
||||
border-style: solid;
|
||||
border-color: var(--color-secondary) var(--color-secondary) var(--color-secondary-dark-8) var(--color-secondary-dark-8);
|
||||
border-radius: var(--border-radius-full);
|
||||
@@ -82,15 +82,6 @@ code.language-math.is-loading::after {
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes fadeout {
|
||||
0% {
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
/* 1p5 means 1-point-5. it can't use "pulse" here, otherwise the animation is not right (maybe due to some conflicts */
|
||||
@keyframes pulse-1p5 {
|
||||
0% {
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
.breadcrumb {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
gap: 3px;
|
||||
overflow-wrap: anywhere;
|
||||
}
|
||||
|
||||
@@ -1,6 +1,8 @@
|
||||
.ui.button {
|
||||
cursor: pointer;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
min-width: 0;
|
||||
outline: none;
|
||||
font-family: var(--fonts-regular);
|
||||
margin: 0 0.25em 0 0;
|
||||
@@ -100,11 +102,13 @@
|
||||
|
||||
/* reference sizes (not exactly at the moment): normal: padding-x=21, height=38 ; compact: padding-x=15, height=32 */
|
||||
.ui.button { /* stylelint-disable-line no-duplicate-selectors */
|
||||
gap: var(--gap-block);
|
||||
min-height: 38px;
|
||||
padding: 0.57em /* around 8px */ 1.43em /* around 20px */;
|
||||
}
|
||||
.ui.compact.buttons .button,
|
||||
.ui.compact.button {
|
||||
gap: var(--gap-inline);
|
||||
padding: 0.42em /* around 8px */ 1.07em /* around 15px */;
|
||||
min-height: 32px;
|
||||
}
|
||||
@@ -118,6 +122,7 @@
|
||||
.ui.mini.buttons .dropdown .menu > .item,
|
||||
.ui.mini.buttons .button,
|
||||
.ui.ui.ui.ui.mini.button {
|
||||
gap: var(--gap-inline);
|
||||
font-size: 11px;
|
||||
min-height: 30px;
|
||||
}
|
||||
@@ -130,6 +135,7 @@
|
||||
.ui.tiny.buttons .dropdown .menu > .item,
|
||||
.ui.tiny.buttons .button,
|
||||
.ui.ui.ui.ui.tiny.button {
|
||||
gap: var(--gap-inline);
|
||||
font-size: 12px;
|
||||
min-height: 32px;
|
||||
}
|
||||
@@ -208,7 +214,6 @@
|
||||
|
||||
.ui.fluid.button {
|
||||
width: 100%;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.ui.primary.button,
|
||||
|
||||
@@ -0,0 +1,55 @@
|
||||
/*
|
||||
Show the escaped and hide the real char:
|
||||
<span class="broken-code-point" data-escaped="␡"><span class="char">{real-char}</span></span>
|
||||
Only show the real-char:
|
||||
<span class="broken-code-point">{real-char}</span>
|
||||
*/
|
||||
.broken-code-point:not([data-escaped]) {
|
||||
border-radius: 4px;
|
||||
padding: 0 2px;
|
||||
border: 1px var(--color-yellow) solid;
|
||||
}
|
||||
|
||||
.broken-code-point[data-escaped] {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.broken-code-point[data-escaped]::before {
|
||||
visibility: visible;
|
||||
content: attr(data-escaped);
|
||||
border-radius: 2px;
|
||||
padding: 0 1px;
|
||||
border: 1px var(--color-yellow) solid;
|
||||
}
|
||||
|
||||
.broken-code-point[data-escaped] .char {
|
||||
/* keep the original character selectable/copyable while showing the escaped label via ::before */
|
||||
position: absolute;
|
||||
left: 0;
|
||||
opacity: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
/*
|
||||
Show the escaped and hide the real-char:
|
||||
<span class="unicode-escaped">
|
||||
<span class="escaped-code-point" data-escaped="[U+1F600]"><span class="char">{real-char}</span></span>
|
||||
</span>
|
||||
Hide the escaped and show the real-char:
|
||||
<span>
|
||||
<span class="escaped-code-point" data-escaped="[U+1F600]"><span class="char">{real-char}</span></span>
|
||||
</span>
|
||||
*/
|
||||
.unicode-escaped .escaped-code-point[data-escaped]::before {
|
||||
visibility: visible;
|
||||
content: attr(data-escaped);
|
||||
color: var(--color-red);
|
||||
}
|
||||
|
||||
.unicode-escaped .escaped-code-point .char {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.unicode-escaped .ambiguous-code-point {
|
||||
border: 1px var(--color-yellow) solid;
|
||||
}
|
||||
@@ -1,10 +1,75 @@
|
||||
/* based on Fomantic UI checkbox module, with just the parts extracted that we use. If you find any
|
||||
unused rules here after refactoring, please remove them. */
|
||||
|
||||
input[type="checkbox"],
|
||||
input[type="radio"] {
|
||||
appearance: none;
|
||||
width: var(--checkbox-size);
|
||||
height: var(--checkbox-size);
|
||||
border: 1px solid var(--color-input-border);
|
||||
border-radius: 50%;
|
||||
background: var(--color-input-background);
|
||||
}
|
||||
|
||||
input[type="radio"]:checked {
|
||||
background: var(--color-white);
|
||||
border: 4px solid var(--color-primary);
|
||||
}
|
||||
|
||||
input[type="checkbox"] {
|
||||
appearance: none;
|
||||
display: inline-grid;
|
||||
place-content: center;
|
||||
width: var(--checkbox-size);
|
||||
height: var(--checkbox-size);
|
||||
border: 1px solid var(--color-input-border);
|
||||
border-radius: 3px;
|
||||
background: var(--color-input-background);
|
||||
overflow: hidden;
|
||||
print-color-adjust: exact;
|
||||
}
|
||||
|
||||
input[type="checkbox"]::before {
|
||||
content: "";
|
||||
background: var(--color-white);
|
||||
width: var(--checkbox-size);
|
||||
height: var(--checkbox-size);
|
||||
clip-path: inset(var(--checkbox-size) 0 0 0);
|
||||
mask-image: var(--checkbox-mask-checked);
|
||||
-webkit-mask-image: var(--checkbox-mask-checked);
|
||||
mask-size: 75%;
|
||||
-webkit-mask-size: 75%;
|
||||
mask-repeat: no-repeat;
|
||||
-webkit-mask-repeat: no-repeat;
|
||||
mask-position: center;
|
||||
-webkit-mask-position: center;
|
||||
}
|
||||
|
||||
input[type="checkbox"]:checked,
|
||||
input[type="checkbox"]:indeterminate {
|
||||
background: var(--color-primary);
|
||||
border-color: var(--color-primary);
|
||||
}
|
||||
|
||||
input[type="checkbox"]:checked::before {
|
||||
clip-path: inset(0);
|
||||
}
|
||||
|
||||
input[type="checkbox"]:disabled:checked,
|
||||
input[type="checkbox"]:disabled:indeterminate {
|
||||
background: var(--color-secondary-dark-4);
|
||||
border-color: var(--color-secondary-dark-4);
|
||||
}
|
||||
|
||||
input[type="radio"]:disabled:checked {
|
||||
border-color: var(--color-secondary-dark-4);
|
||||
}
|
||||
|
||||
input[type="checkbox"]:indeterminate::before {
|
||||
clip-path: inset(0);
|
||||
mask-image: var(--checkbox-mask-indeterminate);
|
||||
-webkit-mask-image: var(--checkbox-mask-indeterminate);
|
||||
mask-size: 75%;
|
||||
-webkit-mask-size: 75%;
|
||||
}
|
||||
|
||||
.ui.checkbox {
|
||||
@@ -26,17 +91,9 @@ input[type="radio"] {
|
||||
height: var(--checkbox-size);
|
||||
}
|
||||
|
||||
.ui.checkbox input[type="checkbox"]:enabled,
|
||||
.ui.checkbox input[type="radio"]:enabled,
|
||||
.ui.checkbox label:enabled {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.ui.checkbox label {
|
||||
cursor: auto;
|
||||
position: relative;
|
||||
display: block;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.ui.checkbox label,
|
||||
|
||||
@@ -0,0 +1,79 @@
|
||||
/* https://github.com/alecthomas/chroma/blob/6428fb4e65f3c1493491571c8a6a8f1add1da822/types.go#L208 */
|
||||
|
||||
/* structural */
|
||||
.chroma .lntd { vertical-align: top; padding: 0; margin: 0; border: 0; }
|
||||
.chroma .lntable { border-spacing: 0; padding: 0; margin: 0; border: 0; width: auto; overflow: auto; display: block; }
|
||||
.chroma .hl { display: block; width: 100%; }
|
||||
.chroma .lnt { margin-right: 0.4em; padding: 0 0.4em; }
|
||||
.chroma .ln { margin-right: 0.4em; padding: 0 0.4em; }
|
||||
|
||||
/* tokens */
|
||||
.chroma .bp { color: var(--color-syntax-name-pseudo); } /* NameBuiltinPseudo */
|
||||
.chroma .c { color: var(--color-syntax-comment); } /* Comment */
|
||||
.chroma .c1 { color: var(--color-syntax-comment); } /* CommentSingle */
|
||||
.chroma .ch { color: var(--color-syntax-comment); } /* CommentHashbang */
|
||||
.chroma .cm { color: var(--color-syntax-comment); } /* CommentMultiline */
|
||||
.chroma .cp { color: var(--color-syntax-preproc); } /* CommentPreproc */
|
||||
.chroma .cpf { color: var(--color-syntax-preproc-file); } /* CommentPreprocFile */
|
||||
.chroma .cs { color: var(--color-syntax-comment-special); } /* CommentSpecial */
|
||||
.chroma .dl { color: var(--color-syntax-string); } /* LiteralStringDelimiter */
|
||||
.chroma .gd { color: var(--color-syntax-diff-fg); background-color: var(--color-syntax-deleted-bg); } /* GenericDeleted */
|
||||
.chroma .ge { color: var(--color-syntax-emph); } /* GenericEmph */
|
||||
.chroma .gh { color: var(--color-syntax-heading); } /* GenericHeading */
|
||||
.chroma .gi { color: var(--color-syntax-diff-fg); background-color: var(--color-syntax-inserted-bg); } /* GenericInserted */
|
||||
.chroma .gl { text-decoration: underline; } /* GenericUnderline */
|
||||
.chroma .go { color: var(--color-syntax-output); } /* GenericOutput */
|
||||
.chroma .gp { color: var(--color-syntax-prompt); } /* GenericPrompt */
|
||||
.chroma .gr { color: var(--color-syntax-invalid); } /* GenericError */
|
||||
.chroma .gs { color: var(--color-syntax-strong); font-weight: var(--font-weight-semibold); } /* GenericStrong */
|
||||
.chroma .gt { color: var(--color-syntax-traceback); } /* GenericTraceback */
|
||||
.chroma .gu { color: var(--color-syntax-subheading); } /* GenericSubheading */
|
||||
.chroma .il { color: var(--color-syntax-number); } /* LiteralNumberIntegerLong */
|
||||
.chroma .k { color: var(--color-syntax-keyword); } /* Keyword */
|
||||
.chroma .kc { color: var(--color-syntax-bool); } /* KeywordConstant */
|
||||
.chroma .kd { color: var(--color-syntax-keyword); } /* KeywordDeclaration */
|
||||
.chroma .kn { color: var(--color-syntax-control); } /* KeywordNamespace */
|
||||
.chroma .kp { color: var(--color-syntax-keyword); } /* KeywordPseudo */
|
||||
.chroma .kr { color: var(--color-syntax-keyword); } /* KeywordReserved */
|
||||
.chroma .kt { color: var(--color-syntax-type); } /* KeywordType */
|
||||
.chroma .m { color: var(--color-syntax-number); } /* LiteralNumber */
|
||||
.chroma .mb { color: var(--color-syntax-number); } /* LiteralNumberBin */
|
||||
.chroma .mf { color: var(--color-syntax-number); } /* LiteralNumberFloat */
|
||||
.chroma .mh { color: var(--color-syntax-number); } /* LiteralNumberHex */
|
||||
.chroma .mi { color: var(--color-syntax-number); } /* LiteralNumberInteger */
|
||||
.chroma .mo { color: var(--color-syntax-number); } /* LiteralNumberOct */
|
||||
.chroma .n { color: var(--color-syntax-text); } /* Name */
|
||||
.chroma .na { color: var(--color-syntax-attribute); } /* NameAttribute */
|
||||
.chroma .nb { color: var(--color-syntax-name); } /* NameBuiltin */
|
||||
.chroma .nc { color: var(--color-syntax-type); } /* NameClass */
|
||||
.chroma .nd { color: var(--color-syntax-decorator); } /* NameDecorator */
|
||||
.chroma .ne { color: var(--color-syntax-keyword); } /* NameException */
|
||||
.chroma .nf { color: var(--color-syntax-name); } /* NameFunction */
|
||||
.chroma .ni { color: var(--color-syntax-entity); } /* NameEntity */
|
||||
.chroma .nl { color: var(--color-syntax-keyword); } /* NameLabel */
|
||||
.chroma .nn { color: var(--color-syntax-namespace); } /* NameNamespace */
|
||||
.chroma .no { color: var(--color-syntax-variable); } /* NameConstant */
|
||||
.chroma .nt { color: var(--color-syntax-tag); } /* NameTag */
|
||||
.chroma .nv { color: var(--color-syntax-variable); } /* NameVariable */
|
||||
.chroma .nx { color: var(--color-syntax-text-alt); } /* NameOther */
|
||||
.chroma .o { color: var(--color-syntax-operator); } /* Operator */
|
||||
.chroma .ow { color: var(--color-syntax-operator); } /* OperatorWord */
|
||||
.chroma .p { color: var(--color-syntax-punctuation); } /* Punctuation */
|
||||
.chroma .s { color: var(--color-syntax-string); } /* LiteralString */
|
||||
.chroma .s1 { color: var(--color-syntax-string); } /* LiteralStringSingle */
|
||||
.chroma .s2 { color: var(--color-syntax-string); } /* LiteralStringDouble */
|
||||
.chroma .sa { color: var(--color-syntax-string-special); } /* LiteralStringAffix */
|
||||
.chroma .sb { color: var(--color-syntax-string); } /* LiteralStringBacktick */
|
||||
.chroma .sc { color: var(--color-syntax-string-special); } /* LiteralStringChar */
|
||||
.chroma .sd { color: var(--color-syntax-string); } /* LiteralStringDoc */
|
||||
.chroma .se { color: var(--color-syntax-escape); } /* LiteralStringEscape */
|
||||
.chroma .sh { color: var(--color-syntax-string); } /* LiteralStringHeredoc */
|
||||
.chroma .si { color: var(--color-syntax-string-special); } /* LiteralStringInterpol */
|
||||
.chroma .sr { color: var(--color-syntax-regexp); } /* LiteralStringRegex */
|
||||
.chroma .ss { color: var(--color-syntax-escape); } /* LiteralStringSymbol */
|
||||
.chroma .sx { color: var(--color-syntax-string); } /* LiteralStringOther */
|
||||
.chroma .vc { color: var(--color-syntax-variable); } /* NameVariableClass */
|
||||
.chroma .vg { color: var(--color-syntax-variable); } /* NameVariableGlobal */
|
||||
.chroma .vi { color: var(--color-syntax-variable); } /* NameVariableInstance */
|
||||
.chroma .w { color: var(--color-syntax-whitespace); } /* TextWhitespace */
|
||||
.chroma .err {/* not styled because Chroma uses it on too many things like JSX */} /* Error */
|
||||
@@ -0,0 +1,569 @@
|
||||
.code-editor-options {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.editor-loading {
|
||||
padding: 1rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.editor-loading.is-loading {
|
||||
width: 100%;
|
||||
min-height: 200px;
|
||||
height: 90vh;
|
||||
}
|
||||
|
||||
.edit.githook .code-editor-container {
|
||||
border: 1px solid var(--color-secondary);
|
||||
}
|
||||
|
||||
/* editor layout */
|
||||
.code-editor-container .cm-editor {
|
||||
color: var(--color-text);
|
||||
background-color: var(--color-code-bg);
|
||||
font-family: var(--fonts-monospace);
|
||||
font-size: 12px;
|
||||
max-height: 90vh;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-editor,
|
||||
.code-editor-container .cm-editor .cm-scroller {
|
||||
border-radius: 0 0 var(--border-radius) var(--border-radius);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-content,
|
||||
.code-editor-container .cm-gutter {
|
||||
min-height: 200px;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-scroller {
|
||||
overflow: auto;
|
||||
line-height: var(--line-height-code);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-content * {
|
||||
caret-color: inherit;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-content {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-cursor,
|
||||
.code-editor-container .cm-dropCursor {
|
||||
border-left-color: var(--color-caret);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-editor.cm-focused {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-editor.cm-focused > .cm-scroller > .cm-selectionLayer .cm-selectionBackground,
|
||||
.code-editor-container .cm-selectionBackground {
|
||||
background-color: var(--color-primary-alpha-30);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-panels {
|
||||
background-color: var(--color-body);
|
||||
color: var(--color-text);
|
||||
border-color: var(--color-secondary);
|
||||
font-family: var(--fonts-regular);
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-panel.cm-search {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
position: relative;
|
||||
padding-right: 24px;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-panel.cm-search br {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-panel.cm-search::after {
|
||||
content: "";
|
||||
flex-basis: 100%;
|
||||
order: 1;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-panel.cm-search .cm-textfield {
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-panel.cm-search br + input.cm-textfield,
|
||||
.code-editor-container .cm-panel.cm-search br + input.cm-textfield ~ * {
|
||||
order: 2;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-panel.cm-search input,
|
||||
.code-editor-container .cm-panel.cm-search button,
|
||||
.code-editor-container .cm-panel.cm-search label {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-panel.cm-search .cm-button + label,
|
||||
.code-editor-container .cm-panel.cm-search label + label {
|
||||
margin-left: 4px;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-panel.cm-search label {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-panel.cm-search input[type="checkbox"] {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-editor .cm-panel button[name="close"] {
|
||||
font-size: 0;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
background-color: currentcolor;
|
||||
mask-image: var(--octicon-x);
|
||||
mask-size: cover;
|
||||
-webkit-mask-image: var(--octicon-x);
|
||||
-webkit-mask-size: cover;
|
||||
border-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-panel.cm-search button[name="close"] {
|
||||
position: absolute;
|
||||
right: 8px;
|
||||
top: 8px;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-editor .cm-panel button[name="close"]:focus-visible {
|
||||
outline: 2px solid var(--color-primary);
|
||||
outline-offset: 2px;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-activeLine,
|
||||
.code-editor-container .cm-activeLineGutter {
|
||||
background-color: var(--color-editor-line-highlight);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-gutters {
|
||||
background-color: var(--color-code-bg);
|
||||
color: var(--color-secondary-dark-6);
|
||||
border-right: none;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-gutters .cm-lineNumbers .cm-gutterElement {
|
||||
min-width: 30px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-foldGutter .cm-gutterElement {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0 2px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-foldGutter .cm-gutterElement svg {
|
||||
color: var(--color-text-light-2);
|
||||
cursor: pointer;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-gutters:hover .cm-foldGutter .cm-gutterElement svg {
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-foldGutter .cm-gutterElement:hover svg {
|
||||
color: var(--color-text);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-gutters .cm-lineNumbers .cm-activeLineGutter {
|
||||
color: var(--color-text-light);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-editor .cm-line ::selection,
|
||||
.code-editor-container .cm-editor .cm-line::selection {
|
||||
color: currentcolor;
|
||||
background-color: var(--color-editor-selection);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-foldPlaceholder {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
background: none;
|
||||
border: none;
|
||||
color: var(--color-text-light-2);
|
||||
cursor: pointer;
|
||||
vertical-align: middle;
|
||||
padding: 0 1px;
|
||||
margin: 0 2px;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-foldPlaceholder:hover {
|
||||
color: var(--color-text);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-searchMatch {
|
||||
background-color: var(--color-highlight-bg);
|
||||
outline: 1px solid var(--color-highlight-fg);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-searchMatch-selected {
|
||||
background-color: var(--color-primary-alpha-30);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-selectionMatch {
|
||||
background-color: var(--color-highlight-bg);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-tooltip {
|
||||
background-color: var(--color-body);
|
||||
color: var(--color-text);
|
||||
border-color: var(--color-secondary);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-tooltip.cm-tooltip-autocomplete > ul > li {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-completionIcon {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 16px;
|
||||
padding-right: 4px;
|
||||
color: var(--color-text-light);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-tooltip-autocomplete ul li[aria-selected] {
|
||||
background-color: var(--color-primary-alpha-30);
|
||||
color: var(--color-text);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-completionMatchedText {
|
||||
text-decoration: none;
|
||||
color: var(--color-primary-dark-1);
|
||||
font-weight: var(--font-weight-semibold);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-placeholder {
|
||||
color: var(--color-placeholder-text);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-button {
|
||||
background-image: none;
|
||||
background-color: var(--color-button);
|
||||
color: var(--color-text);
|
||||
border: 1px solid var(--color-secondary);
|
||||
border-radius: var(--border-radius);
|
||||
height: 28px;
|
||||
padding: 0 10px;
|
||||
cursor: pointer;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-button:hover {
|
||||
background-color: var(--color-hover);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-textfield {
|
||||
background-color: var(--color-input-background);
|
||||
color: var(--color-input-text);
|
||||
border: 1px solid var(--color-input-border);
|
||||
border-radius: var(--border-radius);
|
||||
height: 28px;
|
||||
padding: 0 6px;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-textfield:focus {
|
||||
border-color: var(--color-primary);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-specialChar {
|
||||
color: var(--color-syntax-invalid);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-trailingSpace {
|
||||
background-color: var(--color-error-bg);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-activeLine .cm-trailingSpace {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.code-editor-container.cm-mod-held .cm-url {
|
||||
text-decoration: underline dotted var(--color-syntax-link);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-editor.cm-focused .cm-matchingBracket {
|
||||
background-color: var(--color-syntax-matching-bracket-bg);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-editor.cm-focused .cm-nonmatchingBracket {
|
||||
background-color: var(--color-syntax-nonmatching-bracket-bg);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-panels-top {
|
||||
border-bottom-color: var(--color-secondary);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-panels-bottom {
|
||||
border-top-color: var(--color-secondary);
|
||||
border-radius: 0 0 var(--border-radius) var(--border-radius);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-snippetField {
|
||||
background-color: var(--color-primary-alpha-10);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-snippetFieldPosition {
|
||||
border-left-color: var(--color-text-light-3);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-tooltip.cm-tooltip-autocomplete > ul > completion-section {
|
||||
border-bottom-color: var(--color-secondary);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-tooltip-autocomplete-disabled ul li[aria-selected] {
|
||||
background-color: var(--color-secondary);
|
||||
}
|
||||
|
||||
/* command palette */
|
||||
.code-editor-container {
|
||||
position: relative;
|
||||
min-height: 90vh;
|
||||
}
|
||||
|
||||
.cm-command-palette {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
z-index: 301;
|
||||
width: 400px;
|
||||
max-width: min(calc(100% - 16px), 90vw);
|
||||
background-color: var(--color-body);
|
||||
border: 1px solid var(--color-secondary);
|
||||
border-radius: 0 0 var(--border-radius) var(--border-radius);
|
||||
box-shadow: 0 4px 12px var(--color-shadow);
|
||||
font-family: var(--fonts-regular);
|
||||
font-size: 13px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 4px;
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
.cm-command-palette-input {
|
||||
display: block;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 4px 6px !important;
|
||||
border: 1px solid var(--color-secondary);
|
||||
border-radius: var(--border-radius);
|
||||
background-color: var(--color-input-background);
|
||||
color: var(--color-input-text);
|
||||
font-size: 13px;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.cm-command-palette-input:focus {
|
||||
border-color: var(--color-primary);
|
||||
}
|
||||
|
||||
.cm-command-palette-list {
|
||||
position: relative;
|
||||
max-height: calc(8 * 24px);
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.cm-command-palette-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
height: 24px;
|
||||
padding: 0 6px;
|
||||
border-radius: 2px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.cm-command-palette-item[aria-selected="true"] {
|
||||
background-color: var(--color-primary-alpha-30);
|
||||
}
|
||||
|
||||
.cm-command-palette-empty {
|
||||
color: var(--color-text-light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.cm-command-palette-label {
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.cm-command-palette-label mark {
|
||||
background: none;
|
||||
color: var(--color-primary-dark-1);
|
||||
font-weight: var(--font-weight-semibold);
|
||||
}
|
||||
|
||||
.cm-command-palette-keys {
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 2px;
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-gutter-lint {
|
||||
width: 14px;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-gutter-lint .cm-gutterElement {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-lint-marker-error {
|
||||
content: "";
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-radius: 50%;
|
||||
background-color: var(--color-red);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-lint-marker-warning {
|
||||
content: "";
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-radius: 50%;
|
||||
background-color: var(--color-yellow);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-lintRange-error {
|
||||
background-image: none;
|
||||
text-decoration: wavy underline var(--color-red);
|
||||
text-underline-offset: 3px;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-lintRange-warning {
|
||||
background-image: none;
|
||||
text-decoration: wavy underline var(--color-yellow);
|
||||
text-underline-offset: 3px;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-lintPoint-error::after {
|
||||
border-bottom-color: var(--color-red);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-lintPoint-warning::after {
|
||||
border-bottom-color: var(--color-yellow);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-tooltip-lint {
|
||||
background-color: var(--color-body);
|
||||
color: var(--color-text);
|
||||
border-color: var(--color-secondary);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-panel.cm-panel-lint button[name="close"] {
|
||||
top: 4px;
|
||||
right: 8px;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-panel.cm-panel-lint ul {
|
||||
max-height: 120px;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-panel.cm-panel-lint [aria-selected] {
|
||||
background-color: var(--color-primary-alpha-30) !important;
|
||||
}
|
||||
|
||||
.code-editor-container .cm-diagnostic.cm-diagnostic-error {
|
||||
border-left-color: var(--color-red);
|
||||
}
|
||||
|
||||
.code-editor-container .cm-diagnostic.cm-diagnostic-warning {
|
||||
border-left-color: var(--color-yellow);
|
||||
}
|
||||
|
||||
/* syntax highlighting classes from @lezer/highlight classHighlighter */
|
||||
.code-editor-container .tok-keyword,
|
||||
.code-editor-container .tok-atom { color: var(--color-syntax-keyword); }
|
||||
.code-editor-container .tok-bool { color: var(--color-syntax-bool); }
|
||||
.code-editor-container .tok-variableName { color: var(--color-syntax-variable); }
|
||||
.code-editor-container .tok-variableName2 { color: var(--color-syntax-keyword); }
|
||||
.code-editor-container .tok-propertyName { color: var(--color-syntax-property); }
|
||||
.code-editor-container .tok-typeName,
|
||||
.code-editor-container .tok-className { color: var(--color-syntax-type); }
|
||||
.code-editor-container .tok-namespace { color: var(--color-syntax-namespace); }
|
||||
.code-editor-container .tok-macroName { color: var(--color-syntax-name); }
|
||||
.code-editor-container .tok-labelName { color: var(--color-syntax-name); }
|
||||
.code-editor-container .tok-number { color: var(--color-syntax-number); }
|
||||
.code-editor-container .tok-string { color: var(--color-syntax-string); }
|
||||
.code-editor-container .tok-string2 { color: var(--color-syntax-regexp); }
|
||||
.code-editor-container .tok-operator { color: var(--color-syntax-operator); }
|
||||
.code-editor-container .tok-punctuation { color: var(--color-syntax-punctuation); }
|
||||
.code-editor-container .tok-comment { color: var(--color-syntax-comment); }
|
||||
.code-editor-container .tok-meta { color: var(--color-syntax-preproc); }
|
||||
.code-editor-container .tok-invalid { color: var(--color-syntax-invalid); }
|
||||
.code-editor-container .tok-link { color: var(--color-syntax-link); }
|
||||
.code-editor-container .tok-heading { color: var(--color-syntax-heading); }
|
||||
.code-editor-container .tok-emphasis { color: var(--color-syntax-emph); font-style: italic; }
|
||||
.code-editor-container .tok-strong { font-weight: var(--font-weight-bold); }
|
||||
.code-editor-container .tok-inserted { color: var(--color-syntax-string); }
|
||||
.code-editor-container .tok-deleted { color: var(--color-syntax-invalid); }
|
||||
|
||||
/* language-specific overrides */
|
||||
.code-editor-container[data-language="json"] .tok-propertyName,
|
||||
.code-editor-container[data-language="json5"] .tok-propertyName,
|
||||
.code-editor-container[data-language="yaml"] .tok-propertyName { color: var(--color-syntax-tag); }
|
||||
.code-editor-container[data-language="css"] .tok-propertyName { color: var(--color-syntax-name); }
|
||||
.code-editor-container[data-language="html"] .tok-propertyName,
|
||||
.code-editor-container[data-language="xml"] .tok-propertyName { color: var(--color-syntax-attribute); }
|
||||
|
||||
/* context menu — uses tippy "menu" theme for base styling */
|
||||
.cm-context-menu {
|
||||
min-width: 200px;
|
||||
font-size: 13px;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.cm-context-menu .item {
|
||||
height: 24px !important;
|
||||
padding: 0 12px !important;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.cm-context-menu .item.disabled {
|
||||
color: var(--color-text-light-3);
|
||||
cursor: default;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.cm-context-menu-keys {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 2px;
|
||||
margin-left: auto;
|
||||
padding-left: 30px;
|
||||
}
|
||||
|
||||
.cm-context-menu-separator {
|
||||
border-top: 1px solid var(--color-secondary);
|
||||
margin: 4px 0;
|
||||
}
|
||||
@@ -56,15 +56,6 @@
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.ui.comments .comment .author {
|
||||
font-size: 1em;
|
||||
font-weight: var(--font-weight-medium);
|
||||
}
|
||||
|
||||
.ui.comments .comment a.author {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.ui.comments .comment .metadata {
|
||||
display: inline-block;
|
||||
margin-left: 0.5em;
|
||||
|
||||
@@ -14,3 +14,21 @@
|
||||
.ui.container.medium-width {
|
||||
width: 800px;
|
||||
}
|
||||
|
||||
.ui.message.web-banner-container {
|
||||
position: relative;
|
||||
margin: 0;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.ui.message.web-banner-container > .web-banner-content {
|
||||
width: 1280px;
|
||||
max-width: calc(100% - calc(2 * var(--page-margin-x)));
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.ui.message.web-banner-container > button.dismiss-banner {
|
||||
position: absolute;
|
||||
right: 20px;
|
||||
top: 15px;
|
||||
}
|
||||
|
||||
@@ -36,8 +36,3 @@ h4.divider {
|
||||
.divider.divider-text::after {
|
||||
margin-left: .75em;
|
||||
}
|
||||
|
||||
.ui.dropdown .menu > .divider {
|
||||
border-top: 1px solid var(--color-secondary);
|
||||
margin: 4px 0;
|
||||
}
|
||||
|
||||
@@ -0,0 +1,954 @@
|
||||
/* These are the remnants of the fomantic dropdown module */
|
||||
|
||||
.ui.dropdown {
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
outline: none;
|
||||
text-align: left;
|
||||
user-select: none;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
}
|
||||
|
||||
.ui.dropdown .menu {
|
||||
cursor: auto;
|
||||
position: absolute;
|
||||
display: none;
|
||||
outline: none;
|
||||
top: 100%;
|
||||
min-width: max-content;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background: var(--color-menu);
|
||||
font-size: 1em;
|
||||
text-align: left;
|
||||
box-shadow: 0 6px 18px var(--color-shadow);
|
||||
border: 1px solid var(--color-secondary);
|
||||
border-radius: 0.28571429rem;
|
||||
z-index: 11;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.ui.dropdown .menu > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.ui.dropdown > input:not(.search):first-child,
|
||||
.ui.dropdown > select {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.ui.dropdown > .dropdown.icon {
|
||||
line-height: 1;
|
||||
height: 1em;
|
||||
width: auto;
|
||||
backface-visibility: hidden;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.ui.dropdown:not(.labeled) > .dropdown.icon {
|
||||
position: relative;
|
||||
width: auto;
|
||||
font-size: 0.85714286em;
|
||||
margin: 0 0 0 1em;
|
||||
}
|
||||
|
||||
.ui.dropdown > .text {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.ui.dropdown .menu > .item {
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
display: block;
|
||||
border: none;
|
||||
height: auto;
|
||||
min-height: 2.57142857rem;
|
||||
text-align: left;
|
||||
border-top: none;
|
||||
line-height: var(--line-height-default);
|
||||
font-size: 1rem;
|
||||
color: var(--color-text);
|
||||
padding: 0.78571429rem 1.14285714rem !important;
|
||||
text-transform: none;
|
||||
font-weight: var(--font-weight-normal);
|
||||
box-shadow: none;
|
||||
-webkit-touch-callout: none;
|
||||
}
|
||||
|
||||
.ui.dropdown .menu > .item:first-child {
|
||||
border-top-width: 0;
|
||||
}
|
||||
|
||||
.ui.dropdown .menu > .header {
|
||||
margin: 1rem 0 0.75rem;
|
||||
padding: 0 1.14285714rem;
|
||||
font-weight: var(--font-weight-medium);
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
.ui.dropdown .menu > .header:not(.ui) {
|
||||
color: var(--color-text);
|
||||
font-size: 0.95em;
|
||||
}
|
||||
|
||||
.ui.dropdown .menu > .divider {
|
||||
border-top: 1px solid var(--color-secondary);
|
||||
height: 0;
|
||||
margin: 4px 0;
|
||||
}
|
||||
|
||||
.ui.dropdown.dropdown .menu > .input {
|
||||
width: auto;
|
||||
display: flex;
|
||||
margin: 1.14285714rem 0.78571429rem;
|
||||
min-width: 10rem;
|
||||
}
|
||||
|
||||
.ui.dropdown .menu > .header + .input {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.ui.dropdown .menu > .input:not(.transparent) input {
|
||||
padding: 0.5em 1em;
|
||||
}
|
||||
|
||||
.ui.dropdown .menu > .input:not(.transparent) .button,
|
||||
.ui.dropdown .menu > .input:not(.transparent) i.icon,
|
||||
.ui.dropdown .menu > .input:not(.transparent) .label {
|
||||
padding-top: 0.5em;
|
||||
padding-bottom: 0.5em;
|
||||
}
|
||||
|
||||
.ui.dropdown > .text > .description,
|
||||
.ui.dropdown .menu > .item > .description {
|
||||
float: right;
|
||||
margin: 0 0 0 1em;
|
||||
color: var(--color-text-light-2);
|
||||
}
|
||||
|
||||
.ui.dropdown .menu > .message {
|
||||
padding: 0.78571429rem 1.14285714rem;
|
||||
font-weight: var(--font-weight-normal);
|
||||
}
|
||||
|
||||
.ui.dropdown .menu > .message:not(.ui) {
|
||||
color: var(--color-text-light-2);
|
||||
}
|
||||
|
||||
/* Remove Menu Item Divider */
|
||||
.ui.dropdown .ui.menu > .item::before,
|
||||
.ui.menu .ui.dropdown .menu > .item::before {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Prevent Menu Item Border */
|
||||
.ui.menu .ui.dropdown .menu .active.item {
|
||||
border-left: none;
|
||||
}
|
||||
|
||||
/* Automatically float dropdown menu right on last menu item */
|
||||
.ui.menu .right.menu .dropdown:last-child > .menu:not(.left),
|
||||
.ui.menu .right.dropdown.item > .menu:not(.left),
|
||||
.ui.buttons > .ui.dropdown:last-child > .menu:not(.left) {
|
||||
left: auto;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.ui.button.dropdown .menu {
|
||||
min-width: 100%;
|
||||
}
|
||||
|
||||
select.ui.dropdown {
|
||||
height: 38px;
|
||||
padding: 0.5em;
|
||||
border: 1px solid var(--color-input-border);
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
.ui.selection.dropdown {
|
||||
cursor: pointer;
|
||||
overflow-wrap: break-word;
|
||||
line-height: 1em;
|
||||
white-space: normal;
|
||||
outline: 0;
|
||||
transform: rotateZ(0deg);
|
||||
min-width: 14em;
|
||||
min-height: 2.71428571em;
|
||||
background: var(--color-input-background);
|
||||
display: inline-block;
|
||||
padding: 0.78571429em 3.2em 0.78571429em 1em;
|
||||
color: var(--color-input-text);
|
||||
box-shadow: none;
|
||||
border: 1px solid var(--color-input-border);
|
||||
border-radius: 0.28571429rem;
|
||||
}
|
||||
|
||||
.ui.selection.dropdown.visible,
|
||||
.ui.selection.dropdown.active {
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.ui.selection.dropdown > .search.icon,
|
||||
.ui.selection.dropdown > .delete.icon,
|
||||
.ui.selection.dropdown > .dropdown.icon {
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
width: auto;
|
||||
height: auto;
|
||||
line-height: 1.21428571em;
|
||||
top: 0.78571429em;
|
||||
right: 1em;
|
||||
z-index: 3;
|
||||
margin: -0.78571429em;
|
||||
padding: 0.91666667em;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.ui.selection.dropdown .menu {
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
backface-visibility: hidden;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
border-top-width: 0 !important;
|
||||
outline: none;
|
||||
margin: 0 -1px;
|
||||
min-width: calc(100% + 2px);
|
||||
width: calc(100% + 2px);
|
||||
border-radius: 0 0 0.28571429rem 0.28571429rem;
|
||||
box-shadow: 0 6px 18px var(--color-shadow);
|
||||
}
|
||||
|
||||
.ui.selection.dropdown .menu::after,
|
||||
.ui.selection.dropdown .menu::before {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.ui.selection.dropdown .menu > .message {
|
||||
padding: 0.78571429rem 1.14285714rem;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 767.98px) {
|
||||
.ui.selection.dropdown .menu {
|
||||
max-height: 8.01428571rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 768px) {
|
||||
.ui.selection.dropdown .menu {
|
||||
max-height: 10.68571429rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 992px) {
|
||||
.ui.selection.dropdown .menu {
|
||||
max-height: 16.02857143rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 1920px) {
|
||||
.ui.selection.dropdown .menu {
|
||||
max-height: 21.37142857rem;
|
||||
}
|
||||
}
|
||||
|
||||
.ui.selection.dropdown .menu > .item {
|
||||
border-top: 1px solid var(--color-secondary);
|
||||
padding: 0.78571429rem 1.14285714rem !important;
|
||||
white-space: normal;
|
||||
overflow-wrap: normal;
|
||||
}
|
||||
|
||||
.ui.selection.dropdown .menu .item:first-of-type {
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.ui.selection.dropdown .menu > .hidden.addition.item {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.ui.selection.dropdown:hover {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.ui.selection.active.dropdown {
|
||||
border-color: var(--color-primary);
|
||||
box-shadow: 0 6px 18px var(--color-shadow);
|
||||
border-bottom-left-radius: 0 !important;
|
||||
border-bottom-right-radius: 0 !important;
|
||||
}
|
||||
|
||||
.ui.selection.active.dropdown .menu {
|
||||
border-color: var(--color-primary);
|
||||
box-shadow: 0 6px 18px var(--color-shadow);
|
||||
}
|
||||
|
||||
.ui.selection.dropdown:focus {
|
||||
border-color: var(--color-primary);
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.ui.selection.dropdown:focus .menu {
|
||||
border-color: var(--color-primary);
|
||||
box-shadow: 0 6px 18px var(--color-shadow);
|
||||
}
|
||||
|
||||
.ui.selection.visible.dropdown > .text:not(.default) {
|
||||
font-weight: var(--font-weight-normal);
|
||||
color: var(--color-text);
|
||||
}
|
||||
|
||||
.ui.selection.active.dropdown:hover {
|
||||
border-color: var(--color-primary);
|
||||
box-shadow: 0 6px 18px var(--color-shadow);
|
||||
}
|
||||
|
||||
.ui.selection.active.dropdown:hover .menu {
|
||||
border-color: var(--color-primary);
|
||||
box-shadow: 0 6px 18px var(--color-shadow);
|
||||
}
|
||||
|
||||
.ui.active.selection.dropdown > .dropdown.icon,
|
||||
.ui.visible.selection.dropdown > .dropdown.icon {
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
.ui.active.empty.selection.dropdown {
|
||||
border-radius: 0.28571429rem !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.ui.active.empty.selection.dropdown .menu {
|
||||
border: none !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.ui.search.dropdown > input.search {
|
||||
background: none transparent !important;
|
||||
border: none !important;
|
||||
box-shadow: none !important;
|
||||
cursor: text;
|
||||
top: 0;
|
||||
left: 1px;
|
||||
width: 100%;
|
||||
outline: none;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
padding: inherit;
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.ui.search.dropdown > .text {
|
||||
cursor: text;
|
||||
position: relative;
|
||||
left: 1px;
|
||||
z-index: auto;
|
||||
}
|
||||
|
||||
.ui.search.selection.dropdown > input.search {
|
||||
line-height: 1.21428571em;
|
||||
padding: 0.67857143em 3.2em 0.67857143em 1em;
|
||||
}
|
||||
|
||||
.ui.search.selection.dropdown > span.sizer {
|
||||
line-height: 1.21428571em;
|
||||
padding: 0.67857143em 3.2em 0.67857143em 1em;
|
||||
display: none;
|
||||
white-space: pre;
|
||||
}
|
||||
|
||||
.ui.search.dropdown.active > input.search,
|
||||
.ui.search.dropdown.visible > input.search {
|
||||
cursor: auto;
|
||||
}
|
||||
|
||||
.ui.search.dropdown.active > .text,
|
||||
.ui.search.dropdown.visible > .text {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.ui.active.search.dropdown input.search:focus + .text i.icon {
|
||||
opacity: var(--opacity-disabled);
|
||||
}
|
||||
|
||||
.ui.active.search.dropdown input.search:focus + .text {
|
||||
color: var(--color-placeholder-text) !important;
|
||||
}
|
||||
|
||||
.ui.search.dropdown .menu {
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
backface-visibility: hidden;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 767.98px) {
|
||||
.ui.search.dropdown .menu {
|
||||
max-height: 8.01428571rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 768px) {
|
||||
.ui.search.dropdown .menu {
|
||||
max-height: 10.68571429rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 992px) {
|
||||
.ui.search.dropdown .menu {
|
||||
max-height: 16.02857143rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 1920px) {
|
||||
.ui.search.dropdown .menu {
|
||||
max-height: 21.37142857rem;
|
||||
}
|
||||
}
|
||||
|
||||
.ui.dropdown > .remove.icon {
|
||||
cursor: pointer;
|
||||
font-size: 0.85714286em;
|
||||
margin: -0.78571429em;
|
||||
padding: 0.91666667em;
|
||||
right: 3em;
|
||||
top: 0.78571429em;
|
||||
position: absolute;
|
||||
opacity: 0.6;
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
.ui.clearable.dropdown .text,
|
||||
.ui.clearable.dropdown a:last-of-type {
|
||||
margin-right: 1.5em;
|
||||
}
|
||||
|
||||
.ui.dropdown select.noselection ~ .remove.icon,
|
||||
.ui.dropdown input[value=""] ~ .remove.icon,
|
||||
.ui.dropdown input:not([value]) ~ .remove.icon,
|
||||
.ui.dropdown.loading > .remove.icon {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.ui.ui.multiple.dropdown {
|
||||
padding: 0.22619048em 3.2em 0.22619048em 0.35714286em;
|
||||
}
|
||||
|
||||
.ui.multiple.dropdown .menu {
|
||||
cursor: auto;
|
||||
}
|
||||
|
||||
.ui.multiple.dropdown > .label {
|
||||
display: inline-block;
|
||||
white-space: normal;
|
||||
font-size: 1em;
|
||||
padding: 0.35714286em 0.78571429em;
|
||||
margin: 0.14285714rem 0.28571429rem 0.14285714rem 0;
|
||||
box-shadow: 0 0 0 1px var(--color-secondary) inset;
|
||||
}
|
||||
|
||||
/* Text */
|
||||
.ui.multiple.dropdown > .text {
|
||||
position: static;
|
||||
padding: 0;
|
||||
max-width: 100%;
|
||||
margin: 0.45238095em 0 0.45238095em 0.64285714em;
|
||||
line-height: 1.21428571em;
|
||||
}
|
||||
|
||||
.ui.multiple.dropdown > .text.default {
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.ui.multiple.dropdown > .label ~ input.search {
|
||||
margin-left: 0.14285714em !important;
|
||||
}
|
||||
|
||||
.ui.multiple.dropdown > .label ~ .text {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.ui.multiple.search.dropdown,
|
||||
.ui.multiple.search.dropdown > input.search {
|
||||
cursor: text;
|
||||
}
|
||||
|
||||
.ui.multiple.search.dropdown > .text {
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
padding: inherit;
|
||||
margin: 0.45238095em 0 0.45238095em 0.64285714em;
|
||||
line-height: 1.21428571em;
|
||||
}
|
||||
|
||||
.ui.multiple.search.dropdown > .label ~ .text {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.ui.multiple.search.dropdown > input.search {
|
||||
position: static;
|
||||
padding: 0;
|
||||
max-width: 100%;
|
||||
margin: 0.45238095em 0 0.45238095em 0.64285714em;
|
||||
width: 2.2em;
|
||||
line-height: 1.21428571em;
|
||||
}
|
||||
|
||||
.ui.dropdown .menu .active.item {
|
||||
background: var(--color-active);
|
||||
font-weight: var(--font-weight-normal);
|
||||
color: var(--color-text);
|
||||
box-shadow: none;
|
||||
z-index: 12;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.ui.dropdown .menu > .item:hover {
|
||||
background: var(--color-hover);
|
||||
color: var(--color-text);
|
||||
z-index: 13;
|
||||
}
|
||||
|
||||
.ui.dropdown .menu > .item:active {
|
||||
color: var(--color-text);
|
||||
background: var(--color-active);
|
||||
}
|
||||
|
||||
.ui.dropdown:not(.button) > .default.text,
|
||||
.ui.default.dropdown:not(.button) > .text {
|
||||
color: var(--color-placeholder-text);
|
||||
}
|
||||
|
||||
.ui.dropdown:not(.button) > input:focus ~ .default.text,
|
||||
.ui.default.dropdown:not(.button) > input:focus ~ .text {
|
||||
color: var(--color-placeholder-text);
|
||||
}
|
||||
|
||||
.ui.loading.dropdown > i.icon {
|
||||
height: 1em !important;
|
||||
}
|
||||
|
||||
.ui.loading.selection.dropdown > i.icon {
|
||||
padding: 1.5em 1.28571429em !important;
|
||||
}
|
||||
|
||||
.ui.loading.dropdown > i.icon::before {
|
||||
position: absolute;
|
||||
content: "";
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
margin: -0.64285714em 0 0 -0.64285714em;
|
||||
width: 1.28571429em;
|
||||
height: 1.28571429em;
|
||||
border-radius: 500rem;
|
||||
border: 0.2em solid var(--color-secondary);
|
||||
}
|
||||
|
||||
.ui.loading.dropdown > i.icon::after {
|
||||
position: absolute;
|
||||
content: "";
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
box-shadow: 0 0 0 1px transparent;
|
||||
margin: -0.64285714em 0 0 -0.64285714em;
|
||||
width: 1.28571429em;
|
||||
height: 1.28571429em;
|
||||
animation: loader 0.6s infinite linear;
|
||||
border: 0.2em solid var(--color-text-light-2);
|
||||
border-radius: 500rem;
|
||||
}
|
||||
|
||||
.ui.dropdown .loading.menu {
|
||||
display: block;
|
||||
visibility: hidden;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.ui.dropdown > .loading.menu {
|
||||
left: 0 !important;
|
||||
right: auto !important;
|
||||
}
|
||||
|
||||
.ui.dropdown > .menu .loading.menu {
|
||||
left: 100% !important;
|
||||
right: auto !important;
|
||||
}
|
||||
|
||||
.ui.dropdown.selected,
|
||||
.ui.dropdown .menu .selected.item {
|
||||
color: var(--color-text);
|
||||
background: var(--color-hover);
|
||||
}
|
||||
|
||||
.ui.dropdown > .filtered.text {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.ui.dropdown .filtered.item {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.ui.disabled.dropdown,
|
||||
.ui.dropdown .menu > .disabled.item {
|
||||
cursor: default;
|
||||
pointer-events: none;
|
||||
opacity: var(--opacity-disabled);
|
||||
}
|
||||
|
||||
.ui.dropdown > .left.menu {
|
||||
left: auto !important;
|
||||
right: 0 !important;
|
||||
}
|
||||
|
||||
.ui.upward.dropdown > .menu {
|
||||
top: auto;
|
||||
bottom: 100%;
|
||||
box-shadow: 0 6px 18px var(--color-shadow);
|
||||
border-radius: 0.28571429rem 0.28571429rem 0 0;
|
||||
}
|
||||
|
||||
.ui.dropdown .upward.menu {
|
||||
top: auto !important;
|
||||
bottom: 0 !important;
|
||||
}
|
||||
|
||||
.ui.upward.selection.dropdown .menu {
|
||||
border-top-width: 1px !important;
|
||||
border-bottom-width: 0 !important;
|
||||
box-shadow: 0 6px 18px var(--color-shadow);
|
||||
}
|
||||
|
||||
.ui.upward.selection.dropdown:hover {
|
||||
box-shadow: 0 0 2px 0 var(--color-shadow);
|
||||
}
|
||||
|
||||
.ui.active.upward.selection.dropdown {
|
||||
border-radius: 0 0 0.28571429rem 0.28571429rem !important;
|
||||
}
|
||||
|
||||
.ui.upward.selection.dropdown.visible {
|
||||
box-shadow: 0 0 3px 0 var(--color-shadow);
|
||||
border-radius: 0 0 0.28571429rem 0.28571429rem !important;
|
||||
}
|
||||
|
||||
.ui.upward.active.selection.dropdown:hover {
|
||||
box-shadow: 0 0 3px 0 var(--color-shadow);
|
||||
}
|
||||
|
||||
.ui.upward.active.selection.dropdown:hover .menu {
|
||||
box-shadow: 0 6px 18px var(--color-shadow);
|
||||
}
|
||||
|
||||
.ui.scrolling.dropdown .menu,
|
||||
.ui.dropdown .scrolling.menu {
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.ui.scrolling.dropdown .menu {
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
backface-visibility: hidden;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
min-width: 100% !important;
|
||||
width: auto !important;
|
||||
}
|
||||
|
||||
.ui.dropdown .scrolling.menu {
|
||||
position: static;
|
||||
overflow-y: auto;
|
||||
border: none;
|
||||
box-shadow: none !important;
|
||||
margin: 0 !important;
|
||||
min-width: 100% !important;
|
||||
width: auto !important;
|
||||
border-top: 1px solid var(--color-secondary);
|
||||
border-color: var(--color-secondary);
|
||||
border-radius: 0 0 var(--border-radius) var(--border-radius) !important;
|
||||
}
|
||||
|
||||
.ui.scrolling.dropdown .menu .item.item.item,
|
||||
.ui.dropdown .scrolling.menu > .item.item.item {
|
||||
border-top: none;
|
||||
}
|
||||
|
||||
.ui.scrolling.dropdown .menu .item:first-child,
|
||||
.ui.dropdown .scrolling.menu .item:first-child {
|
||||
border-top: none;
|
||||
}
|
||||
|
||||
.ui.dropdown > .animating.menu .scrolling.menu,
|
||||
.ui.dropdown > .visible.menu .scrolling.menu {
|
||||
display: block;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 767.98px) {
|
||||
.ui.scrolling.dropdown .menu,
|
||||
.ui.dropdown .scrolling.menu {
|
||||
max-height: 10.28571429rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 768px) {
|
||||
.ui.scrolling.dropdown .menu,
|
||||
.ui.dropdown .scrolling.menu {
|
||||
max-height: 15.42857143rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 992px) {
|
||||
.ui.scrolling.dropdown .menu,
|
||||
.ui.dropdown .scrolling.menu {
|
||||
max-height: 20.57142857rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 1920px) {
|
||||
.ui.scrolling.dropdown .menu,
|
||||
.ui.dropdown .scrolling.menu {
|
||||
max-height: 20.57142857rem;
|
||||
}
|
||||
}
|
||||
|
||||
.ui.fluid.dropdown {
|
||||
display: block;
|
||||
width: 100% !important;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.ui.fluid.dropdown > .dropdown.icon {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.ui.floating.dropdown .menu {
|
||||
left: 0;
|
||||
right: auto;
|
||||
box-shadow: 0 6px 18px var(--color-shadow) !important;
|
||||
border-radius: 0.28571429rem !important;
|
||||
}
|
||||
|
||||
.ui.floating.dropdown > .menu {
|
||||
border-radius: 0.28571429rem !important;
|
||||
}
|
||||
|
||||
.ui:not(.upward).floating.dropdown > .menu {
|
||||
margin-top: 0.5em;
|
||||
}
|
||||
|
||||
.ui.upward.floating.dropdown > .menu {
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
.ui.pointing.dropdown > .menu {
|
||||
top: 100%;
|
||||
margin-top: 0.78571429rem;
|
||||
border-radius: 0.28571429rem;
|
||||
}
|
||||
|
||||
.ui.pointing.dropdown > .menu:not(.hidden)::after {
|
||||
display: block;
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
content: "";
|
||||
visibility: visible;
|
||||
transform: rotate(45deg);
|
||||
width: 0.5em;
|
||||
height: 0.5em;
|
||||
box-shadow: -1px -1px 0 0 var(--color-secondary);
|
||||
background: var(--color-menu);
|
||||
z-index: 2;
|
||||
top: -0.25em;
|
||||
left: 50%;
|
||||
margin: 0 0 0 -0.25em;
|
||||
}
|
||||
|
||||
.ui.top.right.pointing.dropdown > .menu {
|
||||
inset: 100% 0 auto auto;
|
||||
margin: 1em 0 0;
|
||||
}
|
||||
|
||||
.ui.top.pointing.dropdown > .left.menu::after,
|
||||
.ui.top.right.pointing.dropdown > .menu::after {
|
||||
top: -0.25em;
|
||||
left: auto !important;
|
||||
right: 1em !important;
|
||||
margin: 0;
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
|
||||
.ui.dropdown,
|
||||
.ui.dropdown .menu > .item {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.ui.mini.dropdown,
|
||||
.ui.mini.dropdown .menu > .item {
|
||||
font-size: 0.78571429rem;
|
||||
}
|
||||
|
||||
.ui.tiny.dropdown,
|
||||
.ui.tiny.dropdown .menu > .item {
|
||||
font-size: 0.85714286rem;
|
||||
}
|
||||
|
||||
.ui.small.dropdown,
|
||||
.ui.small.dropdown .menu > .item {
|
||||
font-size: 0.92857143rem;
|
||||
}
|
||||
|
||||
/* This rule must come AFTER .ui.selection.dropdown because both have
|
||||
specificity (0,3,0) and source order determines the winner.
|
||||
In the original codebase this was in base.css which loaded after fomantic. */
|
||||
.ui.dropdown:not(.button) {
|
||||
line-height: var(--line-height-default);
|
||||
}
|
||||
|
||||
/* Icons / Flags / Labels / Image */
|
||||
.ui.dropdown > .text > img,
|
||||
.ui.dropdown > .text > .image,
|
||||
.ui.dropdown .menu > .item > .image,
|
||||
.ui.dropdown .menu > .item > img {
|
||||
margin-left: 0;
|
||||
float: none;
|
||||
margin-right: 0.78571429rem;
|
||||
}
|
||||
|
||||
.ui.dropdown .menu > .item > svg {
|
||||
margin-right: 0.78rem;
|
||||
}
|
||||
|
||||
/* extend fomantic style '.ui.dropdown > .text > img' to include svg.img */
|
||||
.ui.dropdown > .text > .img {
|
||||
margin-left: 0;
|
||||
float: none;
|
||||
margin-right: 0.78571429rem;
|
||||
}
|
||||
|
||||
.ui.dropdown > .text > img,
|
||||
.ui.dropdown > .text > .image:not(.icon),
|
||||
.ui.dropdown .menu > .item > .image:not(.icon),
|
||||
.ui.dropdown .menu > .item > img {
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
width: auto;
|
||||
margin-top: -0.25rem;
|
||||
margin-bottom: -0.25rem;
|
||||
max-height: 2em;
|
||||
}
|
||||
|
||||
.ui.dropdown .menu .item {
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.ui.dropdown .menu .item:first-of-type {
|
||||
border-radius: var(--border-radius) var(--border-radius) 0 0;
|
||||
}
|
||||
|
||||
.ui.dropdown .menu .item:last-of-type {
|
||||
border-radius: 0 0 var(--border-radius) var(--border-radius);
|
||||
}
|
||||
|
||||
/* Gitea uses SVG images instead of Fomantic builtin "<i>" font icons, so we need to reset the icon styles */
|
||||
.ui.ui.dropdown > .icon.icon {
|
||||
position: initial;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.ui.ui.dropdown > .icon.icon:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.ui.ui.button.dropdown > .icon.icon,
|
||||
.ui.ui.selection.dropdown > .icon.icon {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
.ui.ui.dropdown > .dropdown.icon {
|
||||
right: 0.5em;
|
||||
}
|
||||
|
||||
.ui.ui.dropdown > .remove.icon {
|
||||
right: 2em;
|
||||
}
|
||||
|
||||
.ui.dropdown.mini.button,
|
||||
.ui.dropdown.tiny.button {
|
||||
padding-right: 20px;
|
||||
}
|
||||
|
||||
.ui.dropdown.button {
|
||||
padding-right: 22px;
|
||||
}
|
||||
|
||||
.ui.multiple.selection.dropdown {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.ui.ui.dropdown.selection {
|
||||
min-width: 14em;
|
||||
}
|
||||
|
||||
.ui.dropdown .ui.label .svg {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.ui.dropdown > .ui.button {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* popover box shadow for menu dropdown */
|
||||
.ui.menu .dropdown.item .menu {
|
||||
box-shadow: 0 6px 18px var(--color-shadow);
|
||||
}
|
||||
|
||||
.ui.dropdown .menu.context-user-switch .scrolling.menu {
|
||||
border-radius: 0 !important;
|
||||
box-shadow: none !important;
|
||||
border-bottom: 1px solid var(--color-secondary);
|
||||
max-width: 80vw;
|
||||
}
|
||||
|
||||
.scrolling.menu .item.selected {
|
||||
font-weight: var(--font-weight-semibold) !important;
|
||||
}
|
||||
|
||||
/* to override Fomantic's default display: block for ".menu .item", and use a slightly larger gap for menu item content
|
||||
the "!important" is necessary to override Fomantic UI menu item styles, meanwhile we should keep the "hidden" items still hidden */
|
||||
.ui.dropdown .menu.flex-items-menu > .item:not(.hidden, .filtered, .tw-hidden) {
|
||||
display: flex !important;
|
||||
align-items: center;
|
||||
gap: var(--gap-block);
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.ui.dropdown .menu.flex-items-menu > .item img,
|
||||
.ui.dropdown .menu.flex-items-menu > .item svg {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.ui.dropdown.ellipsis-text-items {
|
||||
/* reset y padding and use the line-height below instead, to avoid the "overflow: hidden" clips the larger image in the "text" element */
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.ui.dropdown.ellipsis-text-items > .text {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
line-height: 2.71;
|
||||
}
|
||||
|
||||
.ui.dropdown.ellipsis-text-items .menu > .item {
|
||||
white-space: nowrap !important;
|
||||
overflow: hidden !important;
|
||||
text-overflow: ellipsis !important;
|
||||
}
|
||||
@@ -0,0 +1,483 @@
|
||||
.ui.form {
|
||||
position: relative;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.ui.form > p {
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
.ui.form .field {
|
||||
clear: both;
|
||||
margin: 0 0 1em;
|
||||
}
|
||||
|
||||
.ui.form .fields .fields,
|
||||
.ui.form .field:last-child,
|
||||
.ui.form .fields:last-child .field {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.ui.form .fields .field {
|
||||
clear: both;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.ui.form .field > label {
|
||||
display: block;
|
||||
margin: 0 0 0.28571429rem;
|
||||
color: var(--color-text);
|
||||
font-size: 0.92857143em;
|
||||
font-weight: var(--font-weight-medium);
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
.ui.form textarea,
|
||||
.ui.form input:not([type="checkbox"], [type="radio"]) {
|
||||
width: 100%;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.ui.form ::-webkit-datetime-edit,
|
||||
.ui.form ::-webkit-inner-spin-button {
|
||||
height: 1.21428571em;
|
||||
}
|
||||
|
||||
.ui.form input:not([type="checkbox"], [type="radio"]),
|
||||
.ui.search > .prompt {
|
||||
font-family: var(--fonts-regular);
|
||||
margin: 0;
|
||||
outline: none;
|
||||
line-height: 1.21428571;
|
||||
padding: 0.67857143em 1em;
|
||||
font-size: 1em;
|
||||
color: var(--color-text);
|
||||
border-radius: 0.28571429rem;
|
||||
}
|
||||
|
||||
.ui.input textarea,
|
||||
.ui.form textarea {
|
||||
margin: 0;
|
||||
padding: 0.78571429em 1em;
|
||||
outline: none;
|
||||
color: var(--color-text);
|
||||
border-radius: 0.28571429rem;
|
||||
font-size: 1em;
|
||||
font-family: var(--fonts-regular);
|
||||
line-height: 1.2857;
|
||||
resize: vertical;
|
||||
}
|
||||
|
||||
.ui.form textarea:not([rows]) {
|
||||
height: var(--min-height-textarea);
|
||||
min-height: var(--min-height-textarea);
|
||||
max-height: 24em;
|
||||
}
|
||||
|
||||
input:not([type="checkbox"], [type="radio"]),
|
||||
textarea,
|
||||
.ui.input > input,
|
||||
.ui.form input:not([type="checkbox"], [type="radio"]),
|
||||
.ui.form select,
|
||||
.ui.form textarea,
|
||||
.ui.selection.dropdown,
|
||||
.ui.search > .prompt {
|
||||
background: var(--color-input-background);
|
||||
border: 1px solid var(--color-input-border);
|
||||
color: var(--color-input-text);
|
||||
}
|
||||
|
||||
input:not([type="checkbox"], [type="radio"]):focus,
|
||||
textarea:focus,
|
||||
.ui.input input:focus,
|
||||
.ui.form input:not([type="checkbox"], [type="radio"]):focus,
|
||||
.ui.form select:focus,
|
||||
.ui.form textarea:focus,
|
||||
.ui.search > .prompt:focus {
|
||||
background: var(--color-input-background);
|
||||
border-color: var(--color-primary);
|
||||
color: var(--color-input-text);
|
||||
}
|
||||
|
||||
.ui.form input:not([type="checkbox"], [type="radio"])[readonly],
|
||||
.ui.form textarea[readonly],
|
||||
.ui.form select[readonly],
|
||||
.ui.form .ui.selection.dropdown[readonly] {
|
||||
background: var(--color-secondary-bg);
|
||||
}
|
||||
|
||||
.ui.input {
|
||||
color: var(--color-input-text);
|
||||
}
|
||||
|
||||
.ui.form textarea,
|
||||
.ui.form input[type="checkbox"] {
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.ui.form .fields:not(.grouped):not(.inline) .field:not(:only-child) label + .ui.ui.checkbox {
|
||||
margin-top: 0.7em;
|
||||
}
|
||||
.ui.form .fields:not(.grouped):not(.inline) .field:not(:only-child) .ui.checkbox {
|
||||
margin-top: 2.41428571em;
|
||||
}
|
||||
.ui.form .fields:not(.grouped):not(.inline) .field:not(:only-child) .ui.toggle.checkbox {
|
||||
margin-top: 2.21428571em;
|
||||
}
|
||||
.ui.form .fields:not(.grouped):not(.inline) .field:not(:only-child) .ui.slider.checkbox {
|
||||
margin-top: 2.61428571em;
|
||||
}
|
||||
.ui.ui.form .field .fields .field:not(:only-child) .ui.checkbox {
|
||||
margin-top: 0.6em;
|
||||
}
|
||||
.ui.ui.form .field .fields .field:not(:only-child) .ui.toggle.checkbox {
|
||||
margin-top: 0.5em;
|
||||
}
|
||||
.ui.ui.form .field .fields .field:not(:only-child) .ui.slider.checkbox {
|
||||
margin-top: 0.7em;
|
||||
}
|
||||
|
||||
.ui.form .field > .selection.dropdown {
|
||||
min-width: 14em; /* matches the default min width */
|
||||
width: 100%;
|
||||
}
|
||||
.ui.form .field > .selection.dropdown > .dropdown.icon {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.ui.form .inline.fields .field > .selection.dropdown,
|
||||
.ui.form .inline.field > .selection.dropdown {
|
||||
width: auto;
|
||||
}
|
||||
.ui.form .inline.fields .field > .selection.dropdown > .dropdown.icon,
|
||||
.ui.form .inline.field > .selection.dropdown > .dropdown.icon {
|
||||
float: none;
|
||||
}
|
||||
|
||||
.ui.form .field .ui.input,
|
||||
.ui.form .fields .field .ui.input {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.ui.form .inline.fields .field .ui.input,
|
||||
.ui.form .inline.field .ui.input {
|
||||
width: auto;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.ui.form .fields .field .ui.input input,
|
||||
.ui.form .field .ui.input input {
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.ui.form .error.message,
|
||||
.ui.form .error.message:empty {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.ui.form .message:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.ui.form .ui.action.input:not([class*="left action"]) input:focus {
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
.ui.form .ui[class*="left action"].input input {
|
||||
border-bottom-left-radius: 0;
|
||||
border-top-left-radius: 0;
|
||||
}
|
||||
|
||||
.ui.form.error .error.message:not(:empty) {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.ui.form .fields.error .error.message:not(:empty),
|
||||
.ui.form .field.error .error.message:not(:empty) {
|
||||
display: block;
|
||||
}
|
||||
.ui.form .fields.error .field textarea,
|
||||
.ui.form .fields.error .field select,
|
||||
.ui.form .fields.error .field input,
|
||||
.ui.form .field.error textarea,
|
||||
.ui.form .field.error select,
|
||||
.ui.form .field.error input {
|
||||
background-color: var(--color-error-bg);
|
||||
border-color: var(--color-error-border);
|
||||
color: var(--color-input-text);
|
||||
}
|
||||
.ui.form .field.error textarea:focus,
|
||||
.ui.form .field.error select:focus,
|
||||
.ui.form .field.error input:focus {
|
||||
background-color: var(--color-error-bg);
|
||||
border-color: var(--color-error-border);
|
||||
color: var(--color-input-text);
|
||||
}
|
||||
|
||||
.ui.form .field.error select {
|
||||
appearance: menulist-button;
|
||||
}
|
||||
|
||||
.ui.form .fields.error .field .ui.dropdown,
|
||||
.ui.form .field.error .ui.dropdown {
|
||||
border-color: var(--color-error-border);
|
||||
}
|
||||
.ui.form .fields.error .field .ui.dropdown:hover,
|
||||
.ui.form .field.error .ui.dropdown:hover {
|
||||
border-color: var(--color-error-border);
|
||||
}
|
||||
|
||||
.ui.form .fields.error .field .ui.dropdown .menu .item:hover,
|
||||
.ui.form .field.error .ui.dropdown .menu .item:hover {
|
||||
background-color: var(--color-error-bg-hover);
|
||||
}
|
||||
|
||||
.ui.form .fields.error .field .ui.dropdown .menu .active.item,
|
||||
.ui.form .field.error .ui.dropdown .menu .active.item {
|
||||
background-color: var(--color-error-bg-active) !important;
|
||||
}
|
||||
|
||||
.ui.form .disabled.fields .field,
|
||||
.ui.form .disabled.field,
|
||||
.ui.form .field :disabled {
|
||||
pointer-events: none;
|
||||
opacity: var(--opacity-disabled);
|
||||
}
|
||||
.ui.form .field.disabled > label,
|
||||
.ui.form .fields.disabled > label {
|
||||
opacity: var(--opacity-disabled);
|
||||
}
|
||||
.ui.form .field.disabled :disabled {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.ui.form .required.fields:not(.grouped) > .field > label::after,
|
||||
.ui.form .required.fields.grouped > label::after,
|
||||
.ui.form .required.field > label::after,
|
||||
.ui.form .required.fields:not(.grouped) > .field > .checkbox::after,
|
||||
.ui.form .required.field > .checkbox::after,
|
||||
.ui.form label.required::after {
|
||||
margin: -0.2em 0 0 0.2em;
|
||||
content: "*";
|
||||
color: var(--color-red);
|
||||
}
|
||||
.ui.form .required.fields:not(.grouped) > .field > label::after,
|
||||
.ui.form .required.fields.grouped > label::after,
|
||||
.ui.form .required.field > label::after,
|
||||
.ui.form label.required::after {
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
}
|
||||
.ui.form .required.fields:not(.grouped) > .field > .checkbox::after,
|
||||
.ui.form .required.field > .checkbox::after {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 100%;
|
||||
}
|
||||
|
||||
.ui.form .grouped.fields {
|
||||
display: block;
|
||||
margin: 0 0 1em;
|
||||
}
|
||||
.ui.form .grouped.fields:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.ui.form .grouped.fields > label {
|
||||
margin: 0 0 0.28571429rem;
|
||||
color: var(--color-text);
|
||||
font-size: 0.92857143em;
|
||||
font-weight: var(--font-weight-medium);
|
||||
text-transform: none;
|
||||
}
|
||||
.ui.form .grouped.fields .field,
|
||||
.ui.form .grouped.inline.fields .field {
|
||||
display: block;
|
||||
margin: 0.5em 0;
|
||||
padding: 0;
|
||||
}
|
||||
.ui.form .grouped.inline.fields .ui.checkbox {
|
||||
margin-bottom: 0.4em;
|
||||
}
|
||||
|
||||
.ui.form .fields {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin: 0 -0.5em 1em;
|
||||
}
|
||||
.ui.form .fields > .field {
|
||||
flex: 0 1 auto;
|
||||
padding-left: 0.5em;
|
||||
padding-right: 0.5em;
|
||||
}
|
||||
.ui.form .fields > .field:first-child {
|
||||
border-left: none;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 767.98px) {
|
||||
.ui.form .fields {
|
||||
flex-wrap: wrap;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.ui.form .fields > .fields,
|
||||
.ui.form .fields > .field {
|
||||
width: 100%;
|
||||
margin: 0 0 1em;
|
||||
}
|
||||
}
|
||||
|
||||
.ui.form .inline.fields {
|
||||
margin: 0 0 1em;
|
||||
align-items: center;
|
||||
}
|
||||
.ui.form .inline.fields .field {
|
||||
margin: 0;
|
||||
padding: 0 1em 0 0;
|
||||
}
|
||||
|
||||
.ui.form .inline.fields > label,
|
||||
.ui.form .inline.fields .field > label,
|
||||
.ui.form .inline.fields .field > p,
|
||||
.ui.form .inline.field > label,
|
||||
.ui.form .inline.field > p {
|
||||
display: inline-block;
|
||||
width: auto;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
vertical-align: baseline;
|
||||
font-size: 0.92857143em;
|
||||
font-weight: var(--font-weight-medium);
|
||||
color: var(--color-text);
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
.ui.form .inline.fields > label {
|
||||
margin: 0.035714em 1em 0 0;
|
||||
}
|
||||
|
||||
.ui.form .inline.fields .field > input,
|
||||
.ui.form .inline.fields .field > select,
|
||||
.ui.form .inline.field > input,
|
||||
.ui.form .inline.field > select {
|
||||
display: inline-block;
|
||||
width: auto;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
vertical-align: middle;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
.ui.form .inline.fields .field > :first-child,
|
||||
.ui.form .inline.field > :first-child {
|
||||
margin: 0 0.85714286em 0 0;
|
||||
}
|
||||
.ui.form .inline.fields .field > :only-child,
|
||||
.ui.form .inline.field > :only-child {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.ui.form,
|
||||
.ui.form .field .dropdown,
|
||||
.ui.form .field .dropdown .menu > .item {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
/* previously from web_src/css/form.css */
|
||||
|
||||
.ui .form .autofill-dummy {
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
overflow: hidden;
|
||||
z-index: -10000;
|
||||
}
|
||||
|
||||
.ui .form .sub.field {
|
||||
margin-left: 25px;
|
||||
}
|
||||
|
||||
.ui.form .fields.error .field .ui.dropdown,
|
||||
.ui.form .field.error .ui.dropdown,
|
||||
.ui.form .fields.error .field .ui.dropdown:hover,
|
||||
.ui.form .field.error .ui.dropdown:hover {
|
||||
border-color: var(--color-error-border) !important;
|
||||
}
|
||||
|
||||
.ui.form .fields.error .dropdown .menu,
|
||||
.ui.form .field.error .dropdown .menu {
|
||||
border-color: var(--color-error-border) !important;
|
||||
}
|
||||
|
||||
input:-webkit-autofill,
|
||||
input:-webkit-autofill:focus,
|
||||
input:-webkit-autofill:hover,
|
||||
input:-webkit-autofill:active {
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: var(--color-text);
|
||||
box-shadow: 0 0 0 100px var(--color-primary-light-6) inset !important;
|
||||
border-color: var(--color-primary-light-4) !important;
|
||||
}
|
||||
|
||||
.ui.form .field.muted {
|
||||
opacity: var(--opacity-disabled);
|
||||
}
|
||||
|
||||
.form .help {
|
||||
color: var(--color-secondary-dark-5);
|
||||
margin-top: 0.25em;
|
||||
padding-bottom: 0.6em;
|
||||
display: inline-block;
|
||||
text-wrap: balance;
|
||||
}
|
||||
|
||||
.form .help code {
|
||||
color: var(--color-text-light-1);
|
||||
}
|
||||
|
||||
.form .help pre.command-block {
|
||||
white-space: pre-wrap;
|
||||
overflow-wrap: anywhere;
|
||||
margin: 0.25em 0 0.25em 1em;
|
||||
}
|
||||
|
||||
.ui.form.left-right-form .inline.field > label {
|
||||
text-align: right;
|
||||
width: 250px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.ui.form.left-right-form .inline.field > .help {
|
||||
display: block;
|
||||
margin-left: calc(250px + 15px);
|
||||
}
|
||||
|
||||
.ui.form.left-right-form .inline.field input:not([type="checkbox"], [type="radio"]),
|
||||
.ui.form.left-right-form .inline.field .ui.dropdown,
|
||||
.ui.form.left-right-form .inline.field textarea {
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.ui.form.left-right-form .inline.field .ui.dropdown input.search {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.ui.form.left-right-form .inline.field .inline-right {
|
||||
display: inline-flex;
|
||||
flex-direction: column;
|
||||
gap: 0.5em;
|
||||
}
|
||||
|
||||
@media (max-width: 767.98px) {
|
||||
.ui.form.left-right-form .inline.field > label {
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
text-align: left;
|
||||
}
|
||||
.ui.form.left-right-form .inline.field > .help {
|
||||
margin: 0;
|
||||
}
|
||||
.ui.form.left-right-form .inline.field input:not([type="checkbox"], [type="radio"]),
|
||||
.ui.form.left-right-form .inline.field .ui.dropdown,
|
||||
.ui.form.left-right-form .inline.field textarea {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
@@ -38,7 +38,7 @@
|
||||
.ui.input.error > input {
|
||||
background: var(--color-error-bg);
|
||||
border-color: var(--color-error-border);
|
||||
color: var(--color-error-text);
|
||||
color: var(--color-input-text);
|
||||
}
|
||||
|
||||
.ui.icon.input > i.icon {
|
||||
@@ -124,7 +124,8 @@
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.ui.action.input:not([class*="left action"]) > input {
|
||||
.ui.action.input:not([class*="left action"]) > input,
|
||||
.ui.action.input:not([class*="left action"]) > .ui.input > input {
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
border-right-color: transparent;
|
||||
|
||||
@@ -292,6 +292,7 @@ If the labels-list itself needs some layouts, use extra classes or "tw" helpers.
|
||||
}
|
||||
|
||||
.labels-list a {
|
||||
display: inline-flex;
|
||||
max-width: 100%; /* for ellipsis */
|
||||
}
|
||||
|
||||
|
||||
@@ -25,15 +25,6 @@
|
||||
list-style-position: outside;
|
||||
}
|
||||
|
||||
.ui.list > .list > .item::after,
|
||||
.ui.list > .item::after {
|
||||
content: "";
|
||||
display: block;
|
||||
height: 0;
|
||||
clear: both;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.ui.list .list:not(.icon) {
|
||||
clear: both;
|
||||
margin: 0;
|
||||
|
||||
@@ -41,9 +41,9 @@
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
.ui.info.message .header,
|
||||
.ui.blue.message .header {
|
||||
color: var(--color-blue);
|
||||
.ui.message .header {
|
||||
color: inherit;
|
||||
font-weight: var(--font-weight-semibold);
|
||||
}
|
||||
|
||||
.ui.info.message,
|
||||
@@ -51,31 +51,17 @@
|
||||
.ui.blue.message,
|
||||
.ui.attached.blue.message {
|
||||
background: var(--color-info-bg);
|
||||
color: var(--color-info-text);
|
||||
border-color: var(--color-info-border);
|
||||
}
|
||||
|
||||
.ui.success.message .header,
|
||||
.ui.positive.message .header,
|
||||
.ui.green.message .header {
|
||||
color: var(--color-green);
|
||||
}
|
||||
|
||||
.ui.success.message,
|
||||
.ui.attached.success.message,
|
||||
.ui.positive.message,
|
||||
.ui.attached.positive.message {
|
||||
background: var(--color-success-bg);
|
||||
color: var(--color-success-text);
|
||||
border-color: var(--color-success-border);
|
||||
}
|
||||
|
||||
.ui.error.message .header,
|
||||
.ui.negative.message .header,
|
||||
.ui.red.message .header {
|
||||
color: var(--color-red);
|
||||
}
|
||||
|
||||
.ui.error.message,
|
||||
.ui.attached.error.message,
|
||||
.ui.red.message,
|
||||
@@ -83,21 +69,14 @@
|
||||
.ui.negative.message,
|
||||
.ui.attached.negative.message {
|
||||
background: var(--color-error-bg);
|
||||
color: var(--color-error-text);
|
||||
border-color: var(--color-error-border);
|
||||
}
|
||||
|
||||
.ui.warning.message .header,
|
||||
.ui.yellow.message .header {
|
||||
color: var(--color-yellow);
|
||||
}
|
||||
|
||||
.ui.warning.message,
|
||||
.ui.attached.warning.message,
|
||||
.ui.yellow.message,
|
||||
.ui.attached.yellow.message {
|
||||
background: var(--color-warning-bg);
|
||||
color: var(--color-warning-text);
|
||||
border-color: var(--color-warning-border);
|
||||
}
|
||||
|
||||
|
||||
@@ -1,3 +1,290 @@
|
||||
/* These are the remnants of the fomantic modal module */
|
||||
|
||||
.ui.modal {
|
||||
position: absolute;
|
||||
display: none;
|
||||
z-index: var(--z-index-modal);
|
||||
text-align: left;
|
||||
background: var(--color-body);
|
||||
border: none;
|
||||
box-shadow: 1px 3px 3px 0 var(--color-shadow), 1px 3px 15px 2px var(--color-shadow);
|
||||
transform-origin: 50% 25%;
|
||||
flex: 0 0 auto;
|
||||
border-radius: var(--border-radius);
|
||||
user-select: text;
|
||||
will-change: top, left, margin, transform, opacity;
|
||||
}
|
||||
|
||||
.ui.modal > :first-child:not(.icon) {
|
||||
border-top-left-radius: var(--border-radius);
|
||||
border-top-right-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
.ui.modal > :last-child {
|
||||
border-bottom-left-radius: var(--border-radius);
|
||||
border-bottom-right-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
.ui.modal > .close {
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
top: -2.5rem;
|
||||
right: -2.5rem;
|
||||
z-index: 1;
|
||||
opacity: 0.8;
|
||||
font-size: 1.25em;
|
||||
color: var(--color-white);
|
||||
width: 2.25rem;
|
||||
height: 2.25rem;
|
||||
padding: 0.625rem 0 0;
|
||||
}
|
||||
|
||||
.ui.modal > .close:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.ui.modal > .header {
|
||||
display: block;
|
||||
font-family: var(--fonts-regular);
|
||||
background: var(--color-body);
|
||||
margin: 0;
|
||||
padding: 1.25rem 1.5rem;
|
||||
box-shadow: none;
|
||||
color: var(--color-text-dark);
|
||||
border-bottom: 1px solid var(--color-secondary);
|
||||
border-top-left-radius: var(--border-radius);
|
||||
border-top-right-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
.ui.modal > .header:not(.ui) {
|
||||
font-size: 1.42857143rem;
|
||||
line-height: 1.28571429em;
|
||||
font-weight: var(--font-weight-medium);
|
||||
}
|
||||
|
||||
.ui.modal > .header .svg {
|
||||
vertical-align: middle;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.ui.modal > .content,
|
||||
.ui.modal form > .content {
|
||||
display: block;
|
||||
width: 100%;
|
||||
font-size: 1em;
|
||||
line-height: 1.4;
|
||||
padding: 1.5em;
|
||||
background: var(--color-body);
|
||||
border-radius: 0 0 var(--border-radius) var(--border-radius);
|
||||
}
|
||||
|
||||
.ui.modal > .actions,
|
||||
.ui.modal .content + .actions,
|
||||
.ui.modal .content + form > .actions {
|
||||
background: var(--color-secondary-bg);
|
||||
padding: 1rem;
|
||||
border-top: 1px solid var(--color-secondary);
|
||||
text-align: right;
|
||||
border-radius: 0 0 var(--border-radius) var(--border-radius);
|
||||
}
|
||||
|
||||
.ui.modal .actions > .button {
|
||||
margin-left: 0.75em;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 767.98px) {
|
||||
.ui.modal {
|
||||
width: 95%;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 768px) {
|
||||
.ui.modal {
|
||||
width: 88%;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 992px) {
|
||||
.ui.modal {
|
||||
width: 850px;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 1200px) {
|
||||
.ui.modal {
|
||||
width: 900px;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 1920px) {
|
||||
.ui.modal {
|
||||
width: 950px;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 991.98px) {
|
||||
.ui.modal > .header {
|
||||
padding-right: 2.25rem;
|
||||
}
|
||||
.ui.modal > .close {
|
||||
top: 1.0535rem;
|
||||
right: 1rem;
|
||||
color: var(--color-text);
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 767.98px) {
|
||||
.ui.modal > .header {
|
||||
padding: 0.75rem 1rem !important;
|
||||
padding-right: 2.25rem !important;
|
||||
}
|
||||
.ui.modal > .content {
|
||||
display: block;
|
||||
padding: 1rem !important;
|
||||
}
|
||||
.ui.modal > .close {
|
||||
top: 0.5rem !important;
|
||||
right: 0.5rem !important;
|
||||
}
|
||||
.ui.modal > .actions {
|
||||
padding: 1rem 1rem 0 !important;
|
||||
}
|
||||
.ui.modal .actions > .buttons,
|
||||
.ui.modal .actions > .button {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
.ui.active.modal {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.scrolling.dimmable > .dimmer {
|
||||
justify-content: flex-start;
|
||||
position: fixed;
|
||||
}
|
||||
|
||||
.modals.dimmer .ui.scrolling.modal {
|
||||
margin: 2rem auto;
|
||||
}
|
||||
|
||||
.ui.modal > .close.inside + .header {
|
||||
padding-right: 2.25rem;
|
||||
}
|
||||
|
||||
.ui.modal > .close.inside {
|
||||
top: 1.0535rem;
|
||||
right: 1rem;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.ui.modal > .close.icon[height="16"] {
|
||||
top: 0.7em;
|
||||
color: var(--color-text-dark);
|
||||
}
|
||||
|
||||
.ui.mini.modal > .header:not(.ui) {
|
||||
font-size: 1.3em;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 767.98px) {
|
||||
.ui.mini.modal {
|
||||
width: 95%;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 768px) {
|
||||
.ui.mini.modal {
|
||||
width: 35.2%;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 992px) {
|
||||
.ui.mini.modal {
|
||||
width: 340px;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 1200px) {
|
||||
.ui.mini.modal {
|
||||
width: 360px;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 1920px) {
|
||||
.ui.mini.modal {
|
||||
width: 380px;
|
||||
}
|
||||
}
|
||||
|
||||
.ui.tiny.modal > .header:not(.ui) {
|
||||
font-size: 1.3em;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 767.98px) {
|
||||
.ui.tiny.modal {
|
||||
width: 95%;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 768px) {
|
||||
.ui.tiny.modal {
|
||||
width: 52.8%;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 992px) {
|
||||
.ui.tiny.modal {
|
||||
width: 510px;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 1200px) {
|
||||
.ui.tiny.modal {
|
||||
width: 540px;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 1920px) {
|
||||
.ui.tiny.modal {
|
||||
width: 570px;
|
||||
}
|
||||
}
|
||||
|
||||
.ui.small.modal > .header:not(.ui) {
|
||||
font-size: 1.3em;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 767.98px) {
|
||||
.ui.small.modal {
|
||||
width: 95%;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 768px) {
|
||||
.ui.small.modal {
|
||||
width: 70.4%;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 992px) {
|
||||
.ui.small.modal {
|
||||
width: 680px;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 1200px) {
|
||||
.ui.small.modal {
|
||||
width: 720px;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 1920px) {
|
||||
.ui.small.modal {
|
||||
width: 760px;
|
||||
}
|
||||
}
|
||||
|
||||
.ui.modal.g-modal-confirm {
|
||||
max-width: min(800px, 90vw);
|
||||
width: fit-content;
|
||||
@@ -10,70 +297,12 @@
|
||||
top: 1.2em;
|
||||
}
|
||||
|
||||
.ui.modal > .close.inside {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.ui.modal > .close.icon[height="16"] {
|
||||
top: 0.7em; /* fomantic uses absolute layout, so if we have special icon size, it needs this trick to align vertically */
|
||||
color: var(--color-text-dark);
|
||||
}
|
||||
|
||||
.ui.modal > .header {
|
||||
/* can't use display:flex, because some headers have space-separated elements, eg: delete branch modal */
|
||||
color: var(--color-text-dark);
|
||||
background: var(--color-body);
|
||||
border-color: var(--color-secondary);
|
||||
border-top-left-radius: var(--border-radius);
|
||||
border-top-right-radius: var(--border-radius);
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.ui.modal > .header .svg {
|
||||
vertical-align: middle;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.ui.modal {
|
||||
background: var(--color-body);
|
||||
box-shadow: 1px 3px 3px 0 var(--color-shadow), 1px 3px 15px 2px var(--color-shadow);
|
||||
}
|
||||
|
||||
/* Gitea sometimes use a form in a modal dialog, then the "positive" button could submit the form directly
|
||||
Fomantic UI only supports the layout: <div .modal><div .content/><div .actions/></div>
|
||||
However, Gitea uses the following layouts:
|
||||
* <div .modal><div .content><div .actions/></div></div>
|
||||
* <div .modal><form><div .content/><div .actions/></form></div>
|
||||
* <div .modal><div .content><form><div .actions/></form></div></div>
|
||||
* <div .modal><div .content></div><form><div .actions/></form></div>
|
||||
* ...
|
||||
These inconsistent layouts should be refactored to simple ones.
|
||||
*/
|
||||
|
||||
.ui.modal > .content,
|
||||
.ui.modal form > .content {
|
||||
padding: 1.5em;
|
||||
background: var(--color-body);
|
||||
border-radius: 0 0 var(--border-radius) var(--border-radius);
|
||||
}
|
||||
|
||||
.ui.modal > .actions,
|
||||
.ui.modal .content + .actions,
|
||||
.ui.modal .content + form > .actions {
|
||||
background: var(--color-secondary-bg);
|
||||
border-color: var(--color-secondary);
|
||||
padding: 1rem;
|
||||
text-align: right;
|
||||
border-radius: 0 0 var(--border-radius) var(--border-radius);
|
||||
}
|
||||
|
||||
.ui.modal .content > form > .actions,
|
||||
.ui.modal .content > .actions {
|
||||
padding-top: 1em; /* if the "actions" is in the "content", some paddings are already added by the "content" */
|
||||
padding-top: 1em;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
/* positive/negative action buttons */
|
||||
.ui.modal .actions > .ui.button {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
|
||||
@@ -7,6 +7,11 @@
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
/* When notification message is present after navbar, hide border to avoid double border */
|
||||
#navbar:has(+ .ui.message) {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
#navbar .navbar-left,
|
||||
#navbar .navbar-right {
|
||||
display: flex;
|
||||
@@ -63,6 +68,7 @@
|
||||
}
|
||||
#navbar .navbar-mobile-right {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 0 0 0 auto;
|
||||
width: auto;
|
||||
}
|
||||
@@ -92,7 +98,6 @@
|
||||
}
|
||||
#navbar.navbar-menu-open .navbar-left .navbar-mobile-right {
|
||||
justify-content: flex-end;
|
||||
width: 50%;
|
||||
min-height: 49px;
|
||||
}
|
||||
#navbar #mobile-stopwatch-icon,
|
||||
@@ -102,12 +107,14 @@
|
||||
}
|
||||
|
||||
#navbar a.item:hover .notification_count,
|
||||
#navbar a.item:hover .header-stopwatch-dot {
|
||||
#navbar a.item:hover .header-stopwatch-dot,
|
||||
#navbar .item.active .navbar-admin-badge {
|
||||
border-color: var(--color-nav-hover-bg);
|
||||
}
|
||||
|
||||
#navbar a.item .notification_count,
|
||||
#navbar a.item .header-stopwatch-dot {
|
||||
#navbar a.item .header-stopwatch-dot,
|
||||
#navbar .item .navbar-admin-badge {
|
||||
color: var(--color-nav-bg);
|
||||
padding: 0 3.75px;
|
||||
font-size: 12px;
|
||||
@@ -127,6 +134,19 @@
|
||||
z-index: 1; /* prevent menu button background from overlaying icon */
|
||||
user-select: none;
|
||||
white-space: nowrap;
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.navbar-avatar {
|
||||
position: relative;
|
||||
display: inline-flex;
|
||||
}
|
||||
|
||||
#navbar .item .navbar-admin-badge {
|
||||
position: absolute;
|
||||
bottom: calc(100% - 29px);
|
||||
left: calc(100% - 18px);
|
||||
padding: 1.5px;
|
||||
}
|
||||
|
||||
.secondary-nav {
|
||||
|
||||
@@ -0,0 +1,86 @@
|
||||
/* These are the remnants of the fomantic search module */
|
||||
|
||||
.ui.search {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.ui.search > .results {
|
||||
display: none;
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
left: 0;
|
||||
white-space: normal;
|
||||
text-align: left;
|
||||
background: var(--color-body);
|
||||
margin-top: 0.5em;
|
||||
width: 18em;
|
||||
border-radius: 0.28571429rem;
|
||||
box-shadow: 0 2px 4px 0 var(--color-shadow), 0 2px 10px 0 var(--color-shadow);
|
||||
border: 1px solid var(--color-secondary);
|
||||
z-index: 998;
|
||||
transform-origin: center top;
|
||||
overflow-wrap: anywhere;
|
||||
}
|
||||
|
||||
.ui.search > .results > :first-child {
|
||||
border-top-left-radius: 0.28571429rem;
|
||||
border-top-right-radius: 0.28571429rem;
|
||||
}
|
||||
|
||||
.ui.search > .results > :last-child {
|
||||
border-bottom-left-radius: 0.28571429rem;
|
||||
border-bottom-right-radius: 0.28571429rem;
|
||||
}
|
||||
|
||||
.ui.search > .results .result {
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
overflow: hidden;
|
||||
padding: 0.85714286em 1.14285714em;
|
||||
color: var(--color-text);
|
||||
line-height: 1.33;
|
||||
border-bottom: 1px solid var(--color-secondary);
|
||||
background: var(--color-body);
|
||||
}
|
||||
|
||||
.ui.search > .results .result:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.ui.search > .results .result .image {
|
||||
overflow: hidden;
|
||||
border-radius: 0.25em;
|
||||
}
|
||||
|
||||
.ui.search > .results .result .image img {
|
||||
display: block;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.ui.search > .results .result .title {
|
||||
margin: -0.14285714em 0 0;
|
||||
font-family: var(--fonts-regular);
|
||||
font-weight: var(--font-weight-medium);
|
||||
color: var(--color-text-dark);
|
||||
}
|
||||
|
||||
.ui.search > .results .result .description {
|
||||
font-size: 0.92857143em;
|
||||
color: var(--color-text-light-2);
|
||||
}
|
||||
|
||||
.ui.search > .results .result:hover,
|
||||
.ui.search > .results .result.active {
|
||||
background: var(--color-hover);
|
||||
}
|
||||
|
||||
.ui.fluid.search .results {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 767.98px) {
|
||||
.ui.search .results {
|
||||
max-width: calc(100vw - 2rem);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,26 @@
|
||||
.global-shortcut-wrapper {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
kbd {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
min-width: 18px;
|
||||
padding: 2px 4px;
|
||||
font-size: 11px;
|
||||
line-height: 1;
|
||||
color: var(--color-text-light-2);
|
||||
background-color: var(--color-box-body);
|
||||
border: 1px solid var(--color-secondary);
|
||||
border-radius: var(--border-radius);
|
||||
box-shadow: var(--box-shadow-kbd);
|
||||
}
|
||||
|
||||
.global-shortcut-wrapper > kbd {
|
||||
position: absolute;
|
||||
right: 6px;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
pointer-events: none;
|
||||
}
|
||||
@@ -196,11 +196,6 @@
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.ui.striped.table > tr:nth-child(2n),
|
||||
.ui.striped.table > tbody > tr:nth-child(2n) {
|
||||
background: var(--color-light);
|
||||
}
|
||||
|
||||
.ui.table[class*="single line"],
|
||||
.ui.table [class*="single line"] {
|
||||
white-space: nowrap;
|
||||
@@ -291,37 +286,10 @@
|
||||
.ui.basic.table > tr > td {
|
||||
background: transparent;
|
||||
}
|
||||
.ui.basic.striped.table > tbody > tr:nth-child(2n) {
|
||||
background: var(--color-light);
|
||||
}
|
||||
.ui.basic.striped.selectable.table > tbody > tr:nth-child(2n):hover {
|
||||
background: var(--color-hover);
|
||||
}
|
||||
|
||||
.ui[class*="very basic"].table {
|
||||
border: none;
|
||||
}
|
||||
.ui[class*="very basic"].table:not(.striped) > tr > th:first-child,
|
||||
.ui[class*="very basic"].table:not(.striped) > thead > tr > th:first-child,
|
||||
.ui[class*="very basic"].table:not(.striped) > tbody > tr > th:first-child,
|
||||
.ui[class*="very basic"].table:not(.striped) > tfoot > tr > th:first-child,
|
||||
.ui[class*="very basic"].table:not(.striped) > tr > td:first-child,
|
||||
.ui[class*="very basic"].table:not(.striped) > tbody > tr > td:first-child,
|
||||
.ui[class*="very basic"].table:not(.striped) > tfoot > tr > td:first-child {
|
||||
padding-left: 0;
|
||||
}
|
||||
.ui[class*="very basic"].table:not(.striped) > tr > th:last-child,
|
||||
.ui[class*="very basic"].table:not(.striped) > thead > tr > th:last-child,
|
||||
.ui[class*="very basic"].table:not(.striped) > tbody > tr > th:last-child,
|
||||
.ui[class*="very basic"].table:not(.striped) > tfoot > tr > th:last-child,
|
||||
.ui[class*="very basic"].table:not(.striped) > tr > td:last-child,
|
||||
.ui[class*="very basic"].table:not(.striped) > tbody > tr > td:last-child,
|
||||
.ui[class*="very basic"].table:not(.striped) > tfoot > tr > td:last-child {
|
||||
padding-right: 0;
|
||||
}
|
||||
.ui[class*="very basic"].table:not(.striped) > thead > tr:first-child > th {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
.ui.celled.table > tr > th,
|
||||
.ui.celled.table > thead > tr > th,
|
||||
|
||||
@@ -8,26 +8,6 @@
|
||||
min-width: 40% !important;
|
||||
}
|
||||
|
||||
.repository .unicode-escaped .escaped-code-point[data-escaped]::before {
|
||||
visibility: visible;
|
||||
content: attr(data-escaped);
|
||||
font-family: var(--fonts-monospace);
|
||||
color: var(--color-red);
|
||||
}
|
||||
|
||||
.repository .unicode-escaped .escaped-code-point .char {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.repository .broken-code-point {
|
||||
font-family: var(--fonts-monospace);
|
||||
color: var(--color-blue);
|
||||
}
|
||||
|
||||
.repository .unicode-escaped .ambiguous-code-point {
|
||||
border: 1px var(--color-yellow) solid;
|
||||
}
|
||||
|
||||
.issue-content {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
@@ -95,8 +75,9 @@
|
||||
}
|
||||
}
|
||||
|
||||
/* make all issue filter dropdown menus popup leftward, to avoid go out the viewport (right side) */
|
||||
.repository .filter.menu .ui.dropdown .menu {
|
||||
/* make all issue filter dropdown (user dashboard, repo issue list) menus popup leftward, to avoid go out the viewport (right side) */
|
||||
.list-header-filters .ui.dropdown .menu,
|
||||
.issue-list-toolbar .ui.dropdown .menu {
|
||||
max-height: 500px;
|
||||
max-width: 300px;
|
||||
overflow-x: hidden;
|
||||
@@ -105,7 +86,8 @@
|
||||
}
|
||||
|
||||
/* the label-filter is the first dropdown, it shouldn't be shown leftward, otherwise it may go out the viewport (left side) */
|
||||
.repository .filter.menu .ui.dropdown.label-filter .menu {
|
||||
.list-header-filters .ui.dropdown.label-filter .menu,
|
||||
.issue-list-toolbar .ui.dropdown.label-filter .menu {
|
||||
min-width: max-content;
|
||||
right: unset;
|
||||
left: 0;
|
||||
@@ -150,83 +132,89 @@ td .commit-summary {
|
||||
}
|
||||
}
|
||||
|
||||
.repository.file.list .non-diff-file-content .header .icon {
|
||||
.non-diff-file-content .header .icon {
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
.repository.file.list .non-diff-file-content .header .small.icon {
|
||||
.non-diff-file-content .header .small.icon {
|
||||
font-size: 0.75em;
|
||||
}
|
||||
|
||||
.repository.file.list .non-diff-file-content .header .tiny.icon {
|
||||
.non-diff-file-content .header .tiny.icon {
|
||||
font-size: 0.5em;
|
||||
}
|
||||
|
||||
.repository.file.list .non-diff-file-content .header .file-actions .btn-octicon {
|
||||
.non-diff-file-content .header .file-actions .btn-octicon {
|
||||
line-height: var(--line-height-default);
|
||||
padding: 8px;
|
||||
vertical-align: middle;
|
||||
color: var(--color-text);
|
||||
}
|
||||
|
||||
.repository.file.list .non-diff-file-content .header .file-actions .btn-octicon:hover {
|
||||
.non-diff-file-content .header .file-actions .btn-octicon:hover {
|
||||
color: var(--color-primary);
|
||||
}
|
||||
|
||||
.repository.file.list .non-diff-file-content .header .file-actions .btn-octicon-danger:hover {
|
||||
.non-diff-file-content .header .file-actions .btn-octicon-danger:hover {
|
||||
color: var(--color-red);
|
||||
}
|
||||
|
||||
.repository.file.list .non-diff-file-content .header .file-actions .btn-octicon.disabled {
|
||||
.non-diff-file-content .header .file-actions .btn-octicon.disabled {
|
||||
color: inherit;
|
||||
opacity: var(--opacity-disabled);
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.repository.file.list .non-diff-file-content .plain-text {
|
||||
.non-diff-file-content .plain-text {
|
||||
padding: 1em 2em;
|
||||
}
|
||||
|
||||
.repository.file.list .non-diff-file-content .plain-text pre {
|
||||
.non-diff-file-content .plain-text pre {
|
||||
overflow-wrap: anywhere;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
.repository.file.list .non-diff-file-content .csv {
|
||||
.non-diff-file-content .csv {
|
||||
overflow-x: auto;
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
.repository.file.list .non-diff-file-content pre {
|
||||
.non-diff-file-content pre {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.repository.file.list .non-diff-file-content .asciicast {
|
||||
.non-diff-file-content .asciicast {
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
.repo-editor-menu {
|
||||
min-height: auto !important;
|
||||
}
|
||||
|
||||
.repo-editor-header {
|
||||
/* it should match ".repo-button-row" so the tree toggle button stays aligned */
|
||||
margin: 8px 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.repo-editor-header input {
|
||||
vertical-align: middle !important;
|
||||
width: auto !important;
|
||||
padding: 7px 8px !important;
|
||||
height: 30px !important;
|
||||
padding: 5px 8px !important;
|
||||
margin-right: 5px !important;
|
||||
}
|
||||
|
||||
.repository.file.editor .tabular.menu .svg {
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.repository.file.editor .commit-form-wrapper {
|
||||
padding-left: 48px;
|
||||
padding-left: 58px;
|
||||
}
|
||||
|
||||
.repository.file.editor .commit-form-wrapper .commit-avatar {
|
||||
float: left;
|
||||
margin-left: -48px;
|
||||
margin-left: -58px;
|
||||
}
|
||||
|
||||
.repository.file.editor .commit-form-wrapper .commit-form {
|
||||
@@ -300,10 +288,6 @@ td .commit-summary {
|
||||
min-width: 100px;
|
||||
}
|
||||
|
||||
.repository.view.issue .instruct-toggle {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
/* issue title & meta & edit */
|
||||
.issue-title-header {
|
||||
width: 100%;
|
||||
@@ -462,7 +446,7 @@ td .commit-summary {
|
||||
}
|
||||
|
||||
.repository.view.issue .comment-list .timeline-avatar-offset {
|
||||
margin-top: 48px;
|
||||
top: 51px;
|
||||
}
|
||||
|
||||
.repository.view.issue .comment-list .timeline-item {
|
||||
@@ -500,9 +484,8 @@ td .commit-summary {
|
||||
border-radius: var(--border-radius-full);
|
||||
display: flex;
|
||||
flex-shrink: 0;
|
||||
float: left;
|
||||
margin-left: -33px;
|
||||
margin-right: 8px;
|
||||
margin-right: 4px;
|
||||
color: var(--color-text);
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
@@ -519,10 +502,6 @@ td .commit-summary {
|
||||
padding: 3px;
|
||||
}
|
||||
|
||||
.repository.view.issue .comment-list .timeline-item .badge .svg.octicon-comment {
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
.repository.view.issue .comment-list .timeline-item.comment > .content {
|
||||
margin-left: -16px;
|
||||
}
|
||||
@@ -531,7 +510,6 @@ td .commit-summary {
|
||||
/* TODO: this "line-height" is not ideal (actually it is abused), many layouts depend on this magic value,
|
||||
for example: alignment of the header arrow and the avatar, view PR commit list left icon layout, dismiss review with reason, etc */
|
||||
line-height: 32px;
|
||||
vertical-align: middle;
|
||||
color: var(--color-text-light);
|
||||
min-width: 0;
|
||||
}
|
||||
@@ -544,23 +522,12 @@ td .commit-summary {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.repository.view.issue .comment-list .timeline-item .avatar-with-link + .comment-text-line {
|
||||
margin-left: 0.25em;
|
||||
}
|
||||
|
||||
.repository.view.issue .comment-list .timeline-item.commits-list {
|
||||
padding-left: 15px;
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
.repository.view.issue .comment-list .timeline-item.event > .commit-status-link {
|
||||
float: right;
|
||||
margin-right: 8px;
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
.repository.view.issue .comment-list .timeline-item .comment-text-label {
|
||||
vertical-align: middle;
|
||||
border: 1px solid var(--color-light-border);
|
||||
height: 26px;
|
||||
margin: 4px 0; /* because this label is beside the comment line, which has "line-height: 34px" */
|
||||
@@ -674,21 +641,35 @@ td .commit-summary {
|
||||
|
||||
.repository.view.issue .comment-list .event {
|
||||
padding-left: 15px;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
.repository.view.issue .comment-list .event .detail {
|
||||
margin-top: 4px;
|
||||
.repository.view.issue .comment-list .event.code-comments-list {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.repository.view.issue .comment-list .event > .badge {
|
||||
align-self: flex-start;
|
||||
}
|
||||
|
||||
.repository.view.issue .comment-list .event > .avatar-with-link {
|
||||
align-self: flex-start;
|
||||
height: 32px;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.repository.view.issue .comment-list .event > .comment-text-line {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.repository.view.issue .comment-list .event > .detail {
|
||||
margin-left: 15px;
|
||||
}
|
||||
|
||||
.repository.view.issue .comment-list .event .detail .text {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.repository.view.issue .comment-list .event .segments {
|
||||
box-shadow: none;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.repository.view.issue .ui.depending .item.is-closed .issue-dependency-title {
|
||||
@@ -771,10 +752,6 @@ td .commit-summary {
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
.repository #commits-table.ui.basic.striped.table tbody tr:nth-child(2n) {
|
||||
background-color: var(--color-light) !important;
|
||||
}
|
||||
|
||||
.repository .data-table {
|
||||
width: 100%;
|
||||
}
|
||||
@@ -845,7 +822,7 @@ td .commit-summary {
|
||||
width: 1%;
|
||||
min-width: 50px;
|
||||
font-family: monospace;
|
||||
line-height: 20px;
|
||||
line-height: var(--line-height-code);
|
||||
color: var(--color-text-light-1);
|
||||
white-space: nowrap;
|
||||
vertical-align: top;
|
||||
@@ -1292,8 +1269,7 @@ td .commit-summary {
|
||||
filter: drop-shadow(-4px 0 0 var(--color-primary-alpha-30)) !important;
|
||||
}
|
||||
|
||||
.code-comment:target,
|
||||
.diff-file-box:target {
|
||||
.code-comment:target {
|
||||
border-color: var(--color-primary) !important;
|
||||
border-radius: var(--border-radius) !important;
|
||||
box-shadow: 0 0 0 3px var(--color-primary-alpha-30) !important;
|
||||
@@ -1409,12 +1385,25 @@ td .commit-summary {
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
.repo-button-row .ui.button {
|
||||
.repo-button-row .ui.button,
|
||||
.repo-view-container .ui.button.repo-view-file-tree-toggle {
|
||||
flex-shrink: 0;
|
||||
margin: 0;
|
||||
min-height: 30px;
|
||||
}
|
||||
|
||||
.repo-view-container .ui.button.repo-view-file-tree-toggle {
|
||||
padding: 0 6px;
|
||||
}
|
||||
|
||||
.repo-button-row .repo-file-search-container .ui.input {
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
.repo-button-row .ui.dropdown > .menu {
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
tbody.commit-list {
|
||||
vertical-align: baseline;
|
||||
}
|
||||
@@ -1471,11 +1460,6 @@ tbody.commit-list {
|
||||
}
|
||||
}
|
||||
|
||||
.commit-list .commit-status-link {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.commit-body {
|
||||
margin: 0.25em 0;
|
||||
white-space: pre-wrap;
|
||||
@@ -1483,6 +1467,12 @@ tbody.commit-list {
|
||||
line-height: initial;
|
||||
}
|
||||
|
||||
.commit-body a.commit code,
|
||||
.commit-summary a.commit code {
|
||||
/* these links are generated by the render: <a class="commit" href="...">...</a> */
|
||||
background: inherit;
|
||||
}
|
||||
|
||||
.git-notes.top {
|
||||
text-align: left;
|
||||
}
|
||||
@@ -1661,18 +1651,27 @@ tbody.commit-list {
|
||||
margin-top: 1em;
|
||||
}
|
||||
|
||||
.diff-file-box:target {
|
||||
border-color: var(--color-primary) !important;
|
||||
border-radius: var(--border-radius) !important;
|
||||
box-shadow: 0 0 0 3px var(--color-primary-alpha-30) !important;
|
||||
}
|
||||
|
||||
.diff-file-header {
|
||||
padding: 5px 8px !important;
|
||||
box-shadow: 0 -1px 0 1px var(--color-body); /* prevent borders being visible behind top corners when sticky and scrolled */
|
||||
font-weight: var(--font-weight-normal);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
gap: 0.5em;
|
||||
|
||||
/* prevent borders from being visible behind top corners when sticky and scrolled,
|
||||
this "shadow" is used to use body's color to cover the scrolled-up left and right borders at corners */
|
||||
box-shadow: 0 -1px 0 1px var(--color-body);
|
||||
}
|
||||
|
||||
.diff-file-header .file {
|
||||
min-width: 0;
|
||||
.diff-file-box:target .diff-file-header {
|
||||
box-shadow: unset; /* when targeted, still use the parent's box-shadow, remove the patched above */
|
||||
}
|
||||
|
||||
.diff-file-header .file-link {
|
||||
@@ -1695,6 +1694,7 @@ tbody.commit-list {
|
||||
.diff-file-header {
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
gap: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1723,13 +1723,13 @@ tbody.commit-list {
|
||||
|
||||
.diff-stats-bar {
|
||||
display: inline-block;
|
||||
background-color: var(--color-red);
|
||||
background-color: var(--color-diff-removed-fg); /* the background is used as "text foreground color" */
|
||||
height: 12px;
|
||||
width: 44px;
|
||||
}
|
||||
|
||||
.diff-stats-bar .diff-stats-add-bar {
|
||||
background-color: var(--color-green);
|
||||
background-color: var(--color-diff-added-fg);
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
@@ -1739,13 +1739,23 @@ tbody.commit-list {
|
||||
}
|
||||
|
||||
.removed-code {
|
||||
color: var(--color-text);
|
||||
background: var(--color-diff-removed-word-bg);
|
||||
}
|
||||
|
||||
.removed-code span {
|
||||
color: inherit !important;
|
||||
}
|
||||
|
||||
.added-code {
|
||||
color: var(--color-text);
|
||||
background: var(--color-diff-added-word-bg);
|
||||
}
|
||||
|
||||
.added-code span {
|
||||
color: inherit !important;
|
||||
}
|
||||
|
||||
.code-diff-unified .del-code,
|
||||
.code-diff-unified .del-code td,
|
||||
.code-diff-split .del-code .lines-num-old,
|
||||
@@ -1942,7 +1952,15 @@ tbody.commit-list {
|
||||
padding-right: 0.5em; /* To match the alignment with the "required" label */
|
||||
}
|
||||
|
||||
.search-fullname {
|
||||
.username-display {
|
||||
max-width: 100%; /* the inner part might have "gt-ellipsis" */
|
||||
min-width: 0; /* if it is the top flex container, "max-width" works; but if it is inside another flex container, the parent needs to handle the x-axis and here also needs "min-width" */
|
||||
display: inline-flex;
|
||||
gap: var(--gap-inline);
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.username-display > .username-fullname {
|
||||
color: var(--color-text-light-2);
|
||||
}
|
||||
|
||||
|
||||
@@ -7,6 +7,10 @@
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.ui.label.commit-sign-badge > * {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.ui.label.commit-id-short {
|
||||
font-family: var(--fonts-monospace);
|
||||
height: 24px;
|
||||
|
||||
@@ -54,7 +54,9 @@
|
||||
gap: var(--page-spacing);
|
||||
}
|
||||
|
||||
.repo-view-container .repo-view-file-tree-container {
|
||||
.repo-view-file-tree-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex: 0 0 15%;
|
||||
min-width: 0;
|
||||
max-height: 100vh;
|
||||
@@ -65,6 +67,12 @@
|
||||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
@media (max-width: 767.98px) {
|
||||
.repo-view-file-tree-container {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.repo-view-content {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
|
||||
@@ -95,46 +95,3 @@
|
||||
font-size: 18px;
|
||||
font-weight: var(--font-weight-normal);
|
||||
}
|
||||
|
||||
.repository.new.release .target {
|
||||
min-width: 500px;
|
||||
}
|
||||
|
||||
.repository.new.release .target #tag-name {
|
||||
margin-top: -4px;
|
||||
}
|
||||
|
||||
.repository.new.release .target .at {
|
||||
margin-left: -5px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.repository.new.release .target .selection.dropdown {
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
.repository.new.release .prerelease.field {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
@media (max-width: 438px) {
|
||||
.repository.new.release .field button,
|
||||
.repository.new.release .field input {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 767.98px) {
|
||||
.repository.new.release .field button {
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
}
|
||||
|
||||
.repository.new.release .field .attachment_edit {
|
||||
max-width: 48em;
|
||||
}
|
||||
|
||||
.repository.new.release .markup {
|
||||
min-height: 240px;
|
||||
}
|
||||
|
||||
@@ -1,7 +1,3 @@
|
||||
.repository.wiki .wiki-pages-list tr:hover {
|
||||
background-color: var(--color-hover);
|
||||
}
|
||||
|
||||
.repository.wiki .wiki-pages-list .wiki-git-entry {
|
||||
margin-left: 10px;
|
||||
display: none;
|
||||
@@ -50,7 +46,7 @@
|
||||
}
|
||||
|
||||
.repository.wiki .wiki-content-toc ul ul {
|
||||
border-left: 1px var(--color-secondary);
|
||||
border-left: 1px var(--color-secondary);
|
||||
border-left-style: dashed;
|
||||
}
|
||||
|
||||
|
||||
@@ -15,11 +15,20 @@
|
||||
transform: scale(1.1);
|
||||
}
|
||||
|
||||
.lines-escape .toggle-escape-button {
|
||||
margin: -1px 2px 0;
|
||||
}
|
||||
|
||||
.lines-escape .toggle-escape-button::before {
|
||||
visibility: visible;
|
||||
content: "⚠️";
|
||||
font-family: var(--fonts-emoji);
|
||||
color: var(--color-red);
|
||||
content: "";
|
||||
display: inline-flex;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
background-color: var(--color-yellow); /* TODO: maybe it needs a new kind of color, there is no suitable "warning" color in the current palette */
|
||||
mask-image: var(--octicon-alert-fill);
|
||||
-webkit-mask-image: var(--octicon-alert-fill);
|
||||
mask-size: contain;
|
||||
-webkit-mask-size: contain;
|
||||
}
|
||||
|
||||
.repository .diff-file-box .code-diff td.lines-escape {
|
||||
@@ -115,6 +124,23 @@
|
||||
color: var(--color-text);
|
||||
}
|
||||
|
||||
.code-expander-buttons {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.code-expander-buttons .code-comment-more {
|
||||
position: absolute;
|
||||
line-height: 12px;
|
||||
padding: 2px 4px;
|
||||
font-size: 10px;
|
||||
background-color: var(--color-primary);
|
||||
color: var(--color-primary-contrast);
|
||||
border-radius: 8px !important;
|
||||
left: -12px;
|
||||
top: 6px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.code-expander-button {
|
||||
border: none;
|
||||
color: var(--color-text-light);
|
||||
@@ -127,8 +153,8 @@
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
/* expand direction 3 is both ways with two buttons */
|
||||
.code-expander-buttons[data-expand-direction="3"] .code-expander-button {
|
||||
/* expand direction "updown" is both ways with two buttons */
|
||||
.code-expander-buttons[data-expand-direction="updown"] .code-expander-button {
|
||||
height: 18px;
|
||||
}
|
||||
|
||||
|
||||
@@ -1 +0,0 @@
|
||||
/* dummy */
|
||||
@@ -1,42 +0,0 @@
|
||||
*,
|
||||
*::before,
|
||||
*::after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.swagger-back-link {
|
||||
color: #1f69c0;
|
||||
text-decoration: none;
|
||||
position: absolute;
|
||||
top: 1rem;
|
||||
right: 1.5rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.swagger-back-link:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.swagger-back-link svg {
|
||||
color: inherit;
|
||||
fill: currentcolor;
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
body {
|
||||
background: #1e1e1e;
|
||||
}
|
||||
.swagger-ui, .swagger-back-link {
|
||||
filter: invert(88%) hue-rotate(180deg);
|
||||
}
|
||||
.swagger-ui .microlight {
|
||||
filter: invert(100%) hue-rotate(180deg);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,13 @@
|
||||
@import "../../node_modules/swagger-ui-dist/swagger-ui.css";
|
||||
|
||||
html,
|
||||
html body,
|
||||
html .swagger-ui,
|
||||
html .swagger-ui .scheme-container {
|
||||
background: var(--gitea-iframe-bgcolor, var(--color-box-body)) !important;
|
||||
}
|
||||
|
||||
/* swagger's bug: the selector was incorrectly written in "thead": "html.dark-mode .swagger-ui .opblock.opblock-get thead tr td" */
|
||||
html.dark-mode .swagger-ui table.headers td {
|
||||
color: var(--color-text) !important;
|
||||
}
|
||||
@@ -0,0 +1,29 @@
|
||||
@import "swagger-render.css";
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.swagger-back-link {
|
||||
color: var(--color-primary);
|
||||
text-decoration: none;
|
||||
position: absolute;
|
||||
top: 1rem;
|
||||
right: 1.5rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.swagger-back-link:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.swagger-back-link svg {
|
||||
color: inherit;
|
||||
fill: currentcolor;
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
|
||||
.swagger-spec-content {
|
||||
display: none;
|
||||
}
|
||||
+3
-1
@@ -2,5 +2,7 @@
|
||||
@import "./theme-gitea-dark-protanopia-deuteranopia.css" (prefers-color-scheme: dark);
|
||||
|
||||
gitea-theme-meta-info {
|
||||
--theme-display-name: "Auto (Red/Green Colorblind-friendly)";
|
||||
--theme-display-name: "Auto";
|
||||
--theme-colorblind-type: "red-green";
|
||||
--theme-color-scheme: "auto";
|
||||
}
|
||||
|
||||
@@ -0,0 +1,8 @@
|
||||
@import "./theme-gitea-light-tritanopia.css" (prefers-color-scheme: light);
|
||||
@import "./theme-gitea-dark-tritanopia.css" (prefers-color-scheme: dark);
|
||||
|
||||
gitea-theme-meta-info {
|
||||
--theme-display-name: "Auto";
|
||||
--theme-colorblind-type: "blue-yellow";
|
||||
--theme-color-scheme: "auto";
|
||||
}
|
||||
@@ -3,4 +3,5 @@
|
||||
|
||||
gitea-theme-meta-info {
|
||||
--theme-display-name: "Auto";
|
||||
--theme-color-scheme: "auto";
|
||||
}
|
||||
|
||||
+11
-8
@@ -1,16 +1,19 @@
|
||||
@import "./theme-gitea-dark.css";
|
||||
|
||||
gitea-theme-meta-info {
|
||||
--theme-display-name: "Dark (Red/Green Colorblind-friendly)";
|
||||
--theme-display-name: "Dark";
|
||||
--theme-colorblind-type: "red-green";
|
||||
--theme-color-scheme: "dark";
|
||||
}
|
||||
|
||||
/* red/green colorblind-friendly colors */
|
||||
/* from GitHub: --diffBlob-addition-*, --diffBlob-deletion-*, etc */
|
||||
:root {
|
||||
--color-diff-added-linenum-bg: #1979fd46;
|
||||
--color-diff-added-row-bg: #1979fd20;
|
||||
--color-diff-added-word-bg: #1979fd66;
|
||||
--color-diff-removed-linenum-bg: #c8622146;
|
||||
--color-diff-removed-row-bg: #c8622120;
|
||||
--color-diff-removed-word-bg: #c8622166;
|
||||
--color-diff-added-fg: #58a6ff;
|
||||
--color-diff-added-linenum-bg: #243d5d;
|
||||
--color-diff-added-row-bg: #132339;
|
||||
--color-diff-added-word-bg: #214d87;
|
||||
--color-diff-removed-fg: #f0883e;
|
||||
--color-diff-removed-linenum-bg: #5b361c;
|
||||
--color-diff-removed-row-bg: #3c2419;
|
||||
--color-diff-removed-word-bg: #824e1f;
|
||||
}
|
||||
|
||||
@@ -0,0 +1,15 @@
|
||||
@import "./theme-gitea-dark.css";
|
||||
|
||||
gitea-theme-meta-info {
|
||||
--theme-display-name: "Dark";
|
||||
--theme-colorblind-type: "blue-yellow";
|
||||
--theme-color-scheme: "dark";
|
||||
}
|
||||
|
||||
/* blue/yellow colorblind-friendly colors */
|
||||
:root {
|
||||
--color-diff-added-fg: #58a6ff;
|
||||
--color-diff-added-linenum-bg: #243d5d;
|
||||
--color-diff-added-row-bg: #132339;
|
||||
--color-diff-added-word-bg: #214d87;
|
||||
}
|
||||
@@ -1,8 +1,6 @@
|
||||
@import "../chroma/dark.css";
|
||||
@import "../codemirror/dark.css";
|
||||
|
||||
gitea-theme-meta-info {
|
||||
--theme-display-name: "Dark";
|
||||
--theme-color-scheme: "dark";
|
||||
}
|
||||
|
||||
:root {
|
||||
@@ -34,45 +32,46 @@ gitea-theme-meta-info {
|
||||
--color-primary-alpha-90: #4183c4e1;
|
||||
--color-primary-hover: var(--color-primary-light-1);
|
||||
--color-primary-active: var(--color-primary-light-2);
|
||||
--color-secondary: #3b444c;
|
||||
--color-secondary-dark-1: #414b54;
|
||||
--color-secondary-dark-2: #49545f;
|
||||
--color-secondary-dark-3: #576471;
|
||||
--color-secondary-dark-4: #677685;
|
||||
--color-secondary-dark-5: #758594;
|
||||
--color-secondary-dark-6: #8392a0;
|
||||
--color-secondary-dark-7: #929eab;
|
||||
--color-secondary-dark-8: #a2acb7;
|
||||
--color-secondary-dark-9: #a9b3bd;
|
||||
--color-secondary-dark-10: #b7bfc7;
|
||||
--color-secondary-dark-11: #c5cbd2;
|
||||
--color-secondary-dark-12: #cfd4da;
|
||||
--color-secondary-dark-13: #d2d7dc;
|
||||
--color-secondary-light-1: #313940;
|
||||
--color-secondary-light-2: #292f35;
|
||||
--color-secondary-light-3: #1d2226;
|
||||
--color-secondary-light-4: #171b1e;
|
||||
--color-secondary-alpha-10: #3b444c19;
|
||||
--color-secondary-alpha-20: #3b444c33;
|
||||
--color-secondary-alpha-30: #3b444c4b;
|
||||
--color-secondary-alpha-40: #3b444c66;
|
||||
--color-secondary-alpha-50: #3b444c80;
|
||||
--color-secondary-alpha-60: #3b444c99;
|
||||
--color-secondary-alpha-70: #3b444cb3;
|
||||
--color-secondary-alpha-80: #3b444ccc;
|
||||
--color-secondary-alpha-90: #3b444ce1;
|
||||
--color-secondary: #3f4248;
|
||||
--color-secondary-dark-1: #46494f;
|
||||
--color-secondary-dark-2: #4f5259;
|
||||
--color-secondary-dark-3: #5e626a;
|
||||
--color-secondary-dark-4: #6f747d;
|
||||
--color-secondary-dark-5: #7d828c;
|
||||
--color-secondary-dark-6: #8b8f98;
|
||||
--color-secondary-dark-7: #999da4;
|
||||
--color-secondary-dark-8: #a8abb1;
|
||||
--color-secondary-dark-9: #aeb1b8;
|
||||
--color-secondary-dark-10: #bbbec3;
|
||||
--color-secondary-dark-11: #c8cacf;
|
||||
--color-secondary-dark-12: #d2d4d7;
|
||||
--color-secondary-dark-13: #d5d6d9;
|
||||
--color-secondary-light-1: #35373c;
|
||||
--color-secondary-light-2: #2c2e32;
|
||||
--color-secondary-light-3: #1f2124;
|
||||
--color-secondary-light-4: #191a1c;
|
||||
--color-secondary-alpha-10: #3f424819;
|
||||
--color-secondary-alpha-20: #3f424833;
|
||||
--color-secondary-alpha-30: #3f42484b;
|
||||
--color-secondary-alpha-40: #3f424866;
|
||||
--color-secondary-alpha-50: #3f424880;
|
||||
--color-secondary-alpha-60: #3f424899;
|
||||
--color-secondary-alpha-70: #3f4248b3;
|
||||
--color-secondary-alpha-80: #3f4248cc;
|
||||
--color-secondary-alpha-90: #3f4248e1;
|
||||
--color-secondary-button: var(--color-secondary-dark-4);
|
||||
--color-secondary-hover: var(--color-secondary-dark-3);
|
||||
--color-secondary-active: var(--color-secondary-dark-2);
|
||||
/* console colors - used for actions console and console files */
|
||||
--color-console-fg: #f7f8f9;
|
||||
--color-console-fg-subtle: #bdc4cc;
|
||||
--color-console-bg: #171b1e;
|
||||
--color-console-border: #2e353b;
|
||||
--color-console-hover-bg: #272d33;
|
||||
--color-console-active-bg: #2e353b;
|
||||
--color-console-menu-bg: #262b31;
|
||||
--color-console-menu-border: #414b55;
|
||||
--color-console-fg: #f8f8f8;
|
||||
--color-console-fg-subtle: #c1c3c8;
|
||||
--color-console-bg: #191a1c;
|
||||
--color-console-border: #313338;
|
||||
--color-console-hover-bg: #2a2c30;
|
||||
--color-console-active-bg: #313338;
|
||||
--color-console-menu-bg: #292b2e;
|
||||
--color-console-menu-border: #46494f;
|
||||
--color-console-link: #969aa1;
|
||||
/* named colors */
|
||||
--color-red: #cc4848;
|
||||
--color-orange: #cc580c;
|
||||
@@ -85,7 +84,7 @@ gitea-theme-meta-info {
|
||||
--color-purple: #b259d0;
|
||||
--color-pink: #d22e8b;
|
||||
--color-brown: #a47252;
|
||||
--color-black: #1d2328;
|
||||
--color-black: #202225;
|
||||
/* light variants - produced via Sass scale-color(color, $lightness: +10%) */
|
||||
--color-red-light: #d15a5a;
|
||||
--color-orange-light: #f6a066;
|
||||
@@ -98,7 +97,7 @@ gitea-theme-meta-info {
|
||||
--color-purple-light: #ba6ad5;
|
||||
--color-pink-light: #d74397;
|
||||
--color-brown-light: #b08061;
|
||||
--color-black-light: #424851;
|
||||
--color-black-light: #45484e;
|
||||
/* dark 1 variants - produced via Sass scale-color(color, $lightness: -10%) */
|
||||
--color-red-dark-1: #c23636;
|
||||
--color-orange-dark-1: #f38236;
|
||||
@@ -111,7 +110,7 @@ gitea-theme-meta-info {
|
||||
--color-purple-dark-1: #a742c9;
|
||||
--color-pink-dark-1: #be297d;
|
||||
--color-brown-dark-1: #94674a;
|
||||
--color-black-dark-1: #292e38;
|
||||
--color-black-dark-1: #2e3033;
|
||||
/* dark 2 variants - produced via Sass scale-color(color, $lightness: -20%) */
|
||||
--color-red-dark-2: #ad3030;
|
||||
--color-orange-dark-2: #f16e17;
|
||||
@@ -124,9 +123,9 @@ gitea-theme-meta-info {
|
||||
--color-purple-dark-2: #9834b9;
|
||||
--color-pink-dark-2: #a9246f;
|
||||
--color-brown-dark-2: #835b42;
|
||||
--color-black-dark-2: #272930;
|
||||
--color-black-dark-2: #292b2e;
|
||||
/* ansi colors used for actions console and console files */
|
||||
--color-ansi-black: #1e2327;
|
||||
--color-ansi-black: #202225;
|
||||
--color-ansi-red: #cc4848;
|
||||
--color-ansi-green: #87ab63;
|
||||
--color-ansi-yellow: #cc9903;
|
||||
@@ -134,7 +133,7 @@ gitea-theme-meta-info {
|
||||
--color-ansi-magenta: #d22e8b;
|
||||
--color-ansi-cyan: #00918a;
|
||||
--color-ansi-white: var(--color-console-fg-subtle);
|
||||
--color-ansi-bright-black: #424851;
|
||||
--color-ansi-bright-black: #45484e;
|
||||
--color-ansi-bright-red: #d15a5a;
|
||||
--color-ansi-bright-green: #93b373;
|
||||
--color-ansi-bright-yellow: #eaaf03;
|
||||
@@ -143,35 +142,40 @@ gitea-theme-meta-info {
|
||||
--color-ansi-bright-cyan: #00b6ad;
|
||||
--color-ansi-bright-white: var(--color-console-fg);
|
||||
/* other colors */
|
||||
--color-grey: #384149;
|
||||
--color-grey-light: #818f9e;
|
||||
--color-grey: #3d3f44;
|
||||
--color-grey-light: #898d96;
|
||||
--color-gold: #b1983b;
|
||||
--color-white: #ffffff;
|
||||
--color-diff-added-fg: #87ab63;
|
||||
--color-diff-added-linenum-bg: #274227;
|
||||
--color-diff-added-row-bg: #203224;
|
||||
--color-diff-added-row-border: #314a37;
|
||||
--color-diff-added-word-bg: #3c653c;
|
||||
--color-diff-moved-row-bg: #818044;
|
||||
--color-diff-moved-row-border: #bcca6f;
|
||||
--color-diff-removed-fg: #cc4848;
|
||||
--color-diff-removed-linenum-bg: #482121;
|
||||
--color-diff-removed-row-bg: #301e1e;
|
||||
--color-diff-removed-row-border: #634343;
|
||||
--color-diff-removed-word-bg: #6f3333;
|
||||
--color-diff-inactive: #22282d;
|
||||
--color-error-border: #a04141;
|
||||
--color-error-bg: #522;
|
||||
--color-error-bg-active: #744;
|
||||
--color-error-bg-hover: #633;
|
||||
--color-error-text: #f9cbcb;
|
||||
--color-success-border: #458a57;
|
||||
--color-success-bg: #284034;
|
||||
--color-success-text: #6cc664;
|
||||
--color-warning-border: #bb9d00;
|
||||
--color-warning-bg: #3a3a30;
|
||||
--color-warning-text: #fbbd08;
|
||||
--color-info-border: #306090;
|
||||
--color-info-bg: #26354c;
|
||||
--color-info-text: #38a8e8;
|
||||
--color-diff-inactive: #25272a;
|
||||
--color-error-border: #763232;
|
||||
--color-error-bg: #322226;
|
||||
--color-error-bg-active: #49262a;
|
||||
--color-error-bg-hover: #3c2427;
|
||||
--color-error-text: #f85149;
|
||||
--color-success-border: #225633;
|
||||
--color-success-bg: #1c3329;
|
||||
--color-success-text: #3fb950;
|
||||
--color-warning-border: #5f481a;
|
||||
--color-warning-bg: #342e1f;
|
||||
--color-warning-text: #d29922;
|
||||
--color-info-border: #254a7e;
|
||||
--color-info-bg: #1b283a;
|
||||
--color-info-text: #2f81f7;
|
||||
--color-priority-border: #4a268d;
|
||||
--color-priority-bg: #251c39;
|
||||
--color-priority-text: #a371f7;
|
||||
--color-red-badge: #db2828;
|
||||
--color-red-badge-bg: #db28281a;
|
||||
--color-red-badge-hover-bg: #db28284d;
|
||||
@@ -187,62 +191,106 @@ gitea-theme-meta-info {
|
||||
--color-git: #f05133;
|
||||
--color-logo: #609926;
|
||||
/* target-based colors */
|
||||
--color-body: #1b1f23;
|
||||
--color-box-header: #1a1d1f;
|
||||
--color-box-body: #14171a;
|
||||
--color-box-body-highlight: #1e2226;
|
||||
--color-text-dark: #f7f8f9;
|
||||
--color-text: #d0d5da;
|
||||
--color-text-light: #bcc3cb;
|
||||
--color-text-light-1: #a5afb9;
|
||||
--color-text-light-2: #8f9ba8;
|
||||
--color-text-light-3: #788797;
|
||||
--color-body: #1e1f20;
|
||||
--color-box-header: #1b1c1e;
|
||||
--color-box-body: #161718;
|
||||
--color-box-body-highlight: #202124;
|
||||
--color-text-dark: #f8f8f8;
|
||||
--color-text: #d2d4d8;
|
||||
--color-text-light: #c0c2c7;
|
||||
--color-text-light-1: #aaadb4;
|
||||
--color-text-light-2: #969aa1;
|
||||
--color-text-light-3: #80858f;
|
||||
--color-footer: var(--color-nav-bg);
|
||||
--color-timeline: #343c44;
|
||||
--color-timeline: #383b40;
|
||||
--color-input-text: var(--color-text-dark);
|
||||
--color-input-background: #171a1e;
|
||||
--color-input-toggle-background: #2e353c;
|
||||
--color-input-border: var(--color-secondary);
|
||||
--color-input-border-hover: var(--color-secondary-dark-1);
|
||||
--color-light: #00001728;
|
||||
--color-light-mimic-enabled: rgba(0, 0, 0, calc(40 / 255 * 222 / 255 / var(--opacity-disabled)));
|
||||
--color-light-border: #e8f3ff28;
|
||||
--color-hover: #e8f3ff19;
|
||||
--color-hover-opaque: #21252a; /* TODO: color-mix(in srgb, var(--color-body), var(--color-hover)); */
|
||||
--color-active: #e8f3ff24;
|
||||
--color-menu: #171a1e;
|
||||
--color-card: #171a1e;
|
||||
--color-markup-table-row: #e8f3ff0f;
|
||||
--color-markup-code-block: #e8f3ff12;
|
||||
--color-markup-code-inline: #e8f3ff28;
|
||||
--color-button: #171a1e;
|
||||
--color-code-bg: #14171a;
|
||||
--color-shadow: #00001758;
|
||||
--color-shadow-opaque: #000017;
|
||||
--color-secondary-bg: #2a3137;
|
||||
--color-expand-button: #2f363d;
|
||||
--color-input-background: #191a1c;
|
||||
--color-input-toggle-background: #323438;
|
||||
--color-input-border: var(--color-secondary-dark-1);
|
||||
--color-light: #0b0b0c28;
|
||||
--color-light-border: #f3f3f428;
|
||||
--color-hover: #f3f3f419;
|
||||
--color-hover-opaque: #232528; /* TODO: color-mix(in srgb, var(--color-body), var(--color-hover)); */
|
||||
--color-active: #f3f3f424;
|
||||
--color-menu: #191a1c;
|
||||
--color-card: #191a1c;
|
||||
--color-markup-table-row: #f3f3f40f;
|
||||
--color-markup-code-block: #f3f3f412;
|
||||
--color-markup-code-inline: #f3f3f428;
|
||||
--color-button: #191a1c;
|
||||
--color-code-bg: #161718;
|
||||
--color-shadow: #0b0b0c58;
|
||||
--color-shadow-opaque: #0b0b0c;
|
||||
--color-secondary-bg: #2e3033;
|
||||
--color-expand-button: #333539;
|
||||
--color-placeholder-text: var(--color-text-light-3);
|
||||
--color-editor-line-highlight: var(--color-primary-light-5);
|
||||
--color-editor-line-highlight: var(--color-secondary-alpha-40);
|
||||
--color-editor-selection: var(--color-primary-alpha-50);
|
||||
--color-project-column-bg: var(--color-secondary-light-2);
|
||||
--color-caret: var(--color-text); /* should ideally be --color-text-dark, see #15651 */
|
||||
--color-reaction-bg: #e8f3ff12;
|
||||
--color-reaction-bg: #f3f3f412;
|
||||
--color-reaction-hover-bg: var(--color-primary-light-4);
|
||||
--color-reaction-active-bg: var(--color-primary-light-5);
|
||||
--color-tooltip-text: #f9fafb;
|
||||
--color-tooltip-bg: #000b17f0;
|
||||
--color-nav-bg: #16191d;
|
||||
--color-tooltip-text: #fafafa;
|
||||
--color-tooltip-bg: #0b0b0cf0;
|
||||
--color-nav-bg: #18191b;
|
||||
--color-nav-hover-bg: var(--color-secondary-light-1);
|
||||
--color-nav-text: var(--color-text);
|
||||
--color-secondary-nav-bg: #181c20;
|
||||
--color-secondary-nav-bg: #1a1b1e;
|
||||
--color-label-text: var(--color-text);
|
||||
--color-label-bg: #7282924b;
|
||||
--color-label-hover-bg: #728292a0;
|
||||
--color-label-active-bg: #728292ff;
|
||||
--color-label-bg: #7a7f8a4b;
|
||||
--color-label-hover-bg: #7a7f8aa0;
|
||||
--color-label-active-bg: #7a7f8aff;
|
||||
--color-accent: var(--color-primary-light-1);
|
||||
--color-small-accent: var(--color-primary-light-5);
|
||||
--color-highlight-fg: #87651e;
|
||||
--color-highlight-bg: #352c1c;
|
||||
--color-highlight-bg: #443a27;
|
||||
--color-overlay-backdrop: #080808c0;
|
||||
--color-danger: var(--color-red);
|
||||
--color-transparency-grid-light: #2a2a2a;
|
||||
--color-transparency-grid-dark: #1a1a1a;
|
||||
--color-workflow-edge-hover: #666a73;
|
||||
--color-syntax-keyword: #ff8854;
|
||||
--color-syntax-bool: #25bbc9;
|
||||
--color-syntax-control: #dd9e17;
|
||||
--color-syntax-name: #c7a618;
|
||||
--color-syntax-type: #eb8cb3;
|
||||
--color-syntax-number: #63b2dd;
|
||||
--color-syntax-operator: #ff8854;
|
||||
--color-syntax-regexp: #b89de4;
|
||||
--color-syntax-string: #95b62a;
|
||||
--color-syntax-comment: #8898b0;
|
||||
--color-syntax-invalid: #ff8686;
|
||||
--color-syntax-link: var(--color-primary);
|
||||
--color-syntax-tag: #ff8854;
|
||||
--color-syntax-attribute: #c792ff;
|
||||
--color-syntax-property: #55afff;
|
||||
--color-syntax-variable: #e29b33;
|
||||
--color-syntax-string-special: #dd9e17;
|
||||
--color-syntax-escape: #c7a618;
|
||||
--color-syntax-entity: #c792ff;
|
||||
--color-syntax-preproc: #4cbe7a;
|
||||
--color-syntax-preproc-file: #63b2dd;
|
||||
--color-syntax-decorator: #4cbe7a;
|
||||
--color-syntax-namespace: #c9d1d9;
|
||||
--color-syntax-name-pseudo: #c792ff;
|
||||
--color-syntax-comment-special: #b89de4;
|
||||
--color-syntax-text: #c9d1d9;
|
||||
--color-syntax-text-alt: #b9bcc7;
|
||||
--color-syntax-punctuation: #d2d4db;
|
||||
--color-syntax-whitespace: #7f8699;
|
||||
--color-syntax-diff-fg: #ffffff;
|
||||
--color-syntax-deleted-bg: #5f3737;
|
||||
--color-syntax-inserted-bg: #3a523a;
|
||||
--color-syntax-emph: #d1a242;
|
||||
--color-syntax-strong: #e29b33;
|
||||
--color-syntax-heading: #dd9e17;
|
||||
--color-syntax-subheading: #95b62a;
|
||||
--color-syntax-output: #8898b0;
|
||||
--color-syntax-prompt: #e29b33;
|
||||
--color-syntax-traceback: #ff8686;
|
||||
--color-syntax-matching-bracket-bg: #00918a48;
|
||||
--color-syntax-nonmatching-bracket-bg: #cc484848;
|
||||
accent-color: var(--color-accent);
|
||||
color-scheme: dark;
|
||||
}
|
||||
|
||||
+11
-8
@@ -1,16 +1,19 @@
|
||||
@import "./theme-gitea-light.css";
|
||||
|
||||
gitea-theme-meta-info {
|
||||
--theme-display-name: "Light (Red/Green Colorblind-friendly)";
|
||||
--theme-display-name: "Light";
|
||||
--theme-colorblind-type: "red-green";
|
||||
--theme-color-scheme: "light";
|
||||
}
|
||||
|
||||
/* red/green colorblind-friendly colors */
|
||||
/* from GitHub: --diffBlob-addition-*, --diffBlob-deletion-*, etc */
|
||||
:root {
|
||||
--color-diff-added-linenum-bg: #54aeff4d;
|
||||
--color-diff-added-row-bg: #ddf4ff80;
|
||||
--color-diff-added-word-bg: #54aeff66;
|
||||
--color-diff-removed-linenum-bg: #ffb77c4d;
|
||||
--color-diff-removed-row-bg: #fff1e580;
|
||||
--color-diff-removed-word-bg: #ffb77c80;
|
||||
--color-diff-added-fg: #2185d0;
|
||||
--color-diff-added-linenum-bg: #b6e3ff;
|
||||
--color-diff-added-row-bg: #ddf4ff;
|
||||
--color-diff-added-word-bg: #b6e3ff;
|
||||
--color-diff-removed-fg: #fc6500;
|
||||
--color-diff-removed-linenum-bg: #ffd8b5;
|
||||
--color-diff-removed-row-bg: #fff1e5;
|
||||
--color-diff-removed-word-bg: #ffd8b5;
|
||||
}
|
||||
|
||||
@@ -0,0 +1,15 @@
|
||||
@import "./theme-gitea-light.css";
|
||||
|
||||
gitea-theme-meta-info {
|
||||
--theme-display-name: "Light";
|
||||
--theme-colorblind-type: "blue-yellow";
|
||||
--theme-color-scheme: "light";
|
||||
}
|
||||
|
||||
/* blue/yellow colorblind-friendly colors */
|
||||
:root {
|
||||
--color-diff-added-fg: #2185d0;
|
||||
--color-diff-added-linenum-bg: #b6e3ff;
|
||||
--color-diff-added-row-bg: #ddf4ff;
|
||||
--color-diff-added-word-bg: #b6e3ff;
|
||||
}
|
||||
@@ -1,8 +1,6 @@
|
||||
@import "../chroma/light.css";
|
||||
@import "../codemirror/light.css";
|
||||
|
||||
gitea-theme-meta-info {
|
||||
--theme-display-name: "Light";
|
||||
--theme-color-scheme: "light";
|
||||
}
|
||||
|
||||
:root {
|
||||
@@ -65,14 +63,15 @@ gitea-theme-meta-info {
|
||||
--color-secondary-hover: var(--color-secondary-dark-5);
|
||||
--color-secondary-active: var(--color-secondary-dark-6);
|
||||
/* console colors - used for actions console and console files */
|
||||
--color-console-fg: #f7f8f9;
|
||||
--color-console-fg-subtle: #bdc4cc;
|
||||
--color-console-bg: #171b1e;
|
||||
--color-console-border: #2e353b;
|
||||
--color-console-hover-bg: #272d33;
|
||||
--color-console-active-bg: #2e353b;
|
||||
--color-console-menu-bg: #262b31;
|
||||
--color-console-menu-border: #414b55;
|
||||
--color-console-fg: #0d1117;
|
||||
--color-console-fg-subtle: #40474d;
|
||||
--color-console-bg: #ffffff;
|
||||
--color-console-border: #d0d7de;
|
||||
--color-console-hover-bg: #f1f3f5;
|
||||
--color-console-active-bg: #d0d7de;
|
||||
--color-console-menu-bg: #f8f9fb;
|
||||
--color-console-menu-border: #d0d7de;
|
||||
--color-console-link: #5c656d;
|
||||
/* named colors */
|
||||
--color-red: #db2828;
|
||||
--color-orange: #f2711c;
|
||||
@@ -147,31 +146,36 @@ gitea-theme-meta-info {
|
||||
--color-grey-light: #7c838a;
|
||||
--color-gold: #a1882b;
|
||||
--color-white: #ffffff;
|
||||
--color-diff-added-fg: #21ba45;
|
||||
--color-diff-added-linenum-bg: #d1f8d9;
|
||||
--color-diff-added-row-bg: #e6ffed;
|
||||
--color-diff-added-row-border: #e6ffed;
|
||||
--color-diff-added-word-bg: #acf2bd;
|
||||
--color-diff-moved-row-bg: #f1f8d1;
|
||||
--color-diff-moved-row-border: #d0e27f;
|
||||
--color-diff-removed-fg: #db2828;
|
||||
--color-diff-removed-linenum-bg: #ffcecb;
|
||||
--color-diff-removed-row-bg: #ffeef0;
|
||||
--color-diff-removed-row-border: #f1c0c0;
|
||||
--color-diff-removed-word-bg: #fdb8c0;
|
||||
--color-diff-inactive: #f0f2f4;
|
||||
--color-error-border: #e0b4b4;
|
||||
--color-error-bg: #fff6f6;
|
||||
--color-error-bg-active: #fbb;
|
||||
--color-error-bg-hover: #fdd;
|
||||
--color-error-text: #9f3a38;
|
||||
--color-success-border: #a3c293;
|
||||
--color-success-bg: #fcfff5;
|
||||
--color-success-text: #2c662d;
|
||||
--color-warning-border: #c9ba9b;
|
||||
--color-warning-bg: #fffaf3;
|
||||
--color-warning-text: #573a08;
|
||||
--color-info-border: #a9d5de;
|
||||
--color-info-bg: #f8ffff;
|
||||
--color-info-text: #276f86;
|
||||
--color-error-border: #ff818266;
|
||||
--color-error-bg: #ffebe9;
|
||||
--color-error-bg-active: #ffcecb;
|
||||
--color-error-bg-hover: #ffdcd7;
|
||||
--color-error-text: #d1242f;
|
||||
--color-success-border: #4ac26b66;
|
||||
--color-success-bg: #dafbe1;
|
||||
--color-success-text: #1a7f37;
|
||||
--color-warning-border: #d4a72c66;
|
||||
--color-warning-bg: #fff8c5;
|
||||
--color-warning-text: #9a6700;
|
||||
--color-info-border: #54aeff66;
|
||||
--color-info-bg: #ddf4ff;
|
||||
--color-info-text: #0969da;
|
||||
--color-priority-border: #b9a1ff66;
|
||||
--color-priority-bg: #f3e7ff;
|
||||
--color-priority-text: #8250df;
|
||||
--color-red-badge: #db2828;
|
||||
--color-red-badge-bg: #db28281a;
|
||||
--color-red-badge-hover-bg: #db28284d;
|
||||
@@ -202,10 +206,8 @@ gitea-theme-meta-info {
|
||||
--color-input-text: var(--color-text-dark);
|
||||
--color-input-background: #fff;
|
||||
--color-input-toggle-background: #d0d7de;
|
||||
--color-input-border: var(--color-secondary);
|
||||
--color-input-border-hover: var(--color-secondary-dark-1);
|
||||
--color-input-border: var(--color-secondary-dark-1);
|
||||
--color-light: #00001706;
|
||||
--color-light-mimic-enabled: rgba(0, 0, 0, calc(6 / 255 * 222 / 255 / var(--opacity-disabled)));
|
||||
--color-light-border: #0000171d;
|
||||
--color-hover: #00001708;
|
||||
--color-hover-opaque: #f1f3f5; /* TODO: color-mix(in srgb, var(--color-body), var(--color-hover)); */
|
||||
@@ -222,7 +224,8 @@ gitea-theme-meta-info {
|
||||
--color-secondary-bg: #f2f5f8;
|
||||
--color-expand-button: #cfe8fa;
|
||||
--color-placeholder-text: var(--color-text-light-3);
|
||||
--color-editor-line-highlight: var(--color-primary-light-6);
|
||||
--color-editor-line-highlight: var(--color-secondary-alpha-30);
|
||||
--color-editor-selection: var(--color-primary-alpha-30);
|
||||
--color-project-column-bg: var(--color-secondary-light-4);
|
||||
--color-caret: var(--color-text-dark);
|
||||
--color-reaction-bg: #0000170a;
|
||||
@@ -241,8 +244,53 @@ gitea-theme-meta-info {
|
||||
--color-accent: var(--color-primary-light-1);
|
||||
--color-small-accent: var(--color-primary-light-6);
|
||||
--color-highlight-fg: #eed200;
|
||||
--color-highlight-bg: #fffbdd;
|
||||
--color-highlight-bg: #f5efc5;
|
||||
--color-overlay-backdrop: #080808c0;
|
||||
--color-danger: var(--color-red);
|
||||
--color-transparency-grid-light: #fafafa;
|
||||
--color-transparency-grid-dark: #e2e2e2;
|
||||
--color-workflow-edge-hover: #b1b7bd;
|
||||
--color-syntax-keyword: #a73a00;
|
||||
--color-syntax-bool: #076872;
|
||||
--color-syntax-control: #7d5700;
|
||||
--color-syntax-name: #785900;
|
||||
--color-syntax-type: #ae2368;
|
||||
--color-syntax-number: #105ead;
|
||||
--color-syntax-operator: #a73a00;
|
||||
--color-syntax-regexp: #773dc5;
|
||||
--color-syntax-string: #456800;
|
||||
--color-syntax-comment: #506070;
|
||||
--color-syntax-invalid: #c00000;
|
||||
--color-syntax-link: var(--color-primary);
|
||||
--color-syntax-tag: #a73a00;
|
||||
--color-syntax-attribute: #6f41c5;
|
||||
--color-syntax-property: #2060a0;
|
||||
--color-syntax-variable: #944a00;
|
||||
--color-syntax-string-special: #7d5700;
|
||||
--color-syntax-escape: #785900;
|
||||
--color-syntax-entity: #6f41c5;
|
||||
--color-syntax-preproc: #2d6a4b;
|
||||
--color-syntax-preproc-file: #105ead;
|
||||
--color-syntax-decorator: #2d6a4b;
|
||||
--color-syntax-namespace: #555555;
|
||||
--color-syntax-name-pseudo: #6f41c5;
|
||||
--color-syntax-comment-special: #773dc5;
|
||||
--color-syntax-text: inherit;
|
||||
--color-syntax-text-alt: #47525b;
|
||||
--color-syntax-punctuation: inherit;
|
||||
--color-syntax-whitespace: #bbbbbb;
|
||||
--color-syntax-diff-fg: #000000;
|
||||
--color-syntax-deleted-bg: #ffdddd;
|
||||
--color-syntax-inserted-bg: #ddffdd;
|
||||
--color-syntax-emph: #8b5000;
|
||||
--color-syntax-strong: inherit;
|
||||
--color-syntax-heading: #7d5700;
|
||||
--color-syntax-subheading: #456800;
|
||||
--color-syntax-output: #506070;
|
||||
--color-syntax-prompt: #944a00;
|
||||
--color-syntax-traceback: #c00000;
|
||||
--color-syntax-matching-bracket-bg: #00b5ad38;
|
||||
--color-syntax-nonmatching-bracket-bg: #db282838;
|
||||
accent-color: var(--color-accent);
|
||||
color-scheme: light;
|
||||
}
|
||||
|
||||
@@ -92,15 +92,31 @@
|
||||
}
|
||||
|
||||
.user-badges {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, 64px);
|
||||
gap: 2px;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 0.5rem;
|
||||
margin: 0;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.user-badge-item {
|
||||
display: inline-flex;
|
||||
flex: 0 0 auto;
|
||||
min-width: max-content;
|
||||
}
|
||||
|
||||
.user-badges img {
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
.user-badge-chip {
|
||||
max-width: none !important;
|
||||
overflow: visible !important;
|
||||
text-overflow: clip !important;
|
||||
white-space: nowrap;
|
||||
min-width: max-content;
|
||||
}
|
||||
|
||||
#readme_profile {
|
||||
padding: 1em 2em;
|
||||
border-radius: var(--border-radius);
|
||||
|
||||
Reference in New Issue
Block a user