From 861903ab811fbf7432b0a3d894d9e3b0e5f785a4 Mon Sep 17 00:00:00 2001 From: crahmouni <149743112+crahmouni@users.noreply.github.com> Date: Mon, 9 Sep 2024 22:19:18 +0200 Subject: [PATCH 1/3] Update index.html MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Código HTML clon de NPM --- index.html | 91 ++++++++++++++++++++++++++++++++++++++++++++++++------ 1 file changed, 82 insertions(+), 9 deletions(-) diff --git a/index.html b/index.html index a2d9c01ab..211d51d27 100644 --- a/index.html +++ b/index.html @@ -1,9 +1,82 @@ -NPM Clone Nifty Penguin Magic npm Enterprise Products Solutions Resources Docs Support Search Join Log In Build amazing -things Essential JavaScript development tools that help you go to market faster and build powerful applications using -modern open source code. See plans Join for free Bring the best of open source to your company npm is the tool used by -over 11,000,000 JavaScript developers around the world. Your developers already use it. Your company depends on it. -Create an Org and get more out of the tools your team already knows and loves. Zero configuration Create an org, add -your team, and start collaborating. Nothing to configure, set up, or manage. Team management Control who has access to -what modules within your team namespace using straightforward team management capabilities. Familiar features npm Orgs -has 100% parity with all the public npm registry features your developers already use. npm audit Enjoy the security -auditing features built into the npm client, a zero-friction way to make open source software safer. Create an Org + + + + + + + NPM Clone + + + +
+
+ + +
+
+ NPM Logo +
+ magnifying glass + + +
+
+ Join + Log In +
+
+
+ +
+
+

Build amazing things

+

Essential JavaScript development tools that help you go to market faster and build powerful applications using modern open source code.

+ See plans + Join for free +
+ +
+ Triangle Hexagon +
+ +
+

Bring the best of open source to your company

+

npm is the tool used by over 11,000,000 JavaScript developers around the world. Your developers already use it. Your company depends on it.

+
+
+ Zero Configuration +

Zero configuration

+

Create an org, add your team, and start collaborating. Nothing to configure, set up, or manage.

+
+
+ Team Management +

Team management

+

Control who has access to what modules within your team namespace using straightforward team management capabilities.

+
+
+ Familiar Features +

Familiar features

+

npm Orgs has 100% parity with all the public npm registry features your developers already use.

+
+
+ NPM Audit +

npm audit

+

Enjoy the security auditing features built into the npm client, a zero-friction way to make open source software safer.

+
+
+
+
+ + From 5344c29818d637d5cfd9e61219a7aae1e097843d Mon Sep 17 00:00:00 2001 From: crahmouni <149743112+crahmouni@users.noreply.github.com> Date: Mon, 9 Sep 2024 22:22:36 +0200 Subject: [PATCH 2/3] Create style.css MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Código css clon de NPM --- style.css | 240 ++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 240 insertions(+) create mode 100644 style.css diff --git a/style.css b/style.css new file mode 100644 index 000000000..833d73b95 --- /dev/null +++ b/style.css @@ -0,0 +1,240 @@ +@import url('https://fonts.googleapis.com/css?family=Poppins'); + +body { + font-family: 'Poppins', sans-serif; + margin: 0; + padding: 0; + box-sizing: border-box; + background-color: #f9f9f9; +} + +header { + background-color: #fff; + color: #333; + padding: 10px 0; + border-bottom: 1px solid #ddd; +} + +.header-top { + display: flex; + justify-content: space-between; + align-items: center; + padding: 0 25px; + border-bottom: 1px solid lightgray; +} + +.logo img { + width: 20px; + margin-right: 10px; +} + +nav { + width: 600px; +} + +nav ul { + list-style: none; + display: flex; + justify-content: space-between; + align-items: center; +} + +nav a { + text-decoration: none; + color: black; + font-weight: bold; + transition: color 0.3s; +} + +nav ul li a:hover { + color: #FB3E44; +} + +.blackHeart { + width: 20px; + margin-right: 1rem; +} + +.header-bottom { + display: flex; + align-items: center; + justify-content: space-between; + padding: 15px 25px; + background-color: #f5f5f5; + box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1); +} + +.logo-main { + max-width: 100px; +} + +.search-bar { + display: flex; + align-items: center; + gap: 10px; + border: 1px solid #ddd; + border-radius: 4px; + padding: 5px 10px; + background-color: #fff; +} + +.icon-search { + width: 18px; +} + +.search-bar input { + border: none; + outline: none; + flex-grow: 1; + color: rgba(0, 0, 0, 0.05); +} + +.search-bar button { + padding: 8px 15px; + background-color: #FB3E44; + border: none; + color: white; + border-radius: 4px; + cursor: pointer; + transition: background-color 0.3s; +} + +.search-bar button:hover { + background-color: #d42f3a; +} + +.header-buttons a { + padding: 8px 15px; + margin-left: 10px; + border-radius: 4px; + text-decoration: none; + font-weight: bold; + color: white; + transition: background-color 0.3s; +} + +.button-primary { + background-color: #FB3E44; +} + +.button-secondary { + background-color: #4CAF50; +} + +.button-primary:hover { + background-color: #d42f3a; +} + +.button-secondary:hover { + background-color: #388E3C; +} + +main { + padding: 40px 20px; + text-align: center; +} + +#intro { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + height: 600px; + background-color: rgba(232, 217, 217, 0.3); + padding: 60px 20px; + border-radius: 8px; +} + +#intro h1 { + font-size: 3rem; + margin-bottom: 20px; + color: #333; + font-weight: bold; +} + +#intro p { + font-size: 1.2rem; + margin-bottom: 30px; + color: #666; +} + +.button-primary, .button-secondary { + padding: 15px 30px; + margin: 10px 15px; + border-radius: 5px; + text-decoration: none; + color: white; + display: inline-block; + font-size: 1rem; +} + +.button-primary { + background-color: #FB3B49; + box-shadow: 8px 8px 0 rgba(251, 59, 73, 0.2); +} + +#features { + margin-top: 60px; + padding: 40px 20px; + background-color: white; + border-radius: 8px; + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05); +} + +#features h2 { + background-color: rgba(255, 204, 53, 0.4); + padding: 10px; + font-style: italic; + margin-bottom: 20px; +} + +.feature-grid { + display: grid; + grid-template-columns: repeat(4, 1fr); + gap: 20px; + margin-top: 30px; +} + +.feature-item { + padding: 20px; + background-color: #fff; + border: 1px solid #ddd; + border-radius: 5px; + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); +} + +.feature-item img { + width: 60px; + margin-bottom: 15px; +} + +.feature-item h3 { + color: #ED1C24; + font-weight: bold; + margin-bottom: 10px; +} + +.hexagon-image { + width: 150px; + margin: 40px auto; + display: block; +} + +#section3 h3 { + color: #ED1C24; +} + +.create-org-button { + background-color: black; + color: white; + padding: 15px 30px; + border: none; + border-radius: 5px; + box-shadow: 8px 8px 0 rgba(128, 83, 35, 0.2); + cursor: pointer; + transition: background-color 0.3s; +} + +.create-org-button:hover { + background-color: #333; +} From 20a7609cb775148025f1099170cc26edfac21a21 Mon Sep 17 00:00:00 2001 From: crahmouni <149743112+crahmouni@users.noreply.github.com> Date: Mon, 9 Sep 2024 22:26:35 +0200 Subject: [PATCH 3/3] Update index.html --- index.html | 1 + 1 file changed, 1 insertion(+) diff --git a/index.html b/index.html index 211d51d27..4a35d090c 100644 --- a/index.html +++ b/index.html @@ -1,6 +1,7 @@ +