This commit is contained in:
Neshura 2022-12-19 21:51:51 +01:00
parent 26ac430d7e
commit bb1520afc9
No known key found for this signature in database
GPG key ID: ACDF5B6EBECF6B0A
5 changed files with 10 additions and 2 deletions

View file

@ -10,7 +10,7 @@ const Layout = ({ children }: { children: React.ReactNode }) => {
let ret: JSX.Element; let ret: JSX.Element;
if(isMobile) { if(isMobile) {
ret = ( ret = (
<Page> <Page mobile={isMobile}>
<Script id="matomo_analytics" <Script id="matomo_analytics"
defer src='https://static.cloudflareinsights.com/beacon.min.js' defer src='https://static.cloudflareinsights.com/beacon.min.js'
data-cf-beacon='{"token": "826fc083aa86417890c0ceb3e0a597fa"}'> data-cf-beacon='{"token": "826fc083aa86417890c0ceb3e0a597fa"}'>

View file

@ -7,13 +7,18 @@ export const StyledBody = styled.body`
Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif; Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
` `
export const Page = styled.div` interface MobilePropType {
mobile?: number;
}
export const Page = styled.div<MobilePropType>`
width: 100%; width: 100%;
background-color: ${({ theme }) => theme.colors.background}; background-color: ${({ theme }) => theme.colors.background};
background-image: ${({ theme }) => theme.backgroundImage ? "url(" + theme.backgroundImage + ")" : ""}; background-image: ${({ theme }) => theme.backgroundImage ? "url(" + theme.backgroundImage + ")" : ""};
background-repeat: no-repeat; background-repeat: no-repeat;
background-attachment: fixed; background-attachment: fixed;
background-size: cover; background-size: cover;
background-position: ${ props => props.mobile ? ({ theme }) => theme.backgroundOffset ? theme.backgroundOffset : "60%" : ""};
` `
export const Main = styled.main` export const Main = styled.main`

View file

@ -205,6 +205,7 @@ export const NavIndicators = styled.nav`
background-repeat: no-repeat; background-repeat: no-repeat;
background-attachment: fixed; background-attachment: fixed;
background-size: cover; background-size: cover;
background-position: ${({ theme }) => theme.backgroundOffset ? theme.backgroundOffset : "60%"};
width: 100%; width: 100%;
display: flex; display: flex;
flex: 1; flex: 1;

View file

@ -52,6 +52,7 @@
"themeName": "Nordlys", "themeName": "Nordlys",
"themeId": 4, "themeId": 4,
"backgroundImage": "https://images4.alphacoders.com/112/1123390.jpg", "backgroundImage": "https://images4.alphacoders.com/112/1123390.jpg",
"backgroundOffset": "60%",
"invertButtons": true, "invertButtons": true,
"colors": { "colors": {
"background": "#0008", "background": "#0008",

1
styled.d.ts vendored
View file

@ -5,6 +5,7 @@ declare module 'styled-components' {
themeName: string, themeName: string,
themeId: number, themeId: number,
backgroundImage?: string, backgroundImage?: string,
backgroundOffset?: string,
invertButtons?: boolean, invertButtons?: boolean,
colors: { colors: {
background: string, background: string,