dejvino/cv
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Add background for wide screen monitors

Browse Source
This commit is contained in:
Dejvino 2023-06-04 10:25:57 +02:00
parent eb3a8ad946
commit 14ba783f3e
3 changed files with 30 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
public/background.jpg Executable file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.3 MiB

29
src/app/globals.css
View File

@ -1,12 +1,39 @@
body { #cv body {
background-color: lightgrey; background-color: lightgrey;
} }
.background {
position: fixed;
width: 100%;
height: 100vh;
top: 0;
z-index: -10;
}
@media screen and (min-width: 1400px) {
.background {
background: url("/background.jpg");
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
z-index: -10;
}
.main-container {
margin-top: 10rem;
margin-bottom: 15rem;
border: 1px solid lightgray;
border-radius: 5px;
}
}
.main-container { .main-container {
background-color: white; background-color: white;
padding-top: 1rem; padding-top: 1rem;
padding-bottom: 0.2rem; padding-bottom: 0.2rem;
z-index: 1;
transition: 0.5s;
} }
.main-container .photo { .main-container .photo {

3
src/app/layout.tsx
View File

@ -21,8 +21,9 @@ export default function RootLayout({
children: React.ReactNode children: React.ReactNode
}) { }) {
return ( return (
<html lang="en"> <html lang="en" id="cv">
<body className={inter.className}> <body className={inter.className}>
<div className='background'></div>
<PersonProvider> <PersonProvider>
{children} {children}
</PersonProvider> </PersonProvider>