Обработка css webpack. Верстка главного блока
This commit is contained in:
grinikita
parent
21d8e8289f
commit
520ad38f8d
230
package-lock.json
generated
230
package-lock.json
generated
@ -15,7 +15,9 @@
|
||||
},
|
||||
"devDependencies": {
|
||||
"copy-webpack-plugin": "^13.0.0",
|
||||
"css-loader": "^7.1.2",
|
||||
"html-webpack-plugin": "^5.6.3",
|
||||
"style-loader": "^4.0.0",
|
||||
"ts-loader": "^9.5.2",
|
||||
"typescript": "^5.8.2"
|
||||
}
|
||||
@ -660,6 +662,42 @@
|
||||
"node": ">= 8"
|
||||
}
|
||||
},
|
||||
"node_modules/css-loader": {
|
||||
"version": "7.1.2",
|
||||
"resolved": "https://registry.npmjs.org/css-loader/-/css-loader-7.1.2.tgz",
|
||||
"integrity": "sha512-6WvYYn7l/XEGN8Xu2vWFt9nVzrCn39vKyTEFf/ExEyoksJjjSZV/0/35XPlMbpnr6VGhZIUg5yJrL8tGfes/FA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"icss-utils": "^5.1.0",
|
||||
"postcss": "^8.4.33",
|
||||
"postcss-modules-extract-imports": "^3.1.0",
|
||||
"postcss-modules-local-by-default": "^4.0.5",
|
||||
"postcss-modules-scope": "^3.2.0",
|
||||
"postcss-modules-values": "^4.0.0",
|
||||
"postcss-value-parser": "^4.2.0",
|
||||
"semver": "^7.5.4"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">= 18.12.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/webpack"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@rspack/core": "0.x || 1.x",
|
||||
"webpack": "^5.27.0"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"@rspack/core": {
|
||||
"optional": true
|
||||
},
|
||||
"webpack": {
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/css-select": {
|
||||
"version": "4.3.0",
|
||||
"resolved": "https://registry.npmjs.org/css-select/-/css-select-4.3.0.tgz",
|
||||
@ -690,6 +728,19 @@
|
||||
"url": "https://github.com/sponsors/fb55"
|
||||
}
|
||||
},
|
||||
"node_modules/cssesc": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz",
|
||||
"integrity": "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"bin": {
|
||||
"cssesc": "bin/cssesc"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=4"
|
||||
}
|
||||
},
|
||||
"node_modules/dom-converter": {
|
||||
"version": "0.2.0",
|
||||
"resolved": "https://registry.npmjs.org/dom-converter/-/dom-converter-0.2.0.tgz",
|
||||
@ -1161,6 +1212,19 @@
|
||||
"entities": "^2.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/icss-utils": {
|
||||
"version": "5.1.0",
|
||||
"resolved": "https://registry.npmjs.org/icss-utils/-/icss-utils-5.1.0.tgz",
|
||||
"integrity": "sha512-soFhflCVWLfRNOPU3iv5Z9VUdT44xFRbzjLsEzSr5AQmgqPMTHdU3PMT1Cf1ssx8fLNJDA1juftYl+PUcv3MqA==",
|
||||
"dev": true,
|
||||
"license": "ISC",
|
||||
"engines": {
|
||||
"node": "^10 || ^12 || >= 14"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"postcss": "^8.1.0"
|
||||
}
|
||||
},
|
||||
"node_modules/import-local": {
|
||||
"version": "3.2.0",
|
||||
"resolved": "https://registry.npmjs.org/import-local/-/import-local-3.2.0.tgz",
|
||||
@ -1426,6 +1490,25 @@
|
||||
"url": "https://github.com/sponsors/ljharb"
|
||||
}
|
||||
},
|
||||
"node_modules/nanoid": {
|
||||
"version": "3.3.11",
|
||||
"resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.11.tgz",
|
||||
"integrity": "sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w==",
|
||||
"dev": true,
|
||||
"funding": [
|
||||
{
|
||||
"type": "github",
|
||||
"url": "https://github.com/sponsors/ai"
|
||||
}
|
||||
],
|
||||
"license": "MIT",
|
||||
"bin": {
|
||||
"nanoid": "bin/nanoid.cjs"
|
||||
},
|
||||
"engines": {
|
||||
"node": "^10 || ^12 || ^13.7 || ^14 || >=15.0.1"
|
||||
}
|
||||
},
|
||||
"node_modules/neo-async": {
|
||||
"version": "2.6.2",
|
||||
"resolved": "https://registry.npmjs.org/neo-async/-/neo-async-2.6.2.tgz",
|
||||
@ -1594,6 +1677,119 @@
|
||||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/postcss": {
|
||||
"version": "8.5.3",
|
||||
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.3.tgz",
|
||||
"integrity": "sha512-dle9A3yYxlBSrt8Fu+IpjGT8SY8hN0mlaA6GY8t0P5PjIOZemULz/E2Bnm/2dcUOena75OTNkHI76uZBNUUq3A==",
|
||||
"dev": true,
|
||||
"funding": [
|
||||
{
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/postcss/"
|
||||
},
|
||||
{
|
||||
"type": "tidelift",
|
||||
"url": "https://tidelift.com/funding/github/npm/postcss"
|
||||
},
|
||||
{
|
||||
"type": "github",
|
||||
"url": "https://github.com/sponsors/ai"
|
||||
}
|
||||
],
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"nanoid": "^3.3.8",
|
||||
"picocolors": "^1.1.1",
|
||||
"source-map-js": "^1.2.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": "^10 || ^12 || >=14"
|
||||
}
|
||||
},
|
||||
"node_modules/postcss-modules-extract-imports": {
|
||||
"version": "3.1.0",
|
||||
"resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-3.1.0.tgz",
|
||||
"integrity": "sha512-k3kNe0aNFQDAZGbin48pL2VNidTF0w4/eASDsxlyspobzU3wZQLOGj7L9gfRe0Jo9/4uud09DsjFNH7winGv8Q==",
|
||||
"dev": true,
|
||||
"license": "ISC",
|
||||
"engines": {
|
||||
"node": "^10 || ^12 || >= 14"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"postcss": "^8.1.0"
|
||||
}
|
||||
},
|
||||
"node_modules/postcss-modules-local-by-default": {
|
||||
"version": "4.2.0",
|
||||
"resolved": "https://registry.npmjs.org/postcss-modules-local-by-default/-/postcss-modules-local-by-default-4.2.0.tgz",
|
||||
"integrity": "sha512-5kcJm/zk+GJDSfw+V/42fJ5fhjL5YbFDl8nVdXkJPLLW+Vf9mTD5Xe0wqIaDnLuL2U6cDNpTr+UQ+v2HWIBhzw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"icss-utils": "^5.0.0",
|
||||
"postcss-selector-parser": "^7.0.0",
|
||||
"postcss-value-parser": "^4.1.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": "^10 || ^12 || >= 14"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"postcss": "^8.1.0"
|
||||
}
|
||||
},
|
||||
"node_modules/postcss-modules-scope": {
|
||||
"version": "3.2.1",
|
||||
"resolved": "https://registry.npmjs.org/postcss-modules-scope/-/postcss-modules-scope-3.2.1.tgz",
|
||||
"integrity": "sha512-m9jZstCVaqGjTAuny8MdgE88scJnCiQSlSrOWcTQgM2t32UBe+MUmFSO5t7VMSfAf/FJKImAxBav8ooCHJXCJA==",
|
||||
"dev": true,
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"postcss-selector-parser": "^7.0.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": "^10 || ^12 || >= 14"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"postcss": "^8.1.0"
|
||||
}
|
||||
},
|
||||
"node_modules/postcss-modules-values": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmjs.org/postcss-modules-values/-/postcss-modules-values-4.0.0.tgz",
|
||||
"integrity": "sha512-RDxHkAiEGI78gS2ofyvCsu7iycRv7oqw5xMWn9iMoR0N/7mf9D50ecQqUo5BZ9Zh2vH4bCUR/ktCqbB9m8vJjQ==",
|
||||
"dev": true,
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"icss-utils": "^5.0.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": "^10 || ^12 || >= 14"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"postcss": "^8.1.0"
|
||||
}
|
||||
},
|
||||
"node_modules/postcss-selector-parser": {
|
||||
"version": "7.1.0",
|
||||
"resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-7.1.0.tgz",
|
||||
"integrity": "sha512-8sLjZwK0R+JlxlYcTuVnyT2v+htpdrjDOKuMcOVdYjt52Lh8hWRYpxBPoKx/Zg+bcjc3wx6fmQevMmUztS/ccA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"cssesc": "^3.0.0",
|
||||
"util-deprecate": "^1.0.2"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=4"
|
||||
}
|
||||
},
|
||||
"node_modules/postcss-value-parser": {
|
||||
"version": "4.2.0",
|
||||
"resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz",
|
||||
"integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/pretty-error": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmjs.org/pretty-error/-/pretty-error-4.0.0.tgz",
|
||||
@ -1803,6 +1999,16 @@
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/source-map-js": {
|
||||
"version": "1.2.1",
|
||||
"resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz",
|
||||
"integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==",
|
||||
"dev": true,
|
||||
"license": "BSD-3-Clause",
|
||||
"engines": {
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/source-map-support": {
|
||||
"version": "0.5.21",
|
||||
"resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.21.tgz",
|
||||
@ -1826,6 +2032,23 @@
|
||||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/style-loader": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmjs.org/style-loader/-/style-loader-4.0.0.tgz",
|
||||
"integrity": "sha512-1V4WqhhZZgjVAVJyt7TdDPZoPBPNHbekX4fWnCJL1yQukhCeZhJySUL+gL9y6sNdN95uEOS83Y55SqHcP7MzLA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">= 18.12.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/webpack"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"webpack": "^5.27.0"
|
||||
}
|
||||
},
|
||||
"node_modules/supports-color": {
|
||||
"version": "8.1.1",
|
||||
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-8.1.1.tgz",
|
||||
@ -2046,6 +2269,13 @@
|
||||
"browserslist": ">= 4.21.0"
|
||||
}
|
||||
},
|
||||
"node_modules/util-deprecate": {
|
||||
"version": "1.0.2",
|
||||
"resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
|
||||
"integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/utila": {
|
||||
"version": "0.4.0",
|
||||
"resolved": "https://registry.npmjs.org/utila/-/utila-0.4.0.tgz",
|
||||
|
||||
@ -16,7 +16,9 @@
|
||||
},
|
||||
"devDependencies": {
|
||||
"copy-webpack-plugin": "^13.0.0",
|
||||
"css-loader": "^7.1.2",
|
||||
"html-webpack-plugin": "^5.6.3",
|
||||
"style-loader": "^4.0.0",
|
||||
"ts-loader": "^9.5.2",
|
||||
"typescript": "^5.8.2"
|
||||
}
|
||||
|
||||
BIN
src/images/img.png
Normal file
BIN
src/images/img.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 117 KiB |
BIN
src/images/img_1.png
Normal file
BIN
src/images/img_1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 127 KiB |
@ -1,6 +1,7 @@
|
||||
{{#> views/layout}}
|
||||
{{> views/header }}
|
||||
<main>
|
||||
{{> views/main-banner.html }}
|
||||
{{> views/carusel }}
|
||||
</main>
|
||||
{{/views/layout}}
|
||||
@ -1,5 +1,6 @@
|
||||
body {
|
||||
margin: 0;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
html {
|
||||
@ -14,7 +15,8 @@ html {
|
||||
}
|
||||
|
||||
.container {
|
||||
padding: 0 97px;
|
||||
padding-left: 97px;
|
||||
padding-right: 97px;
|
||||
}
|
||||
|
||||
.button {
|
||||
@ -28,7 +30,12 @@ html {
|
||||
line-height: 24px;
|
||||
text-transform: uppercase;
|
||||
cursor: pointer;
|
||||
border: none;
|
||||
border: 1.5px solid #000000;
|
||||
}
|
||||
|
||||
.button-secondary {
|
||||
background-color: white;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.button[disabled] {
|
||||
@ -40,6 +47,8 @@ html {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-family: var(--font-inter);
|
||||
padding-top: 45px;
|
||||
padding-bottom: 45px;
|
||||
}
|
||||
|
||||
.logo {
|
||||
@ -99,7 +108,7 @@ html {
|
||||
border-radius: 24px;
|
||||
width: 100%;
|
||||
aspect-ratio: 1;
|
||||
background: center / cover no-repeat url('https://s3-alpha-sig.figma.com/img/b82f/55d0/61c522d86567e3c5ea1f39ddf68ae4bc?Expires=1743379200&Key-Pair-Id=APKAQ4GOSFWCW27IBOMQ&Signature=UlO4-Fsc27zhQo9T9Tl8fhCSVyxM4GHu6DkUtWgi881ggrnY9uHKNdVvhg2GuSS7ItYldxw9FhYRjgcBrwKBvnf4XLjw8YjkZ8584NLVxfH-POsN8O2eh9gyxEBEgaF~AVwwnNmnRpPN2JFnfcRUIihkRrhZA7IjDRxNY1CbPHB5j~AP9wlWhI6P2TqaXaJj~8JRZPx1YBpGWfrSCgLfgQejNNi58FvkkX1Hkvm0aICdebCSqwFrq~sLI6Rbj5H-QgF~2AxU3EGiBzdaCvMXfBx3xpZIvHGkuSeYlhdlU-KFNmjF9u3VPg7c5S~IvPMIOmvWhwX-GguAGxPZe4tksw__'), #F8F8F8;
|
||||
background: center / cover no-repeat url('./images/img.png'), #F8F8F8;
|
||||
}
|
||||
|
||||
.nft-card__content {
|
||||
@ -179,3 +188,26 @@ html {
|
||||
.nft-card-container .nft-card {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.lr-button {
|
||||
width: 166px;
|
||||
height: 69px;
|
||||
box-shadow: 0px 43.12px 34.49px -25.87px #0F0F0F1F;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background: #FCFCFD;
|
||||
border-radius: 17.25px;
|
||||
}
|
||||
.lr-button button {
|
||||
width: 100%;
|
||||
border: none;
|
||||
background: none;
|
||||
}
|
||||
.lr-button-delimiter {
|
||||
width: 2px;
|
||||
height: 25px;
|
||||
background: #E6E8EC;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
@import "views/main-banner.css";
|
||||
@ -1,5 +1,5 @@
|
||||
<header class="header container">
|
||||
<a href="index.html"><img class="logo" src="../src/images/logo.svg" alt=""></a>
|
||||
<a href="index.html"><img class="logo" src="./images/logo.svg" alt=""></a>
|
||||
<nav>
|
||||
<ul class="nav-list">
|
||||
<li><a href="./discover.html">Discover</a></li>
|
||||
|
||||
115
src/views/main-banner.css
Normal file
115
src/views/main-banner.css
Normal file
@ -0,0 +1,115 @@
|
||||
.hero {
|
||||
position: relative;
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
padding-top: 54px;
|
||||
padding-bottom: 143px;
|
||||
}
|
||||
|
||||
.hero-main {
|
||||
margin-right: 48px;
|
||||
}
|
||||
|
||||
.hero-line {
|
||||
width: 195px;
|
||||
border-top: 1px solid #201F1F;
|
||||
opacity: 0.2;
|
||||
margin-top: 12px;
|
||||
}
|
||||
|
||||
.hero-title {
|
||||
margin-top: 10px;
|
||||
margin-bottom: 12px;
|
||||
font-weight: 600;
|
||||
font-size: 75px;
|
||||
line-height: 120%;
|
||||
letter-spacing: -3px;
|
||||
}
|
||||
|
||||
.hero-description {
|
||||
font-family: var(--font-inter);
|
||||
padding: 0;
|
||||
|
||||
font-weight: 400;
|
||||
font-size: 18px;
|
||||
line-height: 28px;
|
||||
letter-spacing: 0px;
|
||||
text-align: justify;
|
||||
}
|
||||
|
||||
.hero-description__bold {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.hero-buttons {
|
||||
margin-top: 45px;
|
||||
display: flex;
|
||||
gap: 23px;
|
||||
}
|
||||
|
||||
.hero-cub1 {
|
||||
position: relative;
|
||||
width: 391px;
|
||||
height: 394px;
|
||||
border-radius: 25px;
|
||||
background: center / cover no-repeat url('../images/img.png'), #F8F8F8;
|
||||
}
|
||||
.hero-cub1::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 25px;
|
||||
background: center / cover no-repeat url('../images/img.png'), #F8F8F8;
|
||||
transform: translateY(25px);
|
||||
|
||||
filter: blur(83.7px);
|
||||
}
|
||||
|
||||
.hero-cub2 {
|
||||
position: absolute;
|
||||
top: 181px;
|
||||
left: calc(100% + 38px);
|
||||
width: 320px;
|
||||
height: 322px;
|
||||
border-radius: 25px;
|
||||
background: center / cover no-repeat url('../images/img_1.png'), #F8F8F8;
|
||||
}
|
||||
.hero-cub2::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 25px;
|
||||
background: center / cover no-repeat url('../images/img_1.png'), #F8F8F8;
|
||||
transform: translateY(25px);
|
||||
|
||||
filter: blur(83.7px);
|
||||
}
|
||||
|
||||
.cub1-arrow {
|
||||
position: absolute;
|
||||
left: calc(100% + 23px);
|
||||
top: 41px;
|
||||
transform: rotate(-3.08deg);
|
||||
}
|
||||
|
||||
.hero-dots {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.hero-cubs {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-self: start;
|
||||
}
|
||||
|
||||
.hero-cubs .lr-button {
|
||||
margin-top: 71px;
|
||||
}
|
||||
203
src/views/main-banner.html
Normal file
203
src/views/main-banner.html
Normal file
@ -0,0 +1,203 @@
|
||||
<div class="container hero">
|
||||
<div class="hero-main">
|
||||
<div class="hero-line"></div>
|
||||
<h1 class="hero-title">Discover And Create NFTs</h1>
|
||||
<p class="hero-description">Discover, Create and Sell NFTs On Our NFT Marketplace With Over Thousands Of NFTs
|
||||
And Get a <span class="hero-description__bold">$20 bonus</span>.</p>
|
||||
<div class="hero-buttons">
|
||||
<button class="button">Explore More</button>
|
||||
<button class="button button-secondary">create NFT</button>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="hero-cubs">
|
||||
<div class="hero-cub1">
|
||||
<svg class="cub1-arrow" width="131" height="136" viewBox="0 0 131 136" fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M15.6507 43.2949C32.4339 30.7255 51.9743 23.0115 72.683 28.6293C91.3749 33.7001 103.143 49.6308 90.5396 69.3323C84.5735 78.6586 71.8706 85.1866 61.8852 79.874C50.7606 73.9554 59.5288 59.017 66.6505 54.7089C83.2839 44.6468 106.696 49.3237 118.212 68.8676C131.849 92.0121 108.785 103.532 108.769 103.344"
|
||||
stroke="black" stroke-width="3.37884" stroke-miterlimit="1.5" stroke-linecap="round"
|
||||
stroke-linejoin="round"/>
|
||||
<path d="M19.2682 18.3819C19.8774 20.8064 19.5256 23.2335 19.2862 25.677C18.5006 33.7006 15.3552 42.0307 9.71151 47.2931C17.1379 44.0369 27.7921 42.6188 34.5374 48.3345"
|
||||
stroke="black" stroke-width="3.37884" stroke-miterlimit="1.5" stroke-linecap="round"
|
||||
stroke-linejoin="round"/>
|
||||
</svg>
|
||||
<div class="hero-cub2"></div>
|
||||
</div>
|
||||
<div class="lr-button">
|
||||
<button class="lr-button-left"><svg width="27" height="27" viewBox="0 0 27 27" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M11.2397 8.39036C10.8023 7.98657 10.1203 8.01384 9.71654 8.45128L6.23402 12.224C5.85287 12.6369 5.85287 13.2733 6.23401 13.6862L9.71653 17.459C10.1203 17.8965 10.8023 17.9237 11.2397 17.5199C11.6772 17.1161 11.7045 16.4342 11.3007 15.9967L9.48802 14.033L19.9611 14.033C20.5565 14.033 21.0391 13.5504 21.0391 12.9551C21.0391 12.3598 20.5565 11.8772 19.9611 11.8772L9.48805 11.8772L11.3007 9.91356C11.7044 9.47612 11.6772 8.79416 11.2397 8.39036Z" fill="#929292"/>
|
||||
</svg>
|
||||
</button>
|
||||
<div class="lr-button-delimiter"></div>
|
||||
<button class="lr-button-right"><svg width="27" height="27" viewBox="0 0 27 27" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M15.7603 8.39036C16.1977 7.98657 16.8797 8.01384 17.2835 8.45128L20.766 12.224C21.1471 12.6369 21.1471 13.2733 20.766 13.6862L17.2835 17.459C16.8797 17.8965 16.1977 17.9237 15.7603 17.5199C15.3228 17.1161 15.2955 16.4342 15.6993 15.9967L17.512 14.033L7.03886 14.033C6.44354 14.033 5.96094 13.5504 5.96094 12.9551C5.96094 12.3598 6.44354 11.8772 7.03886 11.8772L17.5119 11.8772L15.6993 9.91356C15.2956 9.47612 15.3228 8.79416 15.7603 8.39036Z" fill="#23262F"/>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<svg class="hero-dots" width="120" height="400" viewBox="0 0 120 400" fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<g opacity="0.5">
|
||||
<rect y="207.423" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="18.9062" y="207.423" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="37.8145" y="207.423" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="56.7217" y="207.423" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="75.6279" y="207.423" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="94.5361" y="207.423" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="113.443" y="207.423" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect y="226.36" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="18.9062" y="226.36" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="37.8145" y="226.36" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="56.7217" y="226.36" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="75.6279" y="226.36" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="94.5361" y="226.36" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="113.443" y="226.36" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect y="245.3" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="18.9062" y="245.3" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="37.8145" y="245.3" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="56.7217" y="245.3" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="75.6279" y="245.3" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="94.5361" y="245.3" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="113.443" y="245.3" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect y="264.238" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="18.9062" y="264.238" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="37.8145" y="264.238" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="56.7217" y="264.238" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="75.6279" y="264.238" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="94.5361" y="264.238" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="113.443" y="264.238" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect y="283.176" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="18.9062" y="283.176" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="37.8145" y="283.176" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="56.7217" y="283.176" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="75.6279" y="283.176" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="94.5361" y="283.176" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="113.443" y="283.176" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect y="302.114" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="18.9062" y="302.114" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="37.8145" y="302.114" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="56.7217" y="302.114" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="75.6279" y="302.114" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="94.5361" y="302.114" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="113.443" y="302.114" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect y="321.052" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="18.9062" y="321.052" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="37.8145" y="321.052" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="56.7217" y="321.052" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="75.6279" y="321.052" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="94.5361" y="321.052" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="113.443" y="321.052" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect y="339.989" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="18.9062" y="339.991" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="37.8145" y="339.991" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="56.7217" y="339.991" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="75.6279" y="339.991" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="94.5361" y="339.991" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="113.443" y="339.991" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect y="358.929" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="18.9062" y="358.929" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="37.8145" y="358.929" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="56.7217" y="358.929" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="75.6279" y="358.929" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="94.5361" y="358.929" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="113.443" y="358.929" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect y="377.866" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="18.9062" y="377.866" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="37.8145" y="377.866" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="56.7217" y="377.866" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="75.6279" y="377.866" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="94.5361" y="377.866" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="113.443" y="377.866" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect y="396.805" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="18.9062" y="396.806" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="37.8145" y="396.806" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="56.7217" y="396.806" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="75.6279" y="396.806" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="94.5361" y="396.806" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="113.443" y="396.806" width="2.83607" height="2.84073" fill="black"/>
|
||||
</g>
|
||||
<g opacity="0.5">
|
||||
<rect width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="18.9062" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="37.8145" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="56.7217" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="75.6279" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="94.5361" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="113.443" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect y="18.9375" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="18.9062" y="18.9375" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="37.8145" y="18.9375" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="56.7217" y="18.9375" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="75.6279" y="18.9375" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="94.5361" y="18.9375" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="113.443" y="18.9375" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect y="37.877" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="18.9062" y="37.877" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="37.8145" y="37.877" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="56.7217" y="37.877" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="75.6279" y="37.877" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="94.5361" y="37.877" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="113.443" y="37.877" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect y="56.8154" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="18.9062" y="56.8154" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="37.8145" y="56.8154" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="56.7217" y="56.8154" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="75.6279" y="56.8154" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="94.5361" y="56.8154" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="113.443" y="56.8154" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect y="75.7529" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="18.9062" y="75.7529" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="37.8145" y="75.7529" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="56.7217" y="75.7529" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="75.6279" y="75.7529" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="94.5361" y="75.7529" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="113.443" y="75.7529" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect y="94.6914" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="18.9062" y="94.6914" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="37.8145" y="94.6914" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="56.7217" y="94.6914" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="75.6279" y="94.6914" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="94.5361" y="94.6914" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="113.443" y="94.6914" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect y="113.629" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="18.9062" y="113.629" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="37.8145" y="113.629" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="56.7217" y="113.629" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="75.6279" y="113.629" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="94.5361" y="113.629" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="113.443" y="113.629" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect y="132.566" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="18.9062" y="132.568" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="37.8145" y="132.568" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="56.7217" y="132.568" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="75.6279" y="132.568" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="94.5361" y="132.568" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="113.443" y="132.568" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect y="151.506" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="18.9062" y="151.506" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="37.8145" y="151.506" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="56.7217" y="151.506" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="75.6279" y="151.506" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="94.5361" y="151.506" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="113.443" y="151.506" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect y="170.443" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="18.9062" y="170.443" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="37.8145" y="170.443" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="56.7217" y="170.443" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="75.6279" y="170.443" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="94.5361" y="170.443" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="113.443" y="170.443" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect y="189.382" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="18.9062" y="189.383" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="37.8145" y="189.383" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="56.7217" y="189.383" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="75.6279" y="189.383" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="94.5361" y="189.383" width="2.83607" height="2.84073" fill="black"/>
|
||||
<rect x="113.443" y="189.383" width="2.83607" height="2.84073" fill="black"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
@ -16,10 +16,17 @@ module.exports = {
|
||||
rules: [
|
||||
{ test: /\.(ts|tsx)$/, loader: "ts-loader" },
|
||||
{
|
||||
test: /\.hbs$/,
|
||||
test: /\.hbs|html$/,
|
||||
loader: 'handlebars-loader',
|
||||
},
|
||||
]
|
||||
{
|
||||
test: /\.css$/i,
|
||||
use: [
|
||||
{ loader: "style-loader" },
|
||||
{ loader: "css-loader" },
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
plugins: [
|
||||
new HtmlWebpackPlugin({
|
||||
@ -36,7 +43,6 @@ module.exports = {
|
||||
}),
|
||||
new CopyPlugin({
|
||||
patterns: [
|
||||
{from: "./src/style.css", to: "style.css"},
|
||||
{from: "./src/images", to: "images"},
|
||||
],
|
||||
})
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user