-
Notifications
You must be signed in to change notification settings - Fork 6
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Adding my changes on connect section
- Loading branch information
1 parent
2bb1948
commit cc8907c
Showing
11 changed files
with
273 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,128 @@ | ||
* { | ||
padding: 0px; | ||
margin: 0px; | ||
} | ||
body { | ||
width: 100vw; | ||
height: 100vh; | ||
} | ||
|
||
.connect-container { | ||
width: 90%; | ||
height: 60vh; | ||
margin: 100px auto; | ||
height: 60vh; | ||
font-family: "poppins", sans-serif; | ||
display: inline-flex; | ||
gap: 5%; | ||
/* background: grey; */ | ||
padding: 10px; | ||
} | ||
.connect-content { | ||
width: 50%; | ||
} | ||
|
||
.connect-icons { | ||
width: 45%; | ||
height: 100%; | ||
background: white; | ||
position: relative; | ||
} | ||
.square { | ||
height: 60%; | ||
width: 60%; | ||
background: rgba(0, 217, 255, 0.3); | ||
/* margin: auto; */ | ||
transform: translate(30%, 30%); | ||
} | ||
.mbaza-hand { | ||
height: 60%; | ||
width: 40%; | ||
border-radius: 50%; | ||
background: rgb(59, 59, 167); | ||
/* margin: auto; */ | ||
transform: translate(70%, 30%); | ||
} | ||
|
||
.social-icon { | ||
width: 50px; | ||
height: 50px; | ||
border-radius: 50%; | ||
/* border: 0.3px solid black; */ | ||
position: absolute; | ||
background: white; | ||
box-shadow: 1px 1px 10px 1px rgb(83, 82, 82); | ||
transform: scale(0.8); | ||
cursor: pointer; | ||
transition: 0.4s; | ||
} | ||
.social-icon img { | ||
border-radius: 50%; | ||
width: 60%; | ||
height: 60%; | ||
transform: translate(30%, 30%); | ||
} | ||
.social-icon1 { | ||
transform: translate(40%, 60%); | ||
top: 5px; | ||
left: 90px; | ||
} | ||
.social-icon2 { | ||
transform: translate(10%, 30%); | ||
top: 120px; | ||
left: 80px; | ||
} | ||
.social-icon3 { | ||
transform: translate(20%, 33%); | ||
top: 0px; | ||
left: 250px; | ||
} | ||
.social-icon4 { | ||
transform: translate(22%, 68%); | ||
/* top: ; */ | ||
right: 95px; | ||
} | ||
.social-icon5 { | ||
transform: translate(23%, 89%); | ||
top: 200px; | ||
left: 140px; | ||
} | ||
.social-icon6 { | ||
transform: translate(5%, 50%); | ||
bottom: 40px; | ||
left: 255px; | ||
} | ||
.social-icon7 { | ||
transform: translate(90%, 40%); | ||
top: 40px; | ||
right: 120px; | ||
} | ||
.social-icon8 { | ||
transform: translate(80%, 68%); | ||
top: 115px; | ||
right: 150px; | ||
} | ||
.social-icon9 { | ||
transform: translate(5%, 74%); | ||
top: 60px; | ||
left: 310px; | ||
/* background: red; */ | ||
} | ||
.social-icon:hover { | ||
/* transform: scaleY(1); */ | ||
box-shadow: 1px 1px 15px 1px rgb(47, 47, 47); | ||
} | ||
.connect-content { | ||
padding: 30px; | ||
} | ||
.connect-content h2 { | ||
text-align: center; | ||
margin-bottom: 20px; | ||
} | ||
.connect-content p { | ||
font-size: 1.1em; | ||
line-height: 150%; | ||
} | ||
.connect-content a { | ||
margin: 5px; | ||
} |
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,64 @@ | ||
<!DOCTYPE html> | ||
<html lang="en"> | ||
<head> | ||
<meta charset="UTF-8" /> | ||
<meta http-equiv="X-UA-Compatible" content="IE=edge" /> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> | ||
<title>Connect</title> | ||
<link rel="stylesheet" href="../assets/css/connect.css" /> | ||
<link | ||
href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,400;1,900;1,800;1,900&display=swap" | ||
rel="stylesheet" | ||
/> | ||
</head> | ||
<body> | ||
<div class="connect-container"> | ||
<div class="connect-icons"> | ||
<div class="square"> | ||
<div class="mbaza-hand"></div> | ||
</div> | ||
<div class="social-icon social-icon1"> | ||
<img src="../assets/img/connect-icons/GitHub-icon.svg" /> | ||
</div> | ||
<div class="social-icon social-icon2"> | ||
<img src="../assets/img/connect-icons/instagram-icon.svg" /> | ||
</div> | ||
<div class="social-icon social-icon3"> | ||
<img src="../assets/img/connect-icons/flickr-icon.svg" /> | ||
</div> | ||
<div class="social-icon social-icon4"> | ||
<img src="../assets/img/connect-icons/linkedin-icon.svg" /> | ||
</div> | ||
<div class="social-icon social-icon5"> | ||
<img src="../assets/img/connect-icons/youtube-icon.svg" /> | ||
</div> | ||
<div class="social-icon social-icon6"> | ||
<img src="../assets/img/connect-icons/Blogger-icon.svg" /> | ||
</div> | ||
<div class="social-icon social-icon7"> | ||
<img src="../assets/img/connect-icons/twitter-icon.svg" /> | ||
</div> | ||
<div class="social-icon social-icon8"> | ||
<img src="../assets/img/connect-icons/huggingface-icon.svg" /> | ||
</div> | ||
<div class="social-icon social-icon9"> | ||
<img src="../assets/img/connect-icons/slack-icon.svg" /> | ||
</div> | ||
</div> | ||
<div class="connect-content"> | ||
<h2>CONNECT WITH US</h2> | ||
<p> | ||
Explore the world of NLP and connect with our community through our | ||
communication channels. Stay up-to-date with the latest news, | ||
research, and industry insights by following us on social media. For a | ||
more in-depth discussion, join our forums to connect with like-minded | ||
individuals, ask questions, and share your ideas. You can also reach | ||
out to us via email or chat to connect with our experts and get | ||
personalized support. Join our community today and unlock the power of | ||
NLP! | ||
</p> | ||
<a href="#">[email protected]</a> | ||
</div> | ||
</div> | ||
</body> | ||
</html> |