rc/aircox
13
1
Fork 1
Code Issues 15 Pull Requests Projects Releases Wiki Activity

bkp

Browse Source
This commit is contained in:
bkfox 2024-01-09 20:05:39 +01:00
parent ccea2a5ea6
commit 561914ee78
3 changed files with 22 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
aircox/static/aircox/css/admin.css
View File

@ -20,6 +20,7 @@
--preview-wide-content-sz: 1.6rem; --preview-wide-content-sz: 1.6rem;
--header-height: var(--preview-cover-size); --header-height: var(--preview-cover-size);
--a-carousel-p: 1.4rem; --a-carousel-p: 1.4rem;
--a-carousel-ml: calc(1.2rem - 0.5rem);
--a-carousel-gap: 1.2rem; --a-carousel-gap: 1.2rem;
--a-carousel-nav-x: -0.6em; --a-carousel-nav-x: -0.6em;
--a-progress-bg: transparent; --a-progress-bg: transparent;
@ -38,6 +39,7 @@
--a-sound-text-sz: 1rem; --a-sound-text-sz: 1rem;
--a-player-url-fg: var(--highlight-color-2); --a-player-url-fg: var(--highlight-color-2);
--a-player-panel-bg: var(--highlight-color); --a-player-panel-bg: var(--highlight-color);
--a-player-bar-height: var(--nav-primary-height);
--a-player-bar-bg: var(--highlight-color); --a-player-bar-bg: var(--highlight-color);
--a-player-bar-title-alone-sz: 1.4rem; --a-player-bar-title-alone-sz: 1.4rem;
--button-fg: var(--highlight-color-2); --button-fg: var(--highlight-color-2);
@ -286,8 +288,12 @@ preview-header:not(.no-cover) .card-headings .heading, preview-header:not(.no-co
gap: 1.2rem; gap: 1.2rem;
} }
.a-carousel {
margin-left: calc(0rem - var(--a-carousel-ml));
}
.a-carousel .a-carousel-viewport { .a-carousel .a-carousel-viewport {
padding: var(--a-carousel-p) 0; padding: var(--a-carousel-p) 0;
padding-left: var(--a-carousel-ml);
} }
.a-carousel-container { .a-carousel-container {
@ -451,7 +457,7 @@ preview-header:not(.no-cover) .card-headings .heading, preview-header:not(.no-co
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: center; justify-content: center;
height: 3.75em !important; height: var(--a-player-bar-height);
border-top: 1px #ddd solid; border-top: 1px #ddd solid;
background: var(--a-player-bar-bg); background: var(--a-player-bar-bg);
} }
@ -471,7 +477,7 @@ preview-header:not(.no-cover) .card-headings .heading, preview-header:not(.no-co
.a-player-bar .button { .a-player-bar .button {
font-size: 1.6rem; font-size: 1.6rem;
height: 100%; height: 100%;
padding: auto 0.2em !important; padding: 0.2em !important;
min-width: 3em; min-width: 3em;
border-radius: 0px; border-radius: 0px;
transition: background-color 0.5s; transition: background-color 0.5s;

10
aircox/static/aircox/css/public.css
View File

@ -20,6 +20,7 @@
--preview-wide-content-sz: 1.6rem; --preview-wide-content-sz: 1.6rem;
--header-height: var(--preview-cover-size); --header-height: var(--preview-cover-size);
--a-carousel-p: 1.4rem; --a-carousel-p: 1.4rem;
--a-carousel-ml: calc(1.2rem - 0.5rem);
--a-carousel-gap: 1.2rem; --a-carousel-gap: 1.2rem;
--a-carousel-nav-x: -0.6em; --a-carousel-nav-x: -0.6em;
--a-progress-bg: transparent; --a-progress-bg: transparent;
@ -38,6 +39,7 @@
--a-sound-text-sz: 1rem; --a-sound-text-sz: 1rem;
--a-player-url-fg: var(--highlight-color-2); --a-player-url-fg: var(--highlight-color-2);
--a-player-panel-bg: var(--highlight-color); --a-player-panel-bg: var(--highlight-color);
--a-player-bar-height: var(--nav-primary-height);
--a-player-bar-bg: var(--highlight-color); --a-player-bar-bg: var(--highlight-color);
--a-player-bar-title-alone-sz: 1.4rem; --a-player-bar-title-alone-sz: 1.4rem;
--button-fg: var(--highlight-color-2); --button-fg: var(--highlight-color-2);
@ -286,8 +288,12 @@ preview-header:not(.no-cover) .card-headings .heading, preview-header:not(.no-co
gap: 1.2rem; gap: 1.2rem;
} }
.a-carousel {
margin-left: calc(0rem - var(--a-carousel-ml));
}
.a-carousel .a-carousel-viewport { .a-carousel .a-carousel-viewport {
padding: var(--a-carousel-p) 0; padding: var(--a-carousel-p) 0;
padding-left: var(--a-carousel-ml);
} }
.a-carousel-container { .a-carousel-container {
@ -451,7 +457,7 @@ preview-header:not(.no-cover) .card-headings .heading, preview-header:not(.no-co
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: center; justify-content: center;
height: 3.75em !important; height: var(--a-player-bar-height);
border-top: 1px #ddd solid; border-top: 1px #ddd solid;
background: var(--a-player-bar-bg); background: var(--a-player-bar-bg);
} }
@ -471,7 +477,7 @@ preview-header:not(.no-cover) .card-headings .heading, preview-header:not(.no-co
.a-player-bar .button { .a-player-bar .button {
font-size: 1.6rem; font-size: 1.6rem;
height: 100%; height: 100%;
padding: auto 0.2em !important; padding: 0.2em !important;
min-width: 3em; min-width: 3em;
border-radius: 0px; border-radius: 0px;
transition: background-color 0.5s; transition: background-color 0.5s;

8
assets/src/assets/components.scss
View File

@ -22,6 +22,7 @@
--header-height: var(--preview-cover-size); --header-height: var(--preview-cover-size);
--a-carousel-p: #{v.$text-size-medium}; --a-carousel-p: #{v.$text-size-medium};
--a-carousel-ml: calc(#{v.$mp-4} - 0.5rem);
--a-carousel-gap: #{v.$mp-4}; --a-carousel-gap: #{v.$mp-4};
--a-carousel-nav-x: -#{v.$mp-3e}; --a-carousel-nav-x: -#{v.$mp-3e};
@ -44,6 +45,7 @@
--a-player-url-fg: var(--highlight-color-2); --a-player-url-fg: var(--highlight-color-2);
--a-player-panel-bg: var(--highlight-color); --a-player-panel-bg: var(--highlight-color);
--a-player-bar-height: var(--nav-primary-height);
--a-player-bar-bg: var(--highlight-color); --a-player-bar-bg: var(--highlight-color);
--a-player-bar-title-alone-sz: #{v.$text-size-medium}; --a-player-bar-title-alone-sz: #{v.$text-size-medium};
@ -425,9 +427,11 @@
// ---- ---- Carousel // ---- ---- Carousel
.a-carousel { .a-carousel {
margin-left: calc( 0rem - var(--a-carousel-ml));
.a-carousel-viewport { .a-carousel-viewport {
padding: var(--a-carousel-p) 0; padding: var(--a-carousel-p) 0;
padding-left: var(--a-carousel-ml);
} }
} }
@ -618,7 +622,7 @@
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: center; justify-content: center;
height: 3.75em !important; height: var(--a-player-bar-height);
border-top: 1px v.$grey-light solid; border-top: 1px v.$grey-light solid;
background: var(--a-player-bar-bg); background: var(--a-player-bar-bg);
@ -638,7 +642,7 @@
.button { .button {
font-size: v.$text-size-bigger; font-size: v.$text-size-bigger;
height: 100%; height: 100%;
padding: auto 0.2em !important; padding: 0.2em !important;
min-width: 3em; min-width: 3em;
border-radius: 0px; border-radius: 0px;
transition: background-color 0.5s; transition: background-color 0.5s;