Add Contact section

This commit is contained in:
Ceda EI 2019-06-21 18:02:17 +05:30
parent deb6852813
commit e74cd83f22
3 changed files with 44 additions and 3 deletions

BIN
images/ceda.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 85 KiB

View File

@ -51,7 +51,7 @@ body {
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
padding: 10em; padding: 0 10em;
} }
.title-image { .title-image {
@ -92,6 +92,19 @@ a.icon:hover {
background-color: #FFF; background-color: #FFF;
} }
.large {
display: flex;
width: 100%;
justify-content: space-evenly;
}
.large > .icon {
font-size: 2em;
width: 2.8em;
height: 2.8em;
line-height: 2.8em;
}
.selectors { .selectors {
position: fixed; position: fixed;
right: 0; right: 0;
@ -203,6 +216,15 @@ h3 {
text-decoration: underline; text-decoration: underline;
} }
.image-about {
width: 300px;
border-radius: 50%;
}
#contact h3 {
font-size: 3em;
}
@media (max-width: 1300px) and (min-width: 600px) { @media (max-width: 1300px) and (min-width: 600px) {
.project { .project {
width: 46%; width: 46%;
@ -218,6 +240,13 @@ h3 {
.projects { .projects {
justify-content: center; justify-content: center;
} }
.large > .icon {
font-size: 1.8em;
width: 2em;
height: 2em;
line-height: 2em;
}
} }
@media (max-width: 1100px) and (min-width: 900px) { @media (max-width: 1100px) and (min-width: 900px) {
@ -275,4 +304,8 @@ h3 {
.selectors { .selectors {
display: none; display: none;
} }
.image-about {
width: 200px;
}
} }

View File

@ -136,7 +136,15 @@
</div> </div>
</div> </div>
<div class="page" id="contact"> <div class="page" id="contact">
<h2>Contact Us</h2> <h2>Contact</h2>
<img src="images/ceda.jpg" class="image-about"/>
<h3>@ceda_ei</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin nec augue risus. Praesent at lectus ante. Maecenas volutpat purus et eros vehicula, vitae scelerisque turpis iaculis.</p>
<div class="icons large">
<a class="icon" href="https://matrix.to/#/@ceda_ei:matrix.org"><i class="fa fa-matrix-org"></i></a>
<a class="icon" href="https://t.me/ceda_ei"><i class="fa fa-paper-plane"></i></a>
<a class="icon" href="mailto:ceda_ei@webionite.com"><i class="fa fa-envelope"></i></a>
</div>
</div> </div>
</div> </div>
<div class="right-pane"> <div class="right-pane">
@ -155,7 +163,7 @@
</a> </a>
<a href="#contact" class="selector"> <a href="#contact" class="selector">
<i class="fa fa-angle-left"></i> <i class="fa fa-angle-left"></i>
<span>Contact Us</span> <span>Contact</span>
</a> </a>
</div> </div>
<p>Part of <a href="https://libreho.st/"> libreho.st</a> network</p> <p>Part of <a href="https://libreho.st/"> libreho.st</a> network</p>