forked from ironhack-labs/lab-html-exercise
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
98 lines (81 loc) · 11.4 KB
/
index.html
File metadata and controls
98 lines (81 loc) · 11.4 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
<!DOCTYPE html>
<html>
<head>
<title>NPM clone</title>
<meta charset= "UTF-8"/>
<link rel="stylesheet" href="./style.css" />
</head>
<body>
<header>
<div>
<div>
<img class="blackheart" src="images/black-heart.png">
<span>Neverending Pun Machine</span>
</div>
<div>
<nav>
<ul>
<li><a href ="#npm-Enterprise">npm Enterprise</a></li>
<li><a href ="#products">Products</a></li>
<li><a href ="#solutions">Solutions</a></li>
<li><a href ="#resources">Resources</a></li>
<li><a href ="#docs">Docs</a></li>
<li><a href ="#support">Support</a></li>
</ul>
</nav>
</div>
</div>
<div class= "bar">
<img class="npmlogo" src="images/npm-logo.png">
<form class="search-form" action="/some-url" method="post">
<img class="lupa" src="images/magnifying-glass.png">
<input class="inputsearch" type="name" name="name" id="name" placeholder="Search packages"></input>
<button class="search" type="submit" value="Search">Search</button>
</form>
<a class="join" href =#join>Join</a>
<a class="login" href =#log-in>Log In</a>
</div>
</header>
<section id="first">
<h1 class="header1">Build amazing things</h1>
<p class="text1">Essential JavaScript development tools that help you <br> go to market faster and build powerful applications <br> using
modern open source code.
</p>
<div class="buttonsfirst">
<a class="seeplan" href =#see-plans>See plans</a>
<a class="joinforfree" href =#join-for-free>Join for free</a>
</div>
</section>
<section id="second">
<div class="hexagon">
<svg class="hexagonimage" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 100.79 90.68"><defs><style>.cls-1{isolation:isolate;}.cls-2{opacity:0.8;mix-blend-mode:luminosity;}.cls-3,.cls-4,.cls-5,.cls-6{stroke:#c18752;stroke-linejoin:round;stroke-width:0.27px;}.cls-3,.cls-6{opacity:0.3;}.cls-3{fill:url(#Orange_2);}.cls-4,.cls-5{opacity:0.2;}.cls-4{fill:url(#Orange_2-2);}.cls-5{fill:url(#Orange_2-3);}.cls-6{fill:url(#Orange_2-4);}</style><linearGradient id="Orange_2" x1="-1973.93" y1="-513.04" x2="-1932.27" y2="-513.04" gradientTransform="translate(1966.33 -514.02) rotate(-30.81)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#e3bca9"/><stop offset="0.5" stop-color="#d8a089"/><stop offset="1" stop-color="#cf8c72"/></linearGradient><linearGradient id="Orange_2-2" x1="-1973.59" y1="-528.66" x2="-1890.35" y2="-528.66" xlink:href="#Orange_2"/><linearGradient id="Orange_2-3" x1="-1973.59" y1="-473.16" x2="-1890.35" y2="-473.16" xlink:href="#Orange_2"/><linearGradient id="Orange_2-4" x1="-1931.88" y1="-488.65" x2="-1890.22" y2="-488.65" xlink:href="#Orange_2"/></defs><title>best-open</title><g class="cls-1"><g id="Layer_2" data-name="Layer 2"><g id="Layer_2-2" data-name="Layer 2"><g class="cls-2"><polygon class="cls-3" points="52.05 48.55 28.59 90.54 0.14 42.84 23.6 0.85 52.05 48.55"/><polygon class="cls-4" points="48.58 42.09 0.48 42.77 23.89 0.82 71.98 0.14 48.58 42.09"/><polygon class="cls-5" points="77.01 89.76 28.91 90.44 52.31 48.48 100.41 47.81 77.01 89.76"/><polygon class="cls-6" points="100.65 47.96 77.19 89.95 48.74 42.25 72.2 0.26 100.65 47.96"/></g></g></g></g></svg></div>
<h2 class="h2second">Bring the best of open source to your company</h2>
<p class="psecond">npm is the tool used by over 11,000,000 JavaScript developers around the world. Your developers <br> already use it. Your company depends on it. Create an Org and get more out of the tools your <br> team already knows and loves.</p>
</section>
<section id="third">
<div class="advantages">
<article>
<svg class="image3" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 25.99 21.21"><title>zero-configuration</title><g id="Layer_2" data-name="Layer 2"><g id="Layer_2-2" data-name="Layer 2"><path d="M23,19.36l-3.79-4.59L22.58,14a.55.55,0,0,0,.43-.5.54.54,0,0,0-.33-.56L13.47,8.84a.56.56,0,0,0-.59.08.59.59,0,0,0-.19.56L15,19.3a.59.59,0,0,0,.5.44A.57.57,0,0,0,16,19.4l1.41-3.19,3.79,4.59A1.13,1.13,0,0,0,23,19.36Z"/><path d="M2.14,11.32A2.14,2.14,0,0,1,0,9.18v-7A2.14,2.14,0,0,1,2.14,0H23.85A2.14,2.14,0,0,1,26,2.14v7a2.14,2.14,0,0,1-1.66,2.09l-2.11-.71h1.63a1.38,1.38,0,0,0,1.38-1.38v-7A1.38,1.38,0,0,0,23.85.76H2.14A1.38,1.38,0,0,0,.76,2.14v7a1.38,1.38,0,0,0,1.38,1.38h8.55l.26.76Z"/></g></g></svg>
<h3 class="header3">Zero configuration</h3>
<p class="p3">Create an org, add your team,<br> and start collaborating. <br> Nothing to configure, set up, or <br> manage.</p>
</article>
<article>
<svg class="image3" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 29.4 27.38"><title>team-management</title><g id="Layer_2" data-name="Layer 2"><g id="Layer_2-2" data-name="Layer 2"><path d="M14.75,5.21c-3.45,0-3.36-5.4.11-5.2C18.14.19,18,5.21,14.75,5.21Zm-.06-.89h.25l.22,0,.2-.06A1.68,1.68,0,0,0,15.73,4h0a2.73,2.73,0,0,0,.35-.33,1.87,1.87,0,0,0,.33-.75,1.88,1.88,0,0,0,0-.58h0a2.42,2.42,0,0,0-.1-.36,2.82,2.82,0,0,0-.21-.38L16,1.5a2.85,2.85,0,0,0-.25-.25A2,2,0,0,0,15.4,1,1.7,1.7,0,0,0,14.81.9h-.27l-.06.22,0-.22a1.78,1.78,0,0,0-.54.17,2.26,2.26,0,0,0-.26.16,1.38,1.38,0,0,0-.3.29l.11.2-.13-.18a1.83,1.83,0,0,0-.23.38,2,2,0,0,0-.12.42,2,2,0,0,0,0,.49,2,2,0,0,0,.11.42,2.64,2.64,0,0,0,.2.37l.08.09a2.21,2.21,0,0,0,.26.24,1.8,1.8,0,0,0,.35.21l.05,0h0A1.38,1.38,0,0,0,14.69,4.32Z"/><path d="M11.73,10.05c-1.69,0-1.49-2.32-1.32-3.49a3.07,3.07,0,0,1,1.18-2c.69-.48,1.28.31.57.7a2.6,2.6,0,0,0-.38.36l.12.1v.1l-.14-.16a2.28,2.28,0,0,0-.44,1l0,.2c0,.65,0,1.3,0,1.94l0,.13h0l0,0h0l.09.11.08,0,0-.11.1-.08,0,.21.13,0h6.08l.13,0,.08,0h0l.05,0L18.08,9l0,0h0l0-.07,0-.12a20,20,0,0,0,0-2h0A4.74,4.74,0,0,0,18,6.15a3.17,3.17,0,0,0-.27-.47l-.14.1.09-.17c-.18-.22-.68-.49-.74-.77-.12-.55.41-.6.77-.42a3.15,3.15,0,0,1,1.35,2.81c0,1.24.16,2.71-1.45,2.82C15.67,10.19,13.68,10.05,11.73,10.05Z"/><path d="M4.45,22.48c-3.46,0-3.36-5.41.11-5.21C7.84,17.45,7.7,22.48,4.45,22.48Zm0-.9h.24a2.17,2.17,0,0,0,.42-.11,2,2,0,0,0,.72-.54,1.7,1.7,0,0,0,.33-1.33h0a2.42,2.42,0,0,0-.1-.36,2.82,2.82,0,0,0-.21-.38l-.08-.09a2.85,2.85,0,0,0-.25-.25,2,2,0,0,0-.37-.21,2,2,0,0,0-.42-.12l-.17,0H4.23l-.05.22,0-.22a1.7,1.7,0,0,0-.54.17,2.26,2.26,0,0,0-.26.16,2.13,2.13,0,0,0-.31.29l.12.2-.13-.18a2.14,2.14,0,0,0-.23.38,2,2,0,0,0-.12.42,2.68,2.68,0,0,0,0,.49,2.9,2.9,0,0,0,.12.42,2.08,2.08,0,0,0,.2.36l0,0v0h0l0,.05.25.25a2.38,2.38,0,0,0,.41.23h0a2.54,2.54,0,0,0,.37.1H4.4Z"/><path d="M1.43,27.31C-.26,27.31-.06,25,.11,23.82a3,3,0,0,1,1.18-2c.69-.48,1.28.32.57.7a2.22,2.22,0,0,0-.38.37l.12.09V23l-.14-.16a2.55,2.55,0,0,0-.3.5,4.28,4.28,0,0,0-.15.51l0,.21V26l0,.14H1l.12.15,0,0v0l.11,0H7.45l.14,0,.11-.05.08-.07,0-.05h0l0-.07,0-.12a20,20,0,0,0,0-2.05h0a2.73,2.73,0,0,0-.15-.56,2.42,2.42,0,0,0-.26-.47L7.3,23l.11-.14c-.18-.22-.7-.51-.76-.8-.14-.67.55-.57.89-.33a3.14,3.14,0,0,1,1.22,2.52c.06,1.26.23,2.9-1.42,3C5.39,27.46,3.38,27.31,1.43,27.31Z"/><path d="M25.05,22.48c-3.45,0-3.36-5.41.11-5.21C28.44,17.45,28.3,22.48,25.05,22.48Zm-.05-.9h.24a2.17,2.17,0,0,0,.42-.11l.2-.1.18-.11h0a3.51,3.51,0,0,0,.34-.33,1.88,1.88,0,0,0,.21-.36h0a2.78,2.78,0,0,0,.12-.38l-.17,0h.18l-.1,0,.1,0a1.6,1.6,0,0,0,0-.49h0a2.12,2.12,0,0,0-.1-.36,2.82,2.82,0,0,0-.21-.38l-.08-.1-.25-.24a2,2,0,0,0-.37-.21,2,2,0,0,0-.42-.12l-.17,0h-.27l-.06.22,0-.22a1.78,1.78,0,0,0-.54.17,2.26,2.26,0,0,0-.26.16,2.06,2.06,0,0,0-.3.29l.11.2-.13-.18a2.14,2.14,0,0,0-.23.38,1.67,1.67,0,0,0-.12.91,2,2,0,0,0,.11.42,1.75,1.75,0,0,0,.29.47l.25.24a2,2,0,0,0,.35.2l.05,0h0a2.09,2.09,0,0,0,.43.11H25Z"/><path d="M22,27.31c-1.69,0-1.49-2.32-1.32-3.49a3.07,3.07,0,0,1,1.18-2c.69-.48,1.28.32.57.7a2.65,2.65,0,0,0-.38.37l.12.09V23l-.14-.16a3.1,3.1,0,0,0-.29.5,2.29,2.29,0,0,0-.15.51l0,.21V26l0,.14h0l.11.15,0,0v0l.11,0h6.19l.14,0,.12-.05.07-.07,0-.05h0l0-.07,0-.12a20,20,0,0,0,0-2.05h0a5.12,5.12,0,0,0-.15-.56,4.31,4.31,0,0,0-.26-.47l-.15.1L28,22.9c-.19-.22-.71-.51-.77-.8-.14-.67.55-.56.9-.33a3.17,3.17,0,0,1,1.22,2.52c.05,1.26.22,2.9-1.43,3C26,27.46,24,27.31,22,27.31Z"/><path d="M14.74,17.46c-.79,0-.45-2.4-.45-2.84s-.33-2.85.45-2.83.45,2.29.45,2.74S15.53,17.46,14.74,17.46Z"/><path d="M10.6,19.84c-.78,0-.34-.73,0-1s.95-.55,1.42-.82l1.71-1c.24-.14.69-.53,1-.51.74.05.38.69,0,.94a13.26,13.26,0,0,1-1.37.8l-1.79,1c-.26.15-.68.51-1,.51Z"/><path d="M18.87,19.84c-.33,0-.74-.36-1-.51l-1.71-1c-.47-.27-1-.51-1.42-.82s-.76-.92,0-1c.29,0,.71.34.93.47l1.69,1c.5.28,1,.54,1.51.86S19.67,19.84,18.87,19.84Z"/></g></g></svg>
<h3 class="header3">Team management</h3>
<p class="p3">Control who has access to <br>what modules within your<br> team namespace using <br>straightforward team <br>management capabilities.</p>
</article>
<article>
<svg class="image3" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 29.59 22.75"><defs><style>.cls-1{fill:none;stroke:#000;stroke-miterlimit:10;}</style></defs><title>feature-parity</title><g id="Layer_2" data-name="Layer 2"><g id="Layer_2-2" data-name="Layer 2"><path class="cls-1" d="M29.59,16.62H0"/><rect x="0.31" width="11.93" height="6.88" rx="2.42"/><rect x="0.31" y="8" width="11.93" height="6.88" rx="2.42"/><rect x="16.35" width="11.93" height="6.88" rx="2.42"/><rect x="16.35" y="8" width="11.93" height="6.88" rx="2.42"/><polyline points="14.47 19.04 15.9 21.37 16.75 22.75 12.2 22.75 14.48 19.04"/></g></g></svg>
<h3 class="header3">Familiar features</h3>
<p class="p3">npm Orgs has 100% parity with <br>all the public npm registry<br> features your developers <br>already use.</p>
</article>
<article>
<svg class="image3" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 26.98 21.26"><defs><style>.cls-1{fill-rule:evenodd;}</style></defs><title>npm-audit</title><g id="Layer_2" data-name="Layer 2"><g id="Layer_2-2" data-name="Layer 2"><path d="M0,15.53V5.81a5.82,5.82,0,0,1,11.63-.08h3.81A5.77,5.77,0,1,1,27,5.81v9.72a5.77,5.77,0,0,1-11.54,0V11.89H11.63v3.64A5.82,5.82,0,0,1,0,15.53Zm16.74-.09A4.52,4.52,0,0,0,21.17,20a4.38,4.38,0,0,0,4.42-4.42,4.11,4.11,0,0,0-1.3-3.12,4.38,4.38,0,0,0-6.24,0,4.62,4.62,0,0,0-1.31,3Zm-15.35,0a4.43,4.43,0,1,0,8.85.09,4.15,4.15,0,0,0-1.3-3.12,4.39,4.39,0,0,0-6.25,0,4.25,4.25,0,0,0-1.3,3Z"/><path class="cls-1" d="M6.94,12.06c1.82.78,3.21,2.69,1.82,4.51Z"/><path class="cls-1" d="M22.56,12.06c1.82.78,3.21,2.69,1.82,4.51Z"/></g></g></svg>
<h3 class="header3">npm audit</h3>
<p class="p3">Enjoy the security auditing<br> features built into the npm<br> client, a zero-friction way to <br>make open source software <br>safer.</p>
</article>
</div>
<div><center><a class="createanorg" href =#createanorg>Create an Org</a></center></div>
</section>
</body>
</html>