Skip to content

Commit

Permalink
Update project titles and descriptions for clarity; enhance styling w…
Browse files Browse the repository at this point in the history
…ith background images and new layout
  • Loading branch information
mkatigbak committed Jan 11, 2025
1 parent 3a46603 commit 3f067d4
Show file tree
Hide file tree
Showing 3 changed files with 18 additions and 11 deletions.
10 changes: 9 additions & 1 deletion css/styles.css
Original file line number Diff line number Diff line change
Expand Up @@ -241,7 +241,7 @@ section {
}

#project-1 .project-body {
background-color: #6c757d;
background-image: url(../images/project-2.jpg);
}

#project-2 .project-body {
Expand All @@ -263,6 +263,8 @@ section {
box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.3);
height: var(--project-height);
transition: all 0.5s;
background-repeat: no-repeat;
background-size: cover;
}

.project-container .project-body .project-title {
Expand Down Expand Up @@ -316,6 +318,12 @@ button:hover .svg-icon {
border: 1px solid #fff;
}

.project-container p {
background-color: #000;
padding: 20px;
border-radius: 20px;
}

.project-container .project-body .project-content {
display: flex;
flex-direction: column;
Expand Down
Binary file added images/project-2.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
19 changes: 9 additions & 10 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -97,8 +97,8 @@ <h2 class="title">Projects</h2>
<li class="project" id="project-1">
<div class="project-body">
<div class="project-title">
<h2>Under Construction</h2>
<a href="https://github.com/mkatigbak?tab=repositories" target="_blank">
<h2>Text-Based Adventure Game</h2>
<a href="https://mkatigbak.github.io/text-based-adventure-game/" target="_blank">
<button>
<span class="icon">
<svg
Expand All @@ -116,16 +116,15 @@ <h2>Under Construction</h2>
</div>
<hr />
<div class="project-content">
<p>Visit <a href="https://github.com/mkatigbak?tab=repositories" target="_blank" style="color: #20C20E; font-weight: bolder; font-size: large;">my github repository</a> for now to check some of my projects.</p>
<img alt="Project Image" class="project-image" />
<p>A button-driven text-based adventure game made using HTML, CSS, and JavaScript.</p>
</div>
</div>
</li>
<li class="project" id="project-2">
<div class="project-body">
<div class="project-title">
<h2>Placeholder Project Title</h2>
<a href="#" target="_blank">
<h2>Under Construction</h2>
<a href="https://github.com/mkatigbak?tab=repositories" target="_blank">
<button>
<span class="icon">
<svg
Expand All @@ -143,8 +142,8 @@ <h2>Placeholder Project Title</h2>
</div>
<hr />
<div class="project-content">
<p>Placeholder project discription.</p>
<img alt="Project Image" class="project-image" />
<p>Visit <a href="https://github.com/mkatigbak?tab=repositories" target="_blank" style="color: #20C20E; font-weight: bolder; font-size: large;">my github repository</a> for now to check some of my projects.</p>
<!-- <img alt="Project Image" class="project-image" /> -->
</div>
</div>
</li>
Expand All @@ -171,7 +170,7 @@ <h2>Placeholder Project Title</h2>
<hr />
<div class="project-content">
<p>Placeholder project discription.</p>
<img alt="Project Image" class="project-image" />
<!-- <img alt="Project Image" class="project-image" /> -->
</div>
</div>
</li>
Expand All @@ -198,7 +197,7 @@ <h2>Placeholder Project Title</h2>
<hr />
<div class="project-content">
<p>Placeholder project discription.</p>
<img alt="Project Image" class="project-image" />
<!-- <img alt="Project Image" class="project-image" /> -->
</div>
</div>
</li>
Expand Down

0 comments on commit 3f067d4

Please sign in to comment.