ctactic/aircox-radiocampus
1
0
Fork 0
forked from rc/aircox
Code Issues 8 Pull Requests Activity

radiocampus: style update

Browse Source
This commit is contained in:
Chris Tactic
2024-07-24 10:24:23 +02:00
parent a8719bbc80
commit 070af46ef1
3 changed files with 154 additions and 112 deletions
Download Patch File Download Diff File Expand all files Collapse all files

193
radiocampus/static/radiocampus/radiocampus.css
View File

@ -7,7 +7,7 @@
--a-player-panel-bg: #738ef2;
--a-player-panel-fg: white;
--a-sound-hv-bg: #f6ed80;
--a-sound-hv-fg: #444; /*fff667;*/
--a-sound-hv-fg: #444;
--a-sound-bg: #f6ed80;
--body-bg: unset;
--break-color: transparent;
@ -16,10 +16,10 @@
--button-hv-bg: #F4F88D;
--button-hv-fg: #1d3cab;
--button-active-fg: white;
--button-active-bg: #eef289;
--button-active-bg: #738ef2;
--heading-font-family: "campus_grotesk";
--heading-link-hv-fg: #aa217b;
--heading-hg-fg: #e65fb1;
--heading-hg-fg: #fff;
--link-fg: #3b47ff;
--link-hv-fg: #c40c85;
--main-color-light: #F4F881;
@ -28,121 +28,186 @@
--nav-secondary-bg: transparent;
--nav-hv-bg: unset;
--nav-active-bg: unset;
--nav-active-fg: white; /* #fdffba; */
--text-color: #75124e; /*#ed43ab;*/
--nav-active-fg: white;
--text-color: #75124e;
--text-color-light: #bbb;
}
@font-face {
font-family: 'campus_grotesk';
src: url("/static/radiocampus/fonts/CampusGroteskv23-Regular.otf");
}
@font-face {
font-family: "campus_grotesk";
src:
local("campus_grotesk"),
url("/static/radiocampus/fonts/campus_grotesk/CampusGroteskv23-Regular.woff2") format("woff2"),
url("/static/radiocampus/fonts/campus_grotesk/CampusGroteskv23-Regular.woff") format("woff"),
url("/static/radiocampus/fonts/campus_grotesk/CampusGroteskv23-Regular.otf") format("opentype") tech(color-COLRv1);
url("/static/radiocampus/fonts/campus_grotesk/CampusGroteskv24-Regular.woff2") format("woff2"),
url("/static/radiocampus/fonts/campus_grotesk/CampusGroteskv24-Regular.woff") format("woff"),
url("/static/radiocampus/fonts/campus_grotesk/CampusGroteskv24-Regular.otf") format("opentype") tech(color-COLRv1);
}
body {
color: #222;
background-size: cover;
}
#grandlogo {
body.home, body.home .preview .headings a, body.home .page a {
color: #fff;
}
body.home .preview .headings a:hover {
color: #f4f88d !important;
}
body.home .nav.primary {
max-width: 1200px;
margin: 0 auto;
}
body.yellow {
background: url(/static/radiocampus/backgrounds/degrade-jaune.jpg) repeat-x top fixed;
}
body.yellow.home {
background: url(/static/radiocampus/backgrounds/photo-degrade-02.jpg) no-repeat center/cover;
background-attachment: fixed;
}
body.blue {
background: url(/static/radiocampus/backgrounds/degrade-bleu.jpg) repeat-x top fixed;
}
body.blue.home {
background: url(/static/radiocampus/backgrounds/photo-degrade-01.jpg) no-repeat center/cover;
background-attachment: fixed;
}
body.blue #grandlogo img {
content: url('/static/radiocampus/logos/logo-RC-blanc1.png');
}
body.yellow #grandlogo img {
content: url('/static/radiocampus/logos/logo-RC-bleu1.png');
}
body.blue.home #grandlogo img {
content: url('/static/radiocampus/logos/logo-RC-blanc2.png');
}
body.yellow.home #grandlogo img {
content: url('/static/radiocampus/logos/logo-RC-bleu2.png');
}
body.yellow .nav .nav-item.active {
color: #7E6B64 !important;
}
body.blue #grandlogo img, body.yellow #grandlogo img {
width: 120px;
margin: 12px 0 0 48px;
}
body.blue.home #grandlogo, body.yellow.home #grandlogo {
text-align: center;
width: 100%;
background: url('/static/radiocampus/images/grand-logo.png') no-repeat scroll top center;
background-size: contain;
height: 107px;
}
body.blue.home #grandlogo img , body.yellow.home #grandlogo img {
margin: 12px auto 0 auto;
width: 960px;
opacity: 0.8;
}
.a-player-bar {
border-top: 1px solid #555;
}
.a-player .button, .a-player-bar-content {
color: white;
}
#player .a-sound-item .label {
color: white;
color: white !important;
}
.a-switch-nav span {
color: white;
}
.a-switch-nav span:hover {
color: #333;
}
.button, a.button, button.button {
border: var(--link-fg) 1px solid;
border-radius: 20px;
border: 0;
}
.nav.primary .nav-brand {
display: none;
}
/*
.navs {
background-color: #738ef2;
}
*/
.nav.secondary .nav-item {
color: #7E6B64 !important;
}
.nav-item:hover {
opacity: 0.8;
}
.nav.primary .nav-item {
font-weight: unset;
font-size: 1.4em;
}
.page section.container {
margin-top: 0;
padding-top: 0.6rem;
}
@media screen and (max-width: 400px) {
body {
font-size: 16px;
}
}
@media screen and (max-width: 1024px) {
.nav.primary {
background-color: #738ef2;
}
.page {
margin-top: 0;
padding-top: var(--nav-primary-height);
}
.nav.primary .nav-brand {
display: inline-block;
background-color: #738ef2;
}
.dropdown-trigger .icon, .icon.bullet {
color: white;
}
.dropdown.is-right .dropdown-menu {
left: 0;
}
.page {
margin-top: 0;
padding-top: var(--nav-primary-height);
}
.nav.primary .nav-brand {
display: inline-block;
}
.nav.secondary .nav-item {
color: white !important;
}
.dropdown-trigger .icon, .icon.bullet {
color: white;
}
.dropdown.is-right .dropdown-menu {
left: 0;
}
#grandlogo {
display: none;
}
.nav .nav-menu {
background-color: #738ef2;
.navs, .nav-menu.active {
background-color: #7892f1; /*#738ef2;*/
}
.nav .nav-item {
color: white !important;
}
body.yellow .nav .nav-item.active {
color: white !important;
}
/* yellow theme is not implemented for small screens */
body.yellow {
background: url(/static/radiocampus/backgrounds/degrade-bleu.jpg) repeat-x top/auto 520px;
}
body.yellow.home {
background: url(/static/radiocampus/backgrounds/photo-degrade-01.jpg) no-repeat center/cover;
}
.navs .nav + .nav {
flex-grow: 1 !important;
}
}
@media screen and (min-width: 1408px) {
.container:not(.is-max-desktop):not(.is-max-widescreen) {
max-width: unset;
margin: 10px 64px;
}
body.home .container:not(.is-max-desktop):not(.is-max-widescreen) {
max-width: 1400px;
margin: 0 auto;
}
}
@media screen and (min-width: 1216px) {
.container:not(.is-max-desktop):not(.is-max-widescreen) {
max-width: unset;
margin: 10px 64px;
}
body.home .container:not(.is-max-desktop):not(.is-max-widescreen) {
max-width: 1152px;
margin: 0 auto;
}
}
.list-item:nth-child(3n+1):not(.wide) .media {
@ -203,7 +268,9 @@ body {
}
.nav.secondary .nav-item{
color: #1d3cab !important;
olor: #1d3cab !important;
color: #8c827e !important;
font-size: 1.1em;
}
.nav .nav-item:hover {