Skip to content

Upgraded the footer of the Blog section and modified its buttons #532

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
wants to merge 1 commit into from
Closed

Upgraded the footer of the Blog section and modified its buttons #532

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 16 additions & 0 deletions .vscode/launch.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
{
// Use IntelliSense to learn about possible attributes.
// Hover to view descriptions of existing attributes.
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [

{
"type": "chrome",
"request": "launch",
"name": "Launch Chrome against localhost",
"url": "http://localhost:8080",
"webRoot": "${workspaceFolder}"
}
]
}
76 changes: 74 additions & 2 deletions css/main.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,13 +7,32 @@ a {

/* Footer CSS */
.site-footer {
background-color: #f5f5f5;
background: rgb(56, 56, 56);
color: rgb(255, 255, 255);
padding: 30px 0;
}

.site-footer h6 {
font-size: 18px;
color: #fed700;
font-size: 24px;
margin-bottom: 15px;
position: relative;
font-weight: bold;
}

.site-footer h6::after{
content: '';
height:3px;
width:0px;
background-color: #fed700;
position: absolute;
bottom: 0;
left:0;
transition: 0.3s ease;

}
.site-footer h6:hover::after{
width: 35px;
}

.site-footer ul {
Expand Down Expand Up @@ -45,6 +64,59 @@ a {
}


/* footer link hover effect */
.site-footer .footer-links a{
font-weight: 500;
display: block;
text-decoration: none;
color:#f2f2f2;
margin-bottom: 5px;
position: relative;
transition: 0.3s ease;
}
.site-footer .footer-links a::before{
content:'';
height: 16px;
width:3px;
position: absolute;
top:5px;
left:-10px;
background-color: rgb(255, 255, 0);
transition: 0.5s ease;
opacity: 0;
}
.site-footer .footer-links a:hover::before{
opacity: 1;
}
.site-footer .footer-links a:hover{
transform: translateX(-8px);
color:yellow;
}

.site-footer .libutton {
background-color:#c1a403 ;
color: #555;
transition: transform .3s;
}
.site-footer .libutton:hover{
background-color:#eccc18 ;
transform: scale(1.1);
}
.site-footer .libutton a{
color: #555;
}

.blog-buttons{
background-color:#e5c303 ;
color:rgb(64, 62, 62);
transition: transform .3s;
}
.blog-buttons:hover{
background-color:#eccc18 ;
transform: scale(1.1);
color: black;
}

#goTopBtn {
display: none;
position: fixed;
Expand Down
6 changes: 3 additions & 3 deletions home.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -747,7 +747,7 @@ body.dark-mode .faq{
}

.faq .accordion-header img {
transition: transform 0.3s ease;
transition: transform 0.9s ease;
/* Add a smooth transition for the image */
}

Expand Down Expand Up @@ -902,13 +902,13 @@ body.dark-mode .faq{
color:yellow;
}
.col1 .contact-details{
display: inline-flex;
display: inline-flex;
justify-content: space-between;
}
.col1 .contact-details i{
margin: 10px;
}

.copyright {
color: rgb(169, 169, 169);
justify-content: center;
Expand Down
6 changes: 3 additions & 3 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -140,7 +140,7 @@ <h2 class="card-title">How to Create a GitHub Account</h2>
GitHub is a platform used by millions of developers worldwide
for version control and collaboration.
</p>
<a class="btn btn-primary" href="./posts/github/how-to-create-github-account.html">Read more →</a>
<a class="btn blog-buttons" href="./posts/github/how-to-create-github-account.html">Read more →</a>
</div>
</div>
<!-- Nested row for non-featured blog posts-->
Expand Down Expand Up @@ -174,7 +174,7 @@ <h2 class="card-title">How to Create a GitHub Account</h2>
<div class="input-group">
<input class="form-control" type="text" id="searchInput" placeholder="Enter search term..."
aria-label="Enter search term..." aria-describedby="button-search" />
<button class="btn btn-primary" id="button-search" type="button" onclick="search()">
<button class="btn blog-buttons" id="button-search" type="button" onclick="search()">
Go!
</button>
</div>
Expand Down Expand Up @@ -405,7 +405,7 @@ <h6>Quick Links</h6>
<div class="small text-muted">${post.date}</div>
<h2 class="card-title">${post.title}</h2>
<p class="card-text">${post.description}</p>
<a class="btn btn-primary" href="${post.url}">Read more →</a>
<a class="btn blog-buttons" href="${post.url}">Read more →</a>
</div>
</div>
`;
Expand Down
2 changes: 1 addition & 1 deletion readme.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@
Make the necessary modifications or additions to the project files.

3. **Commit and Push**
Once you've made your changes, commit them and push to your fork:
Once you've made your changes, commit them and push into your fork:
```bash
git add .
git commit -m "Describe your changes here"
Expand Down