Violet/Violets-Purgatory
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

CSS fixes, new text

Browse source
This commit is contained in:
Bingus_Violet 2024-01-07 01:28:28 -06:00
parent fa4d09614f
commit 01ed7a416e
2 changed files with 22 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
static/projects/index.html
View file

@ -18,11 +18,18 @@
<body> <body>
<h1>Projects</h1> <h1>Projects</h1>
<p>All my silly lil projects in one, concise page. To be updated over time!</p> <p>All my silly lil projects in one, concise page. To be updated over time!</p>
<div class="project"> <div class="fadediv">
<h2>Violet's Purgatory</h2> <div class="project">
<div class="project-inner"> <h1>Violet's Purgatory</h1>
<img src="/imgs/violets-purgatory-screenshot.png"> <div class="project-inner container-fluid row">
<p>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.</p> <div class="col-lg-5 col-xl-6">
<img src="/imgs/violets-purgatory-screenshot.png">
</div>
<div class="col-lg-7 col-xl-6">
<p>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.</p>
</div>
</div>
</div> </div>
</div> </div>
</body> </body>

20
static/style.css
View file

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