LogalDeveloper/owncast
LogalDeveloper/owncast
0
Fork 0
Code

fix: #1904 CSS Improvements on Admin Page (#2790)

Browse Source 
* fix: #1904 CSS Improvements on Admin Page

* Prettified Code!

---------

Co-authored-by: thisProjects <wibbet@wobbet.com>
Co-authored-by: thisprojects <thisprojects@users.noreply.github.com>
This commit is contained in:
Nathan 2023-03-11 20:16:35 +00:00 committed by GitHub
parent 877fe1307a
commit 84a0c2f169
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 47 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web/components/admin/MainLayout.tsx
View File

@ -277,7 +277,7 @@ export const MainLayout: FC<MainLayoutProps> = ({ children }) => {
}, },
]; ];
return ( return (
<Layout className={appClass}> <Layout id="admin-page" className={appClass}>
<Head> <Head>
<title>Owncast Admin</title> <title>Owncast Admin</title>
<link rel="icon" type="image/png" sizes="32x32" href="/img/favicon/favicon-32x32.png" /> <link rel="icon" type="image/png" sizes="32x32" href="/img/favicon/favicon-32x32.png" />

51
web/public/styles/admin/home.css
View File

@ -1,29 +1,60 @@
.home-container .online-status-section { .home-container .online-status-section {
margin-bottom: 1em; margin-bottom: 1em;
} }
.home-container .online-status-section .online-details-card { .home-container .online-status-section .online-details-card {
border-color: var(--theme-color-palette-6); border-color: var(--theme-color-palette-15);
} }
.home-container .stream-details-item-container { .home-container .stream-details-item-container {
margin: 1em 0; margin: 1em 0;
} }
.home-container .stream-details-item-container:first-of-type { .home-container .stream-details-item-container:first-of-type {
margin-top: 0; margin-top: 0;
} }
.home-container .stream-details > .ant-card-bordered { .home-container .stream-details > .ant-card-bordered {
border-color: rgba(255, 255, 255, 0.1); border-color: rgba(255, 255, 255, 0.1);
} }
.home-container .ant-card-small > .ant-card-head {
background-color: var(--primary-3);
}
#admin-page .ant-card-body {
background-color: var(--theme-color-palette-15);
border-radius: var(--theme-rounded-corners);
}
#admin-page .line-chart-container {
background-color: var(--theme-color-palette-15);
border-radius: var(--theme-rounded-corners);
margin: 10px 0px 10px 0px;
}
#admin-page th {
background-color: var(--theme-color-palette-15);
}
#admin-page .ant-btn-default {
background-color: var(--theme-color-palette-14);
}
.home-container .outbound-details { .home-container .outbound-details {
margin-bottom: 1em; margin-bottom: 1em;
} }
.offline-content .list-section { .offline-content .list-section {
/* background-color: var(--theme-color-palette-3); */ background-color: var(--theme-color-palette-15);
border-radius: var(--theme-rounded-corners); border-radius: var(--theme-rounded-corners);
padding: 1em; padding: 1em;
} }
.offline-content .list-section > .ant-card { .offline-content .list-section > .ant-card {
margin-bottom: 1em; margin-bottom: 1em;
} }
.offline-intro { .offline-intro {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
@ -31,33 +62,42 @@
align-items: center; align-items: center;
margin-bottom: 2em; margin-bottom: 2em;
} }
.offline-intro .logo-svg { .offline-intro .logo-svg {
height: 6em; height: 6em;
width: 6em; width: 6em;
} }
.news-feed { .news-feed {
margin-top: 0; margin-top: 0;
padding: 1.5em; padding: 1.5em;
border: 1px solid var(--theme-color-palette-15); border: 1px solid var(--theme-color-palette-15);
background-color: var(--theme-color-palette-15);
border-radius: var(--theme-rounded-corners);
} }
.news-feed h2 { .news-feed h2 {
font-size: 1.2em; font-size: 1.2em;
margin-top: 0; margin-top: 0;
color: var(--theme-color-palette-11); color: var(--theme-color-palette-1);
} }
.news-feed article { .news-feed article {
padding: 1em 0.25em; padding: 1em 0.25em;
font-size: 0.9rem; font-size: 0.9rem;
color: var(--white-75); color: var(--white-75);
border-bottom: 1px solid var(--theme-color-palette-10); border-bottom: 1px solid var(--theme-color-palette-15);
} }
.news-feed article h3 { .news-feed article h3 {
font-size: 1.2em; font-size: 1.2em;
} }
.news-feed article h3 a { .news-feed article h3 a {
font-weight: 400; font-weight: 400;
font-size: 1em; font-size: 1em;
} }
.news-feed article .timestamp { .news-feed article .timestamp {
margin-top: 0; margin-top: 0;
font-size: 0.75em; font-size: 0.75em;
@ -65,7 +105,8 @@
.ant-collapse > .ant-collapse-item:last-child, .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-header {
background-color: var(--theme-color-palette-5); background-color: var(--theme-color-palette-3);
border-radius: var(--theme-rounded-corners);
} }
.ant-card-body { .ant-card-body {