diff --git a/static/projects/index.html b/static/projects/index.html index 9967712..33a5532 100644 --- a/static/projects/index.html +++ b/static/projects/index.html @@ -18,11 +18,18 @@

Projects

All my silly lil projects in one, concise page. To be updated over time!

-
-

Violet's Purgatory

-
- -

Lorem ipsum dolor, sit amet consectetur adipisicing elit. Lorem, ipsum dolor sit amet consectetur adipisicing elit. Veniam qui unde, deleniti culpa quas dolore quasi nesciunt reiciendis nobis quo iste perferendis nulla praesentium. Magni excepturi quaerat laboriosam vel sed! Lorem ipsum dolor sit amet consectetur adipisicing elit. Illum amet sunt deserunt explicabo enim atque beatae, commodi architecto, eaque vitae libero quisquam asperiores. Mollitia, veritatis assumenda blanditiis possimus sequi sunt! Lorem ipsum dolor sit amet consectetur adipisicing elit. Iste culpa tenetur labore accusamus, error sapiente illum quidem dolor placeat numquam sunt? Debitis nesciunt ad quos eum nam iste dolor veniam! Lorem ipsum dolor sit amet consectetur, adipisicing elit. Maxime qui suscipit et ipsum, accusantium repellat, nulla, minima esse nam provident possimus reprehenderit ab facilis. Consectetur molestiae sequi cum praesentium minima.

+
+
+

Violet's Purgatory

+
+
+ +
+
+

Nothing much to be said- its the site you're using right now! I've made many variations of it over the years, and it's been on 3 different domains. First it was "violets-puragtory.github.io", then moved to "violets-puragtory.com", and lastly (now) to violets-purgatory.dev! My first time coding any HTML on my own, and technically the first iteration of this site, was a css animation of the "homophobic dog" meme sliding on screen accompanied by the role sound effect from amongus. I was like 13 don't judge me I thought it was funny.

+
+ +
diff --git a/static/style.css b/static/style.css index fe5c2df..f5f4b79 100644 --- a/static/style.css +++ b/static/style.css @@ -118,7 +118,7 @@ p { margin: 10px; } -img:not(.project-inner > img) { +img:not(.project-inner > div > img) { width: 100%; max-width: 135px; transition: all 2s cubic-bezier(0.075, 0.82, 0.165, 1); @@ -168,27 +168,27 @@ hr { } .project { - background-color: rgba(35, 35, 35, 1); - padding: 10px; + background-color: rgba(35, 35, 35, 0.8); + padding: 15px; + border: 2px gray solid; } .project-inner { overflow: hidden; - margin: auto; padding: 0; - display: flex; - position: relative; + margin: auto; z-index: 3; } -.project-inner > img { +.project-inner > div > img { object-fit: cover; - max-width: 300px; - border: 2px lightgray solid; + border: 2px white solid; + width: 80%; + max-width: 500px; + margin: auto; } .project > p { - text-align: right; display: inline-block; }