Prettified Code!

This commit is contained in:
gingervitis 2021-02-15 06:24:09 +00:00 committed by GitHub Action
parent 8d5411a0d6
commit 1b116d2252
5 changed files with 41 additions and 68 deletions

View File

@ -1,6 +1,5 @@
// GENERAL ANT OVERRIDES
// RESET BG, TEXT COLORS
.ant-layout,
.ant-layout-header,
@ -23,14 +22,14 @@ td.ant-table-column-sort,
.ant-menu-submenu > .ant-menu,
.ant-menu:not(.ant-menu-horizontal) .ant-menu-item-selected {
background-color: transparent;
color: var(--default-text-color)
color: var(--default-text-color);
}
h1.ant-typography,
h2.ant-typography,
h3.ant-typography,
h4.ant-typography,
h5.ant-typography,
h1.ant-typography,
h2.ant-typography,
h3.ant-typography,
h4.ant-typography,
h5.ant-typography,
.ant-typography,
.ant-typography h1,
.ant-typography h2,
@ -39,7 +38,7 @@ h5.ant-typography,
.ant-typography h5 {
color: var(--white);
font-weight: 400;
margin: .5em 0;
margin: 0.5em 0;
}
.ant-typography.ant-typography-secondary {
color: var(--white);
@ -71,15 +70,11 @@ h3.ant-typography {
font-size: 1.25em;
}
.ant-progress-text,
.ant-progress-circle .ant-progress-text {
color: var(--default-text-color);
}
// ANT MENU
// menu base
.ant-menu-item {
@ -87,7 +82,7 @@ h3.ant-typography {
.anticon {
transition-duration: var(--ant-transition-duration);
color: var(--nav-text);
color: var(--nav-text);
}
a {
@ -106,7 +101,7 @@ h3.ant-typography {
}
}
}
.ant-menu-item:active,
.ant-menu-item:active,
.ant-menu-submenu-title:active {
background-color: var(--black-50);
}
@ -130,14 +125,14 @@ h3.ant-typography {
}
// submenu items
.ant-menu-submenu {
&> .ant-menu {
& > .ant-menu {
border-left: 1px solid var(--white-50);
background-color: var(--black-35);
}
.ant-menu-submenu-title {
transition-duration: var(--ant-transition-duration);
color: var(--nav-text);
.anticon {
color: var(--nav-text);
}
@ -165,7 +160,6 @@ h3.ant-typography {
}
}
// ANT RESULT
.ant-result-title {
color: var(--default-text-color);
@ -174,7 +168,6 @@ h3.ant-typography {
color: var(--white-75);
}
// ANT CARD
.ant-card {
border-radius: var(--container-border-radius);
@ -196,7 +189,6 @@ h3.ant-typography {
border-color: var(--white-25);
}
// ANT INPUT
input.ant-input,
textarea.ant-input {
@ -235,7 +227,7 @@ textarea.ant-input {
}
.ant-input,
.ant-input-number:focus,
.ant-input-affix-wrapper:focus,
.ant-input-affix-wrapper:focus,
.ant-input-affix-wrapper-focused {
border-color: var(--owncast-purple);
input,
@ -252,9 +244,6 @@ textarea.ant-input {
padding-right: 25px;
}
// ANT BUTTON
.ant-btn {
background-color: var(--owncast-purple-25);
@ -270,7 +259,7 @@ textarea.ant-input {
background-color: var(--owncast-purple);
border-color: var(--owncast-purple);
}
.ant-btn-primary:hover,
.ant-btn-primary:hover,
.ant-btn-primary:focus {
background-color: var(--button-focused);
color: var(--white);
@ -299,8 +288,7 @@ textarea.ant-input {
transition-duration: 0.15s;
}
// ANT TABLE
// ANT TABLE
.ant-table-thead > tr > th,
.ant-table-small .ant-table-thead > tr > th {
transition-duration: var(--ant-transition-duration);
@ -339,10 +327,9 @@ textarea.ant-input {
}
.ant-table-thead th.ant-table-column-sort {
background-color: var(--owncast-purple-25);
opacity: .75;
opacity: 0.75;
}
// MODAL
.ant-modal,
.ant-modal-body {
@ -384,7 +371,7 @@ textarea.ant-input {
}
.ant-select-single:not(.ant-select-customize-input) .ant-select-selector {
background-color: var(--black);
border-color: var(--owncast-purple-50);
border-color: var(--owncast-purple-50);
}
.ant-select-arrow {
color: var(--owncast-purple);
@ -409,10 +396,10 @@ textarea.ant-input {
// margin-right: 2em;
// }
.ant-slider-mark-text {
font-size: .85em;
font-size: 0.85em;
white-space: nowrap;
color: var(--white);
opacity: .5;
opacity: 0.5;
}
.ant-slider-handle {
border-color: var(--blue);
@ -441,15 +428,14 @@ textarea.ant-input {
}
}
// ANT COLLAPSE
.ant-collapse {
font-size: 1em;
border-color: transparent;
&> .ant-collapse-item,
& > .ant-collapse-item,
.ant-collapse-content {
border-color: transparent;
&> .ant-collapse-header {
& > .ant-collapse-header {
border-radius: var(--container-border-radius);
border-color: transparent;
background-color: var(--purple-dark);
@ -461,15 +447,14 @@ textarea.ant-input {
.ant-collapse-content {
background-color: var(--black-35); //#181231;
}
.ant-collapse > .ant-collapse-item:last-child, .ant-collapse > .ant-collapse-item:last-child > .ant-collapse-header {
.ant-collapse > .ant-collapse-item:last-child,
.ant-collapse > .ant-collapse-item:last-child > .ant-collapse-header {
border-radius: var(--container-border-radius) var(--container-border-radius) 0 0;
}
.ant-collapse-item:last-child > .ant-collapse-content {
border-radius: 0 0 var(--container-border-radius) var(--container-border-radius);
}
// ANT POPOVER
.ant-popover-inner {
background-color: var(--black);
@ -477,14 +462,11 @@ textarea.ant-input {
.ant-popover-message,
.ant-popover-inner-content {
color: var(--default-text-color);
}
.ant-popover-placement-topLeft > .ant-popover-content > .ant-popover-arrow {
border-color: var(--black);
}
// ANT TAGS
.ant-tag-red,
.ant-tag-orange,
@ -493,7 +475,6 @@ textarea.ant-input {
background-color: var(--black);
}
// ANT PAGINATOR
.ant-pagination-item-active {
color: var(--white);
@ -503,16 +484,15 @@ textarea.ant-input {
color: var(--white);
&:hover {
color: var(--white);
opacity: .75;
opacity: 0.75;
}
}
}
// ANT CHECKBOX
.ant-checkbox-wrapper {
color: var(--white-75);
margin: .5em 0;
margin: 0.5em 0;
}
.ant-checkbox-group {
.ant-checkbox-group-item {

View File

@ -48,7 +48,7 @@
}
.social-items-container {
background-color: var(--container-bg-color-alt);
padding: 0 .75em;
padding: 0 0.75em;
margin-left: 1em;
max-width: 450px;
.form-module {
@ -72,5 +72,5 @@
}
.other-field-container {
margin: .5em 0;
margin: 0.5em 0;
}

View File

@ -8,7 +8,7 @@
flex-direction: row;
justify-content: flex-start;
align-items: center;
padding: .25em;
padding: 0.25em;
line-height: normal;
.option-icon {
@ -33,7 +33,7 @@
justify-content: flex-start;
color: var(--white-75);
.option-icon {
.option-icon {
height: 2em;
width: 2em;
line-height: normal;
@ -43,7 +43,7 @@
flex-direction: column;
margin: 0 0 0 1em;
line-height: 2;
font-size: .85em;
font-size: 0.85em;
}
}
.actions {
@ -54,4 +54,4 @@
width: 6em;
}
}
}
}

View File

@ -38,13 +38,12 @@
.outbound-details,
.inbound-details {
>.ant-card-bordered {
border-color: rgba(255,255,255,.1);
> .ant-card-bordered {
border-color: rgba(255, 255, 255, 0.1);
}
}
}
.offline-content {
max-width: 1000px;
@ -64,12 +63,12 @@
background-color: var(--container-bg-color-alt);
border-radius: var(--container-border-radius);
padding: 1em;
> .ant-card {
background-color: var(--black);
margin-bottom: 1em;
.ant-card-meta-avatar {
margin-top: .25rem;
margin-top: 0.25rem;
svg {
height: 1.5em;
width: 1.5em;

View File

@ -1,5 +1,4 @@
.app-container {
.side-nav {
position: fixed;
height: 100vh;
@ -21,7 +20,7 @@
.logo-container {
background-color: var(--white);
padding: .35rem;
padding: 0.35rem;
border-radius: 9999px;
}
@ -33,7 +32,7 @@
font-weight: 200;
text-transform: uppercase;
line-height: normal;
letter-spacing: .05em;
letter-spacing: 0.05em;
}
}
@ -48,7 +47,6 @@
background-color: var(--nav-bg-color);
}
.main-content-container {
padding: 2em 3em 3em;
}
@ -57,8 +55,6 @@
text-align: center;
}
.online-status-indicator {
display: flex;
flex-direction: row;
@ -72,9 +68,9 @@
.status-label {
color: var(--white);
text-transform: uppercase;
font-size: .75rem;
font-size: 0.75rem;
display: inline-block;
margin-right: .5rem;
margin-right: 0.5rem;
color: var(--offline-color);
}
.status-icon {
@ -99,7 +95,6 @@
}
}
// stream title form field in header
.global-stream-title-container {
display: flex;
@ -149,10 +144,9 @@
}
.update-button-container {
margin: 0;
margin-left: .5em;
margin-left: 0.5em;
line-height: 1;
}
}
}
}
}
}