mirror of
https://github.com/task-17-lct/new-front.git
synced 2024-11-10 22:36:34 +03:00
add landing
This commit is contained in:
ilia
parent
a91cb23f16
commit
cb8f3db3ec
|
|
@ -1,4 +1,10 @@
|
|||
/** @type {import('next').NextConfig} */
|
||||
const path = require('path')
|
||||
const nextConfig = {}
|
||||
|
||||
module.exports = nextConfig
|
||||
module.exports = {
|
||||
sassOptions: {
|
||||
includePaths: [path.join(__dirname, 'styles')],
|
||||
},
|
||||
...nextConfig
|
||||
}
|
||||
|
|
|
|||
236
package-lock.json
generated
236
package-lock.json
generated
|
|
@ -8,6 +8,7 @@
|
|||
"name": "tours",
|
||||
"version": "0.1.0",
|
||||
"dependencies": {
|
||||
"@next/font": "^13.4.12",
|
||||
"@types/node": "20.4.5",
|
||||
"@types/react": "18.2.17",
|
||||
"@types/react-dom": "18.2.7",
|
||||
|
|
@ -17,6 +18,9 @@
|
|||
"react": "18.2.0",
|
||||
"react-dom": "18.2.0",
|
||||
"typescript": "5.1.6"
|
||||
},
|
||||
"devDependencies": {
|
||||
"sass": "^1.64.1"
|
||||
}
|
||||
},
|
||||
"node_modules/@aashutoshrathi/word-wrap": {
|
||||
|
|
@ -133,6 +137,11 @@
|
|||
"glob": "7.1.7"
|
||||
}
|
||||
},
|
||||
"node_modules/@next/font": {
|
||||
"version": "13.4.12",
|
||||
"resolved": "https://registry.npmjs.org/@next/font/-/font-13.4.12.tgz",
|
||||
"integrity": "sha512-w/ygNFuscvvFKFTMoIqhU8Kaq1wM6x4XEu9bwzJaj8G7aloH866TUPeCgiKf+M/ACpMKfRahQa06REcg6T3CyA=="
|
||||
},
|
||||
"node_modules/@next/swc-darwin-arm64": {
|
||||
"version": "13.4.12",
|
||||
"resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-13.4.12.tgz",
|
||||
|
|
@ -522,6 +531,19 @@
|
|||
"url": "https://github.com/chalk/ansi-styles?sponsor=1"
|
||||
}
|
||||
},
|
||||
"node_modules/anymatch": {
|
||||
"version": "3.1.3",
|
||||
"resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.3.tgz",
|
||||
"integrity": "sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==",
|
||||
"devOptional": true,
|
||||
"dependencies": {
|
||||
"normalize-path": "^3.0.0",
|
||||
"picomatch": "^2.0.4"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">= 8"
|
||||
}
|
||||
},
|
||||
"node_modules/argparse": {
|
||||
"version": "2.0.1",
|
||||
"resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz",
|
||||
|
|
@ -701,6 +723,15 @@
|
|||
"node": ">=0.6"
|
||||
}
|
||||
},
|
||||
"node_modules/binary-extensions": {
|
||||
"version": "2.2.0",
|
||||
"resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz",
|
||||
"integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==",
|
||||
"devOptional": true,
|
||||
"engines": {
|
||||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/bplist-parser": {
|
||||
"version": "0.2.0",
|
||||
"resolved": "https://registry.npmjs.org/bplist-parser/-/bplist-parser-0.2.0.tgz",
|
||||
|
|
@ -811,6 +842,45 @@
|
|||
"url": "https://github.com/chalk/chalk?sponsor=1"
|
||||
}
|
||||
},
|
||||
"node_modules/chokidar": {
|
||||
"version": "3.5.3",
|
||||
"resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.3.tgz",
|
||||
"integrity": "sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw==",
|
||||
"devOptional": true,
|
||||
"funding": [
|
||||
{
|
||||
"type": "individual",
|
||||
"url": "https://paulmillr.com/funding/"
|
||||
}
|
||||
],
|
||||
"dependencies": {
|
||||
"anymatch": "~3.1.2",
|
||||
"braces": "~3.0.2",
|
||||
"glob-parent": "~5.1.2",
|
||||
"is-binary-path": "~2.1.0",
|
||||
"is-glob": "~4.0.1",
|
||||
"normalize-path": "~3.0.0",
|
||||
"readdirp": "~3.6.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">= 8.10.0"
|
||||
},
|
||||
"optionalDependencies": {
|
||||
"fsevents": "~2.3.2"
|
||||
}
|
||||
},
|
||||
"node_modules/chokidar/node_modules/glob-parent": {
|
||||
"version": "5.1.2",
|
||||
"resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
|
||||
"integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
|
||||
"devOptional": true,
|
||||
"dependencies": {
|
||||
"is-glob": "^4.0.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">= 6"
|
||||
}
|
||||
},
|
||||
"node_modules/client-only": {
|
||||
"version": "0.0.1",
|
||||
"resolved": "https://registry.npmjs.org/client-only/-/client-only-0.0.1.tgz",
|
||||
|
|
@ -1663,6 +1733,20 @@
|
|||
"resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
|
||||
"integrity": "sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw=="
|
||||
},
|
||||
"node_modules/fsevents": {
|
||||
"version": "2.3.2",
|
||||
"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
|
||||
"integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
|
||||
"dev": true,
|
||||
"hasInstallScript": true,
|
||||
"optional": true,
|
||||
"os": [
|
||||
"darwin"
|
||||
],
|
||||
"engines": {
|
||||
"node": "^8.16.0 || ^10.6.0 || >=11.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/function-bind": {
|
||||
"version": "1.1.1",
|
||||
"resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz",
|
||||
|
|
@ -1937,6 +2021,12 @@
|
|||
"node": ">= 4"
|
||||
}
|
||||
},
|
||||
"node_modules/immutable": {
|
||||
"version": "4.3.1",
|
||||
"resolved": "https://registry.npmjs.org/immutable/-/immutable-4.3.1.tgz",
|
||||
"integrity": "sha512-lj9cnmB/kVS0QHsJnYKD1uo3o39nrbKxszjnqS9Fr6NB7bZzW45U6WSGBPKXDL/CvDKqDNPA4r3DoDQ8GTxo2A==",
|
||||
"devOptional": true
|
||||
},
|
||||
"node_modules/import-fresh": {
|
||||
"version": "3.3.0",
|
||||
"resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.0.tgz",
|
||||
|
|
@ -2011,6 +2101,18 @@
|
|||
"url": "https://github.com/sponsors/ljharb"
|
||||
}
|
||||
},
|
||||
"node_modules/is-binary-path": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
|
||||
"integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==",
|
||||
"devOptional": true,
|
||||
"dependencies": {
|
||||
"binary-extensions": "^2.0.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/is-boolean-object": {
|
||||
"version": "1.1.2",
|
||||
"resolved": "https://registry.npmjs.org/is-boolean-object/-/is-boolean-object-1.1.2.tgz",
|
||||
|
|
@ -2527,6 +2629,15 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"node_modules/normalize-path": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz",
|
||||
"integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==",
|
||||
"devOptional": true,
|
||||
"engines": {
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/npm-run-path": {
|
||||
"version": "5.1.0",
|
||||
"resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-5.1.0.tgz",
|
||||
|
|
@ -2904,6 +3015,18 @@
|
|||
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
|
||||
"integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
|
||||
},
|
||||
"node_modules/readdirp": {
|
||||
"version": "3.6.0",
|
||||
"resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz",
|
||||
"integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==",
|
||||
"devOptional": true,
|
||||
"dependencies": {
|
||||
"picomatch": "^2.2.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=8.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/regenerator-runtime": {
|
||||
"version": "0.13.11",
|
||||
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz",
|
||||
|
|
@ -3128,6 +3251,23 @@
|
|||
"url": "https://github.com/sponsors/ljharb"
|
||||
}
|
||||
},
|
||||
"node_modules/sass": {
|
||||
"version": "1.64.1",
|
||||
"resolved": "https://registry.npmjs.org/sass/-/sass-1.64.1.tgz",
|
||||
"integrity": "sha512-16rRACSOFEE8VN7SCgBu1MpYCyN7urj9At898tyzdXFhC+a+yOX5dXwAR7L8/IdPJ1NB8OYoXmD55DM30B2kEQ==",
|
||||
"devOptional": true,
|
||||
"dependencies": {
|
||||
"chokidar": ">=3.0.0 <4.0.0",
|
||||
"immutable": "^4.0.0",
|
||||
"source-map-js": ">=0.6.2 <2.0.0"
|
||||
},
|
||||
"bin": {
|
||||
"sass": "sass.js"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=14.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/scheduler": {
|
||||
"version": "0.23.0",
|
||||
"resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.0.tgz",
|
||||
|
|
@ -3736,6 +3876,11 @@
|
|||
"glob": "7.1.7"
|
||||
}
|
||||
},
|
||||
"@next/font": {
|
||||
"version": "13.4.12",
|
||||
"resolved": "https://registry.npmjs.org/@next/font/-/font-13.4.12.tgz",
|
||||
"integrity": "sha512-w/ygNFuscvvFKFTMoIqhU8Kaq1wM6x4XEu9bwzJaj8G7aloH866TUPeCgiKf+M/ACpMKfRahQa06REcg6T3CyA=="
|
||||
},
|
||||
"@next/swc-darwin-arm64": {
|
||||
"version": "13.4.12",
|
||||
"resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-13.4.12.tgz",
|
||||
|
|
@ -3960,6 +4105,16 @@
|
|||
"color-convert": "^2.0.1"
|
||||
}
|
||||
},
|
||||
"anymatch": {
|
||||
"version": "3.1.3",
|
||||
"resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.3.tgz",
|
||||
"integrity": "sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==",
|
||||
"devOptional": true,
|
||||
"requires": {
|
||||
"normalize-path": "^3.0.0",
|
||||
"picomatch": "^2.0.4"
|
||||
}
|
||||
},
|
||||
"argparse": {
|
||||
"version": "2.0.1",
|
||||
"resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz",
|
||||
|
|
@ -4091,6 +4246,12 @@
|
|||
"resolved": "https://registry.npmjs.org/big-integer/-/big-integer-1.6.51.tgz",
|
||||
"integrity": "sha512-GPEid2Y9QU1Exl1rpO9B2IPJGHPSupF5GnVIP0blYvNOMer2bTvSWs1jGOUg04hTmu67nmLsQ9TBo1puaotBHg=="
|
||||
},
|
||||
"binary-extensions": {
|
||||
"version": "2.2.0",
|
||||
"resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz",
|
||||
"integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==",
|
||||
"devOptional": true
|
||||
},
|
||||
"bplist-parser": {
|
||||
"version": "0.2.0",
|
||||
"resolved": "https://registry.npmjs.org/bplist-parser/-/bplist-parser-0.2.0.tgz",
|
||||
|
|
@ -4160,6 +4321,33 @@
|
|||
"supports-color": "^7.1.0"
|
||||
}
|
||||
},
|
||||
"chokidar": {
|
||||
"version": "3.5.3",
|
||||
"resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.3.tgz",
|
||||
"integrity": "sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw==",
|
||||
"devOptional": true,
|
||||
"requires": {
|
||||
"anymatch": "~3.1.2",
|
||||
"braces": "~3.0.2",
|
||||
"fsevents": "~2.3.2",
|
||||
"glob-parent": "~5.1.2",
|
||||
"is-binary-path": "~2.1.0",
|
||||
"is-glob": "~4.0.1",
|
||||
"normalize-path": "~3.0.0",
|
||||
"readdirp": "~3.6.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"glob-parent": {
|
||||
"version": "5.1.2",
|
||||
"resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
|
||||
"integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
|
||||
"devOptional": true,
|
||||
"requires": {
|
||||
"is-glob": "^4.0.1"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"client-only": {
|
||||
"version": "0.0.1",
|
||||
"resolved": "https://registry.npmjs.org/client-only/-/client-only-0.0.1.tgz",
|
||||
|
|
@ -4800,6 +4988,13 @@
|
|||
"resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
|
||||
"integrity": "sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw=="
|
||||
},
|
||||
"fsevents": {
|
||||
"version": "2.3.2",
|
||||
"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
|
||||
"integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"function-bind": {
|
||||
"version": "1.1.1",
|
||||
"resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz",
|
||||
|
|
@ -4981,6 +5176,12 @@
|
|||
"resolved": "https://registry.npmjs.org/ignore/-/ignore-5.2.4.tgz",
|
||||
"integrity": "sha512-MAb38BcSbH0eHNBxn7ql2NH/kX33OkB3lZ1BNdh7ENeRChHTYsTvWrMubiIAMNS2llXEEgZ1MUOBtXChP3kaFQ=="
|
||||
},
|
||||
"immutable": {
|
||||
"version": "4.3.1",
|
||||
"resolved": "https://registry.npmjs.org/immutable/-/immutable-4.3.1.tgz",
|
||||
"integrity": "sha512-lj9cnmB/kVS0QHsJnYKD1uo3o39nrbKxszjnqS9Fr6NB7bZzW45U6WSGBPKXDL/CvDKqDNPA4r3DoDQ8GTxo2A==",
|
||||
"devOptional": true
|
||||
},
|
||||
"import-fresh": {
|
||||
"version": "3.3.0",
|
||||
"resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.0.tgz",
|
||||
|
|
@ -5037,6 +5238,15 @@
|
|||
"has-bigints": "^1.0.1"
|
||||
}
|
||||
},
|
||||
"is-binary-path": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
|
||||
"integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==",
|
||||
"devOptional": true,
|
||||
"requires": {
|
||||
"binary-extensions": "^2.0.0"
|
||||
}
|
||||
},
|
||||
"is-boolean-object": {
|
||||
"version": "1.1.2",
|
||||
"resolved": "https://registry.npmjs.org/is-boolean-object/-/is-boolean-object-1.1.2.tgz",
|
||||
|
|
@ -5364,6 +5574,12 @@
|
|||
"zod": "3.21.4"
|
||||
}
|
||||
},
|
||||
"normalize-path": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz",
|
||||
"integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==",
|
||||
"devOptional": true
|
||||
},
|
||||
"npm-run-path": {
|
||||
"version": "5.1.0",
|
||||
"resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-5.1.0.tgz",
|
||||
|
|
@ -5611,6 +5827,15 @@
|
|||
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
|
||||
"integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
|
||||
},
|
||||
"readdirp": {
|
||||
"version": "3.6.0",
|
||||
"resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz",
|
||||
"integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==",
|
||||
"devOptional": true,
|
||||
"requires": {
|
||||
"picomatch": "^2.2.1"
|
||||
}
|
||||
},
|
||||
"regenerator-runtime": {
|
||||
"version": "0.13.11",
|
||||
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz",
|
||||
|
|
@ -5750,6 +5975,17 @@
|
|||
"is-regex": "^1.1.4"
|
||||
}
|
||||
},
|
||||
"sass": {
|
||||
"version": "1.64.1",
|
||||
"resolved": "https://registry.npmjs.org/sass/-/sass-1.64.1.tgz",
|
||||
"integrity": "sha512-16rRACSOFEE8VN7SCgBu1MpYCyN7urj9At898tyzdXFhC+a+yOX5dXwAR7L8/IdPJ1NB8OYoXmD55DM30B2kEQ==",
|
||||
"devOptional": true,
|
||||
"requires": {
|
||||
"chokidar": ">=3.0.0 <4.0.0",
|
||||
"immutable": "^4.0.0",
|
||||
"source-map-js": ">=0.6.2 <2.0.0"
|
||||
}
|
||||
},
|
||||
"scheduler": {
|
||||
"version": "0.23.0",
|
||||
"resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.0.tgz",
|
||||
|
|
|
|||
|
|
@ -9,6 +9,7 @@
|
|||
"lint": "next lint"
|
||||
},
|
||||
"dependencies": {
|
||||
"@next/font": "^13.4.12",
|
||||
"@types/node": "20.4.5",
|
||||
"@types/react": "18.2.17",
|
||||
"@types/react-dom": "18.2.7",
|
||||
|
|
@ -18,5 +19,8 @@
|
|||
"react": "18.2.0",
|
||||
"react-dom": "18.2.0",
|
||||
"typescript": "5.1.6"
|
||||
},
|
||||
"devDependencies": {
|
||||
"sass": "^1.64.1"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
BIN
public/booking.png
Normal file
BIN
public/booking.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.8 KiB |
BIN
public/cloud.png
Normal file
BIN
public/cloud.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 25 KiB |
BIN
public/destination.png
Normal file
BIN
public/destination.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.7 KiB |
BIN
public/first.png
Normal file
BIN
public/first.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 126 KiB |
BIN
public/image.jpg
Normal file
BIN
public/image.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 72 KiB |
0
public/layer.svg
Normal file
0
public/layer.svg
Normal file
|
|
@ -1 +0,0 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 394 80"><path fill="#000" d="M262 0h68.5v12.7h-27.2v66.6h-13.6V12.7H262V0ZM149 0v12.7H94v20.4h44.3v12.6H94v21h55v12.6H80.5V0h68.7zm34.3 0h-17.8l63.8 79.4h17.9l-32-39.7 32-39.6h-17.9l-23 28.6-23-28.6zm18.3 56.7-9-11-27.1 33.7h17.8l18.3-22.7z"/><path fill="#000" d="M81 79.3 17 0H0v79.3h13.6V17l50.2 62.3H81Zm252.6-.4c-1 0-1.8-.4-2.5-1s-1.1-1.6-1.1-2.6.3-1.8 1-2.5 1.6-1 2.6-1 1.8.3 2.5 1a3.4 3.4 0 0 1 .6 4.3 3.7 3.7 0 0 1-3 1.8zm23.2-33.5h6v23.3c0 2.1-.4 4-1.3 5.5a9.1 9.1 0 0 1-3.8 3.5c-1.6.8-3.5 1.3-5.7 1.3-2 0-3.7-.4-5.3-1s-2.8-1.8-3.7-3.2c-.9-1.3-1.4-3-1.4-5h6c.1.8.3 1.6.7 2.2s1 1.2 1.6 1.5c.7.4 1.5.5 2.4.5 1 0 1.8-.2 2.4-.6a4 4 0 0 0 1.6-1.8c.3-.8.5-1.8.5-3V45.5zm30.9 9.1a4.4 4.4 0 0 0-2-3.3 7.5 7.5 0 0 0-4.3-1.1c-1.3 0-2.4.2-3.3.5-.9.4-1.6 1-2 1.6a3.5 3.5 0 0 0-.3 4c.3.5.7.9 1.3 1.2l1.8 1 2 .5 3.2.8c1.3.3 2.5.7 3.7 1.2a13 13 0 0 1 3.2 1.8 8.1 8.1 0 0 1 3 6.5c0 2-.5 3.7-1.5 5.1a10 10 0 0 1-4.4 3.5c-1.8.8-4.1 1.2-6.8 1.2-2.6 0-4.9-.4-6.8-1.2-2-.8-3.4-2-4.5-3.5a10 10 0 0 1-1.7-5.6h6a5 5 0 0 0 3.5 4.6c1 .4 2.2.6 3.4.6 1.3 0 2.5-.2 3.5-.6 1-.4 1.8-1 2.4-1.7a4 4 0 0 0 .8-2.4c0-.9-.2-1.6-.7-2.2a11 11 0 0 0-2.1-1.4l-3.2-1-3.8-1c-2.8-.7-5-1.7-6.6-3.2a7.2 7.2 0 0 1-2.4-5.7 8 8 0 0 1 1.7-5 10 10 0 0 1 4.3-3.5c2-.8 4-1.2 6.4-1.2 2.3 0 4.4.4 6.2 1.2 1.8.8 3.2 2 4.3 3.4 1 1.4 1.5 3 1.5 5h-5.8z"/></svg>
|
||||
|
Before Width: | Height: | Size: 1.3 KiB |
BIN
public/second.png
Normal file
BIN
public/second.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 126 KiB |
BIN
public/third.png
Normal file
BIN
public/third.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 158 KiB |
10
public/travlog.svg
Normal file
10
public/travlog.svg
Normal file
|
|
@ -0,0 +1,10 @@
|
|||
<svg width="154" height="41" viewBox="0 0 154 41" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M8.55273 4.09787C7.12207 5.09823 5.82837 6.28098 4.70532 7.6124C9.29462 7.18633 15.1252 7.88204 21.8944 11.2667C29.123 14.8809 34.9438 15.0031 38.9948 14.2217C38.6272 13.1088 38.1644 12.0392 37.6163 11.0224C32.979 11.5115 27.034 10.8641 20.1056 7.39998C15.706 5.20018 11.8278 4.29401 8.55273 4.09787ZM34.9074 7.16665C31.2453 3.075 25.9234 0.5 20 0.5C18.2605 0.5 16.5727 0.722107 14.9637 1.13948C17.1429 1.73409 19.4579 2.60399 21.8944 3.82227C26.967 6.35853 31.3464 7.17516 34.9074 7.16665ZM39.8609 18.1281C34.9669 19.0945 28.2088 18.896 20.1056 14.8444C12.53 11.0566 6.50043 11.1043 2.4339 12.008C2.224 12.0546 2.01904 12.1036 1.81903 12.1546C1.28662 13.3125 0.861634 14.5301 0.556702 15.7945C0.882386 15.7075 1.21893 15.6248 1.56616 15.5476C6.49957 14.4513 13.4701 14.4989 21.8944 18.7111C29.4701 22.4989 35.4996 22.4512 39.5662 21.5475C39.7055 21.5166 39.8428 21.4846 39.9778 21.4516C39.9926 21.1363 40 20.819 40 20.5C40 19.6975 39.9528 18.906 39.8609 18.1281ZM39.3248 25.6723C34.4783 26.5196 27.917 26.1944 20.1056 22.2888C12.53 18.501 6.50043 18.5487 2.4339 19.4524C1.53125 19.6529 0.719239 19.8972 0.00293 20.1551C0.000977 20.2698 0 20.3848 0 20.5C0 31.5457 8.95429 40.5 20 40.5C29.2571 40.5 37.0453 34.2109 39.3248 25.6723Z" fill="url(#paint0_linear_832_821)"/>
|
||||
<path d="M61.016 29.5V17.092H56.096V12.7H71.6V17.092H66.68V29.5H61.016ZM72.6688 29.5V16.372H77.8288V20.332L76.9888 19.204C77.3888 18.18 78.0288 17.412 78.9088 16.9C79.7888 16.388 80.8448 16.132 82.0768 16.132V20.932C81.8368 20.9 81.6208 20.876 81.4288 20.86C81.2528 20.844 81.0688 20.836 80.8768 20.836C80.0608 20.836 79.3888 21.052 78.8608 21.484C78.3488 21.9 78.0928 22.628 78.0928 23.668V29.5H72.6688ZM90.8315 29.5V27.172L90.4475 26.548V22.132C90.4475 21.492 90.2475 21.004 89.8475 20.668C89.4635 20.332 88.8315 20.164 87.9515 20.164C87.3595 20.164 86.7595 20.26 86.1515 20.452C85.5435 20.628 85.0235 20.876 84.5915 21.196L82.8635 17.62C83.6315 17.14 84.5515 16.772 85.6235 16.516C86.6955 16.26 87.7435 16.132 88.7675 16.132C91.0235 16.132 92.7675 16.636 93.9995 17.644C95.2475 18.652 95.8715 20.252 95.8715 22.444V29.5H90.8315ZM87.1115 29.74C86.0395 29.74 85.1435 29.556 84.4235 29.188C83.7035 28.82 83.1595 28.332 82.7915 27.724C82.4235 27.1 82.2395 26.412 82.2395 25.66C82.2395 24.812 82.4555 24.092 82.8875 23.5C83.3195 22.908 83.9755 22.46 84.8555 22.156C85.7515 21.852 86.8795 21.7 88.2395 21.7H90.9755V24.316H89.1035C88.5275 24.316 88.1035 24.412 87.8315 24.604C87.5755 24.78 87.4475 25.052 87.4475 25.42C87.4475 25.724 87.5595 25.98 87.7835 26.188C88.0235 26.38 88.3435 26.476 88.7435 26.476C89.1115 26.476 89.4475 26.38 89.7515 26.188C90.0715 25.98 90.3035 25.66 90.4475 25.228L91.1435 26.836C90.9355 27.812 90.4955 28.54 89.8235 29.02C89.1515 29.5 88.2475 29.74 87.1115 29.74ZM101.701 29.5L96.4212 16.372H101.989L105.997 27.028H103.189L107.461 16.372H112.597L107.317 29.5H101.701ZM113.427 29.5V11.692H118.851V29.5H113.427ZM128.191 29.74C126.703 29.74 125.383 29.452 124.231 28.876C123.095 28.284 122.199 27.476 121.543 26.452C120.887 25.428 120.559 24.252 120.559 22.924C120.559 21.596 120.887 20.42 121.543 19.396C122.199 18.372 123.095 17.572 124.231 16.996C125.383 16.42 126.703 16.132 128.191 16.132C129.679 16.132 130.999 16.42 132.151 16.996C133.303 17.572 134.199 18.372 134.839 19.396C135.495 20.42 135.823 21.596 135.823 22.924C135.823 24.252 135.495 25.428 134.839 26.452C134.199 27.476 133.303 28.284 132.151 28.876C130.999 29.452 129.679 29.74 128.191 29.74ZM128.191 25.516C128.591 25.516 128.951 25.42 129.271 25.228C129.591 25.036 129.847 24.748 130.039 24.364C130.231 23.964 130.327 23.484 130.327 22.924C130.327 22.348 130.231 21.876 130.039 21.508C129.847 21.124 129.591 20.836 129.271 20.644C128.951 20.452 128.591 20.356 128.191 20.356C127.791 20.356 127.431 20.452 127.111 20.644C126.791 20.836 126.535 21.124 126.343 21.508C126.151 21.876 126.055 22.348 126.055 22.924C126.055 23.484 126.151 23.964 126.343 24.364C126.535 24.748 126.791 25.036 127.111 25.228C127.431 25.42 127.791 25.516 128.191 25.516ZM144.192 34.396C142.896 34.396 141.68 34.26 140.544 33.988C139.408 33.716 138.432 33.308 137.616 32.764L139.44 29.068C139.952 29.468 140.6 29.78 141.384 30.004C142.184 30.244 142.936 30.364 143.64 30.364C144.76 30.364 145.56 30.124 146.04 29.644C146.52 29.18 146.76 28.508 146.76 27.628V26.524L147 22.444L147.024 18.364V16.372H152.184V26.884C152.184 29.428 151.48 31.316 150.072 32.548C148.664 33.78 146.704 34.396 144.192 34.396ZM143.136 28.78C142.032 28.78 141 28.524 140.04 28.012C139.08 27.484 138.304 26.748 137.712 25.804C137.12 24.86 136.824 23.74 136.824 22.444C136.824 21.148 137.12 20.028 137.712 19.084C138.304 18.14 139.08 17.412 140.04 16.9C141 16.388 142.032 16.132 143.136 16.132C144.272 16.132 145.2 16.356 145.92 16.804C146.656 17.252 147.2 17.948 147.552 18.892C147.904 19.82 148.08 21.004 148.08 22.444C148.08 23.884 147.904 25.076 147.552 26.02C147.2 26.948 146.656 27.644 145.92 28.108C145.2 28.556 144.272 28.78 143.136 28.78ZM144.576 24.556C145.008 24.556 145.392 24.468 145.728 24.292C146.064 24.116 146.328 23.868 146.52 23.548C146.712 23.228 146.808 22.86 146.808 22.444C146.808 22.012 146.712 21.644 146.52 21.34C146.328 21.02 146.064 20.78 145.728 20.62C145.392 20.444 145.008 20.356 144.576 20.356C144.16 20.356 143.776 20.444 143.424 20.62C143.088 20.78 142.816 21.02 142.608 21.34C142.416 21.644 142.32 22.012 142.32 22.444C142.32 22.86 142.416 23.228 142.608 23.548C142.816 23.868 143.088 24.116 143.424 24.292C143.776 24.468 144.16 24.556 144.576 24.556Z" fill="#191825"/>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear_832_821" x1="36" y1="43.7" x2="-3.73321" y2="36.0931" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#5D50C6"/>
|
||||
<stop offset="1" stop-color="#F85E9F"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 5.8 KiB |
|
|
@ -1 +0,0 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 283 64"><path fill="black" d="M141 16c-11 0-19 7-19 18s9 18 20 18c7 0 13-3 16-7l-7-5c-2 3-6 4-9 4-5 0-9-3-10-7h28v-3c0-11-8-18-19-18zm-9 15c1-4 4-7 9-7s8 3 9 7h-18zm117-15c-11 0-19 7-19 18s9 18 20 18c6 0 12-3 16-7l-8-5c-2 3-5 4-8 4-5 0-9-3-11-7h28l1-3c0-11-8-18-19-18zm-10 15c2-4 5-7 10-7s8 3 9 7h-19zm-39 3c0 6 4 10 10 10 4 0 7-2 9-5l8 5c-3 5-9 8-17 8-11 0-19-7-19-18s8-18 19-18c8 0 14 3 17 8l-8 5c-2-3-5-5-9-5-6 0-10 4-10 10zm83-29v46h-9V5h9zM37 0l37 64H0L37 0zm92 5-27 48L74 5h10l18 30 17-30h10zm59 12v10l-3-1c-6 0-10 4-10 10v15h-9V17h9v9c0-5 6-9 13-9z"/></svg>
|
||||
|
Before Width: | Height: | Size: 629 B |
14
src/app/components/block/block.module.css
Normal file
14
src/app/components/block/block.module.css
Normal file
|
|
@ -0,0 +1,14 @@
|
|||
.container{
|
||||
border-radius: 100px;
|
||||
background: #FFF;
|
||||
box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.07), 0px 34px 75px 0px rgba(0, 0, 0, 0.07), 0px 137px 137px 0px rgba(0, 0, 0, 0.06), 0px 308px 185px 0px rgba(0, 0, 0, 0.04), 0px 548px 219px 0px rgba(0, 0, 0, 0.01), 0px 856px 240px 0px rgba(0, 0, 0, 0.00);
|
||||
display: inline-flex;
|
||||
padding: 20px;
|
||||
padding-top: 15px;
|
||||
padding-bottom: 15px;
|
||||
overflow: visible;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
width: 300px;
|
||||
}
|
||||
14
src/app/components/block/index.tsx
Normal file
14
src/app/components/block/index.tsx
Normal file
|
|
@ -0,0 +1,14 @@
|
|||
'use client'
|
||||
|
||||
import react from 'react'
|
||||
import styles from './block.module.css'
|
||||
|
||||
interface IBlock{
|
||||
children: react.ReactElement | string | react.ReactElement[];
|
||||
className?: string;
|
||||
}
|
||||
|
||||
export const Block: react.FC<IBlock> = (props) => {
|
||||
const className = props.className ? styles.container + ' ' + props.className : styles.container
|
||||
return <div className={className}>{props.children}</div>
|
||||
}
|
||||
19
src/app/components/button/button.module.scss
Normal file
19
src/app/components/button/button.module.scss
Normal file
|
|
@ -0,0 +1,19 @@
|
|||
.button{
|
||||
outline: none;
|
||||
border: none;
|
||||
border-radius: 1000px;
|
||||
padding: 15px 30px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.active{
|
||||
@extend .button;
|
||||
background-color: #5D50C6;
|
||||
|
||||
}
|
||||
|
||||
.disabled{
|
||||
@extend .button;
|
||||
background-color: white;
|
||||
color: black;
|
||||
}
|
||||
18
src/app/components/button/index.tsx
Normal file
18
src/app/components/button/index.tsx
Normal file
|
|
@ -0,0 +1,18 @@
|
|||
'use client'
|
||||
import React from "react"
|
||||
import styles from './button.module.scss'
|
||||
import { montserrat } from "@/app/fonts";
|
||||
|
||||
interface IButton{
|
||||
children: React.ReactElement | string;
|
||||
type: "active" | "disabled";
|
||||
onClick?: () => {}
|
||||
}
|
||||
|
||||
const Button: React.FC<IButton> = (props) => {
|
||||
const className = props.type == 'active' ? styles.active : styles.disabled;
|
||||
const onClick = props.onClick ? props.onClick : () => {}
|
||||
return <button className={className + ' ' + montserrat.className}>{props.children}</button>
|
||||
}
|
||||
|
||||
export default Button
|
||||
81
src/app/components/functional/functional.module.css
Normal file
81
src/app/components/functional/functional.module.css
Normal file
|
|
@ -0,0 +1,81 @@
|
|||
.sized{
|
||||
overflow: visible;
|
||||
margin-top: 50px;
|
||||
display: flex;
|
||||
gap: 300px;
|
||||
padding-left: calc((100% - var(--max-width)) / 2);
|
||||
}
|
||||
.centered{
|
||||
}
|
||||
|
||||
.header{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
width: 400px;
|
||||
}
|
||||
.pink{
|
||||
color: #F85E9F;
|
||||
font-size: 20px;
|
||||
font-style: normal;
|
||||
line-height: 120%; /* 27.6px */
|
||||
letter-spacing: 2.5px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.header__head{
|
||||
color: #191825;
|
||||
font-size: 44px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: 120%; /* 52.8px */
|
||||
}
|
||||
.blocks{
|
||||
display: flex;
|
||||
gap: 30px;
|
||||
}
|
||||
|
||||
.block{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 32px;
|
||||
padding: 30px;
|
||||
border-radius: 30px;
|
||||
}
|
||||
|
||||
.block__head{
|
||||
padding-top: 30px;
|
||||
color: #191825;
|
||||
text-align: center;
|
||||
font-size: 24px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: 120%; /* 33.6px */
|
||||
}
|
||||
|
||||
.block__descr{
|
||||
color: rgba(25, 24, 37, 0.50);
|
||||
text-align: center;
|
||||
font-size: 18px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: 160%; /* 28.8px */
|
||||
}
|
||||
|
||||
.container{
|
||||
display: flex;
|
||||
gap: 100px;
|
||||
width: 1500px;
|
||||
}
|
||||
|
||||
.size__box{
|
||||
width: 100%;
|
||||
overflow-x: scroll;
|
||||
overflow-y: visible;
|
||||
padding-top: 150px;
|
||||
padding-bottom: 500px;
|
||||
}
|
||||
|
||||
.size__box::-webkit-scrollbar{
|
||||
display: none;
|
||||
}
|
||||
87
src/app/components/functional/index.tsx
Normal file
87
src/app/components/functional/index.tsx
Normal file
|
|
@ -0,0 +1,87 @@
|
|||
import react from 'react'
|
||||
import styles from './functional.module.css'
|
||||
import { inter, montserrat, montserratNormal } from '@/app/fonts'
|
||||
import { Block } from '../block'
|
||||
|
||||
|
||||
interface IFunctionalBlock{
|
||||
src: string;
|
||||
head: string;
|
||||
description: string;
|
||||
}
|
||||
|
||||
const FunctionalBlock: react.FC<IFunctionalBlock> = (props) => {
|
||||
return <Block className={styles.block}>
|
||||
<img src={props.src} alt="" width={64}/>
|
||||
<div className={styles.block__head}>{props.head}</div>
|
||||
<div className={styles.block__descr + ' ' + inter.className}>{props.description}</div>
|
||||
</Block>
|
||||
}
|
||||
|
||||
|
||||
export const Functional: react.FC = () => {
|
||||
|
||||
// react.useEffect(() => {
|
||||
// function isElementVisible(el: any) {
|
||||
// var rect = el.getBoundingClientRect(),
|
||||
// vWidth = window.innerWidth || document.documentElement.clientWidth,
|
||||
// vHeight = window.innerHeight || document.documentElement.clientHeight,
|
||||
// efp = function (x: any, y: any) { return document.elementFromPoint(x, y) };
|
||||
|
||||
// // Return false if it's not in the viewport
|
||||
// if (rect.right < 0 || rect.bottom < 0
|
||||
// || rect.left > vWidth || rect.top > vHeight)
|
||||
// return false;
|
||||
|
||||
// // Return true if any of its four corners are visible
|
||||
// return (
|
||||
// el.contains(efp(rect.left, rect.top))
|
||||
// || el.contains(efp(rect.right, rect.top))
|
||||
// || el.contains(efp(rect.right, rect.bottom))
|
||||
// || el.contains(efp(rect.left, rect.bottom))
|
||||
// );
|
||||
// }
|
||||
// var mouseWheelEvt = function (event: any) {
|
||||
// if ((document as any).body.doScroll)
|
||||
// (document as any).body.doScroll(event.wheelDelta>0?"left":"right");
|
||||
// else if ((event.wheelDelta || event.detail) > 0)
|
||||
// document.body.scrollLeft -= 10;
|
||||
// else
|
||||
// document.body.scrollLeft += 10;
|
||||
|
||||
// return false;
|
||||
// }
|
||||
// document.body.addEventListener("mousewheel", mouseWheelEvt);
|
||||
// })
|
||||
|
||||
return <div className={styles.centered}>
|
||||
<div className={styles.sized}>
|
||||
<div className={styles.size__box}>
|
||||
<div className={styles.container}>
|
||||
<div className={styles.header}>
|
||||
<div className={styles.pink + ' ' + montserrat.className}>ФУНКЦИОНАЛ</div>
|
||||
<div className={styles.header__head + ' ' + montserrat.className}>Чем мы можем вам помочь</div>
|
||||
</div>
|
||||
<div className={styles.blocks}>
|
||||
<FunctionalBlock
|
||||
src='/destination.png'
|
||||
head='Освобождаем от рутины'
|
||||
description='С нашим сервисом вы можете спланировать тур за 2 минуты'
|
||||
/>
|
||||
<FunctionalBlock
|
||||
src='/booking.png'
|
||||
head='Интересные предложения'
|
||||
description='Мы поможем найти вам необычные места для путешествий'
|
||||
/>
|
||||
<FunctionalBlock
|
||||
src='/cloud.png'
|
||||
head='Сезонность'
|
||||
description='В планировании туров мы учитываем климат и сезонность.'
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
81
src/app/components/functionality/functionality.module.css
Normal file
81
src/app/components/functionality/functionality.module.css
Normal file
|
|
@ -0,0 +1,81 @@
|
|||
.sized{
|
||||
width: var(--max-width);
|
||||
}
|
||||
.centered{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
transform: translateY(-300px);
|
||||
}
|
||||
|
||||
.tour_container{
|
||||
width: 285px;
|
||||
display: inline-flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
border-radius: 32px;
|
||||
overflow: hidden;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
.img_block{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 285px;
|
||||
height: 270px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.body{
|
||||
padding: 10px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.head__city{
|
||||
color: #191825;
|
||||
font-size: 23px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: 120%; /* 27.6px */
|
||||
width: 150px;
|
||||
}
|
||||
|
||||
.head{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.time{
|
||||
color: #F85E9F;
|
||||
font-size: 23px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: 120%;
|
||||
}
|
||||
|
||||
.description{
|
||||
color: rgba(25, 24, 37, 0.75);
|
||||
font-size: 18px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: 160%;
|
||||
}
|
||||
|
||||
.places{
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
color: #FF5722;
|
||||
font-size: 23px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: 120%;
|
||||
}
|
||||
|
||||
.tours{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding-top: 60px;
|
||||
}
|
||||
78
src/app/components/functionality/index.tsx
Normal file
78
src/app/components/functionality/index.tsx
Normal file
|
|
@ -0,0 +1,78 @@
|
|||
import react from 'react'
|
||||
import styles from './functionality.module.css'
|
||||
import { PinkHeader } from '../pinkHeader'
|
||||
import { Block } from '../block';
|
||||
import { inter } from '@/app/fonts';
|
||||
|
||||
|
||||
interface ITour{
|
||||
src: string;
|
||||
title: string;
|
||||
description: string;
|
||||
places: string;
|
||||
time: string;
|
||||
}
|
||||
|
||||
const Tour: react.FC<ITour> = (props) => {
|
||||
return <Block className={styles.tour_container}>
|
||||
<div className={styles.img_block}>
|
||||
<img src={props.src} alt="" />
|
||||
</div>
|
||||
<div className={styles.body}>
|
||||
<div className={styles.head}>
|
||||
<div className={styles.head__city}>
|
||||
{props.title}
|
||||
</div>
|
||||
<div className={styles.time}>
|
||||
{props.time}
|
||||
</div>
|
||||
</div>
|
||||
<div className={styles.description + ' ' + inter.className}>
|
||||
{props.description}
|
||||
</div>
|
||||
<div className={styles.places}>
|
||||
{props.places}
|
||||
</div>
|
||||
</div>
|
||||
</Block>
|
||||
}
|
||||
|
||||
|
||||
export const Functionality: react.FC = () => {
|
||||
|
||||
return <div className={styles.centered}>
|
||||
<div className={styles.sized}>
|
||||
<PinkHeader pinkText='Наши предложения' blackText='Примеры составленных туров'/>
|
||||
<div className={styles.tours}>
|
||||
<Tour
|
||||
src='/image.jpg'
|
||||
title='Нижний новгород'
|
||||
time='2 дня'
|
||||
description='Исторические места'
|
||||
places='12 точек'
|
||||
/>
|
||||
<Tour
|
||||
src='/image.jpg'
|
||||
title='Нижний новгород'
|
||||
time='2 дня'
|
||||
description='Исторические места'
|
||||
places='12 точек'
|
||||
/>
|
||||
<Tour
|
||||
src='/image.jpg'
|
||||
title='Нижний новгород'
|
||||
time='2 дня'
|
||||
description='Исторические места'
|
||||
places='12 точек'
|
||||
/>
|
||||
<Tour
|
||||
src='/image.jpg'
|
||||
title='Нижний новгород'
|
||||
time='2 дня'
|
||||
description='Исторические места'
|
||||
places='12 точек'
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
18
src/app/components/header/header.module.css
Normal file
18
src/app/components/header/header.module.css
Normal file
|
|
@ -0,0 +1,18 @@
|
|||
.container{
|
||||
padding: 32px 0px;
|
||||
width: var(--max-width);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.login_block{
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.centered{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
39
src/app/components/header/index.tsx
Normal file
39
src/app/components/header/index.tsx
Normal file
|
|
@ -0,0 +1,39 @@
|
|||
import React from "react";
|
||||
import styles from './header.module.css'
|
||||
import Logo from "../icons/logo";
|
||||
import Select from "../select";
|
||||
import Button from "../button";
|
||||
|
||||
const Header: React.FC = () => {
|
||||
return <div className={styles.centered}>
|
||||
<div className={styles.container}>
|
||||
<Logo />
|
||||
<Select
|
||||
options={[
|
||||
{
|
||||
'link': '#',
|
||||
'value': 'Главная'
|
||||
},
|
||||
{
|
||||
'link': '#functions',
|
||||
'value': 'Функционал'
|
||||
},
|
||||
{
|
||||
'link': '#examples',
|
||||
'value': 'Примеры туров'
|
||||
},
|
||||
{
|
||||
'link': '#getting-started',
|
||||
'value': 'С чего начать'
|
||||
}
|
||||
]}
|
||||
/>
|
||||
<div className={styles.login_block}>
|
||||
<Button type="disabled">Вход</Button>
|
||||
<Button type="active">Регистрация</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
export default Header;
|
||||
9
src/app/components/icons/backpack/index.tsx
Normal file
9
src/app/components/icons/backpack/index.tsx
Normal file
|
|
@ -0,0 +1,9 @@
|
|||
'use client'
|
||||
import react from 'react'
|
||||
|
||||
export const BackPack: react.FC = () => {
|
||||
|
||||
return <svg xmlns="http://www.w3.org/2000/svg" width="24" height="25" viewBox="0 0 24 25" fill="none">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M10.7044 4.01898C10.034 4.01898 9.46373 4.4848 9.30365 5.11265H14.6863C14.5263 4.4848 13.956 4.01898 13.2856 4.01898H10.7044ZM16.2071 5.11264H18.1881C20.2891 5.11264 22 6.84428 22 8.97085C22 8.97085 21.94 9.8711 21.92 11.1248C21.918 11.224 21.8699 11.3212 21.7909 11.38C21.3097 11.7354 20.8694 12.0291 20.8294 12.0493C19.1686 13.1632 17.2386 13.947 15.1826 14.3369C15.0485 14.3632 14.9165 14.2934 14.8484 14.1739C14.2721 13.1754 13.1956 12.5253 11.995 12.5253C10.8024 12.5253 9.71586 13.1683 9.12256 14.1678C9.05353 14.2853 8.92346 14.3531 8.7904 14.3278C6.75138 13.9369 4.82141 13.1541 3.17059 12.0594L2.21011 11.3911C2.13007 11.3405 2.08004 11.2493 2.08004 11.1481C2.05003 10.6316 2 8.97085 2 8.97085C2 6.84428 3.71086 5.11264 5.81191 5.11264H7.78289C7.97299 3.6443 9.2036 2.5 10.7044 2.5H13.2856C14.7864 2.5 16.017 3.6443 16.2071 5.11264ZM21.6598 13.3152L21.6198 13.3355C19.5988 14.6924 17.1676 15.5937 14.6163 15.9684C14.2561 16.019 13.8959 15.7861 13.7959 15.4216C13.5758 14.5912 12.8654 14.0443 12.015 14.0443H12.005H11.985C11.1346 14.0443 10.4242 14.5912 10.2041 15.4216C10.1041 15.7861 9.74387 16.019 9.38369 15.9684C6.83242 15.5937 4.4012 14.6924 2.38019 13.3355C2.37019 13.3254 2.27014 13.2646 2.1901 13.3152C2.10005 13.3659 2.10005 13.4874 2.10005 13.4874L2.17009 18.6519C2.17009 20.7785 3.87094 22.5 5.97199 22.5H18.018C20.1191 22.5 21.8199 20.7785 21.8199 18.6519L21.9 13.4874C21.9 13.4874 21.9 13.3659 21.8099 13.3152C21.7599 13.2849 21.6999 13.295 21.6598 13.3152ZM12.7454 17.5583C12.7454 17.9836 12.4152 18.3177 11.995 18.3177C11.5848 18.3177 11.2446 17.9836 11.2446 17.5583V16.2519C11.2446 15.8367 11.5848 15.4924 11.995 15.4924C12.4152 15.4924 12.7454 15.8367 12.7454 16.2519V17.5583Z" fill="#F85E9F"/>
|
||||
</svg>
|
||||
}
|
||||
24
src/app/components/icons/globus/index.tsx
Normal file
24
src/app/components/icons/globus/index.tsx
Normal file
File diff suppressed because one or more lines are too long
11
src/app/components/icons/logo/index.tsx
Normal file
11
src/app/components/icons/logo/index.tsx
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
export default () => (
|
||||
<svg width="154" height="41" viewBox="0 0 154 41" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M8.55273 4.09787C7.12207 5.09823 5.82837 6.28098 4.70532 7.6124C9.29462 7.18633 15.1252 7.88204 21.8944 11.2667C29.123 14.8809 34.9438 15.0031 38.9948 14.2217C38.6272 13.1088 38.1644 12.0392 37.6163 11.0224C32.979 11.5115 27.034 10.8641 20.1056 7.39998C15.706 5.20018 11.8278 4.29401 8.55273 4.09787ZM34.9074 7.16665C31.2453 3.075 25.9234 0.5 20 0.5C18.2605 0.5 16.5727 0.722107 14.9637 1.13948C17.1429 1.73409 19.4579 2.60399 21.8944 3.82227C26.967 6.35853 31.3464 7.17516 34.9074 7.16665ZM39.8609 18.1281C34.9669 19.0945 28.2088 18.896 20.1056 14.8444C12.53 11.0566 6.50043 11.1043 2.4339 12.008C2.224 12.0546 2.01904 12.1036 1.81903 12.1546C1.28662 13.3125 0.861634 14.5301 0.556702 15.7945C0.882386 15.7075 1.21893 15.6248 1.56616 15.5476C6.49957 14.4513 13.4701 14.4989 21.8944 18.7111C29.4701 22.4989 35.4996 22.4512 39.5662 21.5475C39.7055 21.5166 39.8428 21.4846 39.9778 21.4516C39.9926 21.1363 40 20.819 40 20.5C40 19.6975 39.9528 18.906 39.8609 18.1281ZM39.3248 25.6723C34.4783 26.5196 27.917 26.1944 20.1056 22.2888C12.53 18.501 6.50043 18.5487 2.4339 19.4524C1.53125 19.6529 0.719239 19.8972 0.00293 20.1551C0.000977 20.2698 0 20.3848 0 20.5C0 31.5457 8.95429 40.5 20 40.5C29.2571 40.5 37.0453 34.2109 39.3248 25.6723Z" fill="url(#paint0_linear_832_821)"/>
|
||||
<path d="M61.016 29.5V17.092H56.096V12.7H71.6V17.092H66.68V29.5H61.016ZM72.6688 29.5V16.372H77.8288V20.332L76.9888 19.204C77.3888 18.18 78.0288 17.412 78.9088 16.9C79.7888 16.388 80.8448 16.132 82.0768 16.132V20.932C81.8368 20.9 81.6208 20.876 81.4288 20.86C81.2528 20.844 81.0688 20.836 80.8768 20.836C80.0608 20.836 79.3888 21.052 78.8608 21.484C78.3488 21.9 78.0928 22.628 78.0928 23.668V29.5H72.6688ZM90.8315 29.5V27.172L90.4475 26.548V22.132C90.4475 21.492 90.2475 21.004 89.8475 20.668C89.4635 20.332 88.8315 20.164 87.9515 20.164C87.3595 20.164 86.7595 20.26 86.1515 20.452C85.5435 20.628 85.0235 20.876 84.5915 21.196L82.8635 17.62C83.6315 17.14 84.5515 16.772 85.6235 16.516C86.6955 16.26 87.7435 16.132 88.7675 16.132C91.0235 16.132 92.7675 16.636 93.9995 17.644C95.2475 18.652 95.8715 20.252 95.8715 22.444V29.5H90.8315ZM87.1115 29.74C86.0395 29.74 85.1435 29.556 84.4235 29.188C83.7035 28.82 83.1595 28.332 82.7915 27.724C82.4235 27.1 82.2395 26.412 82.2395 25.66C82.2395 24.812 82.4555 24.092 82.8875 23.5C83.3195 22.908 83.9755 22.46 84.8555 22.156C85.7515 21.852 86.8795 21.7 88.2395 21.7H90.9755V24.316H89.1035C88.5275 24.316 88.1035 24.412 87.8315 24.604C87.5755 24.78 87.4475 25.052 87.4475 25.42C87.4475 25.724 87.5595 25.98 87.7835 26.188C88.0235 26.38 88.3435 26.476 88.7435 26.476C89.1115 26.476 89.4475 26.38 89.7515 26.188C90.0715 25.98 90.3035 25.66 90.4475 25.228L91.1435 26.836C90.9355 27.812 90.4955 28.54 89.8235 29.02C89.1515 29.5 88.2475 29.74 87.1115 29.74ZM101.701 29.5L96.4212 16.372H101.989L105.997 27.028H103.189L107.461 16.372H112.597L107.317 29.5H101.701ZM113.427 29.5V11.692H118.851V29.5H113.427ZM128.191 29.74C126.703 29.74 125.383 29.452 124.231 28.876C123.095 28.284 122.199 27.476 121.543 26.452C120.887 25.428 120.559 24.252 120.559 22.924C120.559 21.596 120.887 20.42 121.543 19.396C122.199 18.372 123.095 17.572 124.231 16.996C125.383 16.42 126.703 16.132 128.191 16.132C129.679 16.132 130.999 16.42 132.151 16.996C133.303 17.572 134.199 18.372 134.839 19.396C135.495 20.42 135.823 21.596 135.823 22.924C135.823 24.252 135.495 25.428 134.839 26.452C134.199 27.476 133.303 28.284 132.151 28.876C130.999 29.452 129.679 29.74 128.191 29.74ZM128.191 25.516C128.591 25.516 128.951 25.42 129.271 25.228C129.591 25.036 129.847 24.748 130.039 24.364C130.231 23.964 130.327 23.484 130.327 22.924C130.327 22.348 130.231 21.876 130.039 21.508C129.847 21.124 129.591 20.836 129.271 20.644C128.951 20.452 128.591 20.356 128.191 20.356C127.791 20.356 127.431 20.452 127.111 20.644C126.791 20.836 126.535 21.124 126.343 21.508C126.151 21.876 126.055 22.348 126.055 22.924C126.055 23.484 126.151 23.964 126.343 24.364C126.535 24.748 126.791 25.036 127.111 25.228C127.431 25.42 127.791 25.516 128.191 25.516ZM144.192 34.396C142.896 34.396 141.68 34.26 140.544 33.988C139.408 33.716 138.432 33.308 137.616 32.764L139.44 29.068C139.952 29.468 140.6 29.78 141.384 30.004C142.184 30.244 142.936 30.364 143.64 30.364C144.76 30.364 145.56 30.124 146.04 29.644C146.52 29.18 146.76 28.508 146.76 27.628V26.524L147 22.444L147.024 18.364V16.372H152.184V26.884C152.184 29.428 151.48 31.316 150.072 32.548C148.664 33.78 146.704 34.396 144.192 34.396ZM143.136 28.78C142.032 28.78 141 28.524 140.04 28.012C139.08 27.484 138.304 26.748 137.712 25.804C137.12 24.86 136.824 23.74 136.824 22.444C136.824 21.148 137.12 20.028 137.712 19.084C138.304 18.14 139.08 17.412 140.04 16.9C141 16.388 142.032 16.132 143.136 16.132C144.272 16.132 145.2 16.356 145.92 16.804C146.656 17.252 147.2 17.948 147.552 18.892C147.904 19.82 148.08 21.004 148.08 22.444C148.08 23.884 147.904 25.076 147.552 26.02C147.2 26.948 146.656 27.644 145.92 28.108C145.2 28.556 144.272 28.78 143.136 28.78ZM144.576 24.556C145.008 24.556 145.392 24.468 145.728 24.292C146.064 24.116 146.328 23.868 146.52 23.548C146.712 23.228 146.808 22.86 146.808 22.444C146.808 22.012 146.712 21.644 146.52 21.34C146.328 21.02 146.064 20.78 145.728 20.62C145.392 20.444 145.008 20.356 144.576 20.356C144.16 20.356 143.776 20.444 143.424 20.62C143.088 20.78 142.816 21.02 142.608 21.34C142.416 21.644 142.32 22.012 142.32 22.444C142.32 22.86 142.416 23.228 142.608 23.548C142.816 23.868 143.088 24.116 143.424 24.292C143.776 24.468 144.16 24.556 144.576 24.556Z" fill="#191825"/>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear_832_821" x1="36" y1="43.7" x2="-3.73321" y2="36.0931" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#5D50C6"/>
|
||||
<stop offset="1" stop-color="#F85E9F"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>)
|
||||
8
src/app/components/icons/play/index.tsx
Normal file
8
src/app/components/icons/play/index.tsx
Normal file
|
|
@ -0,0 +1,8 @@
|
|||
import react from 'react'
|
||||
|
||||
export const PlayIcon: react.FC = () => {
|
||||
|
||||
return <svg xmlns="http://www.w3.org/2000/svg" width="24" height="25" viewBox="0 0 24 25" fill="none">
|
||||
<path d="M11.9688 2.5C6.44875 2.5 1.96875 6.98 1.96875 12.5C1.96875 18.02 6.44875 22.5 11.9688 22.5C17.4888 22.5 21.9688 18.02 21.9688 12.5C21.9688 6.98 17.4988 2.5 11.9688 2.5ZM14.9688 14.73L12.0687 16.4C11.7087 16.61 11.3088 16.71 10.9187 16.71C10.5188 16.71 10.1287 16.61 9.76875 16.4C9.04875 15.98 8.61875 15.24 8.61875 14.4V11.05C8.61875 10.22 9.04875 9.47 9.76875 9.05C10.4888 8.63 11.3487 8.63 12.0787 9.05L14.9787 10.72C15.6987 11.14 16.1287 11.88 16.1287 12.72C16.1287 13.56 15.6987 14.31 14.9688 14.73Z" fill="#5D50C6"/>
|
||||
</svg>
|
||||
}
|
||||
59
src/app/components/intro/index.tsx
Normal file
59
src/app/components/intro/index.tsx
Normal file
|
|
@ -0,0 +1,59 @@
|
|||
'use client'
|
||||
import react from 'react'
|
||||
import { Block } from '../block'
|
||||
import { BackPack } from '../icons/backpack'
|
||||
import { inter, montserrat } from '@/app/fonts'
|
||||
import styles from './intro.module.css'
|
||||
import { Play } from 'next/font/google'
|
||||
import { PlayIcon } from '../icons/play'
|
||||
import { GlobusIcon } from '../icons/globus'
|
||||
|
||||
export const Intro: react.FC = () => {
|
||||
|
||||
return <div className={styles.centered}>
|
||||
<div className={styles.sized}>
|
||||
<div className={styles.container}>
|
||||
<div className={styles.info}>
|
||||
<Block>
|
||||
<span className={montserrat.className + ' ' + styles.kaif__text}>
|
||||
Исследуй мир с кайфом
|
||||
</span>
|
||||
<BackPack />
|
||||
</Block>
|
||||
<div>
|
||||
<h2 className={styles.info__header}>
|
||||
Тур <span className={styles.colored}>учитывая ваши вкусы</span> по всей России
|
||||
</h2>
|
||||
</div>
|
||||
<span className={styles.description + ' ' + inter.className}>
|
||||
Первый в мире планировщик туров который
|
||||
учитывает ваши предпочтения
|
||||
</span>
|
||||
<div className={styles.actions}>
|
||||
<Block className={styles.reg_block + ' ' + montserrat.className}>
|
||||
<div>Зарегистрироваться</div>
|
||||
</Block>
|
||||
<div className={styles.play_block}>
|
||||
<span>Демо</span>
|
||||
<PlayIcon />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className={styles.decorations}>
|
||||
<div className={styles.globus}>
|
||||
<GlobusIcon />
|
||||
</div>
|
||||
<div className={styles.photos}>
|
||||
<div className={styles.first}>
|
||||
<img src="/first.png" alt="" />
|
||||
<img src="/second.png" alt="" />
|
||||
</div>
|
||||
<div className={styles.second}>
|
||||
<img src="/third.png" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
96
src/app/components/intro/intro.module.css
Normal file
96
src/app/components/intro/intro.module.css
Normal file
|
|
@ -0,0 +1,96 @@
|
|||
.sized{
|
||||
width: var(--max-width);
|
||||
overflow: visible;
|
||||
}
|
||||
.centered{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.kaif__text{
|
||||
font-size: 14px;
|
||||
color: #F85E9F;
|
||||
}
|
||||
|
||||
.container{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
overflow: visible;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.info{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 20px;
|
||||
margin-top: -100px;
|
||||
}
|
||||
|
||||
.decorations{
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.info__header{
|
||||
font-size: 56px;
|
||||
max-width: 500px;
|
||||
}
|
||||
|
||||
.colored{
|
||||
color: #F85E9F;
|
||||
}
|
||||
|
||||
.description{
|
||||
max-width: 450px;
|
||||
color: rgba(25, 24, 37, 0.50);
|
||||
font-size: 18px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: 160%; /* 28.8px */
|
||||
}
|
||||
.reg_block{
|
||||
background: #5D50C6;
|
||||
color: white;
|
||||
text-align: center;
|
||||
align-items: center;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.play_block{
|
||||
border-radius: 100px;
|
||||
border: 1px solid #EEE;
|
||||
background: #FFF;
|
||||
display: flex;
|
||||
padding: 16px 32px;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.actions{
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.first{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.photos{
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
align-items: center;
|
||||
z-index: 1;
|
||||
margin-top: -200px;
|
||||
}
|
||||
|
||||
.globus{
|
||||
}
|
||||
|
||||
.decorations{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
20
src/app/components/pinkHeader/index.tsx
Normal file
20
src/app/components/pinkHeader/index.tsx
Normal file
|
|
@ -0,0 +1,20 @@
|
|||
import react from 'react'
|
||||
import styles from './pink.module.css'
|
||||
import { montserrat } from '@/app/fonts';
|
||||
|
||||
interface IPinkHeader{
|
||||
pinkText: string;
|
||||
pinkFontSize?: number;
|
||||
blackText: string;
|
||||
blackFontSize?: number;
|
||||
}
|
||||
|
||||
|
||||
export const PinkHeader: react.FC<IPinkHeader> = (props) => {
|
||||
const pinkfz = props.pinkFontSize ? props.pinkFontSize : 20;
|
||||
const darkfz = props.blackFontSize ? props.blackFontSize : 40;
|
||||
return <div className={styles.pink__container}>
|
||||
<div className={styles.pink + ' ' + montserrat.className} style={{fontSize: pinkfz}}>{props.pinkText}</div>
|
||||
<div className={styles.dark} style={{fontSize: darkfz}}>{props.blackText}</div>
|
||||
</div>
|
||||
}
|
||||
20
src/app/components/pinkHeader/pink.module.css
Normal file
20
src/app/components/pinkHeader/pink.module.css
Normal file
|
|
@ -0,0 +1,20 @@
|
|||
.pink__container{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.pink{
|
||||
color: #F85E9F;
|
||||
font-style: normal;
|
||||
line-height: 120%; /* 27.6px */
|
||||
letter-spacing: 2.5px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.dark{
|
||||
color: #191825;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: 120%;
|
||||
}
|
||||
41
src/app/components/select/index.tsx
Normal file
41
src/app/components/select/index.tsx
Normal file
|
|
@ -0,0 +1,41 @@
|
|||
'use client'
|
||||
|
||||
import Link from "next/link";
|
||||
import React, { useEffect, useState } from "react";
|
||||
import styles from './select.module.css'
|
||||
import { montserrat } from "@/app/fonts";
|
||||
import { usePathname } from "next/navigation";
|
||||
|
||||
|
||||
interface ISelect {
|
||||
options: {
|
||||
link: string;
|
||||
value: string;
|
||||
}[]
|
||||
}
|
||||
|
||||
const Select: React.FC<ISelect> = (props) => {
|
||||
const router = usePathname();
|
||||
console.log(router);
|
||||
const [path, setPath] = useState(props.options[0].link)
|
||||
|
||||
const listenToPopstate = () => {
|
||||
const winPath = window.location.pathname;
|
||||
setPath(winPath);
|
||||
};
|
||||
return <div className={styles.container}>
|
||||
{
|
||||
props.options.map(
|
||||
e => <Link
|
||||
href={e.link}
|
||||
className={montserrat.className + ' ' + (e.link == path ? styles.active : styles.disabled)}
|
||||
onClick={() => {
|
||||
setPath(e.link)
|
||||
}}
|
||||
>{e.value}</Link>
|
||||
)
|
||||
}
|
||||
</div>
|
||||
}
|
||||
|
||||
export default Select
|
||||
14
src/app/components/select/select.module.css
Normal file
14
src/app/components/select/select.module.css
Normal file
|
|
@ -0,0 +1,14 @@
|
|||
.container{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: 32px;
|
||||
color: black;
|
||||
}
|
||||
|
||||
.active{
|
||||
color: black;
|
||||
}
|
||||
|
||||
.disabled{
|
||||
color: rgba(25, 24, 37, 0.50);
|
||||
}
|
||||
14
src/app/fonts.ts
Normal file
14
src/app/fonts.ts
Normal file
|
|
@ -0,0 +1,14 @@
|
|||
import { Inter, Montserrat } from "next/font/google";
|
||||
|
||||
export const inter = Inter({
|
||||
weight: '400',
|
||||
subsets: ['cyrillic', 'latin']
|
||||
});
|
||||
export const montserrat = Montserrat({
|
||||
weight: '700',
|
||||
subsets: ['cyrillic', 'latin']
|
||||
});
|
||||
export const montserratNormal = Montserrat({
|
||||
weight: '400',
|
||||
subsets: ['cyrillic', 'latin']
|
||||
});
|
||||
|
|
@ -1,13 +1,14 @@
|
|||
:root {
|
||||
--max-width: 1100px;
|
||||
--max-width: 1200px;
|
||||
--border-radius: 12px;
|
||||
--font-mono: ui-monospace, Menlo, Monaco, 'Cascadia Mono', 'Segoe UI Mono',
|
||||
'Roboto Mono', 'Oxygen Mono', 'Ubuntu Monospace', 'Source Code Pro',
|
||||
'Fira Mono', 'Droid Sans Mono', 'Courier New', monospace;
|
||||
|
||||
--foreground-rgb: 0, 0, 0;
|
||||
--background-start-rgb: 214, 219, 220;
|
||||
--background-start-rgb: 255, 255, 255;
|
||||
--background-end-rgb: 255, 255, 255;
|
||||
--background-rgb: 255, 255, 255;
|
||||
|
||||
--primary-glow: conic-gradient(
|
||||
from 180deg at 50% 50%,
|
||||
|
|
@ -40,7 +41,7 @@
|
|||
--card-border-rgb: 131, 134, 135;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
/* @media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--foreground-rgb: 255, 255, 255;
|
||||
--background-start-rgb: 0, 0, 0;
|
||||
|
|
@ -71,7 +72,7 @@
|
|||
--card-rgb: 100, 100, 100;
|
||||
--card-border-rgb: 200, 200, 200;
|
||||
}
|
||||
}
|
||||
} */
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
|
|
@ -79,6 +80,10 @@
|
|||
margin: 0;
|
||||
}
|
||||
|
||||
*::-webkit-scrollbar{
|
||||
display: none;
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
max-width: 100vw;
|
||||
|
|
|
|||
|
|
@ -1,229 +1,3 @@
|
|||
.main {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 6rem;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.description {
|
||||
display: inherit;
|
||||
justify-content: inherit;
|
||||
align-items: inherit;
|
||||
font-size: 0.85rem;
|
||||
max-width: var(--max-width);
|
||||
width: 100%;
|
||||
z-index: 2;
|
||||
font-family: var(--font-mono);
|
||||
}
|
||||
|
||||
.description a {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
|
||||
.description p {
|
||||
position: relative;
|
||||
margin: 0;
|
||||
padding: 1rem;
|
||||
background-color: rgba(var(--callout-rgb), 0.5);
|
||||
border: 1px solid rgba(var(--callout-border-rgb), 0.3);
|
||||
border-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
.code {
|
||||
font-weight: 700;
|
||||
font-family: var(--font-mono);
|
||||
}
|
||||
|
||||
.grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, minmax(25%, auto));
|
||||
width: var(--max-width);
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.card {
|
||||
padding: 1rem 1.2rem;
|
||||
border-radius: var(--border-radius);
|
||||
background: rgba(var(--card-rgb), 0);
|
||||
border: 1px solid rgba(var(--card-border-rgb), 0);
|
||||
transition: background 200ms, border 200ms;
|
||||
}
|
||||
|
||||
.card span {
|
||||
display: inline-block;
|
||||
transition: transform 200ms;
|
||||
}
|
||||
|
||||
.card h2 {
|
||||
font-weight: 600;
|
||||
margin-bottom: 0.7rem;
|
||||
}
|
||||
|
||||
.card p {
|
||||
margin: 0;
|
||||
opacity: 0.6;
|
||||
font-size: 0.9rem;
|
||||
line-height: 1.5;
|
||||
max-width: 30ch;
|
||||
}
|
||||
|
||||
.center {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
padding: 4rem 0;
|
||||
}
|
||||
|
||||
.center::before {
|
||||
background: var(--secondary-glow);
|
||||
border-radius: 50%;
|
||||
width: 480px;
|
||||
height: 360px;
|
||||
margin-left: -400px;
|
||||
}
|
||||
|
||||
.center::after {
|
||||
background: var(--primary-glow);
|
||||
width: 240px;
|
||||
height: 180px;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.center::before,
|
||||
.center::after {
|
||||
content: '';
|
||||
left: 50%;
|
||||
position: absolute;
|
||||
filter: blur(45px);
|
||||
transform: translateZ(0);
|
||||
}
|
||||
|
||||
.logo {
|
||||
position: relative;
|
||||
}
|
||||
/* Enable hover only on non-touch devices */
|
||||
@media (hover: hover) and (pointer: fine) {
|
||||
.card:hover {
|
||||
background: rgba(var(--card-rgb), 0.1);
|
||||
border: 1px solid rgba(var(--card-border-rgb), 0.15);
|
||||
}
|
||||
|
||||
.card:hover span {
|
||||
transform: translateX(4px);
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion) {
|
||||
.card:hover span {
|
||||
transform: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* Mobile */
|
||||
@media (max-width: 700px) {
|
||||
.content {
|
||||
padding: 4rem;
|
||||
}
|
||||
|
||||
.grid {
|
||||
grid-template-columns: 1fr;
|
||||
margin-bottom: 120px;
|
||||
max-width: 320px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.card {
|
||||
padding: 1rem 2.5rem;
|
||||
}
|
||||
|
||||
.card h2 {
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.center {
|
||||
padding: 8rem 0 6rem;
|
||||
}
|
||||
|
||||
.center::before {
|
||||
transform: none;
|
||||
height: 300px;
|
||||
}
|
||||
|
||||
.description {
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
|
||||
.description a {
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.description p,
|
||||
.description div {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.description p {
|
||||
align-items: center;
|
||||
inset: 0 0 auto;
|
||||
padding: 2rem 1rem 1.4rem;
|
||||
border-radius: 0;
|
||||
border: none;
|
||||
border-bottom: 1px solid rgba(var(--callout-border-rgb), 0.25);
|
||||
background: linear-gradient(
|
||||
to bottom,
|
||||
rgba(var(--background-start-rgb), 1),
|
||||
rgba(var(--callout-rgb), 0.5)
|
||||
);
|
||||
background-clip: padding-box;
|
||||
backdrop-filter: blur(24px);
|
||||
}
|
||||
|
||||
.description div {
|
||||
align-items: flex-end;
|
||||
pointer-events: none;
|
||||
inset: auto 0 0;
|
||||
padding: 2rem;
|
||||
height: 200px;
|
||||
background: linear-gradient(
|
||||
to bottom,
|
||||
transparent 0%,
|
||||
rgb(var(--background-end-rgb)) 40%
|
||||
);
|
||||
z-index: 1;
|
||||
}
|
||||
}
|
||||
|
||||
/* Tablet and Smaller Desktop */
|
||||
@media (min-width: 701px) and (max-width: 1120px) {
|
||||
.grid {
|
||||
grid-template-columns: repeat(2, 50%);
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.vercelLogo {
|
||||
filter: invert(1);
|
||||
}
|
||||
|
||||
.logo {
|
||||
filter: invert(1) drop-shadow(0 0 0.3rem #ffffff70);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes rotate {
|
||||
from {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
to {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
}
|
||||
.main{
|
||||
background: rgb(var(--background-rgb));
|
||||
}
|
||||
|
|
@ -1,95 +1,17 @@
|
|||
import Image from 'next/image'
|
||||
import styles from './page.module.css'
|
||||
import Header from './components/header'
|
||||
import { Intro } from './components/intro'
|
||||
import { Functional } from './components/functional'
|
||||
import { Functionality } from './components/functionality'
|
||||
|
||||
export default function Home() {
|
||||
return (
|
||||
<main className={styles.main}>
|
||||
<div className={styles.description}>
|
||||
<p>
|
||||
Get started by editing
|
||||
<code className={styles.code}>src/app/page.tsx</code>
|
||||
</p>
|
||||
<div>
|
||||
<a
|
||||
href="https://vercel.com?utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
By{' '}
|
||||
<Image
|
||||
src="/vercel.svg"
|
||||
alt="Vercel Logo"
|
||||
className={styles.vercelLogo}
|
||||
width={100}
|
||||
height={24}
|
||||
priority
|
||||
/>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className={styles.center}>
|
||||
<Image
|
||||
className={styles.logo}
|
||||
src="/next.svg"
|
||||
alt="Next.js Logo"
|
||||
width={180}
|
||||
height={37}
|
||||
priority
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className={styles.grid}>
|
||||
<a
|
||||
href="https://nextjs.org/docs?utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app"
|
||||
className={styles.card}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
<h2>
|
||||
Docs <span>-></span>
|
||||
</h2>
|
||||
<p>Find in-depth information about Next.js features and API.</p>
|
||||
</a>
|
||||
|
||||
<a
|
||||
href="https://nextjs.org/learn?utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app"
|
||||
className={styles.card}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
<h2>
|
||||
Learn <span>-></span>
|
||||
</h2>
|
||||
<p>Learn about Next.js in an interactive course with quizzes!</p>
|
||||
</a>
|
||||
|
||||
<a
|
||||
href="https://vercel.com/templates?framework=next.js&utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app"
|
||||
className={styles.card}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
<h2>
|
||||
Templates <span>-></span>
|
||||
</h2>
|
||||
<p>Explore the Next.js 13 playground.</p>
|
||||
</a>
|
||||
|
||||
<a
|
||||
href="https://vercel.com/new?utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app"
|
||||
className={styles.card}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
<h2>
|
||||
Deploy <span>-></span>
|
||||
</h2>
|
||||
<p>
|
||||
Instantly deploy your Next.js site to a shareable URL with Vercel.
|
||||
</p>
|
||||
</a>
|
||||
</div>
|
||||
<Header />
|
||||
<Intro />
|
||||
<Functional />
|
||||
<Functionality />
|
||||
</main>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user