/* This code should work with any preprocessor that supports nesting and the use of "&", like "Stylus" (Recommended) and "Less". */ :root { --base-border-radius: 6px; } html.theme-gitea, html.theme-arc-green { --fonts-override: var(--fonts-regular); } a[rel*="nofollow"]:not(.ui):hover, .link:not(.ui):hover, a[rel*="nofollow"]:not(.ui):focus, .link:not(.ui):focus { text-decoration: underline; text-underline-offset: 5px; } /*** Change Border Radius's ***/ .ui.buttons .ui.basic.button { border-radius: 0; } .ui.button, .ui.basic.button, .ui.menu, .input.action.fluid, .ui.label, .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="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.table, .tab-size-8 { border-radius: var(--base-border-radius); } .ui.menu > .item:first-child, .ui.buttons .button:first-child, .ui.buttons > .ui.basic.button:first-child { border-radius: var(--base-border-radius) 0 0 var(--base-border-radius); } .ui.compact.menu:not(.secondary) .item:last-child, .ui.buttons .button:last-child, .ui.action.input > .button:last-child, .ui.buttons > .ui.basic.button:last-child { border-radius: 0 var(--base-border-radius) var(--base-border-radius) 0; } .ui.top.attached.header { border-radius: var(--base-border-radius) var(--base-border-radius) 0 0; } .ui.avatar { border-radius: var(--base-border-radius) !important; } /*** Buttons ***/ .ui.compact.button { padding-top: 0.3em; padding-bottom: 0.3em; min-height: 0.8em; display: inline-flex; align-items: center; } .ui.compact.button svg { margin-bottom: -1px !important; } .ui.basic.button, .ui.basic.label { background: none; } /*** Inputs ***/ .input.action.fluid { border: 1px solid var(--color-secondary) !important; height: 40px; } .input.action.fluid input { border: 0; } .input.action.fluid button { margin: 2px !important; margin-left: 0 !important; padding-top: 0 !important; padding-bottom: 0 !important; box-sizing: border-box; border-radius: var(--base-border-radius) !important; } .input.action.fluid .icon { border: 0 !important; } .input.action.fluid:focus-within { outline: 1px solid var(--color-primary); outline-offset: -1px; } .ui.form + .ui.divider { display: none; } /*** Layouts ***/ .three.column { margin-left: 0; margin-right: 0; } .three.column .column { width: auto !important; align-items: center !important; display: flex !important; } .three.column .column form { width: 100%; } .three.column .column:first-child { padding-left: 0; } .three.column .column:last-child { padding-right: 0; } .three.column .center { flex-grow: 100; padding-left: 0 !important; padding-right: 0 !important; } .ui.two.column.stackable.grid > .column { width: auto !important; flex-grow: 1; } .ui.compact.tiny.menu { flex-grow: 1; } .ui.compact.tiny.menu a { flex-grow: 1; justify-content: center; } /* Better center content */ .page-content:not(.home) > .middle { padding: calc(4vw + 1rem) 4vw !important; width: 100% !important; } .page-content:not(.home) > .middle > .column { padding: 0 !important; } /* Tooltips */ .popup.tiny.inverted { background: var(--color-body); color: var(--color-text); box-shadow: var(--lm-large-shadow); border: 1px solid var(--color-secondary); pointer-events: none; z-index: 1000; } .popup.tiny.inverted::before { background: var(--color-body) !important; z-index: -99999 !important; border-color: var(--color-secondary) !important; } .ui.left.popup::before { border: 0; border-top: 1px solid; border-right: 1px solid; } .ui.right.popup::before { border: 0; border-left: 1px solid; border-bottom: 1px solid; } .ui.top.popup::before { border: 0; border-right: 1px solid; border-bottom: 1px solid; } .ui.bottom.popup::before { border: 0; border-top: 1px solid; border-left: 1px solid; } .settings > .ui.container { max-width: 1150px !important; } /* No Script Message */ .full.height > span[style="display: inline !important;"]:first-child { margin: auto; line-height: 40px; padding: 30px; text-align: center; /* Remove stuff that isn't needed when JS is disabled */ } .full.height > span[style="display: inline !important;"]:first-child::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 40px; background: var(--color-navbar); border-bottom: 1px solid var(--color-secondary); z-index: -1; } .full.height > span[style="display: inline !important;"]:first-child ~ .page-content #app, .full.height > span[style="display: inline !important;"]:first-child ~ .page-content #user-heatmap, .full.height > span[style="display: inline !important;"]:first-child ~ .page-content #user-heatmap + .divider { display: none !important; } /** Other Elements **/ #user-heatmap { overflow: auto hidden; justify-content: flex-start; max-width: 900px; margin: auto; } #user-heatmap .vch__wrapper { min-width: 500px; } /* Bold repo name, not author*/ .repo-title a:nth-last-child(2) { font-weight: 600 !important; } /* Better labels */ .label:not(.basic) { border-radius: 100px !important; padding: 4px 8px !important; font-weight: 700; align-items: center; justify-content: center; min-width: 24px !important; display: inline-flex; } .label:not(.basic).sha > .detail { /* Fix SHA Padding */ margin-left: 6px !important; } .label:not(.basic) svg { margin-right: 4px; } /*** Menu's ***/ .ui.tabular.menu, .ui.tight.menu { position: relative; flex-direction: row !important; flex-wrap: nowrap !important; overflow: auto hidden !important; scrollbar-width: thin; padding-bottom: 2px; scrollbar-color: var(--color-primary) var(--color-secondary); border-bottom: 1px solid var(--color-secondary) !important; } .ui.tabular.menu.ui.tight.menu > .item, .ui.tight.menu.ui.tight.menu > .item { width: auto !important; border-bottom-width: 0px !important; position: relative !important; } .ui.tabular.menu.ui.tight.menu > .item::before, .ui.tight.menu.ui.tight.menu > .item::before { content: "" !important; position: absolute !important; bottom: 0 !important; left: 20px !important; right: 20px !important; top: unset !important; width: unset !important; height: 2px !important; opacity: 0.7; border-radius: 4px 4px 0 0; background: none; display: flex !important; transition: left 2s; } .ui.tabular.menu.ui.tight.menu > .item.active::before, .ui.tight.menu.ui.tight.menu > .item.active::before { background-color: var(--color-primary) !important; left: 0 !important; right: 0 !important; } .ui.tabular.menu { border-bottom: 0 !important; position: relative; } .ui.tabular.menu::before { content: ""; position: absolute; bottom: 1px; left: 0; right: 0; z-index: -1; border-top: 1px solid var(--color-secondary); } .ui.tabular.menu:not(.borderless) > .item { width: auto !important; padding-left: 16px; padding-right: 16px; min-width: 70px; justify-content: center; position: relative; } .ui.tabular.menu:not(.borderless) > .item svg { margin-right: 10px !important; } .ui.tabular.menu:not(.borderless) > .item.active { border-radius: 10px 10px 0 0 !important; z-index: 1; } .ui.tabular.menu:not(.borderless) > .item.active::after { content: "" !important; position: absolute; width: 6px; height: 6px; bottom: 1px; right: -7px; border-bottom-left-radius: 100px; box-shadow: -1px 1px 0 0px var(--color-secondary), -3px 3px 0px 2px var(--color-body); } .ui.tabular.menu:not(.borderless) > .item.active::before { all: unset; content: "" !important; position: absolute; width: 6px; height: 6px; bottom: 1px; left: -7px; border-bottom-right-radius: 100px; box-shadow: 1px 1px 0 0px var(--color-secondary), 3px 3px 0px 2px var(--color-body); display: unset !important; } .ui.tabular.menu:not(.borderless) > .item.active:first-child::before { content: none !important; } .repository .filter.menu .menu { max-height: 80vh; width: max-content !important; } .repository .filter.menu .menu .info { width: 100% !important; padding: 0.8em !important; line-height: 1.2em; white-space: normal !important; } /*** Body ***/ html { scrollbar-width: auto !important; } .full.height { padding-bottom: 30px; } /*** Header ***/ .following.bar { --min-height: 60px; background: none !important; border-bottom: 1px solid var(--color-secondary) !important; background-color: var(--color-navbar) !important; position: relative; min-height: var(--min-height); align-items: center; z-index: 99999; } #navbar { padding: 0 calc(2px + 1%) !important; background: none !important; max-width: 100rem; transition: padding 1s; min-height: var(--min-height) !important; margin: auto; } #navbar > .item:not(.brand), #navbar > .right > .item { color: var(--color-text-dark) !important; font-size: 1rem !important; font-weight: 600; padding: 0 calc(0px + 1.1%); height: calc(var(--min-height) + 1px) !important; margin: 0 !important; border-radius: 0; border-top: 1px solid transparent; border-bottom: 1px solid transparent; margin-bottom: -1px !important; background: none !important; box-sizing: border-box; transition: border 0.5s, padding 0.7s; } #navbar > .item:not(.brand):hover, #navbar > .right > .item:hover, #navbar > .item:not(.brand).active, #navbar > .right > .item.active, #navbar > .item:not(.brand):focus, #navbar > .right > .item:focus { border-bottom: 1px solid var(--color-primary); transition: border 0.1s; outline: none; } #navbar .item.brand { padding: 0 !important; min-height: var(--min-height) !important; margin-right: calc(-30px + 2%) !important; } #navbar .item.brand a { width: 35px; height: 35px; margin-right: 20px; background-position: center; } #navbar .item.brand a img { width: 100%; height: 100%; } #navbar .right { position: sticky; right: 1%; background-color: var(--color-navbar); box-shadow: 100px 0px 0 var(--color-navbar); width: 100%; min-width: max-content; justify-content: flex-end; } #navbar .right > .item { padding: 0 10px; } #navbar .right > .item > .text { display: flex; align-items: center; } #navbar .right > .item > .text span:not(.fitted) { margin-left: 10px; } #navbar .right > .item > .text img ~ .fitted { margin-left: 4px; } /* Page content when width is larger than 850px */ @media only screen and (min-width: 850px) { .page-content.repository:not(.issues.repository.milestones):not(.new:not(.issue)) { display: grid; grid-row-gap: 10px; grid-template-columns: 100px calc(100% - 100px); padding: 0 20px; padding-top: 20px; width: 1367px; max-width: 100%; margin: auto; } .page-content.repository:not(.issues.repository.milestones):not(.new:not(.issue)) .header-wrapper { display: contents; } .page-content.repository:not(.issues.repository.milestones):not(.new:not(.issue)) .header-wrapper > .ui.container:first-child { grid-row: 1; grid-column: 1/span 2; width: 100%; padding-left: 100px; border: 0 !important; box-shadow: none !important; } .page-content.repository:not(.issues.repository.milestones):not(.new:not(.issue)) .header-wrapper > .ui.container:first-child .avatar, .page-content.repository:not(.issues.repository.milestones):not(.new:not(.issue)) .header-wrapper > .ui.container:first-child .repo-icon { width: 50px !important; height: 50px !important; object-fit: contain; margin: 0 10px; margin-left: -90px; margin-right: 39px !important; margin-bottom: -10px; display: flex; justify-content: center; align-items: center; border-radius: 8px !important; } .page-content.repository:not(.issues.repository.milestones):not(.new:not(.issue)) .header-wrapper > .ui.container:first-child .repo-title-wrap { display: flex; flex-direction: row !important; align-items: center; } .page-content.repository:not(.issues.repository.milestones):not(.new:not(.issue)) .header-wrapper > .ui.container:first-child .fork-flag { margin: 0 !important; margin-left: 6px !important; padding: 2px 8px; font-size: 12px; border-radius: var(--base-border-radius); border: 1px solid var(--color-secondary); } .page-content.repository:not(.issues.repository.milestones):not(.new:not(.issue)) .header-wrapper .tabs { order: -1; width: auto !important; width: 70px; margin: 0 !important; margin-top: 60px !important; grid-column: 1; grid-row: 2/span 5; height: min-content; position: sticky; bottom: 20px; margin-bottom: -60px !important; align-self: flex-end; align-content: flex-start; min-height: calc(100vh - 40px); } .page-content.repository:not(.issues.repository.milestones):not(.new:not(.issue)) .header-wrapper .tabs .tabular { flex-direction: column !important; padding-right: 30px; overflow: visible !important; padding-left: 0; border-bottom: 0 !important; } .page-content.repository:not(.issues.repository.milestones):not(.new:not(.issue)) .header-wrapper .tabs .tabular::before { content: unset !important; } .page-content.repository:not(.issues.repository.milestones):not(.new:not(.issue)) .header-wrapper .tabs .tabular .item { display: flex; flex-direction: column; text-align: center; padding-top: 12px; padding-bottom: 18px; position: relative; background: none; color: var(--color-text); opacity: 0.7; } .page-content.repository:not(.issues.repository.milestones):not(.new:not(.issue)) .header-wrapper .tabs .tabular .item svg { margin: 0; width: 22px; height: 22px; max-width: unset !important; margin-bottom: 10px; margin-right: 0 !important; overflow: visible; order: -2; } .page-content.repository:not(.issues.repository.milestones):not(.new:not(.issue)) .header-wrapper .tabs .tabular .item .label { margin: 0 !important; margin-top: -3px !important; margin-bottom: 6px !important; order: -1; position: relative; } .page-content.repository:not(.issues.repository.milestones):not(.new:not(.issue)) .header-wrapper .tabs .tabular .item.active { border: none; opacity: 1; } .page-content.repository:not(.issues.repository.milestones):not(.new:not(.issue)) .header-wrapper .tabs .tabular .item.active::before { content: unset !important; } .page-content.repository:not(.issues.repository.milestones):not(.new:not(.issue)) .header-wrapper .tabs .tabular .item.active::after { all: unset; content: ""; position: absolute; top: 2px; left: -5px; right: -5px; bottom: 5px; background: var(--color-primary); opacity: 0.1; border-radius: 12px !important; z-index: -1; } .page-content.repository:not(.issues.repository.milestones):not(.new:not(.issue)) .header-wrapper .tabs .tabular .item:hover { opacity: 0.9 !important; } .page-content.repository:not(.issues.repository.milestones):not(.new:not(.issue)) .header-wrapper .tabs .tabular .right.menu { display: contents; } .page-content.repository:not(.issues.repository.milestones):not(.new:not(.issue)) .header-wrapper .divider { display: none; } .page-content.repository:not(.issues.repository.milestones):not(.new:not(.issue)) > .ui.container { width: 100%; } } /* Default Page Content, no width restraint */ .page-content.repository:not(.milestones) { width: 1300px; height: min-content; max-width: 100%; margin: auto; margin-bottom: -80px; /* Move the repo stats to the side, only when page width larger than 1000px */ } .page-content.repository:not(.milestones) .header-wrapper { padding-top: 40px !important; border-bottom: 0 !important; background: none; } .page-content.repository:not(.milestones) .header-wrapper .repo-title { flex-wrap: wrap; line-height: 1.5em; justify-content: center; } .page-content.repository:not(.milestones) .header-wrapper .repo-buttons { display: flex; flex-wrap: wrap; justify-content: center; } .page-content.repository:not(.milestones) .header-wrapper .repo-buttons > * { margin-top: 4px; } .page-content.repository:not(.milestones) .header-wrapper .tabs.container { margin-bottom: -2px; margin-left: 0; margin-right: 0; width: 100%; border-bottom: 0 !important; } .page-content.repository:not(.milestones) .header-wrapper .tabs.container .tabular { padding-left: 2rem; padding-right: 2rem; border-bottom: 0 !important; } .page-content.repository:not(.milestones) > .ui.container { height: min-content; } .page-content.repository:not(.milestones) > .ui.container > div:not(.attached) { height: min-content; margin-top: 0 !important; margin-bottom: 0.7rem !important; } .page-content.repository:not(.milestones) > .ui.container > .column + .divider:not(.header) { border: 0; margin: -22px 0 !important; } .page-content.repository:not(.milestones) > .ui.container > .column:first-child > .column { padding-top: 0; } .page-content.repository:not(.milestones) > .ui.container #repo-desc { font-size: 1.14rem; line-height: 1.6rem; } .page-content.repository:not(.milestones) > .ui.container #repo-topics { margin: 0 -4px; margin-bottom: 0 !important; margin-top: -0.5rem !important; align-items: flex-start !important; } .page-content.repository:not(.milestones) > .ui.container #repo-topics > *:last-child { margin: 2px !important; height: 22px !important; margin-bottom: 0.7rem !important; } .page-content.repository:not(.milestones) > .ui.container .repo-topic { border-radius: 100px; padding: 4px 10px; color: var(--color-primary); font-size: 0.9rem; position: relative; } .page-content.repository:not(.milestones) > .ui.container .repo-topic:not(:hover) { background: none; } .page-content.repository:not(.milestones) > .ui.container .repo-topic::before { content: ""; position: absolute; inset: 0; border-radius: 100px; background: var(--color-primary); opacity: 0.07; z-index: -1; } .page-content.repository:not(.milestones) > .ui.container .form .ui.tabular.menu { margin-bottom: -2px; z-index: 1; } .page-content.repository:not(.milestones) > .ui.container #comment-form .markdown { padding-top: 15px; } .page-content.repository:not(.milestones) > .ui.container .mobile--no-negative-margins { margin: 10px -6px; flex-wrap: wrap; grid-row-gap: 5px; } .page-content.repository:not(.milestones) > .ui.container .mobile--no-negative-margins > .item:nth-last-child(+2) { flex-grow: 1; } .page-content.repository:not(.milestones) > .ui.container .mobile--no-negative-margins > .item:last-child { flex: 3 1 100px; margin-left: 4px; } .page-content.repository:not(.milestones) > .ui.container .mobile--no-negative-margins > .item:first-child .floating.filter.dropdown > .basic.small.compact.button .text { font-size: 0; display: flex; align-items: center; } .page-content.repository:not(.milestones) > .ui.container .mobile--no-negative-margins > .item:first-child .floating.filter.dropdown > .basic.small.compact.button .text strong { font-size: 1rem; margin-left: 8px; margin-right: 4px; text-transform: capitalize; font-weight: 500; } .page-content.repository:not(.milestones) > .ui.container .mobile--no-negative-margins .breadcrumb { margin: 0 10px; } .page-content.repository:not(.milestones) > .ui.container .mobile--no-negative-margins button, .page-content.repository:not(.milestones) > .ui.container .mobile--no-negative-margins .button { align-content: center; display: flex; align-items: center; height: 32px !important; padding-left: 16px !important; padding-right: 16px !important; box-sizing: border-box; } .page-content.repository:not(.milestones) > .ui.container .mobile--no-negative-margins button.icon, .page-content.repository:not(.milestones) > .ui.container .mobile--no-negative-margins .button.icon { padding-left: 8px !important; padding-right: 8px !important; } .page-content.repository:not(.milestones) > .ui.container .mobile--no-negative-margins #file-buttons { margin: 0 4px !important; } .page-content.repository:not(.milestones) > .ui.container .mobile--no-negative-margins #clone-panel { width: 0px !important; box-sizing: border-box; flex-grow: 1; border: 1px solid var(--color-secondary); padding: 2px; height: 32px; border-radius: var(--base-border-radius); } .page-content.repository:not(.milestones) > .ui.container .mobile--no-negative-margins #clone-panel input { width: 0px !important; min-width: unset; flex-grow: 1; border: 0; background: none; border-radius: var(--base-border-radius) !important; } .page-content.repository:not(.milestones) > .ui.container .mobile--no-negative-margins #clone-panel button { border-radius: var(--base-border-radius) !important; margin-right: 2px; height: 100% !important; background: none; border: 0; } .page-content.repository:not(.milestones) > .ui.container .mobile--no-negative-margins #clone-panel button:hover { background: var(--color-light); } .page-content.repository:not(.milestones) > .ui.container .mobile--no-negative-margins #clone-panel button:last-child { margin-right: 0; } .page-content.repository:not(.milestones) > .ui.container #repo-files-table { margin-top: 0; overflow: hidden; background: none !important; } .page-content.repository:not(.milestones) > .ui.container #repo-files-table thead { position: relative; } .page-content.repository:not(.milestones) > .ui.container #repo-files-table thead::after { content: ""; position: absolute; inset: 0; background: var(--color-primary); opacity: 0.05; z-index: -1; } .page-content.repository:not(.milestones) > .ui.container #repo-files-table thead tr { background: none !important; } .page-content.repository:not(.milestones) > .ui.container #repo-files-table thead th { padding: 12px 12px; background: none !important; } .page-content.repository:not(.milestones) > .ui.container #repo-files-table thead th a { color: var(--color-text); } .page-content.repository:not(.milestones) > .ui.container #repo-files-table thead th > .avatar { width: 20px; height: 20px; margin: 4px; margin-right: 8px !important; } .page-content.repository:not(.milestones) > .ui.container #repo-files-table thead .avatar { margin-right: 4px; } .page-content.repository:not(.milestones) > .ui.container #repo-files-table thead .avatar + a { display: inline-flex !important; transform: translateY(1px); } .page-content.repository:not(.milestones) > .ui.container #repo-files-table thead .commit-body { padding: 6px; padding-right: 0; } .page-content.repository:not(.milestones) > .ui.container #repo-files-table tr { position: relative; } .page-content.repository:not(.milestones) > .ui.container #repo-files-table td::before { content: ""; position: absolute !important; inset: 0; pointer-events: none !important; z-index: -100 !important; background: var(--color-primary); opacity: 0; } .page-content.repository:not(.milestones) > .ui.container #repo-files-table tr:hover td:nth-child(2)::before, .page-content.repository:not(.milestones) > .ui.container #repo-files-table tr:focus-within td:nth-child(2)::before { opacity: 0.1; } .page-content.repository:not(.milestones) > .ui.container #repo-files-table .truncate a { width: 100%; color: var(--color-text); } .page-content.repository:not(.milestones) > .ui.container #repo-files-table .truncate a:hover, .page-content.repository:not(.milestones) > .ui.container #repo-files-table .truncate a:focus { color: var(--color-primary); } .page-content.repository:not(.milestones) > .ui.container #repo-files-table .truncate svg { margin: 0 10px; margin-top: 2px; } .page-content.repository:not(.milestones) > .ui.container #repo-files-table .name { padding-left: 8px; } .page-content.repository:not(.milestones) > .ui.container #repo-files-table .message, .page-content.repository:not(.milestones) > .ui.container #repo-files-table .right { opacity: 0.8; } .page-content.repository:not(.milestones) > .ui.container .file-header { padding: 8px 16px !important; font-size: 1rem; } .page-content.repository:not(.milestones) > .ui.container .file-header .octicon-book { color: var(--color-text-light-2) !important; margin-right: 10px !important; } .page-content.repository:not(.milestones) > .ui.container .file-header strong { line-height: 35px; } .page-content.repository:not(.milestones) > .ui.container .issue.list { margin-top: -8px !important; } .page-content.repository:not(.milestones) > .ui.container .ui.grid > .eleven { margin-left: 1rem; } .page-content.repository:not(.milestones) > .ui.container .ui.grid > .four > .metas { position: sticky; min-height: calc(100vh - 40px); bottom: 20px; top: unset; align-self: flex-end; } @media only screen and (min-width: 1000px) { .page-content.repository:not(.milestones).file > .ui.container, .page-content.repository:not(.milestones).commits > .ui.container, .page-content.repository:not(.milestones).branches > .ui.container { margin: 0 !important; grid-column: 2; width: auto !important; max-width: 100% !important; display: grid; grid-template-columns: calc(100% - 100px) 100px; } .page-content.repository:not(.milestones).file > .ui.container > *, .page-content.repository:not(.milestones).commits > .ui.container > *, .page-content.repository:not(.milestones).branches > .ui.container > * { grid-column: 1; } .page-content.repository:not(.milestones).file > .ui.container .repository-summary, .page-content.repository:not(.milestones).commits > .ui.container .repository-summary, .page-content.repository:not(.milestones).branches > .ui.container .repository-summary { grid-column: 2; grid-row: 1/span 6; border: 0; margin-top: 12px !important; margin-left: 30px; height: min-content; position: sticky; bottom: 20px; align-self: flex-end; background: none !important; min-height: calc(100vh - 40px); margin-bottom: -60px !important; overflow: visible !important; display: flex; flex-direction: column; align-items: center; } .page-content.repository:not(.milestones).file > .ui.container .repository-summary .segment, .page-content.repository:not(.milestones).commits > .ui.container .repository-summary .segment, .page-content.repository:not(.milestones).branches > .ui.container .repository-summary .segment { background: none; } .page-content.repository:not(.milestones).file > .ui.container .repository-summary .language-stats-details, .page-content.repository:not(.milestones).commits > .ui.container .repository-summary .language-stats-details, .page-content.repository:not(.milestones).branches > .ui.container .repository-summary .language-stats-details { display: flex !important; padding: 0; border-top: 1px solid rgba(0,0,0,0.1); overflow: hidden; background: none !important; } .page-content.repository:not(.milestones).file > .ui.container .repository-summary .language-stats-details .item, .page-content.repository:not(.milestones).commits > .ui.container .repository-summary .language-stats-details .item, .page-content.repository:not(.milestones).branches > .ui.container .repository-summary .language-stats-details .item { flex-direction: column; } .page-content.repository:not(.milestones).file > .ui.container .repository-summary .language-stats-details .item > *, .page-content.repository:not(.milestones).commits > .ui.container .repository-summary .language-stats-details .item > *, .page-content.repository:not(.milestones).branches > .ui.container .repository-summary .language-stats-details .item > * { margin: 0 !important; } .page-content.repository:not(.milestones).file > .ui.container .repository-summary .language-stats-details .item i, .page-content.repository:not(.milestones).commits > .ui.container .repository-summary .language-stats-details .item i, .page-content.repository:not(.milestones).branches > .ui.container .repository-summary .language-stats-details .item i { margin-bottom: 8px !important; } .page-content.repository:not(.milestones).file > .ui.container .repository-summary .repository-menu, .page-content.repository:not(.milestones).commits > .ui.container .repository-summary .repository-menu, .page-content.repository:not(.milestones).branches > .ui.container .repository-summary .repository-menu { display: block !important; height: unset !important; } .page-content.repository:not(.milestones).file > .ui.container .repository-summary .language-stats-details, .page-content.repository:not(.milestones).commits > .ui.container .repository-summary .language-stats-details, .page-content.repository:not(.milestones).branches > .ui.container .repository-summary .language-stats-details { height: unset !important; padding: 0 !important; margin: 0 !important; order: 2; border: 0 !important; } .page-content.repository:not(.milestones).file > .ui.container .repository-summary .language-stats, .page-content.repository:not(.milestones).commits > .ui.container .repository-summary .language-stats, .page-content.repository:not(.milestones).branches > .ui.container .repository-summary .language-stats { border-radius: 100px !important; overflow: hidden !important; pointer-events: none; top: 0; } .page-content.repository:not(.milestones).file > .ui.container .repository-summary .horizontal.list:not(.two), .page-content.repository:not(.milestones).commits > .ui.container .repository-summary .horizontal.list:not(.two), .page-content.repository:not(.milestones).branches > .ui.container .repository-summary .horizontal.list:not(.two) { padding-top: 1rem; } .page-content.repository:not(.milestones).file > .ui.container .repository-summary .list, .page-content.repository:not(.milestones).commits > .ui.container .repository-summary .list, .page-content.repository:not(.milestones).branches > .ui.container .repository-summary .list { flex-direction: column; background: none !important; } .page-content.repository:not(.milestones).file > .ui.container .repository-summary .list .item, .page-content.repository:not(.milestones).commits > .ui.container .repository-summary .list .item, .page-content.repository:not(.milestones).branches > .ui.container .repository-summary .list .item { border-radius: 12px !important; padding: 12px 0 !important; padding-bottom: 18px !important; position: relative; margin-right: 0 !important; } .page-content.repository:not(.milestones).file > .ui.container .repository-summary .list .item a, .page-content.repository:not(.milestones).commits > .ui.container .repository-summary .list .item a, .page-content.repository:not(.milestones).branches > .ui.container .repository-summary .list .item a { padding: 0 !important; } .page-content.repository:not(.milestones).file > .ui.container .repository-summary .list .item .bold, .page-content.repository:not(.milestones).commits > .ui.container .repository-summary .list .item .bold, .page-content.repository:not(.milestones).branches > .ui.container .repository-summary .list .item .bold, .page-content.repository:not(.milestones).file > .ui.container .repository-summary .list .item b, .page-content.repository:not(.milestones).commits > .ui.container .repository-summary .list .item b, .page-content.repository:not(.milestones).branches > .ui.container .repository-summary .list .item b { font-weight: 500 !important; } .page-content.repository:not(.milestones).file > .ui.container .repository-summary .list .item.active, .page-content.repository:not(.milestones).commits > .ui.container .repository-summary .list .item.active, .page-content.repository:not(.milestones).branches > .ui.container .repository-summary .list .item.active { background: none !important; } .page-content.repository:not(.milestones).file > .ui.container .repository-summary .list .item.active::before, .page-content.repository:not(.milestones).commits > .ui.container .repository-summary .list .item.active::before, .page-content.repository:not(.milestones).branches > .ui.container .repository-summary .list .item.active::before { content: ""; position: absolute; top: 0; left: -5px; right: -5px; bottom: 5px; background: var(--color-primary); opacity: 0.1; z-index: -1; border-radius: 12px; } .page-content.repository:not(.milestones).file > .ui.container .repository-summary .list a, .page-content.repository:not(.milestones).commits > .ui.container .repository-summary .list a, .page-content.repository:not(.milestones).branches > .ui.container .repository-summary .list a, .page-content.repository:not(.milestones).file > .ui.container .repository-summary .list span, .page-content.repository:not(.milestones).commits > .ui.container .repository-summary .list span, .page-content.repository:not(.milestones).branches > .ui.container .repository-summary .list span { display: flex; flex-direction: column; padding: 0 10px; justify-content: center; } .page-content.repository:not(.milestones).file > .ui.container .repository-summary .list a > *, .page-content.repository:not(.milestones).commits > .ui.container .repository-summary .list a > *, .page-content.repository:not(.milestones).branches > .ui.container .repository-summary .list a > *, .page-content.repository:not(.milestones).file > .ui.container .repository-summary .list span > *, .page-content.repository:not(.milestones).commits > .ui.container .repository-summary .list span > *, .page-content.repository:not(.milestones).branches > .ui.container .repository-summary .list span > * { margin-bottom: 5px; } .page-content.repository:not(.milestones).file > .ui.container .repository-summary .list a svg, .page-content.repository:not(.milestones).commits > .ui.container .repository-summary .list a svg, .page-content.repository:not(.milestones).branches > .ui.container .repository-summary .list a svg, .page-content.repository:not(.milestones).file > .ui.container .repository-summary .list span svg, .page-content.repository:not(.milestones).commits > .ui.container .repository-summary .list span svg, .page-content.repository:not(.milestones).branches > .ui.container .repository-summary .list span svg { width: 100%; height: 20px; margin-bottom: 10px !important; } } /* ISSUES LIST / MILESTONES LIST, mostly issue's list though. */ .issue.list, .milestone.list { border: 1px solid var(--color-secondary); border-radius: var(--base-border-radius); background: var(--color-menu); padding: 0 !important; margin-top: 1rem; } .issue.list.milestone.list li, .milestone.list.milestone.list li { border-bottom-style: solid !important; } .issue.list.milestone.list li:last-child, .milestone.list.milestone.list li:last-child { border-bottom: 0; } .issue.list li, .milestone.list li { padding: 10px !important; padding-bottom: 6px !important; position: relative; } .issue.list li:hover, .milestone.list li:hover { box-shadow: inset 0 0 600px -300px var(--color-primary); } .issue.list li .issue-item-left, .milestone.list li .issue-item-left { padding-top: 2px; } .issue.list li .issue-item-left svg, .milestone.list li .issue-item-left svg { margin-right: 8px; } .issue.list li .issue-item-top-row a, .milestone.list li .issue-item-top-row a { vertical-align: unset !important; } .issue.list li .issue-item-bottom-row, .milestone.list li .issue-item-bottom-row { margin-top: -2px !important; } .issue.list li .issue-item-bottom-row svg, .milestone.list li .issue-item-bottom-row svg { margin-top: 3px; } .issue.list li .content, .milestone.list li .content { padding-bottom: 2px; padding-top: 2px !important; } .issue.list .label, .milestone.list .label { margin-top: -1px; position: relative; } /* Repo page releases list */ #release-list { padding-left: 0; } #release-list .four.wide.column { position: sticky !important; top: 0px; height: min-content; width: 150px !important; } /*** USER PROFILES & EXPLORE PAGES ***/ .explore, .user:not(.list), .profile { display: flex; flex-wrap: wrap; justify-content: center; /* Responsive explore page */ } .explore.explore > .ui.container, .user:not(.list).explore > .ui.container, .profile.explore > .ui.container { max-width: calc(100vw - 40px); width: 3000px !important; padding: 0 calc(10vw - 80px); } .explore.organization > .ui.container:first-child, .user:not(.list).organization > .ui.container:first-child, .profile.organization > .ui.container:first-child { padding-top: 30px; padding-bottom: 30px; } .explore.organization > .ui.container:first-child #org-info, .user:not(.list).organization > .ui.container:first-child #org-info, .profile.organization > .ui.container:first-child #org-info { display: flex; flex-direction: column; margin: 0 10px; justify-content: center; } .explore.organization > .ui.container:first-child #org-info > p, .user:not(.list).organization > .ui.container:first-child #org-info > p, .profile.organization > .ui.container:first-child #org-info > p { margin: 0 !important; margin-bottom: 0.2rem !important; } .explore.organization > .ui.container:first-child #org-info .item, .user:not(.list).organization > .ui.container:first-child #org-info .item, .profile.organization > .ui.container:first-child #org-info .item { display: flex; align-items: center; } .explore.organization > .ui.container:first-child #org-info .item a, .user:not(.list).organization > .ui.container:first-child #org-info .item a, .profile.organization > .ui.container:first-child #org-info .item a { margin-left: 4px; } .explore.organization .ui.eleven.wide.column::before, .user:not(.list).organization .ui.eleven.wide.column::before, .profile.organization .ui.eleven.wide.column::before { content: unset !important; } .explore > .ui.container, .user:not(.list) > .ui.container, .profile > .ui.container { max-width: 1350px; width: 100% !important; padding: 0 20px; } .explore > .ui.container[class="ui container"] .five.wide.column, .user:not(.list) > .ui.container[class="ui container"] .five.wide.column, .profile > .ui.container[class="ui container"] .five.wide.column { width: 320px !important; flex: 1 0 320px !important; position: sticky; bottom: 0; align-self: flex-end; min-height: 100vh; } .explore > .ui.container[class="ui container"] .five.wide.column .card, .user:not(.list) > .ui.container[class="ui container"] .five.wide.column .card, .profile > .ui.container[class="ui container"] .five.wide.column .card { width: 100%; border: 0; background: none !important; } .explore > .ui.container[class="ui container"] .five.wide.column .card #profile-avatar, .user:not(.list) > .ui.container[class="ui container"] .five.wide.column .card #profile-avatar, .profile > .ui.container[class="ui container"] .five.wide.column .card #profile-avatar { padding-left: 0.7rem; padding-right: 2rem !important; padding-top: 0.5rem; } .explore > .ui.container[class="ui container"] .five.wide.column .card #profile-avatar .avatar, .user:not(.list) > .ui.container[class="ui container"] .five.wide.column .card #profile-avatar .avatar, .profile > .ui.container[class="ui container"] .five.wide.column .card #profile-avatar .avatar { border-radius: calc(var(--base-border-radius) * 2) !important; box-shadow: 0 4px 12px rgba(0,0,0,0.1); border: 1px solid var(--color-secondary); background: var(--color-body); height: 100% !important; max-height: 80vh; } .explore > .ui.container[class="ui container"] .five.wide.column .card .profile-avatar-name, .user:not(.list) > .ui.container[class="ui container"] .five.wide.column .card .profile-avatar-name, .profile > .ui.container[class="ui container"] .five.wide.column .card .profile-avatar-name { font-size: 2rem; display: contents; } .explore > .ui.container[class="ui container"] .five.wide.column .card .profile-avatar-name span, .user:not(.list) > .ui.container[class="ui container"] .five.wide.column .card .profile-avatar-name span, .profile > .ui.container[class="ui container"] .five.wide.column .card .profile-avatar-name span { text-align: left; font-weight: 600; padding-left: 0.7rem; margin: 1.5rem 0; } .explore > .ui.container[class="ui container"] .five.wide.column .card .profile-avatar-name span.header, .user:not(.list) > .ui.container[class="ui container"] .five.wide.column .card .profile-avatar-name span.header, .profile > .ui.container[class="ui container"] .five.wide.column .card .profile-avatar-name span.header { font-weight: 500; letter-spacing: 0.1em; height: 44px; line-height: 50px; margin-bottom: -1.2em; margin-top: 0; background: var(--color-body); position: sticky; top: 0px; z-index: 3; box-shadow: 0 -5px 5px var(--color-body); } .explore > .ui.container[class="ui container"] .five.wide.column .card .profile-avatar-name span.username, .user:not(.list) > .ui.container[class="ui container"] .five.wide.column .card .profile-avatar-name span.username, .profile > .ui.container[class="ui container"] .five.wide.column .card .profile-avatar-name span.username { z-index: 2; } .explore > .ui.container[class="ui container"] .five.wide.column .card .extra, .user:not(.list) > .ui.container[class="ui container"] .five.wide.column .card .extra, .profile > .ui.container[class="ui container"] .five.wide.column .card .extra { border: 0 !important; } .explore > .ui.container[class="ui container"] .five.wide.column .card .extra li, .user:not(.list) > .ui.container[class="ui container"] .five.wide.column .card .extra li, .profile > .ui.container[class="ui container"] .five.wide.column .card .extra li { border: 0 !important; padding: 0.3rem 0.7rem; display: flex; align-items: center; } .explore > .ui.container[class="ui container"] .five.wide.column .card .extra li svg, .user:not(.list) > .ui.container[class="ui container"] .five.wide.column .card .extra li svg, .profile > .ui.container[class="ui container"] .five.wide.column .card .extra li svg { margin-right: 8px; } .explore > .ui.container[class="ui container"] .five.wide.column .card .extra li .user-orgs, .user:not(.list) > .ui.container[class="ui container"] .five.wide.column .card .extra li .user-orgs, .profile > .ui.container[class="ui container"] .five.wide.column .card .extra li .user-orgs { justify-content: center; margin-top: 1rem !important; } .explore > .ui.container[class="ui container"] .five.wide.column .card .extra li .user-orgs li, .user:not(.list) > .ui.container[class="ui container"] .five.wide.column .card .extra li .user-orgs li, .profile > .ui.container[class="ui container"] .five.wide.column .card .extra li .user-orgs li { flex-grow: 1 !important; } .explore > .ui.container[class="ui container"] .five.wide.column .card .extra li .user-orgs li a, .user:not(.list) > .ui.container[class="ui container"] .five.wide.column .card .extra li .user-orgs li a, .profile > .ui.container[class="ui container"] .five.wide.column .card .extra li .user-orgs li a { width: 100%; } .explore > .ui.container[class="ui container"] .five.wide.column .card .extra li .user-orgs li a img, .user:not(.list) > .ui.container[class="ui container"] .five.wide.column .card .extra li .user-orgs li a img, .profile > .ui.container[class="ui container"] .five.wide.column .card .extra li .user-orgs li a img { width: 35px; height: 35px; } .explore > .ui.container[class="ui container"] .five.wide.column .card .extra li .render-content p, .user:not(.list) > .ui.container[class="ui container"] .five.wide.column .card .extra li .render-content p, .profile > .ui.container[class="ui container"] .five.wide.column .card .extra li .render-content p { padding: 0.6rem 0; padding-bottom: 0.7rem !important; word-break: normal !important; } .explore > .ui.container[class="ui container"] .five.wide.column .card .extra .follow form, .user:not(.list) > .ui.container[class="ui container"] .five.wide.column .card .extra .follow form, .profile > .ui.container[class="ui container"] .five.wide.column .card .extra .follow form { margin-top: 1rem; width: 100%; } .explore > .ui.container .eleven.wide.column, .user:not(.list) > .ui.container .eleven.wide.column, .profile > .ui.container .eleven.wide.column { flex-grow: 100; width: 500px !important; max-width: 100%; } .explore > .ui.container .eleven.wide.column .ui.secondary.stackable.pointing.tight.menu, .user:not(.list) > .ui.container .eleven.wide.column .ui.secondary.stackable.pointing.tight.menu, .profile > .ui.container .eleven.wide.column .ui.secondary.stackable.pointing.tight.menu { margin: 0 -2px; margin-bottom: 1.5rem; position: sticky; top: 0px !important; margin-top: -45px; height: 45px; z-index: 9999; background-color: var(--color-body); } .explore > .ui.container .eleven.wide.column::before, .user:not(.list) > .ui.container .eleven.wide.column::before, .profile > .ui.container .eleven.wide.column::before { content: ""; position: sticky; margin: 0 !important; margin-left: -100vw !important; margin-top: 45px !important; width: 200vw; display: block; border-bottom: 1px solid var(--color-secondary); top: 44px; z-index: -1; } .explore > .ui.container .item .meta, .user:not(.list) > .ui.container .item .meta, .profile > .ui.container .item .meta { display: flex; align-items: center; } .explore > .ui.container .item .meta svg, .user:not(.list) > .ui.container .item .meta svg, .profile > .ui.container .item .meta svg { margin-right: 4px; } .explore > .ui.container .item .meta a, .user:not(.list) > .ui.container .item .meta a, .profile > .ui.container .item .meta a { max-width: calc(100% - 20px); white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } /* DASHBOARD / USER FEEDS */ .ui.container > .news, .feeds > .news { border: 1px solid var(--color-secondary) !important; background: var(--color-box-body); margin-bottom: 1rem; border-radius: var(--base-border-radius); padding: 10px 12px !important; position: relative; } .ui.container > .news .ui.left img, .feeds > .news .ui.left img { margin: 0 !important; margin-top: 2px !important; margin-right: 15px !important; border-radius: var(--base-border-radius); } .ui.container > .news .ui.grid, .feeds > .news .ui.grid { margin: 0 !important; padding: 0 !important; } .ui.container > .news .ui.grid > .column, .feeds > .news .ui.grid > .column { padding: 0 !important; width: 100% !important; } .ui.container > .news .ui.grid > .column > div, .feeds > .news .ui.grid > .column > div { display: flex; flex-wrap: wrap; min-height: 60px; } .ui.container > .news .ui.grid > .column > div > *:first-child, .feeds > .news .ui.grid > .column > div > *:first-child { min-width: 100%; } .ui.container > .news .ui.grid > .column > div > *:last-child, .feeds > .news .ui.grid > .column > div > *:last-child { margin-left: auto; margin-top: auto; } .ui.container > .news .ui.grid .content, .feeds > .news .ui.grid .content { max-width: 100%; } .ui.container > .news .ui.grid > .column > div > p:first-child, .feeds > .news .ui.grid > .column > div > p:first-child { margin-bottom: 0.4rem; font-weight: 600; } .ui.container > .news .ui.grid > .right.column, .feeds > .news .ui.grid > .right.column { position: absolute; top: 45px; left: 0; width: 52px !important; text-align: center; } .ui.container > .news .ui.grid > .right.column svg, .feeds > .news .ui.grid > .right.column svg { width: 28px; height: 28px; padding: 4px; } .ui.container > .news .ui.grid .title, .feeds > .news .ui.grid .title, .ui.container > .news .ui.grid p, .feeds > .news .ui.grid p, .ui.container > .news .ui.grid ul, .feeds > .news .ui.grid ul { margin-bottom: 0; } .ui.container > .news .ui.grid ul, .feeds > .news .ui.grid ul { border-left: 4px solid var(--color-secondary); } .ui.container > .news .divider, .feeds > .news .divider { display: none; } /* REPOSITORY LIST */ .ui.repository.list { margin-top: 16px !important; display: grid; grid-template-columns: repeat(auto-fit, minmax(400px, 1fr)); grid-gap: 16px; } .ui.repository.list .item { width: 400px; width: 100%; min-height: unset !important; padding: 14px 16px !important; border: 1px solid var(--color-secondary); background: var(--color-box-body); border-radius: 8px; flex-grow: 1; display: grid !important; position: relative; grid-template-columns: max-content 1fr; align-content: flex-start; } .ui.repository.list .item:hover, .ui.repository.list .item:focus-within { box-shadow: var(--lm-shadow); } .ui.repository.list .item .header { display: contents !important; } .ui.repository.list .item .header .repo-title { display: contents; position: relative; font-size: 1.2rem; line-height: 1.4em; } .ui.repository.list .item .header .repo-title a { white-space: normal !important; word-break: normal !important; } .ui.repository.list .item .header .repo-title > * { grid-column: 2/span 4; } .ui.repository.list .item .header .repo-title .labels { grid-column: 3; grid-row: 2; margin-left: 0 !important; white-space: nowrap; } .ui.repository.list .item .header .repo-title a::before { content: ""; position: absolute; top: 0; left: 0; height: 80px; width: 100%; } .ui.repository.list .item .header .avatar { height: 50px !important; width: 50px !important; margin-right: 12px !important; margin-left: -2px; grid-column: 1; grid-row: 1/span 2; border-radius: 12px; } .ui.repository.list .item .header .metas { grid-column: 2; grid-row: 2; width: 100%; } .ui.repository.list .item .description { display: contents; } .ui.repository.list .item .description > p:first-child { padding-top: 4px; margin-bottom: 0px; } .ui.repository.list .item .description > * { grid-column: 1/span 4; } .ui.repository.list .item .description > *:nth-last-child(2) { margin-bottom: 0 !important; } .ui.repository.list .item .description .time { grid-row: 2; grid-column: 4; padding-top: 7px; margin-left: 10px; text-align: right; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; z-index: 3; direction: rtl; } .ui.repository.list .item .description .tags { display: flex; overflow-x: auto; scrollbar-width: none; margin-top: 8px; } .ui.repository.list .item .description .tags a > div { width: max-content !important; } .ui.repository.list .item .description .tags::after { content: ""; min-width: 100px; margin-left: 100px; height: 100%; position: sticky; right: 0px; background: linear-gradient(to right, transparent, var(--color-box-body)); pointer-events: none; } /*** DASHBOARD ***/ .dashboard { display: flex; flex-wrap: wrap; margin: auto; max-width: 100%; padding: 30px 10px; padding: 30px 0; width: 1300px; margin-bottom: -45px; /* Move Navbar to the side */ /* Main Content */ } .dashboard .dashboard-navbar { width: auto; position: sticky; bottom: 10px; align-self: flex-end; height: min-content; z-index: 2; flex: 1 1 80px; max-width: calc(100% - 60px); margin: 0 auto; } .dashboard .dashboard-navbar > .menu { padding-top: 0 !important; padding-right: 0 !important; } .dashboard .dashboard-navbar > .ui { display: flex; flex-wrap: wrap; flex-direction: row !important; padding-top: 20px; } .dashboard .dashboard-navbar > .ui .right.right { margin-left: 0 !important; display: flex; flex-wrap: wrap; flex-direction: row !important; flex-grow: 1; } .dashboard .dashboard-navbar > .ui > .item, .dashboard .dashboard-navbar > .ui > .right > .item { flex-direction: column; margin: 0 20px !important; text-align: center; flex-grow: 1; display: flex !important; align-content: center; align-items: center; padding-bottom: 20px; max-width: 100%; width: 80px !important; text-indent: -0.35em !important; } .dashboard .dashboard-navbar > .ui > .item > .dropdown, .dashboard .dashboard-navbar > .ui > .right > .item > .dropdown, .dashboard .dashboard-navbar > .ui > .item .button, .dashboard .dashboard-navbar > .ui > .right > .item .button { text-indent: 0px !important; } .dashboard .dashboard-navbar > .ui > .item span, .dashboard .dashboard-navbar > .ui > .right > .item span { text-align: center; } .dashboard .dashboard-navbar > .ui > .item svg:not(.octicon-plus), .dashboard .dashboard-navbar > .ui > .right > .item svg:not(.octicon-plus) { width: 100%; height: 22px; margin: 0 !important; margin-bottom: 10px !important; } .dashboard .dashboard-navbar > .ui > .item .dropdown > span, .dashboard .dashboard-navbar > .ui > .right > .item .dropdown > span { flex-direction: column; } .dashboard .dashboard-navbar > .ui > .item .dropdown > span img, .dashboard .dashboard-navbar > .ui > .right > .item .dropdown > span img { margin: 0 auto; width: 40px; height: 40px !important; max-height: unset; margin-bottom: 10px; } .dashboard .dashboard-navbar > .ui > .item .dropdown > span .icon, .dashboard .dashboard-navbar > .ui > .right > .item .dropdown > span .icon { margin-bottom: 0 !important; } .dashboard .dashboard-navbar > .ui > .item .dropdown > span .avatar, .dashboard .dashboard-navbar > .ui > .right > .item .dropdown > span .avatar { border-radius: var(--base-border-radius); } .dashboard .dashboard-navbar > .ui > .item .dropdown > span span, .dashboard .dashboard-navbar > .ui > .right > .item .dropdown > span span { margin-bottom: -4px; } .dashboard > .ui.container { margin: 0 auto !important; display: flex; flex-wrap: wrap-reverse; flex: 9999 1 650px; --container-padding-x: calc(2.5% + 0px); /* Right Sidebar */ } .dashboard > .ui.container > .ui.stackable.grid { width: 100%; justify-content: center; /* Change to row wrapping for better responsiveness, aswell as adding a border to better differenciate buttons */ } .dashboard > .ui.container > .ui.stackable.grid > .ten.column { flex-grow: 1; z-index: 1; padding: 15px var(--container-padding-x) !important; margin: 0 auto !important; } .dashboard > .ui.container > .ui.stackable.grid > .column { max-width: calc(100vw - 40px); margin: 0 auto; flex-grow: 1; } .dashboard > .ui.container > .ui.stackable.grid > .column .ui.secondary.menu, .dashboard > .ui.container > .ui.stackable.grid > .column .ui.stackable.grid { margin-left: 0 !important; margin-right: 0 !important; } .dashboard > .ui.container > .ui.stackable.grid .four.wide.column { min-width: 250px; } .dashboard > .ui.container > .ui.stackable.grid .four.wide.column > .menu { display: flex; flex-direction: row; flex-wrap: wrap; margin: 0 -6px !important; background: none !important; } .dashboard > .ui.container > .ui.stackable.grid .four.wide.column > .menu a { display: flex; flex: 1 0 max-content; min-width: 200px; max-width: calc(100% - 12px); border: 1px solid var(--color-secondary); margin: 3px 6px; } .dashboard > .ui.container > .ui.stackable.grid .four.wide.column > .menu a .right { margin-left: auto; } .dashboard > .ui.container > .ui.stackable.grid .four.wide.column > .menu a span { width: 100%; } .dashboard > .ui.container > .ui.stackable.grid .four.wide.column > .menu a .label { margin-left: 4px; } .dashboard > .ui.container > .ui.stackable.grid .four.wide.column > .menu a:hover { background-color: var(--color-light); } .dashboard > .ui.container > .ui.stackable.grid .four.wide.column > .menu .ui.divider { /* Do what a divider is suppose to do, separate into two rows. */ width: 100%; margin: 12px 6px; } .dashboard > .ui.container #app { height: min-content; position: sticky; bottom: 0; align-self: flex-end; margin: 0 auto !important; margin-top: 0 !important; padding: 0 var(--container-padding-x) !important; padding-top: 10px !important; padding-bottom: 0 !important; z-index: 0; max-width: 100% !important; } .dashboard > .ui.container #app > div { height: 100%; display: flex; flex-direction: column; min-height: calc(100vh - 30px); } .dashboard > .ui.container #app::before { content: ""; position: absolute; bottom: 0; border-left: 1px solid var(--color-secondary); border-right: 1px solid var(--color-secondary); width: 200vw; height: 200vh; right: calc(100% - 15px); right: 100%; z-index: -100; background: var(--color-light); } .dashboard > .ui.container #app codeberg-announcement-widget { background: none !important; } .dashboard > .ui.container #app codeberg-announcement-widget > div { margin-top: 0 !important; margin-right: 0 !important; margin-bottom: 1rem !important; } .dashboard > .ui.container #app codeberg-announcement-widget > div .close span { font-size: 1.7em; font-weight: 200; margin-right: 2px; } .dashboard > .ui.container #app codeberg-announcement-widget > div h4 { margin-right: 1.7em; font-weight: 600; } .dashboard > .ui.container #app .tabable { background: none; margin-right: 0 !important; box-sizing: border-box; width: unset; margin-bottom: 0; } .dashboard > .ui.container #app .dashboard-repos, .dashboard > .ui.container #app .dashboard-orgs { margin: 0 !important; overflow-y: auto; overflow-x: hidden; scrollbar-width: thin; margin-bottom: 0; min-height: 200px; height: 0; flex-grow: 1; padding-top: 15px; } .dashboard > .ui.container #app .dashboard-repos .repos-search .input, .dashboard > .ui.container #app .dashboard-orgs .repos-search .input { margin-bottom: 8px; } .dashboard > .ui.container #app .dashboard-repos > .ui:last-child, .dashboard > .ui.container #app .dashboard-orgs > .ui:last-child { margin-bottom: 78px; } .dashboard > .ui.container #app .dashboard-repos > *, .dashboard > .ui.container #app .dashboard-orgs > * { border: 0; background: none; } .dashboard > .ui.container #app .dashboard-repos .header, .dashboard > .ui.container #app .dashboard-orgs .header { padding-top: 5px; font-weight: 600; } .dashboard > .ui.container #app .dashboard-repos .header a, .dashboard > .ui.container #app .dashboard-orgs .header a { display: flex; align-items: center; } .dashboard > .ui.container #app .dashboard-repos .header a svg, .dashboard > .ui.container #app .dashboard-orgs .header a svg { width: 18px; height: 18px; } .dashboard > .ui.container #app .dashboard-repos .header, .dashboard > .ui.container #app .dashboard-orgs .header, .dashboard > .ui.container #app .dashboard-repos .repos-search, .dashboard > .ui.container #app .dashboard-orgs .repos-search { padding-left: 5px; padding-right: 5px; } .dashboard > .ui.container #app .dashboard-repos .repos-search, .dashboard > .ui.container #app .dashboard-orgs .repos-search { padding-top: 0; } .dashboard > .ui.container #app .dashboard-repos .repos-search input, .dashboard > .ui.container #app .dashboard-orgs .repos-search input, .dashboard > .ui.container #app .dashboard-repos .repos-search .button, .dashboard > .ui.container #app .dashboard-orgs .repos-search .button { background: none !important; } .dashboard > .ui.container #app .dashboard-repos .table, .dashboard > .ui.container #app .dashboard-orgs .table { margin-top: 10px; } .dashboard > .ui.container #app .dashboard-repos li, .dashboard > .ui.container #app .dashboard-orgs li { background: none; font-weight: 700; border: 0; } .dashboard > .ui.container #app .dashboard-repos li a, .dashboard > .ui.container #app .dashboard-orgs li a { padding: 5px 5px; } .dashboard > .ui.container #app .dashboard-repos li a .item-name, .dashboard > .ui.container #app .dashboard-orgs li a .item-name { display: flex; align-items: center; } .dashboard > .ui.container #app .dashboard-repos li a .item-name svg, .dashboard > .ui.container #app .dashboard-orgs li a .item-name svg { margin-right: 8px !important; } .dashboard > .ui.container #app .dashboard-repos li a strong, .dashboard > .ui.container #app .dashboard-orgs li a strong { font-weight: 700; } footer { border: 0; padding: 20px; box-sizing: border-box; width: auto !important; border-top: 1px solid var(--color-secondary); background: var(--color-body); z-index: 2; } footer .container { max-width: 1390px !important; padding: 0 40px; } @-moz-keyframes slideInY { from { opacity: 0; transform: scale(0.97); } to { opacity: 1; transform: scale(1); } } @-webkit-keyframes slideInY { from { opacity: 0; transform: scale(0.97); } to { opacity: 1; transform: scale(1); } } @-o-keyframes slideInY { from { opacity: 0; transform: scale(0.97); } to { opacity: 1; transform: scale(1); } } @keyframes slideInY { from { opacity: 0; transform: scale(0.97); } to { opacity: 1; transform: scale(1); } } @-moz-keyframes slideOutY { from { opacity: 1; transform: scale(1); } to { opacity: 0; transform: scale(0.97); } } @-webkit-keyframes slideOutY { from { opacity: 1; transform: scale(1); } to { opacity: 0; transform: scale(0.97); } } @-o-keyframes slideOutY { from { opacity: 1; transform: scale(1); } to { opacity: 0; transform: scale(0.97); } } @keyframes slideOutY { from { opacity: 1; transform: scale(1); } to { opacity: 0; transform: scale(0.97); } }