LogalDeveloper/owncast
0
Fork 0
Code Activity

reorganize styles and pages (wip); update readme

Browse Source
This commit is contained in:
gingervitis
2021-01-27 01:46:08 -08:00
parent 8ddd780281
commit ff51c168ff
12 changed files with 254 additions and 146 deletions
Download Patch File Download Diff File Expand all files Collapse all files

95
web/styles/ant-overrides.scss Normal file
View File

@@ -0,0 +1,95 @@
// GENERAL ANT OVERRIDES
.ant-layout,
.ant-layout-footer,
.ant-menu,
.ant-menu.ant-menu-dark {
background-color: transparent;
}
.owncast-layout .ant-menu-dark.ant-menu-dark:not(.ant-menu-horizontal) .ant-menu-item-selected {
background-color: var(--owncast-purple);
}
// LAYOUT
.ant-layout-header,
.ant-layout-sider {
background-color: #07050d;
}
// MENU
.ant-menu-dark .ant-menu-inline.ant-menu-sub {
// background-color: rgba(255,255,255,.05);
background-color: #140028;
}
// CARD
.ant-card {
border-radius: .5em;
}
// INPUT
.ant-input-affix-wrapper {
border-radius: 5px;
background-color: rgba(255,255,255,.1);
textarea {
border-radius: 5px;
}
input {
background-color: transparent;
}
}
// BUTTON
.ant-btn-primary:hover, .ant-btn-primary:focus {
background-color: white;
color: #40a9ff;
}
.ant-btn.ant-btn-primary:focus {
border-color: white;
}
.ant-input-affix-wrapper,
.ant-btn {
transition-delay: 0s;
transition-duration: 0.15s;
}
// TABLE
.ant-table-thead > tr > th,
.ant-table-small .ant-table-thead > tr > th {
background-color: #000;
}
// MODAL
.ant-modal-content {
border-radius: 6px;
}
.ant-modal-header {
background-color: #1c173d;
border-radius: 6px 6px 0 0;
}
.ant-modal-title {
font-weight: bold;
font-size: 1.5em;
}
.ant-modal-body {
background-color: #33333c;
}
.ant-modal-footer {
background-color: #222229;
}
// SELECT
.ant-select-dropdown {
background-color: #334;
}
// SLIDER
.ant-slider-with-marks {
margin-right: 2em;
}
.ant-slider-mark-text {
font-size: .85em;
white-space: nowrap;
}

33
web/styles/config-pages.module.scss Normal file
View File

@@ -0,0 +1,33 @@
.publicDetailsContainer {
display: flex;
flex-direction: row;
align-items: flex-start;
flex-wrap: wrap;
.textFieldsSection {
margin-right: 2rem;
}
}
.socialLinksEditor {
width: 20rem;
margin: 2em 0;
}
.tag-editor-container,
.config-directory-details-form {
border-radius: 1em;
background-color: rgba(128,99,255,.1);
padding: 1.5em;
margin-bottom: 1em;
}
//////////////////////////////
// common?
.dataTable {
}

7
web/styles/config.scss
View File

@@ -26,13 +26,6 @@
margin-bottom: 1em;
}
.ant-slider-with-marks {
margin-right: 2em;
}
.ant-slider-mark-text {
font-size: .85em;
white-space: nowrap;
}
.status-message {
margin: 1rem 0;

84
web/styles/globals.scss
View File

@@ -1,7 +1,5 @@
@import "~antd/dist/antd.dark";
$owncast-purple: rgba(90,103,216,1);
html,
body {
padding: 0;
@@ -37,84 +35,12 @@ code {
color: var(--owncast-purple);
}
.owncast-layout .ant-menu-dark.ant-menu-dark:not(.ant-menu-horizontal) .ant-menu-item-selected {
background-color: $owncast-purple;
}
// GENERAL ANT FORM OVERRIDES
.ant-layout,
.ant-layout-footer,
.ant-menu,
.ant-menu.ant-menu-dark {
background-color: transparent;
}
.ant-layout-header,
.ant-layout-sider {
background-color: #07050d;
}
.ant-menu-dark .ant-menu-inline.ant-menu-sub {
// background-color: rgba(255,255,255,.05);
background-color: #140028;
}
.ant-card {
border-radius: .5em;
}
.ant-input-affix-wrapper {
border-radius: 5px;
background-color: rgba(255,255,255,.1);
textarea {
border-radius: 5px;
}
input {
background-color: transparent;
}
}
.ant-btn-primary:hover, .ant-btn-primary:focus {
background-color: white;
color: #40a9ff;
}
.ant-btn.ant-btn-primary:focus {
border-color: white;
}
.ant-input-affix-wrapper,
.ant-btn {
transition-delay: 0s;
transition-duration: 0.15s;
}
.ant-table-thead > tr > th,
.ant-table-small .ant-table-thead > tr > th {
background-color: #000;
}
.ant-modal-content {
border-radius: 6px;
}
.ant-modal-header {
background-color: #1c173d;
border-radius: 6px 6px 0 0;
}
.ant-modal-title {
font-weight: bold;
font-size: 1.5em;
}
.ant-modal-body {
background-color: #33333c;
}
.ant-modal-footer {
background-color: #222229;
}
.ant-select-dropdown {
background-color: #334;
}
.rc-virtual-list-scrollbar {
display: block !important;
}
// markdown editor overrides
.rc-virtual-list-scrollbar {
display: block !important;
}
.rc-md-editor {
// Set the background color of the preview container
.editor-container {
@@ -126,7 +52,7 @@ code {
.markdown-editor-preview-pane {
// color:lightgrey;
a {
color: $owncast-purple;
color: var(--owncast-purple);;
}
h1 {
font-size: 2em;
@@ -150,4 +76,4 @@ code {
.button-type-undo, .button-type-redo, .button-type-clear, .button-type-image, .button-type-wrap, .button-type-quote, .button-type-strikethrough, .button-type-code-inline, .button-type-code-block {
display: none !important;
}
}
}