diff --git a/images/IMG_1270.JPG b/images/IMG_1270.JPG new file mode 100644 index 0000000..3c09386 Binary files /dev/null and b/images/IMG_1270.JPG differ diff --git a/images/sunset-bg-blue.jpg b/images/sunset-bg-blue.jpg deleted file mode 100644 index 0acbd1c..0000000 Binary files a/images/sunset-bg-blue.jpg and /dev/null differ diff --git a/images/sunset-bg.jpg b/images/sunset-bg.jpg deleted file mode 100644 index d6471e5..0000000 Binary files a/images/sunset-bg.jpg and /dev/null differ diff --git a/images/sunset-square-bg-blue.min.avif b/images/sunset-square-bg-blue.min.avif new file mode 100644 index 0000000..0420750 Binary files /dev/null and b/images/sunset-square-bg-blue.min.avif differ diff --git a/images/sunset-square-bg-blue.min.jpg b/images/sunset-square-bg-blue.min.jpg new file mode 100644 index 0000000..80d02c1 Binary files /dev/null and b/images/sunset-square-bg-blue.min.jpg differ diff --git a/images/sunset-square-bg.min.jpg b/images/sunset-square-bg.min.jpg new file mode 100644 index 0000000..368d68f Binary files /dev/null and b/images/sunset-square-bg.min.jpg differ diff --git a/images/sunset-square.jpg b/images/sunset-square.jpg new file mode 100644 index 0000000..4242859 Binary files /dev/null and b/images/sunset-square.jpg differ diff --git a/images/sunset-square.min.jpg b/images/sunset-square.min.jpg new file mode 100644 index 0000000..d2df307 Binary files /dev/null and b/images/sunset-square.min.jpg differ diff --git a/images/sunset.jpg b/images/sunset.jpg index f95234c..212e38e 100644 Binary files a/images/sunset.jpg and b/images/sunset.jpg differ diff --git a/images/sunset.min.jpg b/images/sunset.min.jpg new file mode 100644 index 0000000..31763db Binary files /dev/null and b/images/sunset.min.jpg differ diff --git a/index.html b/index.html index dbd14b6..4a48a2a 100644 --- a/index.html +++ b/index.html @@ -29,16 +29,9 @@ body {margin: auto; min-height: 100vh} section, footer {margin-top: 2.5rem} footer {padding-bottom: 1rem; display: flex; justify-content: center} .container {padding: 0 1rem; height: 100%;} -header { - background: url(./images/sunset-bg-blue.jpg); - background-size: cover; - background-repeat: no-repeat; - width: 100%; height: 100vw; - max-height: 600px; background-position: bottom -} -header .container { - display: grid; grid-template-rows: 1fr auto auto -} +header {position: relative;} +header .container {position: absolute; bottom: 0; width: 100%; height: fit-content} +header img {width: 100vw; height: 100vw; max-width: 100%; max-height: 600px; object-fit: cover; object-position: bottom} header h1 {grid-row: 2} header p {grid-row: 3} dl {display: grid; grid-template-columns: 6.5rem 1fr} @@ -60,7 +53,7 @@ body:before { height: 100vh; left: 0; top: 0; - background: url(./images/sunset-bg-blue.jpg); + background: url(./images/sunset-square-bg-blue.min.jpg); background-size: cover; background-repeat: no-repeat; background-position: center; filter: blur(1rem); @@ -68,7 +61,7 @@ body:before { z-index: -1 } html {background-color: #212121} -body, header, section {background-color: #212227; color: white} +body, header, section {background-color: #1D1B20; color: white} a {color: #64b5f6} a:visited {color: #d1c4e9} img {color: white} @@ -91,6 +84,10 @@ img {color: white}
+ + + a picture i took of a sunset, but hue-shifted to be blue and purple +

hi, i'm a.

i have approximate knowledge of many things. perpetual student. (nb/ace/they)