Skip to content

Commit 6c3cdbc

Browse files
authored
Changed Footer (#405)
1 parent 09a5bcc commit 6c3cdbc

File tree

3 files changed

+248
-234
lines changed

3 files changed

+248
-234
lines changed

css/main.css

Lines changed: 66 additions & 66 deletions
Original file line numberDiff line numberDiff line change
@@ -1,75 +1,75 @@
1-
/* Remove default hyperlink style */
1+
2+
Remove default hyperlink style
23
a {
3-
text-decoration: none;
4-
color: inherit;
5-
}
6-
7-
/* Footer CSS */
8-
.site-footer {
9-
background-color: #f5f5f5;
10-
padding: 30px 0;
11-
}
12-
13-
.site-footer h6 {
14-
font-size: 18px;
15-
margin-bottom: 15px;
16-
}
17-
18-
.site-footer ul {
19-
list-style: none;
20-
padding: 0;
21-
}
22-
23-
.site-footer li {
24-
margin-bottom: 10px;
25-
}
26-
27-
.site-footer a {
28-
color: #777;
29-
}
30-
31-
.site-footer a:hover {
32-
color: #333;
33-
}
34-
35-
.site-footer hr {
36-
margin: 20px 0;
37-
border-top: 1px solid #e5e5e5;
38-
}
39-
40-
.site-footer .copyright-text {
41-
font-size: 14px;
42-
text-align: center;
43-
margin-bottom: 0;
44-
}
45-
4+
text-decoration: none;
5+
color: inherit;
6+
}
7+
8+
/* Footer CSS */
9+
.site-footer {
10+
background-color: #f5f5f5;
11+
padding: 30px 0;
12+
}
13+
14+
.site-footer h6 {
15+
font-size: 18px;
16+
margin-bottom: 15px;
17+
}
18+
19+
.site-footer ul {
20+
list-style: none;
21+
padding: 0;
22+
}
23+
24+
.site-footer li {
25+
margin-bottom: 10px;
26+
}
27+
28+
.site-footer a {
29+
color: #777;
30+
}
31+
32+
.site-footer a:hover {
33+
color: #333;
34+
}
35+
36+
.site-footer hr {
37+
margin: 20px 0;
38+
border-top: 1px solid #e5e5e5;
39+
}
40+
41+
.site-footer .copyright-text {
42+
font-size: 14px;
43+
text-align: center;
44+
margin-bottom: 0;
45+
}
46+
47+
48+
#goTopBtn {
49+
display: none;
50+
position: fixed;
51+
bottom: 20px;
52+
right: 30px;
53+
z-index: 99;
54+
border: none;
55+
outline: none;
56+
background-color: #555;
57+
color: white;
58+
cursor: pointer;
59+
padding: 15px;
60+
border-radius: 50%;
61+
font-size: 18px;
4662

47-
#goTopBtn {
48-
display: none;
49-
position: fixed;
50-
bottom: 20px;
51-
right: 30px;
52-
z-index: 99;
53-
border: none;
54-
outline: none;
55-
background-color: #555;
56-
color: white;
57-
cursor: pointer;
58-
padding: 15px;
59-
border-radius: 50%;
60-
font-size: 18px;
61-
6263
}
6364

6465
#goTopBtn:hover {
65-
background-color: #333;
66-
/* Darker shade on hover */
66+
background-color: #333;
67+
/* Darker shade on hover */
6768
}
6869

6970
#goTopBtn i {
70-
font-size: 24px;
71-
position: relative;
72-
left: 2px;
73-
/* Increase icon size for better visibility */
71+
font-size: 24px;
72+
position: relative;
73+
left: 2px;
74+
/* Increase icon size for better visibility */
7475
}
75-

home.css

Lines changed: 120 additions & 114 deletions
Original file line numberDiff line numberDiff line change
@@ -733,123 +733,129 @@ body.dark-mode .faq{
733733
/* Tomato red color */
734734
}
735735

736-
737736
/* Styles for Footer */
738-
footer {
739-
background-color: #24292d;
740-
padding: 30px 0 0 0;
741-
text-align: center;
742-
color: #f5f5f5;
743-
border-top: 2px solid #2f363e;
744-
}
745-
746-
.footer-container {
747-
margin: 0 auto;
748-
display: flex;
749-
flex-direction: column;
750-
/*justify-content: space-between;*/
751-
752-
}
753-
754-
.footer2{
755-
display: flex;
756-
flex-direction: row;
757-
}
758-
.footer-about {
759-
display: inline;
760-
align-items: center;
761-
flex-direction: row;
762-
margin-top: 1rem;
763-
margin-bottom: 1rem;
764-
width: 100%;
765-
766-
}
767-
768-
.footer-links {
769-
display: inline;
770-
align-items: center;
771-
flex-direction: row;
772-
margin-top: 1rem;
773-
margin-bottom: 1rem;
774-
width: 50%;
775-
776-
}
777-
778-
.footer-container h4 {
779-
font-weight: bolder;
780-
}
781-
782-
.footer-container .btn {
783-
background-color: #4c5156;
784-
font-size: smaller;
785-
padding: 10px;
786-
color: #f5f5f5;
787-
border-radius: 5px;
788-
}
789-
790-
.footer-about p {
791-
width: 100%;
792-
padding: 20px;
793-
}
794-
795-
.footer-links ul {
796-
padding: 10px;
797-
}
798-
799-
.footer-links li {
800-
margin-bottom: 10px;
801-
width: auto;
802-
box-sizing: inherit;
803-
}
804-
805-
.footer-links li a {
806-
text-decoration: none;
807-
color: #f5f5f5;
737+
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600;700;800;900&display=swap');
808738

809-
}
810-
811-
.footer-contact {
812-
padding: 10px;
813-
margin: auto;
739+
.f1{
740+
padding: 3rem 1rem;
741+
background: rgb(56, 56, 56);
742+
position: relative;
743+
min-height: 350px;
814744
width: 100%;
815-
display: flex;
816-
flex-direction: column;
817-
background-color: dimgrey;
818-
align-items: center;
819-
font-size: medium;
820-
}
821-
822-
.social-icons {
823-
display: flex;
824-
flex-direction: row;
825-
align-items: center;
826-
}
827-
828-
.social-icons a {
829-
font-size: medium;
830-
text-decoration: none;
831-
color: white;
832-
}
833-
834-
i {
835-
color: #f5f5f5;
836-
margin-right: 5px;
837-
}
838-
839-
.contact-icons a i {
840-
color: #f5f5f5;
841-
}
842-
843-
.copyright {
844-
background-color: #4c5156;
845-
color: #fff;
846-
margin-bottom: 0;
847-
padding: 10px;
848-
font-size: 2vh;
849-
font-weight: bold;
850-
margin-top: 0px;
851-
}
852-
745+
}
746+
747+
.social_media:hover {
748+
color: yellow;
749+
}
750+
.container1 {
751+
max-width: 1140px;
752+
margin: 0 auto;
753+
display: flex;
754+
justify-content: center;
755+
align-items: center;
756+
flex-direction: column;
757+
}
758+
.social {
759+
font-size: x-large;
760+
}
761+
.row1{
762+
display: flex;
763+
justify-content: space-between;
764+
align-items: center;
765+
}
766+
767+
.col1{
768+
min-width: 250px;
769+
color:#f2f2f2f2;
770+
font-family: poppins;
771+
padding:0 2rem;
772+
}
773+
.col1 .h11 {
774+
color: yellow;
775+
}
776+
777+
.col1 .logo{
778+
width: 100px;
779+
margin-bottom:25px;
780+
}
781+
.col1 h3{
782+
font-weight: 800;
783+
color: yellow;
784+
margin-bottom: 20px;
785+
position: relative;
786+
cursor: pointer;
787+
}
788+
789+
790+
.col1 h3::after{
791+
content: '';
792+
height:2px;
793+
width:0px;
794+
background-color: rgb(208, 255, 0);
795+
position: absolute;
796+
bottom: 0;
797+
left:0;
798+
transition: 0.3s ease;
799+
800+
}
801+
.col1 h3:hover::after{
802+
width: 35px;
803+
}
804+
.col1 .social a i{
805+
color:rgb(255, 255, 255);
806+
margin-top:2rem;
807+
margin-right: 5px;
808+
transition: 0.3s ease;
809+
font-size: 1.8rem;
810+
}
811+
.col1 .social a i:hover{
812+
transform: scale(1.5);
813+
color: yellow;
814+
}
815+
.col1 .links a{
816+
font-weight: 200;
817+
display: block;
818+
text-decoration: none;
819+
color:#f2f2f2;
820+
margin-bottom: 5px;
821+
position: relative;
822+
transition: 0.3s ease;
823+
}
824+
.col1 .links a::before{
825+
content:'';
826+
height: 16px;
827+
width:3px;
828+
position: absolute;
829+
top:5px;
830+
left:-10px;
831+
background-color: rgb(255, 255, 0);
832+
transition: 0.5s ease;
833+
opacity: 0;
834+
}
835+
.col1 .links a:hover::before{
836+
opacity: 1;
837+
}
838+
.col1 .links a:hover{
839+
transform: translateX(-8px);
840+
color:yellow;
841+
}
842+
.col1 .contact-details{
843+
display: inline-flex;
844+
justify-content: space-between;
845+
}
846+
.col1 .contact-details i{
847+
margin: 10px;
848+
}
849+
850+
.copyright {
851+
color: rgb(169, 169, 169);
852+
justify-content: center;
853+
display: flex;
854+
align-items: center;
855+
margin-top: 4rem;
856+
margin-left: 4rem;
857+
}
858+
853859
/* Media Queries */
854860
@media screen and (max-width: 1000px) {
855861
.hero {

0 commit comments

Comments
 (0)