Untitled Document
Untitled Document
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" />
<link rel="stylesheet" href="style.css" />
<link rel="stylesheet" href="styles/universal.css" />
<link rel="stylesheet" href="styles/colors.css" />
<link rel="stylesheet" href="styles/navbar.css" />
<link rel="stylesheet" href="styles/footer.css" />
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all
.min.css"
integrity="sha512-iecdLmaskl7CVkqkXNQ/ZH/XLlvWZOJyj7Yy7tcenmpD1ypASozpm
T/E0iPtmFIB46ZmdtAc9eNBvH0H/ZpiBw=="
crossorigin="anonymous"
referrerpolicy="no-referrer"
/>
<title>Annaden Solutions | We Serve You The Best</title>
<link rel="icon" href="images/favicon.ico" type="image/x-icon" />
</head>
<body class="dark">
<header>
<nav style="position: fixed; top: 0; width: 100%">
<div class="nav-bar">
<li class="logo">
<a href="#">
<img id="topLogo" src="images/logo.png" alt="AS Main
Logo" />
</a>
</li>
<div style="display: flex">
<div class="wrapper">
<input type="checkbox" id="hide_checkbox" checked />
<label for="hide_checkbox" class="toggle">
<span class="toggle-button">
<span class="crater crater-1"></span>
<span class="crater crater-2"></span>
<span class="crater crater-3"></span>
<span class="crater crater-4"></span>
<span class="crater crater-5"></span>
<span class="crater crater-6"></span>
<span class="crater crater-7"></span>
</span>
<span class="star star-1"></span>
<span class="star star-2"></span>
<span class="star star-3"></span>
<span class="star star-4"></span>
<span class="star star-5"></span>
<span class="star star-6"></span>
<span class="star star-7"></span>
<span class="star star-8"></span>
</label>
</div>
<input type="checkbox" id="check" />
<span class="menu font-sans">
<li>
<a class="text-white text-center"
href="#courses">Courses</a>
</li>
<li>
<a class="text-white text-center" href="#internships"
>Internships</a
>
</li>
<li>
<a class="text-white text-center"
href="#projects">Projects</a>
</li>
<li>
<a
class="text-white text-center"
href="pages/contact-us/contact.html"
>Contact Us</a
>
</li>
<li>
<a
class="text-white text-center"
href="pages/about-us/about.html"
>About Us</a
>
</li>
<li>
<a href="pages/login/login.html">
<button class="btn-design text-bold">Login</button>
</a>
</li>
<label for="check" class="close-menu">
<i class="text-white fas fa-times"></i>
</label>
</span>
</div>
<label for="check" class="open-menu">
<i class="text-white fas fa-bars"></i>
</label>
</div>
</nav>
</header>
<main>
<div class="first-section">
<div class="headerText font-sans">
<h2 class="section-one-title text-bold">
Internships, Projects, and Courses<br /><span
>On Your Hand <span class="typed_text"></span
></span>
</h2>
<h3 class="text-white">
<b>Unlock Your Coding</b> Potential: Budget-friendly
Courses,
Interactive Content, Internships, Real Projects &
Assignments!
</h3>
<a href="#courses" class="text-bold">Explore
Opportunities</a>
</div>
<div class="headerImage-div">
<img
src="images/headerImage.webp"
alt="A Person Working on Laptop"
class="headerImage"
/>
</div>
</div>
<div class="line-div"></div>
React.useEffect(() => {
fetch("http://localhost:5000/api/internships")
.then((res) => res.json())
.then((data) => setInternships(data))
.catch((err) => console.error(err));
}, []);
return (
<div id="internships" className="third-section font-sans">
<div className="third-section-title">
<p className="text-bold title">Internship
Opportunities</p>
</div>
<div className="line"></div>
<form onSubmit={handleSubmit}>
<input
name="title"
placeholder="Title"
value={form.title}
onChange={handleChange}
/>
<input
name="company"
placeholder="Company"
value={form.company}
onChange={handleChange}
/>
<input
name="price"
placeholder="Price"
value={form.price}
onChange={handleChange}
/>
<input
name="previousPrice"
placeholder="Previous Price"
value={form.previousPrice}
onChange={handleChange}
/>
<input
name="discount"
placeholder="Discount"
value={form.discount}
onChange={handleChange}
/>
<textarea
name="description"
placeholder="Description"
value={form.description}
onChange={handleChange}
></textarea>
<input
name="thumbnail"
placeholder="Thumbnail URL"
value={form.thumbnail}
onChange={handleChange}
/>
<button type="submit">Add Internship</button>
</form>
<div className="third-section-content">
{internships.map((internship) => (
<div className="card" key={internship._id}>
<img
className="course-thumbnail"
src={internship.thumbnail}
alt="Internship Thumbnail"
/>
<p className="card-level
text-bold">{internship.title}</p>
<h3 className="course-title">{internship.company}
Batch</h3>
</div>
))}
</div>
</div>
);
};
ReactDOM.render(
<InternshipSection />,
document.getElementById("internship-section")
);
</script>
<div class="line-div"></div>
<div class="line-div"></div>
<div class="line-div"></div>
<div class="adv-section">
<div class="adv-card">
<img src="images/pocketFriendlyCourses.webp" alt="" />
<span class="adv-desc margin-0"
>Pocket-Friendly Courses: Coding on a Budget!</span
>
</div>
<div class="adv-card">
<img src="images/highQualityLectures.webp" alt="" />
<span class="adv-desc margin-0"
>HD Videos & Crystal clear audios</span
>
</div>
<div class="adv-card">
<img src="images/detailedExplanations.webp" alt="" />
<span class="adv-desc margin-0"
>Intuitive & Detailed Explanations</span
>
</div>
<div class="adv-card">
<img src="images/practiceProblems.webp" alt="" />
<span class="adv-desc margin-0"
>Practice codes, real time feedback</span
>
</div>
<div class="adv-card">
<img src="images/industryCurriculum.webp" alt="" />
<span class="adv-desc margin-0"
>Industry vetted curriculum</span
>
</div>
<div class="adv-card">
<img src="images/lifetimeAccess.webp" alt="" />
<span class="adv-desc margin-0"
>Lifetime access, anytime anywhere</span
>
</div>
<div class="adv-card">
<img src="images/doubtSupport.webp" alt="" />
<span class="adv-desc margin-0">Unlimited doubt
support</span>
</div>
<div class="adv-card">
<img src="images/certificate.webp" alt="" />
<span class="adv-desc margin-0">Certificate of
completion</span>
</div>
</div>
</div>
</div>
</div>
<div id="instructor" class="about-us font-sans text-center">
<div class="instructor-title">
<p class="text-bold title">Meet your
<span>Instructor</span></p>
<a href="pages/about-us/about.html"
><button class="button-61 text-bold text-center">
Know More
</button></a
>
</div>
<div class="line-long"></div>
<div class="instructor-content">
<div class="image-div">
<img src="images/circledp.webp" alt="Brayden mykhaltso" />
</div>
<div class="name-div">
<p class="name text-bold">Brayden mykhaltso</p>
<p class="designation text-bold">Founder, Anneden
Solutions</p>
</div>
</div>
<div class="description-div">
<p class="description">
Meet <span><i>Brayden mykhaltso</i></span
>, a dynamic individual driven by an insatiable curiosity
to explore
the ever-evolving world of technology. With a passion for
coding and
a deep-rooted love for teaching, Brayden stands out as a
proficient
coder and a dedicated mentor. He passionately shares his
knowledge
and insights with others to help them achieve their goals.
</p>
</div>
</div>
<div class="line-div"></div>
<div class="social-card-section">
<div class="social-card">
<div class="social-icon">
<a target="_blank"
href="https://www.youtube.com/@Anneden">
<span
style="
box-sizing: border-box;
display: block;
overflow: hidden;
width: initial;
height: initial;
background: none;
opacity: 1;
border: 0px;
margin: 0px;
padding: 0px;
position: relative;
"
>
<span
style="
box-sizing: border-box;
display: block;
width: initial;
height: initial;
background: none;
opacity: 1;
border: 0px;
margin: 0px;
padding: 100% 0px 0px;
"
></span>
<img
style="
position: absolute;
inset: 0px;
box-sizing: border-box;
padding: 0px;
border: none;
margin: auto;
display: block;
width: 0px;
height: 0px;
min-width: 100%;
max-width: 100%;
min-height: 100%;
max-height: 100%;
"
src="images/youtube.webp"
alt="Youtube Logo"
/>
</span>
</a>
</div>
<div class="social-text">
<a
class="text-link d-flex"
target="_blank"
href="https://www.youtube.com/@Anneden"
>
<div>
<svg
stroke="currentColor"
fill="currentColor"
stroke-width="0"
viewBox="0 0 24 24"
height="20"
width="20"
xmlns="http://www.w3.org/2000/svg"
style="color: rgb(255, 0, 0)"
>
<path
d="m13 3 3.293 3.293-7 7 1.414 1.414 7-7L21
11V3z"
></path>
<path
d="M19 19H5V5h7l-2-2H5c-1.103 0-2 .897-2 2v14c0
1.103.897 2 2 2h14c1.103 0 2-.897 2-2v-5l-2-2v7z"
></path>
</svg>
</div>
<p
style="color: rgb(255, 0, 0)"
class="margin-0 text-bold font-sans"
>
YouTube
</p>
</a>
</div>
</div>
<div class="social-card">
<div class="social-icon">
<a target="_blank"
href="https://www.instagram.com/Anneden/">
<span
style="
box-sizing: border-box;
display: block;
overflow: hidden;
width: initial;
height: initial;
background: none;
opacity: 1;
border: 0px;
margin: 0px;
padding: 0px;
position: relative;
"
>
<span
style="
box-sizing: border-box;
display: block;
width: initial;
height: initial;
background: none;
opacity: 1;
border: 0px;
margin: 0px;
padding: 100% 0px 0px;
"
></span>
<img
style="
position: absolute;
inset: 0px;
box-sizing: border-box;
padding: 0px;
border: none;
margin: auto;
display: block;
width: 0px;
height: 0px;
min-width: 100%;
max-width: 100%;
min-height: 100%;
max-height: 100%;
"
src="images/instagram.webp"
alt="Instagram Logo"
/>
</span>
</a>
</div>
<div class="social-text">
<a
class="text-link d-flex"
target="_blank"
href="https://www.instagram.com/Anneden/"
>
<div>
<svg
stroke="currentColor"
fill="currentColor"
stroke-width="0"
viewBox="0 0 24 24"
height="20"
width="20"
xmlns="http://www.w3.org/2000/svg"
style="color: #9f40ab"
>
<path
d="m13 3 3.293 3.293-7 7 1.414 1.414 7-7L21
11V3z"
></path>
<path
d="M19 19H5V5h7l-2-2H5c-1.103 0-2 .897-2 2v14c0
1.103.897 2 2 2h14c1.103 0 2-.897 2-2v-5l-2-2v7z"
></path>
</svg>
</div>
<p style="color: #9f40ab" class="margin-0 text-bold
font-sans">
Instagram
</p>
</a>
</div>
</div>
<div class="social-card">
<div class="social-icon">
<a target="_blank" href="https://www.linkedin.com/in/">
<span
style="
box-sizing: border-box;
display: block;
overflow: hidden;
width: initial;
height: initial;
background: none;
opacity: 1;
border: 0px;
margin: 0px;
padding: 0px;
position: relative;
"
>
<span
style="
box-sizing: border-box;
display: block;
width: initial;
height: initial;
background: none;
opacity: 1;
border: 0px;
margin: 0px;
padding: 100% 0px 0px;
"
></span>
<img
style="
position: absolute;
inset: 0px;
box-sizing: border-box;
padding: 0px;
border: none;
margin: auto;
display: block;
width: 0px;
height: 0px;
min-width: 100%;
max-width: 100%;
min-height: 100%;
max-height: 100%;
"
src="images/linkedin.webp"
alt="Linkedin Logo"
/>
</span>
</a>
</div>
<div class="social-text">
<a
class="text-link d-flex"
target="_blank"
href="https://www.linkedin.com/in/"
>
<div>
<svg
stroke="currentColor"
fill="currentColor"
stroke-width="0"
viewBox="0 0 24 24"
height="20"
width="20"
xmlns="http://www.w3.org/2000/svg"
style="color: rgb(0, 119, 181)"
>
<path
d="m13 3 3.293 3.293-7 7 1.414 1.414 7-7L21
11V3z"
></path>
<path
d="M19 19H5V5h7l-2-2H5c-1.103 0-2 .897-2 2v14c0
1.103.897 2 2 2h14c1.103 0 2-.897 2-2v-5l-2-2v7z"
></path>
</svg>
</div>
<p
style="color: rgb(0, 119, 181)"
class="margin-0 text-bold font-sans"
>
Linkedin
</p>
</a>
</div>
</div>
<div class="social-card">
<div class="social-icon">
<a target="_blank" href="https://github.com/">
<span
style="
box-sizing: border-box;
display: block;
overflow: hidden;
width: initial;
height: initial;
background: none;
opacity: 1;
border: 0px;
margin: 0px;
padding: 0px;
position: relative;
"
>
<span
style="
box-sizing: border-box;
display: block;
width: initial;
height: initial;
background: none;
opacity: 1;
border: 0px;
margin: 0px;
padding: 100% 0px 0px;
"
></span>
<img
id="gitlogo"
src="images/github-dark.webp"
style="
position: absolute;
inset: 0px;
box-sizing: border-box;
padding: 0px;
border: none;
margin: auto;
display: block;
width: 0px;
height: 0px;
min-width: 100%;
max-width: 100%;
min-height: 100%;
max-height: 100%;
"
alt="Github Logo"
/>
</span>
</a>
</div>
<div class="social-text">
<a
class="text-link d-flex"
target="_blank"
href="https://github.com/"
>
<div>
<svg
class="git-redirect"
stroke="currentColor"
fill="currentColor"
stroke-width="0"
viewBox="0 0 24 24"
height="20"
width="20"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="m13 3 3.293 3.293-7 7 1.414 1.414 7-7L21
11V3z"
></path>
<path
d="M19 19H5V5h7l-2-2H5c-1.103 0-2 .897-2 2v14c0
1.103.897 2 2 2h14c1.103 0 2-.897 2-2v-5l-2-2v7z"
></path>
</svg>
</div>
<p class="git-text margin-0 text-bold
font-sans">Github</p>
</a>
</div>
</div>
</div>
</div>
</main>
<div class="line-div"></div>
<footer>
<div class="super-container font-poppin">
<div class="components-outer-container">
<div class="footer-container">
<div class="first">
<div class="top">
<img id="footerLogo" src="images/logo.png" alt="" />
</div>
<div class="bottom">
<p class="text-white">
Anneden was started with a mission to provide
affordable &
high quality education for everyone. we wish to bring
all our
courses with top-notch content to our students at
pocket
friendly prices with lifetime access.
</p>
<p class="copyright">©2023 Anneden. All rights
reserved</p>
</div>
</div>
<div class="second">
<ul>
<li>
<a href="/#courses" class="footer-nav">Our
Courses</a>
</li>
<li>
<a href="/#blogs" class="footer-nav">Blogs</a>
</li>
<li>
<a
href="https://www.youtube.com/@Anneden"
target="_blank"
class="footer-nav"
>Community</a
>
</li>
<li>
<a href="/#social" class="footer-nav">Social
Media</a>
</li>
<li>
<a href="/#instructor" class="footer-nav">Mentors</a>
</li>
</ul>
</div>
<div class="third">
<div class="top">
<p class="text-white">Get in Touch</p>
<div class="social-icons">
<a
class="text-white"
href="https://www.linkedin.com/in/"
target="_blank"
rel="noreferrer"
>
<svg
stroke="currentColor"
fill="currentColor"
stroke-width="0"
viewBox="0 0 448 512"
height="1em"
width="1em"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M100.28 448H7.4V148.9h92.88zM53.79
108.1C24.09 108.1 0 83.5 0 53.8a53.79 53.79 0 0 1 107.58 0c0 29.7-24.1
54.3-53.79 54.3zM447.9 448h-92.68V302.4c0-34.7-.7-79.2-48.29-79.2-48.29
0-55.69 37.7-55.69 76.7V448h-92.78V148.9h89.08v40.8h1.3c12.4-23.5
42.69-48.3 87.88-48.3 94 0 111.28 61.9 111.28 142.3V448z"
></path>
</svg>
</a>
<a
class="text-white"
href="https://www.instagram.com/Anneden/"
target="_blank"
rel="noreferrer"
><svg
stroke="currentColor"
fill="currentColor"
stroke-width="0"
viewBox="0 0 16 16"
height="1em"
width="1em"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M8 0C5.829 0 5.556.01 4.703.048 3.85.088
3.269.222 2.76.42a3.917 3.917 0 0 0-1.417.923A3.927 3.927 0 0 0 .42
2.76C.222 3.268.087 3.85.048 4.7.01 5.555 0 5.827 0 8.001c0 2.172.01
2.444.048 3.297.04.852.174 1.433.372 1.942.205.526.478.972.923
1.417.444.445.89.719 1.416.923.51.198 1.09.333 1.942.372C5.555 15.99
5.827 16 8 16s2.444-.01 3.298-.048c.851-.04 1.434-.174 1.943-.372a3.916
3.916 0 0 0
1.416-.923c.445-.445.718-.891.923-1.417.197-.509.332-1.09.372-1.942C15.
99 10.445 16 10.173 16
8s-.01-2.445-.048-3.299c-.04-.851-.175-1.433-.372-1.941a3.926 3.926 0 0
0-.923-1.417A3.911 3.911 0 0 0
13.24.42c-.51-.198-1.092-.333-1.943-.372C10.443.01 10.172 0 7.998
0h.003zm-.717 1.442h.718c2.136 0 2.389.007 3.232.046.78.035 1.204.166
1.486.275.373.145.64.319.92.599.28.28.453.546.598.92.11.281.24.705.275
1.485.039.843.047 1.096.047 3.231s-.008 2.389-.047 3.232c-.035.78-.166
1.203-.275 1.485a2.47 2.47 0 0
1-.599.919c-.28.28-.546.453-.92.598-.28.11-.704.24-1.485.276-.843.038-1
.096.047-3.232.047s-2.39-.009-3.233-.047c-.78-.036-1.203-.166-1.485-.27
6a2.478 2.478 0 0 1-.92-.598 2.48 2.48 0 0
1-.6-.92c-.109-.281-.24-.705-.275-1.485-.038-.843-.046-1.096-.046-3.233
0-2.136.008-2.388.046-3.231.036-.78.166-1.204.276-1.486.145-.373.319-.6
4.599-.92.28-.28.546-.453.92-.598.282-.11.705-.24 1.485-.276.738-.034
1.024-.044 2.515-.045v.002zm4.988 1.328a.96.96 0 1 0 0 1.92.96.96 0 0 0
0-1.92zm-4.27 1.122a4.109 4.109 0 1 0 0 8.217 4.109 4.109 0 0 0
0-8.217zm0 1.441a2.667 2.667 0 1 1 0 5.334 2.667 2.667 0 0 1 0-5.334z"
></path>
</svg>
</a>
<a
class="text-white"
href="https://www.youtube.com/@Anneden"
target="_blank"
rel="noreferrer"
>
<svg
stroke="currentColor"
fill="currentColor"
stroke-width="0"
viewBox="0 0 16 16"
height="1em"
width="1em"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M8.051 1.999h.089c.822.003 4.987.033
6.11.335a2.01 2.01 0 0 1 1.415 1.42c.101.38.172.883.22
1.402l.01.104.022.26.008.104c.065.914.073 1.77.074
1.957v.075c-.001.194-.01 1.108-.082
2.06l-.008.105-.009.104c-.05.572-.124 1.14-.235 1.558a2.007 2.007 0 0
1-1.415 1.42c-1.16.312-5.569.334-6.18.335h-.142c-.309
0-1.587-.006-2.927-.052l-.17-.006-.087-.004-.171-.007-.171-.007c-1.11-.
049-2.167-.128-2.654-.26a2.007 2.007 0 0
1-1.415-1.419c-.111-.417-.185-.986-.235-1.558L.09 9.82l-.008-.104A31.4
31.4 0 0 1 0
7.68v-.123c.002-.215.01-.958.064-1.778l.007-.103.003-.052.008-.104.022-
.26.01-.104c.048-.519.119-1.023.22-1.402a2.007 2.007 0 0 1
1.415-1.42c.487-.13 1.544-.21
2.654-.26l.17-.007.172-.006.086-.003.171-.007A99.788 99.788 0 0 1 7.858
2h.193zM6.4 5.209v4.818l4.157-2.408L6.4 5.209z"
></path>
</svg>
</a>
</div>
</div>
<div class="bottom">
<p class="text-white">Contact Us</p>
<a href="mailto:[email protected]" class="text-white"
>[email protected]</a
>
</div>
</div>
</div>
</div>
</div>
</footer>
<script
src="https://unpkg.com/[email protected]/dist/typed.umd.js"></script>
<script>
var typed = new Typed(".typed_text", {
strings: ["For Your Future!", "For Your Success!", "For Your
Growth!"],
typeSpeed: 100,
backSpeed: 100,
loop: true,
});
</script>
<script src="script.js"></script>
</body>
</html>