LogalDeveloper/owncast
0
Fork 0
Code Activity

Admin css overhaul pt2 (#19)

Browse Source 
* tweaks to offline state in admin viewers page

If stream is offline, hide current viewers statistic and viewers table.
Also, change wording for describing max viewers.

* take out ant dark stylesheet, organize ant color overrides

* remove ant dark css; cleanup ant overrides; format public-detail page

* combine toggleswitch component style with textfield so layout can be shared

* fix toggleswitch status message placement

* - update styles for modals, collapses
- move reset dir into its own component
- assorted style cleanups ans consistencies

* hide entire advanced section for resetyp if no yp

* temp adjustments to video modal

* temp comment out toggle switch use for later'

* address PR comments

* lint

* update type

* allow warnings during lint

Co-authored-by: nebunez <uoj2y7wak869@opayq.net>
This commit is contained in:
gingervitis
2021-02-12 23:55:59 -08:00
committed by GitHub
parent 250acbf6e9
commit a122ee6c42
40 changed files with 1150 additions and 552 deletions
Download Patch File Download Diff File Expand all files Collapse all files

120
web/styles/config-video-variants.scss
View File

@@ -1,7 +1,30 @@
// styles for Video variant editor (table + modal)
.config-video-variants {
.variants-table {
margin-top: 2em;
}
.variants-table-module {
min-width: 48%;
max-width: 600px;
margin-right: 1em
}
}
// modal content
.config-variant-form {
.description {
margin-top: 0;
}
.advanced-settings {
width: 48%;
margin-left: 2em;
}
.blurb {
margin: 1em;
opacity: .75;
@@ -13,58 +36,61 @@
opacity: .5;
font-style: italic;
}
.section-intro {
margin-bottom: 2em;
}
.field {
margin-bottom: 2em;
display: flex;
flex-direction: row;
justify-content: center;
align-items: flex-start;
transform: opacity .15s;
&.disabled {
opacity: .25;
}
.label {
width: 40%;
text-align: right;
padding-right: 2em;
font-weight: bold;
color: var(--owncast-purple);
}
.info-tip {
margin-right: 1em;
}
.form-component {
width: 60%;
// .field {
// margin-bottom: 2em;
// display: flex;
// flex-direction: row;
// justify-content: center;
// align-items: flex-start;
// transform: opacity .15s;
// &.disabled {
// opacity: .25;
// }
// .label {
// width: 40%;
// text-align: right;
// padding-right: 2em;
// font-weight: bold;
// color: var(--owncast-purple);
// }
// .info-tip {
// margin-right: 1em;
// }
// .form-component {
// width: 60%;
.selected-value-note {
font-size: .85em;
display: inline-block;
text-align: center;
}
}
}
.ant-collapse {
border: none;
border-radius: 6px;
}
.ant-collapse > .ant-collapse-item:last-child,
.ant-collapse > .ant-collapse-item:last-child > .ant-collapse-header {
border: none;
background-color: rgba(0,0,0,.25);
border-radius: 6px;
}
.ant-collapse-content {
background-color: rgba(0,0,0,.1);
}
// .selected-value-note {
// font-size: .85em;
// display: inline-block;
// text-align: center;
// }
// }
// }
// .ant-collapse {
// border: none;
// border-radius: 6px;
// }
// .ant-collapse > .ant-collapse-item:last-child,
// .ant-collapse > .ant-collapse-item:last-child > .ant-collapse-header {
// border: none;
// background-color: rgba(0,0,0,.25);
// border-radius: 6px;
// }
// .ant-collapse-content {
// background-color: rgba(0,0,0,.1);
// }
}
.config-video-segements-conatiner {
// display: flex;
// flex-direction: row;
// justify-content: center;
// align-items: flex-start;
.status-message {
text-align: center;
@@ -82,4 +108,8 @@
margin-left: .5em;
opacity: .8;
}
}
.advanced-settings {
margin-top: 2em;
}