HornCoding
Open in Telegram
Welcome to HornCoding Support Admin ABA Bank: 500 372 116 Hat Chhenghorn Thank you.
Show more347
Subscribers
No data24 hours
-17 days
-530 days
Posts Archive
347
</svg>
</span>
<svg xmlns="http://www.w3.org/2000/svg" style="display: none">
<symbol id="ck-6" viewBox="0 0 22 22">
<path
fill="none"
d="M5.5,11.3L9,14.8L20.2,3.3l0,0c-0.5-1-1.5-1.8-2.7-1.8h-13c-1.7,0-3,1.3-3,3v13c0,1.7,1.3,3,3,3h13 c1.7,0,3-1.3,3-3v-13c0-0.4-0.1-0.8-0.3-1.2"
/>
</symbol>
</svg>
</div>
</div>
</div>
<p class="code-comments">
Code In The Comments π¨βπ»
</p>
<p class="bottom-bar">
<span class="modern-frontend-developer">
<span class="emph">Modern Frontend Developer</span>: <span class="emph">HTML</span> and <span class="emph">CSS</span> Course
</span>
<span class="learning-link">
<img src="assets/atheros-learning.png" alt="arrow icon" />
learning.atheros.ai
</span>
</p>
</div>
</body>
</html>
`347
`<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Checkboxes</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="container">
<div class="top-bar">
<div class="profile-wrapper">
<img
class="profile"
src="assets/david_mraz_resized.jpg"
alt="profile picture"
/>
<p>@davidm_ai</p>
</div>
</div>
<h1><span class="emph">Checkboxes</span></h1>
<div class="items">
<div class="item-wrapper">
<div>1</div>
<input type="checkbox" class="ck-1">
</div>
<div class="item-wrapper">
<div>2</div>
<label class="ck-2">
<input type="checkbox">
<svg viewBox="0 0 68 68" height="32px" width="32px">
<path d="M 0 16 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 16 L 32 48 L 64 16 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 16" pathLength="575.0541381835938" class="path"></path>
</svg>
</label>
</div>
<div class="item-wrapper">
<div>3</div>
<div class="ck-3">
<input id="form-checkbox-1" name="checkbox" type="checkbox">
<label for="form-checkbox-1">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 200 200">
<mask fill="white" id="checkbox-mask"><rect height="200" width="200"></rect></mask>
<rect mask="url(#checkbox-mask)" stroke-width="30" height="200" width="200"></rect>
<path stroke-width="15" d="M52 111.018L76.9867 136L149 64"></path>
</svg>
</label>
</div>
</div>
<div class="item-wrapper">
<div>4</div>
<div class="ck-5">
<input class="inp-cbx" id="morning" type="checkbox" />
<label class="cbx" for="morning">
<span>
<svg width="14px" height="14px">
<use xlink:href="#check-4"></use>
</svg>
</span>
</label>
<svg class="inline-svg">
<symbol id="check-4" viewbox="0 0 14 14">
<polyline points="1.5 6 4.5 9 10.5 1"></polyline>
</symbol>
</svg>
</div>
</div>
<div class="item-wrapper">
<div>5</div>
<div class="ck-4">
<label>
<input type="checkbox" />
<span class="checkbox"></span>
</label>
</div>
</div>
<div class="item-wrapper">
<div>6</div>
<div class="ck-6">
<span class="checkbox">
<input type="checkbox" />
<svg>
<use xlink:href="#ck-6" class="checkbox"></use>347
</svg>
</span>
<svg xmlns="http://www.w3.org/2000/svg" style="display: none">
<symbol id="ck-6" viewBox="0 0 22 22">
<path
fill="none"
d="M5.5,11.3L9,14.8L20.2,3.3l0,0c-0.5-1-1.5-1.8-2.7-1.8h-13c-1.7,0-3,1.3-3,3v13c0,1.7,1.3,3,3,3h13 c1.7,0,3-1.3,3-3v-13c0-0.4-0.1-0.8-0.3-1.2"
/>
</symbol>
</svg>
</div>
</div>
</div>
<p class="code-comments">
Code In The Comments π¨βπ»
</p>
<p class="bottom-bar">
<span class="modern-frontend-developer">
<span class="emph">Modern Frontend Developer</span>: <span class="emph">HTML</span> and <span class="emph">CSS</span> Course
</span>
<span class="learning-link">
<img src="assets/atheros-learning.png" alt="arrow icon" />
learning.atheros.ai
</span>
</p>
</div>
</body>
</html>
`347
`<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Checkboxes</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="container">
<div class="top-bar">
<div class="profile-wrapper">
<img
class="profile"
src="assets/david_mraz_resized.jpg"
alt="profile picture"
/>
<p>@davidm_ai</p>
</div>
</div>
<h1><span class="emph">Checkboxes</span></h1>
<div class="items">
<div class="item-wrapper">
<div>1</div>
<input type="checkbox" class="ck-1">
</div>
<div class="item-wrapper">
<div>2</div>
<label class="ck-2">
<input type="checkbox">
<svg viewBox="0 0 68 68" height="32px" width="32px">
<path d="M 0 16 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 16 L 32 48 L 64 16 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 16" pathLength="575.0541381835938" class="path"></path>
</svg>
</label>
</div>
<div class="item-wrapper">
<div>3</div>
<div class="ck-3">
<input id="form-checkbox-1" name="checkbox" type="checkbox">
<label for="form-checkbox-1">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 200 200">
<mask fill="white" id="checkbox-mask"><rect height="200" width="200"></rect></mask>
<rect mask="url(#checkbox-mask)" stroke-width="30" height="200" width="200"></rect>
<path stroke-width="15" d="M52 111.018L76.9867 136L149 64"></path>
</svg>
</label>
</div>
</div>
<div class="item-wrapper">
<div>4</div>
<div class="ck-5">
<input class="inp-cbx" id="morning" type="checkbox" />
<label class="cbx" for="morning">
<span>
<svg width="14px" height="14px">
<use xlink:href="#check-4"></use>
</svg>
</span>
</label>
<svg class="inline-svg">
<symbol id="check-4" viewbox="0 0 14 14">
<polyline points="1.5 6 4.5 9 10.5 1"></polyline>
</symbol>
</svg>
</div>
</div>
<div class="item-wrapper">
<div>5</div>
<div class="ck-4">
<label>
<input type="checkbox" />
<span class="checkbox"></span>
</label>
</div>
</div>
<div class="item-wrapper">
<div>6</div>
<div class="ck-6">
<span class="checkbox">
<input type="checkbox" />
<svg>
<use xlink:href="#ck-6" class="checkbox"></use>
347
β¨οΈ Scroll-driven animations in CSS!!
Lets you create partial or full-page visuals with elements animating into and within the viewport, also known as scrollytelling, for dynamic visual impact.
347
+4
β¨οΈ How to Use Rem Units in CSS!!
Rem units in CSS can be used for setting font sizes, margins, padding, widths, and heights relative to the root element's font-size.
347
β¨οΈ Conic Gradients in CSS!!
Used to create circular gradients with color transitions rotating around a center point. They're ideal for effects like color wheels.
347
Today we cover CSS positions, from position absolute, fixed and sticky
#css #frontend #developer #webdev
347
HornCoding - Udemy Free
ββββββββββββ
=> Title: Introduction To Python Programming
=> Link: https://www.udemy.com/course/pythonforbeginnersintro/?LSNPUBID=0F1O0otUXQc&ranEAID=0F1O0otUXQc&ranMID=47901&ranSiteID=0F1O0otUXQc-chdTZ1avV366pLmB1FgWGQ&utm_medium=udemyads&utm_source=aff-campaign
=> Title: React with Redux, React-Router, Hooks and Auth0
=> Link: https://www.udemy.com/course/modern-react/?LSNPUBID=0F1O0otUXQc&ranEAID=0F1O0otUXQc&ranMID=47901&ranSiteID=0F1O0otUXQc-sIqYV8kqld9BrlEzotG95Q&utm_medium=udemyads&utm_source=aff-campaign
=> Title: Learn To Build A User Login System Using NodeJS
=> Link: https://www.eduonix.com/courses/Web-Development/learn-to-build-a-user-login-system-using-nodejs
