feat: ✨ support gitea 1.23
This commit is contained in:
Lucas Colombo
@ -1,304 +0,0 @@
|
||||
@use '@lucas-labs/lui-micro/color' as color;
|
||||
@use '@lucas-labs/lui-micro/var' as var;
|
||||
|
||||
|
||||
@mixin make-chroma-styles {
|
||||
.chroma .code-inner{
|
||||
font: 14px var.get('code-font-family');
|
||||
}
|
||||
|
||||
/* NameBuiltinPseudo */
|
||||
.chroma .bp {
|
||||
color: color.get('theme/peach/base');
|
||||
}
|
||||
/* Comment */
|
||||
.chroma .c {
|
||||
color: color.get('elevated/7');
|
||||
}
|
||||
/* CommentSingle */
|
||||
.chroma .c1 {
|
||||
color: color.get('elevated/7');
|
||||
}
|
||||
/* CommentHashbang */
|
||||
.chroma .ch {
|
||||
color: color.get('elevated/7');
|
||||
}
|
||||
/* CommentMultiline */
|
||||
.chroma .cm {
|
||||
color: color.get('elevated/7');
|
||||
}
|
||||
/* CommentPreproc */
|
||||
.chroma .cp {
|
||||
color: color.get('theme/blue/base');
|
||||
}
|
||||
/* CommentPreprocFile */
|
||||
.chroma .cpf {
|
||||
color: color.get('theme/blue/base');
|
||||
}
|
||||
/* CommentSpecial */
|
||||
.chroma .cs {
|
||||
color: color.get('elevated/7');
|
||||
}
|
||||
/* LiteralStringDelimiter */
|
||||
.chroma .dl {
|
||||
color: color.get('theme/blue/base');
|
||||
}
|
||||
/* NameFunctionMagic */
|
||||
.chroma .fm {
|
||||
}
|
||||
/* Generic */
|
||||
.chroma .g {
|
||||
}
|
||||
/* GenericDeleted */
|
||||
.chroma .gd {
|
||||
color: color.get('theme');
|
||||
background-color: rgba(#{color.get('theme/red/base', 'rgb')}, 0.15);
|
||||
}
|
||||
/* GenericEmph */
|
||||
.chroma .ge {
|
||||
font-style: italic;
|
||||
}
|
||||
/* GenericHeading */
|
||||
.chroma .gh {
|
||||
color: color.get('theme/sky/base');
|
||||
}
|
||||
/* GenericInserted */
|
||||
.chroma .gi {
|
||||
color: color.get('theme');
|
||||
background-color: rgba(#{color.get('theme/green/base', 'rgb')}, 0.15);
|
||||
}
|
||||
/* GenericUnderline */
|
||||
.chroma .gl {
|
||||
}
|
||||
/* GenericOutput */
|
||||
.chroma .go {
|
||||
color: color.get('theme/peach/base');
|
||||
}
|
||||
/* GenericPrompt */
|
||||
.chroma .gp {
|
||||
color: color.get('elevated/7');
|
||||
font-weight: bold;
|
||||
}
|
||||
/* GenericError */
|
||||
.chroma .gr {
|
||||
color: color.get('theme/maroon/base');
|
||||
}
|
||||
/* GenericStrong */
|
||||
.chroma .gs {
|
||||
font-weight: bold;
|
||||
}
|
||||
/* GenericTraceback */
|
||||
.chroma .gt {
|
||||
color: color.get('theme/maroon/base');
|
||||
}
|
||||
/* GenericSubheading */
|
||||
.chroma .gu {
|
||||
color: color.get('theme/sky/base');
|
||||
}
|
||||
/* LiteralNumberIntegerLong */
|
||||
.chroma .il {
|
||||
color: color.get('theme/peach/base');
|
||||
}
|
||||
/* Keyword */
|
||||
.chroma .k {
|
||||
color: color.get('theme/mauve/base');
|
||||
}
|
||||
/* KeywordConstant */
|
||||
.chroma .kc {
|
||||
color: color.get('theme/yellow/base');
|
||||
}
|
||||
/* KeywordDeclaration */
|
||||
.chroma .kd {
|
||||
color: color.get('theme/mauve/base');
|
||||
}
|
||||
/* KeywordNamespace */
|
||||
.chroma .kn {
|
||||
color: color.get('theme/yellow/base');
|
||||
}
|
||||
/* KeywordPseudo */
|
||||
.chroma .kp {
|
||||
color: color.get('theme/mauve/base');
|
||||
font-weight: bold;
|
||||
}
|
||||
/* KeywordReserved */
|
||||
.chroma .kr {
|
||||
color: color.get('theme/mauve/base');
|
||||
}
|
||||
/* KeywordType */
|
||||
.chroma .kt {
|
||||
color: color.get('theme/yellow/base');
|
||||
}
|
||||
/* Literal */
|
||||
.chroma .l {
|
||||
}
|
||||
/* LiteralDate */
|
||||
.chroma .ld {
|
||||
}
|
||||
/* LiteralNumber */
|
||||
.chroma .m {
|
||||
color: color.get('theme/peach/base');
|
||||
}
|
||||
/* LiteralNumberBin */
|
||||
.chroma .mb {
|
||||
color: color.get('theme/peach/base');
|
||||
}
|
||||
/* LiteralNumberFloat */
|
||||
.chroma .mf {
|
||||
color: color.get('theme/peach/base');
|
||||
}
|
||||
/* LiteralNumberHex */
|
||||
.chroma .mh {
|
||||
color: color.get('theme/peach/base');
|
||||
}
|
||||
/* LiteralNumberInteger */
|
||||
.chroma .mi {
|
||||
color: color.get('theme/peach/base');
|
||||
}
|
||||
/* LiteralNumberOct */
|
||||
.chroma .mo {
|
||||
color: color.get('theme/peach/base');
|
||||
}
|
||||
/* Name */
|
||||
.chroma .n {
|
||||
color: color.get('theme/lavender/base');
|
||||
}
|
||||
/* NameAttribute */
|
||||
.chroma .na {
|
||||
color: color.get('theme/yellow/base');
|
||||
}
|
||||
/* NameBuiltin */
|
||||
.chroma .nb {
|
||||
color: color.get('theme/peach/base');
|
||||
}
|
||||
/* NameClass */
|
||||
.chroma .nc {
|
||||
color: color.get('theme/yellow/base');
|
||||
}
|
||||
/* NameDecorator */
|
||||
.chroma .nd {
|
||||
color: color.get('theme/pink/base');
|
||||
}
|
||||
/* NameException */
|
||||
.chroma .ne {
|
||||
color: color.get('theme/maroon/base');
|
||||
}
|
||||
/* NameFunction */
|
||||
.chroma .nf {
|
||||
color: color.get('theme/blue/base');
|
||||
}
|
||||
/* NameEntity */
|
||||
.chroma .ni {
|
||||
color: color.get('theme/pink/base');
|
||||
}
|
||||
/* NameLabel */
|
||||
.chroma .nl {
|
||||
color: color.get('theme/yellow/base');
|
||||
}
|
||||
/* NameNamespace */
|
||||
.chroma .nn {
|
||||
color: color.get('theme/yellow/base');
|
||||
}
|
||||
/* NameConstant */
|
||||
.chroma .no {
|
||||
color: color.get('theme/yellow/base');
|
||||
}
|
||||
/* NameTag */
|
||||
.chroma .nt {
|
||||
color: color.get('theme/mauve/base');
|
||||
}
|
||||
/* NameVariable */
|
||||
.chroma .nv {
|
||||
color: color.get('theme/peach/base');
|
||||
}
|
||||
/* NameOther */
|
||||
.chroma .nx {
|
||||
color: color.get('theme/peach/base');
|
||||
}
|
||||
/* Operator */
|
||||
.chroma .o {
|
||||
color: color.get('theme/sky/base');
|
||||
}
|
||||
/* OperatorWord */
|
||||
.chroma .ow {
|
||||
color: color.get('theme/sky/base');
|
||||
font-weight: bold;
|
||||
}
|
||||
/* Punctuation */
|
||||
.chroma .p {
|
||||
color: color.get('elevated/9');
|
||||
}
|
||||
/* NameProperty */
|
||||
.chroma .py {
|
||||
}
|
||||
/* LiteralString */
|
||||
.chroma .s {
|
||||
color: color.get('theme/green/base');
|
||||
}
|
||||
/* LiteralStringSingle */
|
||||
.chroma .s1 {
|
||||
color: color.get('theme/green/base');
|
||||
}
|
||||
/* LiteralStringDouble */
|
||||
.chroma .s2 {
|
||||
color: color.get('theme/green/base');
|
||||
}
|
||||
/* LiteralStringAffix */
|
||||
.chroma .sa {
|
||||
color: color.get('theme/green/base');
|
||||
}
|
||||
/* LiteralStringBacktick */
|
||||
.chroma .sb {
|
||||
color: color.get('theme/green/base');
|
||||
}
|
||||
/* LiteralStringChar */
|
||||
.chroma .sc {
|
||||
color: color.get('theme/green/base');
|
||||
}
|
||||
/* LiteralStringDoc */
|
||||
.chroma .sd {
|
||||
color: color.get('theme/green/base');
|
||||
}
|
||||
/* LiteralStringEscape */
|
||||
.chroma .se {
|
||||
color: color.get('theme/blue/base');
|
||||
}
|
||||
/* LiteralStringHeredoc */
|
||||
.chroma .sh {
|
||||
color: color.get('theme/green/base');
|
||||
}
|
||||
/* LiteralStringInterpol */
|
||||
.chroma .si {
|
||||
color: color.get('theme/green/base');
|
||||
}
|
||||
/* LiteralStringRegex */
|
||||
.chroma .sr {
|
||||
color: color.get('theme/blue/base');
|
||||
}
|
||||
/* LiteralStringSymbol */
|
||||
.chroma .ss {
|
||||
color: color.get('theme/green/base');
|
||||
}
|
||||
/* LiteralStringOther */
|
||||
.chroma .sx {
|
||||
color: color.get('theme/green/base');
|
||||
}
|
||||
/* NameVariableClass */
|
||||
.chroma .vc {
|
||||
color: color.get('theme/yellow/base');
|
||||
}
|
||||
/* NameVariableGlobal */
|
||||
.chroma .vg {
|
||||
color: color.get('theme/peach/base');
|
||||
}
|
||||
/* NameVariableInstance */
|
||||
.chroma .vi {
|
||||
color: color.get('theme/yellow/base');
|
||||
}
|
||||
/* NameVariableMagic */
|
||||
.chroma .vm {
|
||||
}
|
||||
/* TextWhitespace */
|
||||
.chroma .w {
|
||||
color: color.get('elevated/4');
|
||||
}
|
||||
}
|
||||
@ -1,95 +0,0 @@
|
||||
@use '@lucas-labs/lui-micro/color' as color;
|
||||
|
||||
@mixin make-code-mirror-styles {
|
||||
.CodeMirror,
|
||||
.CodeMirror.cm-s-default,
|
||||
.CodeMirror.cm-s-paper {
|
||||
.cm-property {
|
||||
color: color.get('text')
|
||||
}
|
||||
|
||||
.cm-header {
|
||||
color: color.get('text')
|
||||
}
|
||||
|
||||
.cm-quote {
|
||||
color: color.get('theme/green/base')
|
||||
}
|
||||
|
||||
.cm-keyword {
|
||||
color: color.get('theme/mauve/base');
|
||||
}
|
||||
|
||||
.cm-atom {
|
||||
color: color.get('theme/red/base');
|
||||
}
|
||||
|
||||
.cm-number {
|
||||
color: color.get('theme/peach/base');
|
||||
}
|
||||
|
||||
.cm-def {
|
||||
color: color.get('text')
|
||||
}
|
||||
|
||||
.cm-variable-2 {
|
||||
color: color.get('theme/sky/base');
|
||||
}
|
||||
|
||||
.cm-variable-3 {
|
||||
color: color.get('theme/teal/base');
|
||||
}
|
||||
|
||||
.cm-comment {
|
||||
color: color.get('elevation/6')
|
||||
}
|
||||
|
||||
.cm-string {
|
||||
color: color.get('theme/green')
|
||||
}
|
||||
|
||||
.cm-string-2 {
|
||||
color: color.get('theme/green')
|
||||
}
|
||||
|
||||
.cm-meta {
|
||||
color: color.get('theme/peach/base');
|
||||
}
|
||||
|
||||
.cm-qualifier {
|
||||
color: color.get('theme/peach/base');
|
||||
}
|
||||
|
||||
.cm-builtin {
|
||||
color: color.get('theme/peach/base');
|
||||
}
|
||||
|
||||
.cm-bracket {
|
||||
color: color.get('text')
|
||||
}
|
||||
|
||||
.cm-tag {
|
||||
color: color.get('theme/yellow/base');
|
||||
}
|
||||
|
||||
.cm-attribute {
|
||||
color: color.get('theme/yellow/base');
|
||||
}
|
||||
|
||||
.cm-hr {
|
||||
color: color.get('elevation/9');
|
||||
}
|
||||
|
||||
.cm-url {
|
||||
color: color.get('theme/blue/base');
|
||||
}
|
||||
|
||||
.cm-link {
|
||||
color: color.get('theme/blue/base');
|
||||
}
|
||||
|
||||
.cm-error {
|
||||
color: color.get('theme/red/base');
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,155 +0,0 @@
|
||||
@use '@lucas-labs/lui-micro/color' as color;
|
||||
|
||||
@mixin make-monaco-styles($is-dark: true) {
|
||||
$surface0: #{color.get('elevation/4')};
|
||||
$subtext0: #{color.get('elevation/10')};
|
||||
$overlay2: #{color.get('elevation/9')};
|
||||
$mantle: #{color.get('elevation/0')};
|
||||
$base: #{color.get('elevation/3')};
|
||||
$accent: #{color.get('primary/base')};
|
||||
$text: #{color.get('text')};
|
||||
$mauve: #{color.get('theme/sapphire/base')};
|
||||
$peach: #{color.get('theme/peach/base')};
|
||||
$teal: #{color.get('theme/teal/base')};
|
||||
$green: #{color.get('theme/green/base')};
|
||||
$blue: #{color.get('theme/blue/base')};
|
||||
$pink: #{color.get('theme/pink/base')};
|
||||
|
||||
.monaco-editor {
|
||||
--vscode-editor-background: #{$mantle} !important;
|
||||
--vscode-editorGutter-background: #{$mantle} !important;
|
||||
|
||||
// selected text
|
||||
.selected-text {
|
||||
background-color: $surface0 !important;
|
||||
}
|
||||
// line numbers
|
||||
.margin-view-overlays .line-numbers {
|
||||
color: $subtext0 !important;
|
||||
}
|
||||
.line-numbers.active-line-number {
|
||||
color: $accent !important;
|
||||
}
|
||||
|
||||
// current / cursor line
|
||||
.view-overlays .current-line,
|
||||
.margin-view-overlays .current-line-margin {
|
||||
background-color: #{color.get('elevation/2')} !important;
|
||||
}
|
||||
|
||||
// Note: all of the hotpink stuff is there so it's easily visible, since these editor scope mappings are a mess
|
||||
|
||||
// plaintext
|
||||
.mtk1 {
|
||||
color: $text !important;
|
||||
}
|
||||
.mtk2 {
|
||||
color: #ff69b4 !important;
|
||||
}
|
||||
// decorators
|
||||
.mtk3 {
|
||||
color: $peach !important;
|
||||
}
|
||||
// shell arguments
|
||||
.mtk4 {
|
||||
color: $teal !important;
|
||||
}
|
||||
// css constants & pre-defineds
|
||||
.mtk5 {
|
||||
color: $text !important;
|
||||
}
|
||||
// keywords
|
||||
.mtk6 {
|
||||
color: $mauve !important;
|
||||
}
|
||||
// numbers
|
||||
.mtk7 {
|
||||
color: $peach !important;
|
||||
}
|
||||
// comments
|
||||
.mtk8 {
|
||||
color: $overlay2 !important;
|
||||
}
|
||||
// sometimes a keyword, apparently
|
||||
.mtk9 {
|
||||
color: $mauve !important;
|
||||
}
|
||||
// braces, brackets, parentheses
|
||||
.mtk10 {
|
||||
color: $subtext0 !important;
|
||||
}
|
||||
// arrow brackets & equal signs in HTML
|
||||
.mtk11 {
|
||||
color: $teal !important;
|
||||
}
|
||||
// @ sign in javascript ¯\_(ツ)_/¯
|
||||
.mtk12 {
|
||||
color: $teal !important;
|
||||
}
|
||||
.mtk13 {
|
||||
color: #ff69b4 !important;
|
||||
}
|
||||
.mtk14 {
|
||||
color: #ff69b4 !important;
|
||||
}
|
||||
// regex, css classnames, and HTML keywords (huh)
|
||||
.mtk15 {
|
||||
color: $mauve !important;
|
||||
}
|
||||
// shebangs
|
||||
.mtk16 {
|
||||
color: $overlay2 !important;
|
||||
}
|
||||
.mtk17 {
|
||||
color: #ff69b4 !important;
|
||||
}
|
||||
.mtk18 {
|
||||
color: #ff69b4 !important;
|
||||
}
|
||||
// glob operator i guess
|
||||
.mtk19 {
|
||||
color: $teal !important;
|
||||
}
|
||||
.mtk20 {
|
||||
color: #ff69b4 !important;
|
||||
}
|
||||
// strings
|
||||
.mtk21 {
|
||||
color: $green !important;
|
||||
}
|
||||
.mtk22 {
|
||||
color: #ff69b4 !important;
|
||||
}
|
||||
// functions
|
||||
.mtk23 {
|
||||
color: $blue !important;
|
||||
}
|
||||
// shell variables
|
||||
.mtk24 {
|
||||
color: $peach !important;
|
||||
}
|
||||
// weird variables
|
||||
.mtk25 {
|
||||
color: $pink !important;
|
||||
}
|
||||
|
||||
// .bracket-highlighting-0 {
|
||||
// color: color.mix($text, $red, 40%) !important;
|
||||
// }
|
||||
// .bracket-highlighting-1 {
|
||||
// color: color.mix($text, $peach, 40%) !important;
|
||||
// }
|
||||
// .bracket-highlighting-2 {
|
||||
// color: color.mix($text, $yellow, 40%) !important;
|
||||
// }
|
||||
// .bracket-highlighting-3 {
|
||||
// color: color.mix($text, $green, 40%) !important;
|
||||
// }
|
||||
// .bracket-highlighting-4 {
|
||||
// color: color.mix($text, $blue, 40%) !important;
|
||||
// }
|
||||
// .bracket-highlighting-5 {
|
||||
// color: color.mix($text, $mauve, 40%) !important;
|
||||
// }
|
||||
}
|
||||
}
|
||||
@ -1,14 +0,0 @@
|
||||
@use '@lucas-labs/lui-micro/var' as var;
|
||||
@use '@lucas-labs/lui-micro/color' as color;
|
||||
|
||||
@mixin apply-styles {
|
||||
.page-content.home {
|
||||
div.center {
|
||||
img {
|
||||
// background-color: color.get('primary/base');
|
||||
// border-radius: var.get('measure/4x');
|
||||
// padding: var.get('measure/1.25x');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,16 +0,0 @@
|
||||
@mixin apply-styles {
|
||||
.issue-content {
|
||||
img {
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.issue-content, .issue-list {
|
||||
.labels-list {
|
||||
.label {
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
@ -1,9 +0,0 @@
|
||||
@use '@lucas-labs/lui-micro/color' as color;
|
||||
|
||||
@mixin apply-styles() {
|
||||
.markup {
|
||||
table {
|
||||
width: fit-content;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,19 +0,0 @@
|
||||
@use '@lucas-labs/lui-micro/var' as var;
|
||||
@use '@lucas-labs/lui-micro/color' as color;
|
||||
|
||||
@mixin apply-styles {
|
||||
#project-board {
|
||||
.project-column-header {
|
||||
.project-column-title {
|
||||
.circular.label {
|
||||
display: flex;
|
||||
padding: 0 !important;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
line-height: 16px;
|
||||
padding: 0 var.get('measure/.25x') !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,69 +0,0 @@
|
||||
@use '@lucas-labs/lui-micro/var' as var;
|
||||
@use '@lucas-labs/lui-micro/color' as color;
|
||||
|
||||
@mixin apply-styles {
|
||||
.secondary-nav {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-bottom: var.get('measure/1x');
|
||||
|
||||
.ui.container {
|
||||
margin: 0 0 0 0 !important;
|
||||
max-width: unset !important;
|
||||
width: 100% !important;
|
||||
padding: 0 var.get('measure/1x');
|
||||
}
|
||||
|
||||
.repo-header {
|
||||
margin: 0 0 var.get('measure/1x') 0;
|
||||
}
|
||||
|
||||
.ui.tabs.divider {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
overflow-menu {
|
||||
.item {
|
||||
--item-margin-bottom: #{var.get('measure/.5x')} !important;
|
||||
margin: 0 var.get('measure/.5x') var(--item-margin-bottom) !important;
|
||||
border-radius: var.get('measure/.25x') !important;
|
||||
padding: var.get('measure/.5x') var.get('measure/.5x') !important;
|
||||
color: var(--color-text) !important;
|
||||
border: none !important;
|
||||
position: relative; // Make the parent element positioned
|
||||
|
||||
svg {
|
||||
color: var(--color-text-light-3) !important;
|
||||
margin-right: var.get('measure/.5x') !important;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: color.get('elevation/4') !important;
|
||||
}
|
||||
|
||||
&.active {
|
||||
background-color: transparent !important;
|
||||
color: var(--color-text) !important;
|
||||
border-radius: 0 !important;
|
||||
// font-weight: normal !important;
|
||||
border-bottom: calc(var(--item-margin-bottom) - 1px) solid var(--color-secondary-nav-bg) !important;
|
||||
margin-bottom: 1px !important;
|
||||
box-shadow: 0px 2px 0px 0px color.get('primary/base') !important;
|
||||
}
|
||||
|
||||
.small.label {
|
||||
background-color: color.get('elevation/7');
|
||||
border: 1px solid color.get('elevation/7');
|
||||
border-radius: var.get('measure/2x');
|
||||
color: var(--color-text);
|
||||
font-weight: var(--base-text-weight-medium, 500);
|
||||
min-width: calc(var.get('measure/1.25x') + 6px);
|
||||
padding: 6px;
|
||||
text-align: center;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,15 +0,0 @@
|
||||
@use './repo-header';
|
||||
@use './repo';
|
||||
@use './project';
|
||||
@use './home';
|
||||
@use './markup';
|
||||
@use './issue-content';
|
||||
|
||||
@mixin apply-custom-styles {
|
||||
@include repo-header.apply-styles();
|
||||
@include repo.apply-styles();
|
||||
@include project.apply-styles();
|
||||
@include home.apply-styles();
|
||||
@include markup.apply-styles();
|
||||
@include issue-content.apply-styles();
|
||||
}
|
||||
@ -1,207 +0,0 @@
|
||||
@use '@lucas-labs/lui-micro/var' as var;
|
||||
@use '@lucas-labs/lui-micro/color' as color;
|
||||
|
||||
@mixin apply-styles {
|
||||
|
||||
#repo-topics, #topic_edit, .label-list {
|
||||
row-gap: var.get('measure/.5x');
|
||||
margin-top: 0 !important;
|
||||
|
||||
.label:not(.basic) {
|
||||
font-size: var.get('small-font-size') !important;
|
||||
background-color: rgba(#{color.get('theme/blue/base', 'rgb')}, 0.1);
|
||||
color: color.get('primary/base');
|
||||
border-radius: var.get('measure/2x');
|
||||
line-height: 14px;
|
||||
transition: background-color 0.2s ease;
|
||||
|
||||
&:hover {
|
||||
background-color: rgba(#{color.get('theme/blue/base', 'rgb')}, 0.3) !important;
|
||||
color: color.get('primary/base') !important;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.ui.table>tr>td, .ui.table>tbody>tr>td {
|
||||
border-top-color: rgba(#{color.get('theme/blue/base', 'rgb')}, 0.04);
|
||||
}
|
||||
|
||||
.page-content.repository.file.list > .ui.container.lugit-repo-list-view {
|
||||
display: flex;
|
||||
flex-direction: row-reverse;
|
||||
column-gap: 24px;
|
||||
|
||||
@media (max-width: 1100px) {
|
||||
width: 100%;
|
||||
min-width: 100%;
|
||||
margin: 0;
|
||||
padding: 0 var.get('measure/2x');
|
||||
|
||||
.lugit-repo-header-data {
|
||||
min-width: calc(#{var.get('repo-home/sidebar-width')} * 0.87) !important;
|
||||
max-width: calc(#{var.get('repo-home/sidebar-width')} * 0.87) !important;
|
||||
width: calc(#{var.get('repo-home/sidebar-width')} * 0.87) !important;
|
||||
}
|
||||
|
||||
.repo-button-row {
|
||||
.gt-gap-y-3 {
|
||||
column-gap: var.get('measure/.5x');
|
||||
|
||||
#new-pull-request {
|
||||
display: none;
|
||||
}
|
||||
|
||||
[role=menu] {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
#clone-panel {
|
||||
#repo-clone-url {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1280px) {
|
||||
flex-direction: column;
|
||||
column-gap: 0;
|
||||
row-gap: 24px;
|
||||
|
||||
.lugit-repo-header-data {
|
||||
min-width: 100%!important;
|
||||
max-width: 100%!important;
|
||||
width: 100%!important;
|
||||
}
|
||||
|
||||
#repo-topics {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
#repo-desc {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
font-size: 1em;
|
||||
row-gap: var.get('measure/1x');
|
||||
|
||||
h5 {
|
||||
display: none;
|
||||
}
|
||||
|
||||
span {
|
||||
font-size: 1.2em !important;
|
||||
font-style: italic !important;
|
||||
color: var(--color-text-light-3);
|
||||
}
|
||||
|
||||
a {
|
||||
font-size: 1.1em;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.repo-button-row {
|
||||
.gt-gap-y-3 {
|
||||
column-gap: var.get('measure/.5x');
|
||||
}
|
||||
|
||||
#clone-panel {
|
||||
#repo-clone-url {
|
||||
width: unset;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.lugit-repo-header-data {
|
||||
min-width: var.get('repo-home/sidebar-width');
|
||||
max-width: var.get('repo-home/sidebar-width');
|
||||
width: var.get('repo-home/sidebar-width');
|
||||
|
||||
#repo-desc {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
font-size: 1em;
|
||||
row-gap: var.get('measure/1x');
|
||||
|
||||
* {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
h5 {
|
||||
font-size: 1.1em;
|
||||
}
|
||||
|
||||
span {
|
||||
font-size: 1.1em;
|
||||
}
|
||||
|
||||
a {
|
||||
font-size: 1.1em;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.lugit-repo-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
row-gap: var.get('measure/1x');
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
#repo-files-table {
|
||||
.commit-list {
|
||||
.latest-commit {
|
||||
gap: var.get('measure/.5x');
|
||||
}
|
||||
|
||||
.isSigned, .isVerified {
|
||||
padding: 0 !important;
|
||||
border: none !important;
|
||||
.shortsha {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.detail {
|
||||
border-left: none !important;
|
||||
padding: 0 !important;
|
||||
margin: 0 !important;
|
||||
|
||||
div {
|
||||
display: block;
|
||||
padding: 0 !important;
|
||||
margin: 0 !important;
|
||||
|
||||
svg {
|
||||
margin: 0 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.avatar {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.commit-summary {
|
||||
color: var(--color-text-light-2) !important
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#topic_edit {
|
||||
flex-direction: column;
|
||||
row-gap: var.get('measure/1x');
|
||||
|
||||
.field.gt-f1.gt-mr-3 {
|
||||
margin: 0px !important;
|
||||
}
|
||||
}
|
||||
|
||||
#repo-topics {
|
||||
margin-top: var.get('measure/1x') !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,5 +0,0 @@
|
||||
@use './file-list';
|
||||
|
||||
@mixin apply-styles {
|
||||
@include file-list.apply-styles();
|
||||
}
|
||||
2
src/themes/scss/theme/modules/index.scss
Normal file
2
src/themes/scss/theme/modules/index.scss
Normal file
@ -0,0 +1,2 @@
|
||||
@forward './repo';
|
||||
@forward './issues';
|
||||
274
src/themes/scss/theme/modules/issues/_issue-sidebar.scss
Normal file
274
src/themes/scss/theme/modules/issues/_issue-sidebar.scss
Normal file
@ -0,0 +1,274 @@
|
||||
@use '@lucas-labs/lui-micro/var' as var;
|
||||
@use '@lucas-labs/lui-micro/color' as color;
|
||||
@use '../../components/button' as button;
|
||||
|
||||
@mixin sidebar {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border: none !important;
|
||||
color: var(--color-text-light-2) !important;
|
||||
padding: 0 !important;
|
||||
|
||||
// reset padding and margin for all children
|
||||
>*, .issue-sidebar-combo>*, >text+*, >.ui>* {
|
||||
margin: unset !important;
|
||||
padding: unset !important;
|
||||
font-size: var.get('font-size/sm') !important;
|
||||
}
|
||||
|
||||
// alignment for main children elements
|
||||
>.ui, >.text, >.ui {
|
||||
padding-left: var.get('measure/.5x') !important;
|
||||
padding-right: 0 !important;
|
||||
}
|
||||
|
||||
.ui.ui.ui.compact.grid>.column:not(.row), .ui.ui.ui.compact.grid>.row>.column {
|
||||
padding-left: unset;
|
||||
padding-right: unset;
|
||||
}
|
||||
|
||||
// reset for all actionable elements
|
||||
button, input, .dropdown, .ui.grid>.row>[class*="two wide"].column, .ui.grid>.column.row>[class*="two wide"].column, .ui.grid>[class*="two wide"].column, .ui.column.grid>[class*="two wide"].column {
|
||||
padding: 0 !important;
|
||||
margin: 0 !important;
|
||||
min-height: 0 !important;
|
||||
min-width: 0 !important;
|
||||
}
|
||||
|
||||
// -------------------------------------------------------------- //
|
||||
// ---------------------- Elements Styling ---------------------- //
|
||||
// -------------------------------------------------------------- //
|
||||
|
||||
a:hover {
|
||||
text-decoration: none !important;
|
||||
}
|
||||
|
||||
.ui.label {
|
||||
height: 20px;
|
||||
border-radius: 20px;
|
||||
}
|
||||
|
||||
// dividers
|
||||
>.divider {
|
||||
width: calc(100% - var.get('measure/.5x')) !important;
|
||||
align-self: flex-end;
|
||||
margin: var.get('measure/.875x') 0 !important;
|
||||
}
|
||||
|
||||
|
||||
// select branch dropdown
|
||||
.select-branch {
|
||||
align-self: flex-end;
|
||||
|
||||
.branch-dropdown-button {
|
||||
@include button.hollow;
|
||||
}
|
||||
|
||||
+.divider {
|
||||
border: none !important;
|
||||
margin: var.get('measure/.5x') 0 !important;
|
||||
}
|
||||
|
||||
.menu {
|
||||
--color-menu: #{color.get('elevation/3')};
|
||||
|
||||
.branch-tag-item.active, .reference-list-menu, .reference-list-menu .item {
|
||||
--color-menu: #{color.get('elevation/4')} !important;
|
||||
}
|
||||
|
||||
.branch-tag-item {
|
||||
--border-radius: #{var.get('measure/.5x')};
|
||||
|
||||
&:hover {
|
||||
color: currentColor !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.issue-sidebar-combo {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: var.get('measure/.5x') !important;
|
||||
|
||||
> * {
|
||||
padding-left: var.get('measure/.5x') !important;
|
||||
padding-right: var.get('measure/.5x') !important;
|
||||
}
|
||||
|
||||
.ui.dropdown {
|
||||
padding-top: var.get('measure/.375x') !important;
|
||||
padding-bottom: var.get('measure/.375x') !important;
|
||||
font-size: var.get('font-size/sm');
|
||||
transition: background-color .1s ease;
|
||||
border-radius: var(--border-radius) !important;
|
||||
|
||||
>a {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
&:hover {
|
||||
color: currentColor !important;
|
||||
text-decoration: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: rgba(#{color.get('elevation/6', 'rgb')}, .5);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// direct text children
|
||||
>.text {
|
||||
// background-color: orange !important;
|
||||
flex: 1;
|
||||
display: flex !important;
|
||||
justify-content: space-between;
|
||||
font-weight: 500 !important;
|
||||
margin-bottom: var.get('measure/.75x') !important;
|
||||
|
||||
strong {
|
||||
font-weight: 500 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.watching, .depending {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: var.get('measure/.75x') !important;
|
||||
}
|
||||
|
||||
.watching {
|
||||
button {
|
||||
font-weight: 500;
|
||||
padding: var.get('measure/.5x') var.get('measure/.75x') !important;
|
||||
border-radius: var(--border-radius) !important;
|
||||
|
||||
svg {
|
||||
color: color.get('subtle') !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.depending {
|
||||
.divided.list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: var.get('measure/1x') !important;
|
||||
|
||||
.dependency {
|
||||
border: none !important;
|
||||
|
||||
.item-left {
|
||||
a { // issue
|
||||
|
||||
}
|
||||
|
||||
div.text { // repo
|
||||
font-size: var.get('font-size/xs') !important;
|
||||
}
|
||||
}
|
||||
|
||||
// if not the first dependency in the list, we add a :before element to serve as divider
|
||||
&:not(:first-child) {
|
||||
position: relative;
|
||||
&:before {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: -8px;
|
||||
left: 0;
|
||||
height: 1px;
|
||||
width: 100%;
|
||||
background-color: color.get('elevation/4');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.selection.dropdown {
|
||||
padding: var.get('measure/.375x') var.get('measure/.75x') !important;
|
||||
|
||||
input {
|
||||
padding: var.get('measure/.375x') var.get('measure/.75x') !important;
|
||||
line-height: 20px !important;
|
||||
}
|
||||
}
|
||||
|
||||
button {
|
||||
padding: var.get('measure/.5x') !important;
|
||||
}
|
||||
}
|
||||
|
||||
// reference
|
||||
div.ui.equal.width.compact.grid {
|
||||
button {
|
||||
@include button.hollow;
|
||||
display: flex;
|
||||
color: color.get('subtle') !important;
|
||||
width: unset !important;
|
||||
// padding: var.get('measure/.5x') !important;
|
||||
}
|
||||
}
|
||||
|
||||
// issue due date form
|
||||
.issue-due-form {
|
||||
* {
|
||||
color: color.get('subtle') !important;
|
||||
}
|
||||
|
||||
// input of type date
|
||||
input[type="date"] {
|
||||
padding: var.get('measure/.5x') var.get('measure/.75x') !important;
|
||||
border-top-left-radius: var(--border-radius);
|
||||
border-bottom-left-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
button {
|
||||
padding: var.get('measure/.5x') !important;
|
||||
border-top-right-radius: var(--border-radius) !important;
|
||||
border-bottom-right-radius: var(--border-radius) !important;
|
||||
}
|
||||
}
|
||||
|
||||
// direct form child
|
||||
>form, .form {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: var.get('measure/.5x') !important;
|
||||
}
|
||||
|
||||
// buttons at the end of the sidebar
|
||||
>form button, >button {
|
||||
font-size: var.get('font-size/sm') !important;
|
||||
border: none !important;
|
||||
background: transparent !important;
|
||||
padding: var.get('measure/.375x') var.get('measure/.5x') !important;
|
||||
justify-content: start !important;
|
||||
gap: var.get('measure/.5x') !important;
|
||||
margin-bottom: var.get('measure/.25x') !important;
|
||||
border-radius: var(--border-radius) !important;
|
||||
|
||||
svg {
|
||||
color: color.get('subtle') !important;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: color.get('elevation/4') !important;
|
||||
}
|
||||
|
||||
// if the data-modal attr is #sidebar-delete-issue, make the color red
|
||||
&[data-modal="#sidebar-delete-issue"] {
|
||||
color: color.get('palette/red/base') !important;
|
||||
svg {
|
||||
color: color.get('palette/red/base') !important;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: rgba(#{color.get('palette/red/dark/15%', 'rgb')}, 0.1) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
133
src/themes/scss/theme/modules/issues/_issue.scss
Normal file
133
src/themes/scss/theme/modules/issues/_issue.scss
Normal file
@ -0,0 +1,133 @@
|
||||
@use '@lucas-labs/lui-micro/var' as var;
|
||||
@use '@lucas-labs/lui-micro/color' as color;
|
||||
@use '../../components/button' as button;
|
||||
@use './issue-sidebar';
|
||||
|
||||
@mixin apply-styles {
|
||||
.issue-content-right {
|
||||
@include issue-sidebar.sidebar;
|
||||
}
|
||||
|
||||
.issue-title-header {
|
||||
margin-bottom: var.get('measure/1.5x');
|
||||
padding-bottom: var.get('measure/.75x');
|
||||
border-bottom: 1px solid color.get('elevation/5');
|
||||
|
||||
.issue-title {
|
||||
.index {
|
||||
font-weight: 300;
|
||||
}
|
||||
}
|
||||
|
||||
.issue-title-meta {
|
||||
color: color.get('subtle');
|
||||
}
|
||||
}
|
||||
|
||||
.issue-content {
|
||||
column-gap: var.get('measure/1.5x');
|
||||
}
|
||||
|
||||
.issue-content-left {
|
||||
.timeline-avatar img {
|
||||
border-radius: 50% !important;
|
||||
}
|
||||
}
|
||||
|
||||
.timeline-item {
|
||||
&.comment {
|
||||
.content {
|
||||
background-color: transparent !important;
|
||||
|
||||
>.comment-header, >.ui.segment {
|
||||
&:before, &:after {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.comment-header {
|
||||
padding: var.get('measure/.25x') var.get('measure/.25x') var.get('measure/.25x') var.get('measure/1x') !important;
|
||||
|
||||
.comment-header-left {
|
||||
.text {
|
||||
color: color.get('subtle') !important;
|
||||
|
||||
.author {
|
||||
color: color.get('text') !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.comment-header-right {
|
||||
* {
|
||||
color: color.get('subtle') !important;
|
||||
}
|
||||
|
||||
.label {
|
||||
height: var.get('measure/1.25x', 1.25rem) !important;
|
||||
padding: 0px var.get('measure/.375x') !important;
|
||||
border-radius: var.get('measure/1x') !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
// comment form at the end
|
||||
&.form {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
background-color: var(--color-body);
|
||||
gap: var.get('measure/1x');
|
||||
left: -68px !important;
|
||||
width: calc(100% + 68px - 16px) !important;
|
||||
|
||||
@media (max-width: 768px) {
|
||||
left: 0 !important;
|
||||
margin-left: -16px !important;
|
||||
width: auto !important;
|
||||
}
|
||||
|
||||
.timeline-avatar {
|
||||
display: block;
|
||||
position: relative !important;
|
||||
left: unset !important;
|
||||
flex: 0 0 auto !important;
|
||||
}
|
||||
|
||||
.content {
|
||||
// fake title to mimic github new issue page
|
||||
&:before {
|
||||
display: block;
|
||||
content: 'Add a comment';
|
||||
font-weight: 600;
|
||||
margin-bottom: var.get('measure/1x');
|
||||
margin-top: var.get('measure/.5x');
|
||||
font-size: var.get('font-size/lg');
|
||||
}
|
||||
|
||||
display: block;
|
||||
position: relative !important;
|
||||
margin-left: 0 !important;
|
||||
flex: 1;
|
||||
|
||||
.ui.segment {
|
||||
padding: 0 !important;
|
||||
border: none !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.repository.view.issue .comment-list .comment>.content>div:last-child {
|
||||
border-bottom-left-radius: var(--border-radius);
|
||||
border-bottom-right-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
.repository.view.issue .comment-list .comment>.content>div:first-child {
|
||||
border-top-left-radius: var(--border-radius);
|
||||
border-top-right-radius: var(--border-radius);
|
||||
}
|
||||
}
|
||||
46
src/themes/scss/theme/modules/issues/_list.scss
Normal file
46
src/themes/scss/theme/modules/issues/_list.scss
Normal file
@ -0,0 +1,46 @@
|
||||
@use '@lucas-labs/lui-micro/var' as var;
|
||||
@use '@lucas-labs/lui-micro/color' as color;
|
||||
|
||||
@mixin apply-styles {
|
||||
.page-content.repository.issue-list, .page-content.dashboard.issues {
|
||||
.secondary-nav {
|
||||
margin-bottom: var.get('measure/1.5x');
|
||||
}
|
||||
|
||||
#issue-filters {
|
||||
margin: var.get('measure/2x') 0 var.get('measure/1x') 0;
|
||||
gap: var.get('measure/3x');
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
#issue-list {
|
||||
.flex-item {
|
||||
padding: var.get('measure/.75x') 0 var.get('measure/.75x') 0;
|
||||
|
||||
&:first-child {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.branch {
|
||||
background-color: color.get('elevation/1');
|
||||
}
|
||||
|
||||
.flex-item-icon {
|
||||
svg {
|
||||
&.green {
|
||||
color: color.get('palette/green/base') !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.list-header {
|
||||
margin-bottom: var.get('measure/1.5x');
|
||||
}
|
||||
}
|
||||
}
|
||||
7
src/themes/scss/theme/modules/issues/index.scss
Normal file
7
src/themes/scss/theme/modules/issues/index.scss
Normal file
@ -0,0 +1,7 @@
|
||||
@use './list';
|
||||
@use './issue';
|
||||
|
||||
@mixin issues {
|
||||
@include list.apply-styles();
|
||||
@include issue.apply-styles();
|
||||
}
|
||||
63
src/themes/scss/theme/modules/repo/_file-list.scss
Normal file
63
src/themes/scss/theme/modules/repo/_file-list.scss
Normal file
@ -0,0 +1,63 @@
|
||||
@use '@lucas-labs/lui-micro/var' as var;
|
||||
@use '@lucas-labs/lui-micro/color' as color;
|
||||
@use '../../components/button' as button;
|
||||
|
||||
@mixin apply-styles {
|
||||
.repo-button-row-left {
|
||||
.button {
|
||||
@include button.hollow;
|
||||
}
|
||||
}
|
||||
|
||||
.repo-home-filelist {
|
||||
> div {
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
row-gap: var.get('measure/1x');
|
||||
|
||||
// file list table
|
||||
#repo-files-table {
|
||||
// header
|
||||
.repo-file-last-commit {
|
||||
padding: var.get('measure/.75x') var.get('measure/1x') !important;
|
||||
|
||||
.commit-summary {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.latest-commit {
|
||||
gap: var.get('measure/.5x');
|
||||
|
||||
img {
|
||||
// make it a circle (avatar)
|
||||
border-radius: 50%;
|
||||
width: var.get('measure/1.25x');
|
||||
height: var.get('measure/1.25x');
|
||||
}
|
||||
}
|
||||
|
||||
.label {
|
||||
// boton con icono y avatar
|
||||
.detail.icon.button img {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// cells
|
||||
.repo-file-cell {
|
||||
padding: var.get('measure/.5x') var.get('measure/1x') !important;
|
||||
|
||||
&.name {
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
column-gap: var.get('measure/.5x');
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
167
src/themes/scss/theme/modules/repo/_home.scss
Normal file
167
src/themes/scss/theme/modules/repo/_home.scss
Normal file
@ -0,0 +1,167 @@
|
||||
@use '@lucas-labs/lui-micro/var' as var;
|
||||
@use '@lucas-labs/lui-micro/color' as color;
|
||||
|
||||
@mixin apply-styles {
|
||||
// description, labels, info
|
||||
.repo-home-sidebar-top {
|
||||
@media (max-width: 768px) {
|
||||
border-bottom: 1px solid color.get('elevation/6');
|
||||
margin-bottom: var.get('measure/1x');
|
||||
}
|
||||
|
||||
form {
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
|
||||
#repo-topics, #topic_edit, .label-list {
|
||||
row-gap: var.get('measure/.5x');
|
||||
margin-top: 0 !important;
|
||||
|
||||
.label:not(.basic) {
|
||||
font-size: var.get('font-size/sm') !important;
|
||||
background-color: rgba(#{color.get('palette/blue/base', 'rgb')}, 0.1);
|
||||
color: color.get('primary/base');
|
||||
border-radius: var.get('measure/2x');
|
||||
line-height: 22px !important;
|
||||
padding-top: 0 !important;
|
||||
padding-bottom: 0 !important;
|
||||
|
||||
&:hover {
|
||||
background-color: rgba(#{color.get('palette/blue/base', 'rgb')}, 0.3) !important;
|
||||
color: color.get('primary/base') !important;
|
||||
}
|
||||
}
|
||||
|
||||
.ui.selection.active.dropdown, .ui.selection.active.dropdown .menu {
|
||||
border-color: color.get('elevation/6')
|
||||
}
|
||||
}
|
||||
|
||||
.repo-description {
|
||||
margin-bottom: var.get('measure/1x');
|
||||
}
|
||||
|
||||
.flex-text-block {
|
||||
gap: var.get('measure/.25x') !important;
|
||||
font-size: var.get('font-size/md') !important;
|
||||
|
||||
svg {
|
||||
margin-right: var.get('measure/.25x') !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.repo-description {
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
|
||||
#repo-topics, #manage_topic, .flex-item-title {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.flex-item-body>div {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// releases + languages section
|
||||
.repo-home-sidebar-bottom {
|
||||
.flex-list .flex-item .flex-item-main {
|
||||
.flex-item {
|
||||
padding: 0 !important;
|
||||
|
||||
.flex-item-main {
|
||||
gap: 0 !important;
|
||||
|
||||
.flex-item-header {
|
||||
* {
|
||||
font-size: var.get('font-size/md') !important;
|
||||
}
|
||||
|
||||
.flex-item-title {
|
||||
gap: var.get('measure/.5x') !important;
|
||||
.green.label {
|
||||
border-radius: var.get('measure/2x');
|
||||
font-size: var.get('font-size/sm') !important;
|
||||
background-color: transparent !important;
|
||||
border: 1px solid color.get('palette/green/base') !important;
|
||||
color: color.get('palette/green/base') !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.flex-item-body {
|
||||
.time {
|
||||
font-size: var.get('font-size/sm') !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// languages
|
||||
.flex-item-body {
|
||||
gap: 0 !important;
|
||||
|
||||
.language-stats {
|
||||
background-color: red !important;
|
||||
margin: 0 !important;
|
||||
height: var.get('measure/.5x') !important;
|
||||
margin-bottom: var.get('measure/.5x') !important;
|
||||
}
|
||||
|
||||
.language-stats-details {
|
||||
gap: var.get('measure/1x') !important;
|
||||
.item {
|
||||
font-size: var.get('font-size/sm') !important;
|
||||
padding: 0;
|
||||
gap: var.get('measure/.25x') !important;
|
||||
|
||||
.color-icon {
|
||||
height: var.get('measure/.5x') !important;
|
||||
width: var.get('measure/.5x') !important;
|
||||
margin-right: var.get('measure/.25x') !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.repo-home-sidebar-bottom, .repo-home-sidebar-top {
|
||||
padding-left: var.get('measure/1.5x');
|
||||
|
||||
@media (max-width: 768px) {
|
||||
padding-left: 0 !important;
|
||||
}
|
||||
|
||||
.flex-item-title .item {
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
gap: var.get('measure/.5x');
|
||||
text-decoration: none;
|
||||
|
||||
.small.label {
|
||||
background-color: color.get('elevation/7');
|
||||
border: 1px solid color.get('elevation/7');
|
||||
border-radius: var.get('measure/2x');
|
||||
color: color.get('text');
|
||||
font-weight: var(--base-text-weight-medium, 500);
|
||||
min-width: 20px;
|
||||
padding: 2px;
|
||||
text-align: center;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
|
||||
>.flex-list>.flex-item {
|
||||
padding-top: var.get('measure/1x');
|
||||
padding-bottom: var.get('measure/1x');
|
||||
|
||||
>.flex-item-main {
|
||||
gap: var.get('measure/1x');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
171
src/themes/scss/theme/modules/repo/_secondary-navbar.scss
Normal file
171
src/themes/scss/theme/modules/repo/_secondary-navbar.scss
Normal file
@ -0,0 +1,171 @@
|
||||
@use '@lucas-labs/lui-micro/var' as var;
|
||||
@use '@lucas-labs/lui-micro/color' as color;
|
||||
@use '../../components/button' as button;
|
||||
|
||||
@mixin apply-styles {
|
||||
.secondary-nav {
|
||||
margin-bottom: var.get('measure/1.5x') !important;
|
||||
|
||||
.ui.container {
|
||||
margin: 0 0 0 0 !important;
|
||||
max-width: unset !important;
|
||||
width: 100% !important;
|
||||
padding: 0 var.get('measure/1x');
|
||||
}
|
||||
|
||||
// header
|
||||
.repo-header {
|
||||
margin: 0 0 var.get('measure/1x') 0;
|
||||
|
||||
// repo image
|
||||
img.avatar {
|
||||
width: var.get('measure/2x') !important;
|
||||
height: var.get('measure/2x') !important;
|
||||
}
|
||||
|
||||
// repo title (repo "owner / name" text)
|
||||
.flex-item-title {
|
||||
gap: var.get('measure/.25x') !important;
|
||||
font-size: var.get('font-size/md') !important;
|
||||
font-weight: normal !important;
|
||||
color: color.get('elevation/10') !important;
|
||||
|
||||
a {
|
||||
padding: var.get('measure/.375x') var.get('measure/.5x') !important;
|
||||
border-radius: var.get('measure/.25x');
|
||||
|
||||
&:hover {
|
||||
background-color: color.get('elevation/4') !important;
|
||||
color: color.get('text') !important;
|
||||
text-decoration: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
// repo name only
|
||||
a:last-child {
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
// "public/private" label
|
||||
.flex-item-trailing {
|
||||
.label {
|
||||
padding: var.get('measure/.25x') var.get('measure/.5x');
|
||||
font-size: var.get('font-size/sm');
|
||||
border-radius: var.get('measure/1x');
|
||||
background-color: transparent;
|
||||
color: color.get('elevation/10');
|
||||
}
|
||||
|
||||
// lock icon
|
||||
svg {
|
||||
color: color.get('elevation/10');
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
// repo title (repo "owner / name" text)
|
||||
.flex-item-title {
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
padding: 0 var.get('measure/.5x') !important;
|
||||
font-size: var.get('font-size/sm') !important;
|
||||
font-weight: 500 !important;
|
||||
|
||||
a {
|
||||
padding: 0 !important;
|
||||
|
||||
&:hover {
|
||||
background-color: transparent !important;
|
||||
color: color.get('primary/base') !important;
|
||||
text-decoration: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
a:first-child {
|
||||
float: left;
|
||||
margin-right: var.get('measure/.5x');
|
||||
color: color.get('elevation/10') !important;
|
||||
font-weight: 500 !important;
|
||||
|
||||
&:hover {
|
||||
color: color.get('primary/base') !important;
|
||||
}
|
||||
}
|
||||
|
||||
// repo name only
|
||||
a:last-child {
|
||||
font-size: var.get('font-size/md') !important;
|
||||
clear: left;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// header navbar menu
|
||||
overflow-menu.ui.secondary.pointing.menu {
|
||||
.overflow-menu-items {
|
||||
gap: var.get('measure/.25x') !important;
|
||||
}
|
||||
|
||||
// navbar menu items
|
||||
.item {
|
||||
padding: var.get('measure/.375x') var.get('measure/.5x') !important;
|
||||
margin-bottom: var.get('measure/.5x') !important;
|
||||
border-radius: var.get('measure/.25x');
|
||||
border: none !important;
|
||||
|
||||
// icon
|
||||
svg {
|
||||
color: var(--color-text-light-3) !important;
|
||||
margin-right: var.get('measure/.5x') !important;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: color.get('elevation/4') !important;
|
||||
color: var(--color-text-light-2) !important;
|
||||
}
|
||||
|
||||
// when the represents the current route
|
||||
&.active {
|
||||
border: none !important;
|
||||
&:after {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 2px;
|
||||
left: 0;
|
||||
top: calc(100% + #{var.get('measure/.375x')} - 1px);
|
||||
background-color: color.get('primary/base');
|
||||
transform: unset;
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
|
||||
// numeric badge/label (e.g. indicating the number of issues)
|
||||
.small.label {
|
||||
background-color: color.get('elevation/7');
|
||||
border: 1px solid color.get('elevation/7');
|
||||
border-radius: var.get('measure/2x');
|
||||
color: color.get('text');
|
||||
font-weight: var(--base-text-weight-medium, 500);
|
||||
min-width: calc(var.get('measure/1x') + 1px);
|
||||
padding: 2px;
|
||||
text-align: center;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// buttons at the right of the header (unwatch, star, fork, etc.)
|
||||
.repo-buttons {
|
||||
.button {
|
||||
font-size: var.get('font-size/sm') !important;
|
||||
@include button.hollow;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
9
src/themes/scss/theme/modules/repo/index.scss
Normal file
9
src/themes/scss/theme/modules/repo/index.scss
Normal file
@ -0,0 +1,9 @@
|
||||
@use './home';
|
||||
@use './secondary-navbar';
|
||||
@use './file-list';
|
||||
|
||||
@mixin repo {
|
||||
@include home.apply-styles();
|
||||
@include secondary-navbar.apply-styles();
|
||||
@include file-list.apply-styles();
|
||||
}
|
||||
Reference in New Issue
Block a user