Agata #2
3
highneed/.vs/ProjectSettings.json
Normal file
3
highneed/.vs/ProjectSettings.json
Normal file
@ -0,0 +1,3 @@
|
||||
{
|
||||
"CurrentProjectSetting": "Brak konfiguracji"
|
||||
}
|
||||
6
highneed/.vs/VSWorkspaceState.json
Normal file
6
highneed/.vs/VSWorkspaceState.json
Normal file
@ -0,0 +1,6 @@
|
||||
{
|
||||
"ExpandedNodes": [
|
||||
"\\venv\\lib\\python3.6"
|
||||
],
|
||||
"PreviewInSolutionExplorer": false
|
||||
}
|
||||
BIN
highneed/.vs/slnx.sqlite
Normal file
BIN
highneed/.vs/slnx.sqlite
Normal file
Binary file not shown.
2
highneed_react/.gitignore
vendored
2
highneed_react/.gitignore
vendored
@ -21,3 +21,5 @@
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
|
||||
.vs*
|
||||
|
||||
Binary file not shown.
Binary file not shown.
158
highneed_react/package-lock.json
generated
158
highneed_react/package-lock.json
generated
@ -3011,11 +3011,6 @@
|
||||
"resolved": "https://registry.npmjs.org/async-each/-/async-each-1.0.3.tgz",
|
||||
"integrity": "sha512-z/WhQ5FPySLdvREByI2vZiTWwCnF0moMJ1hK9YQwDTHKh6I7/uSckMetoRGb5UBZPC1z0jlw+n/XCgjeH7y1AQ=="
|
||||
},
|
||||
"async-limiter": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/async-limiter/-/async-limiter-1.0.1.tgz",
|
||||
"integrity": "sha512-csOlWGAcRFJaI6m+F2WKdnMKr4HhdhFVBk0H/QbJFMCr+uO2kwohwXQPxw/9OCxp05r5ghVBFSyioixx3gfkNQ=="
|
||||
},
|
||||
"asynckit": {
|
||||
"version": "0.4.0",
|
||||
"resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
|
||||
@ -5167,11 +5162,18 @@
|
||||
}
|
||||
},
|
||||
"domhandler": {
|
||||
"version": "2.4.2",
|
||||
"resolved": "https://registry.npmjs.org/domhandler/-/domhandler-2.4.2.tgz",
|
||||
"integrity": "sha512-JiK04h0Ht5u/80fdLMCEmV4zkNh2BcoMFBmZ/91WtYZ8qVXSKjiw7fXMgFPnHcSZgOo3XdinHvmnDUeMf5R4wA==",
|
||||
"version": "4.2.0",
|
||||
"resolved": "https://registry.npmjs.org/domhandler/-/domhandler-4.2.0.tgz",
|
||||
"integrity": "sha512-zk7sgt970kzPks2Bf+dwT/PLzghLnsivb9CcxkvR8Mzr66Olr0Ofd8neSbglHJHaHa2MadfoSdNlKYAaafmWfA==",
|
||||
"requires": {
|
||||
"domelementtype": "1"
|
||||
"domelementtype": "^2.2.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"domelementtype": {
|
||||
"version": "2.2.0",
|
||||
"resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-2.2.0.tgz",
|
||||
"integrity": "sha512-DtBMo82pv1dFtUmHyr48beiuq792Sxohr+8Hm9zoxklYPfa6n0Z3Byjj2IV7bmr2IyqClnqEQhfgHJJ5QF0R5A=="
|
||||
}
|
||||
}
|
||||
},
|
||||
"domutils": {
|
||||
@ -7300,22 +7302,40 @@
|
||||
}
|
||||
},
|
||||
"htmlparser2": {
|
||||
"version": "3.10.1",
|
||||
"resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-3.10.1.tgz",
|
||||
"integrity": "sha512-IgieNijUMbkDovyoKObU1DUhm1iwNYE/fuifEoEHfd1oZKZDaONBSkal7Y01shxsM49R4XaMdGez3WnF9UfiCQ==",
|
||||
"version": "6.1.0",
|
||||
"resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-6.1.0.tgz",
|
||||
"integrity": "sha512-gyyPk6rgonLFEDGoeRgQNaEUvdJ4ktTmmUh/h2t7s+M8oPpIPxgNACWa+6ESR57kXstwqPiCut0V8NRpcwgU7A==",
|
||||
"requires": {
|
||||
"domelementtype": "^1.3.1",
|
||||
"domhandler": "^2.3.0",
|
||||
"domutils": "^1.5.1",
|
||||
"entities": "^1.1.1",
|
||||
"inherits": "^2.0.1",
|
||||
"readable-stream": "^3.1.1"
|
||||
"domelementtype": "^2.0.1",
|
||||
"domhandler": "^4.0.0",
|
||||
"domutils": "^2.5.2",
|
||||
"entities": "^2.0.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"entities": {
|
||||
"version": "1.1.2",
|
||||
"resolved": "https://registry.npmjs.org/entities/-/entities-1.1.2.tgz",
|
||||
"integrity": "sha512-f2LZMYl1Fzu7YSBKg+RoROelpOaNrcGmE9AZubeDfrCEia483oW4MI4VyFd5VNHIgQ/7qm1I0wUHK1eJnn2y2w=="
|
||||
"dom-serializer": {
|
||||
"version": "1.3.2",
|
||||
"resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-1.3.2.tgz",
|
||||
"integrity": "sha512-5c54Bk5Dw4qAxNOI1pFEizPSjVsx5+bpJKmL2kPn8JhBUq2q09tTCa3mjijun2NfK78NMouDYNMBkOrPZiS+ig==",
|
||||
"requires": {
|
||||
"domelementtype": "^2.0.1",
|
||||
"domhandler": "^4.2.0",
|
||||
"entities": "^2.0.0"
|
||||
}
|
||||
},
|
||||
"domelementtype": {
|
||||
"version": "2.2.0",
|
||||
"resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-2.2.0.tgz",
|
||||
"integrity": "sha512-DtBMo82pv1dFtUmHyr48beiuq792Sxohr+8Hm9zoxklYPfa6n0Z3Byjj2IV7bmr2IyqClnqEQhfgHJJ5QF0R5A=="
|
||||
},
|
||||
"domutils": {
|
||||
"version": "2.7.0",
|
||||
"resolved": "https://registry.npmjs.org/domutils/-/domutils-2.7.0.tgz",
|
||||
"integrity": "sha512-8eaHa17IwJUPAiB+SoTYBo5mCdeMgdcAoXJ59m6DT1vw+5iLS3gNoqYaRowaBKtGVrOF1Jz4yDTgYKLK2kvfJg==",
|
||||
"requires": {
|
||||
"dom-serializer": "^1.0.1",
|
||||
"domelementtype": "^2.2.0",
|
||||
"domhandler": "^4.2.0"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
@ -12479,6 +12499,14 @@
|
||||
"resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.8.3.tgz",
|
||||
"integrity": "sha512-X8jZHc7nCMjaCqoU+V2I0cOhNW+QMBwSUkeXnTi8IPe6zaRWfn60ZzvFDZqWPfmSJfjub7dDW1SP0jaHWLu/hg=="
|
||||
},
|
||||
"react-responsive-image": {
|
||||
"version": "5.0.0",
|
||||
"resolved": "https://registry.npmjs.org/react-responsive-image/-/react-responsive-image-5.0.0.tgz",
|
||||
"integrity": "sha512-SFWb9nlJSDNVXLwwe4Pgzn62KLUXFhXwjed4MFFFC97qGBVbEct2zMk10F05W/Jw7da1YpglPYAdvo2Q1UmCkw==",
|
||||
"requires": {
|
||||
"prop-types": "^15.5.10"
|
||||
}
|
||||
},
|
||||
"react-router": {
|
||||
"version": "5.2.0",
|
||||
"resolved": "https://registry.npmjs.org/react-router/-/react-router-5.2.0.tgz",
|
||||
@ -12804,28 +12832,65 @@
|
||||
"integrity": "sha1-wkvOKig62tW8P1jg1IJJuSN52O8="
|
||||
},
|
||||
"renderkid": {
|
||||
"version": "2.0.5",
|
||||
"resolved": "https://registry.npmjs.org/renderkid/-/renderkid-2.0.5.tgz",
|
||||
"integrity": "sha512-ccqoLg+HLOHq1vdfYNm4TBeaCDIi1FLt3wGojTDSvdewUv65oTmI3cnT2E4hRjl1gzKZIPK+KZrXzlUYKnR+vQ==",
|
||||
"version": "2.0.6",
|
||||
"resolved": "https://registry.npmjs.org/renderkid/-/renderkid-2.0.6.tgz",
|
||||
"integrity": "sha512-GIis2GBr/ho0pFNf57D4XM4+PgnQuTii0WCPjEZmZfKivzUfGuRdjN2aQYtYMiNggHmNyBve+thFnNR1iBRcKg==",
|
||||
"requires": {
|
||||
"css-select": "^2.0.2",
|
||||
"dom-converter": "^0.2",
|
||||
"htmlparser2": "^3.10.1",
|
||||
"lodash": "^4.17.20",
|
||||
"strip-ansi": "^3.0.0"
|
||||
"css-select": "^4.1.3",
|
||||
"dom-converter": "^0.2.0",
|
||||
"htmlparser2": "^6.1.0",
|
||||
"lodash": "^4.17.21",
|
||||
"strip-ansi": "^6.0.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"ansi-regex": {
|
||||
"version": "2.1.1",
|
||||
"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
|
||||
"integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8="
|
||||
},
|
||||
"strip-ansi": {
|
||||
"version": "3.0.1",
|
||||
"resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
|
||||
"integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
|
||||
"css-select": {
|
||||
"version": "4.1.3",
|
||||
"resolved": "https://registry.npmjs.org/css-select/-/css-select-4.1.3.tgz",
|
||||
"integrity": "sha512-gT3wBNd9Nj49rAbmtFHj1cljIAOLYSX1nZ8CB7TBO3INYckygm5B7LISU/szY//YmdiSLbJvDLOx9VnMVpMBxA==",
|
||||
"requires": {
|
||||
"ansi-regex": "^2.0.0"
|
||||
"boolbase": "^1.0.0",
|
||||
"css-what": "^5.0.0",
|
||||
"domhandler": "^4.2.0",
|
||||
"domutils": "^2.6.0",
|
||||
"nth-check": "^2.0.0"
|
||||
}
|
||||
},
|
||||
"css-what": {
|
||||
"version": "5.0.1",
|
||||
"resolved": "https://registry.npmjs.org/css-what/-/css-what-5.0.1.tgz",
|
||||
"integrity": "sha512-FYDTSHb/7KXsWICVsxdmiExPjCfRC4qRFBdVwv7Ax9hMnvMmEjP9RfxTEZ3qPZGmADDn2vAKSo9UcN1jKVYscg=="
|
||||
},
|
||||
"dom-serializer": {
|
||||
"version": "1.3.2",
|
||||
"resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-1.3.2.tgz",
|
||||
"integrity": "sha512-5c54Bk5Dw4qAxNOI1pFEizPSjVsx5+bpJKmL2kPn8JhBUq2q09tTCa3mjijun2NfK78NMouDYNMBkOrPZiS+ig==",
|
||||
"requires": {
|
||||
"domelementtype": "^2.0.1",
|
||||
"domhandler": "^4.2.0",
|
||||
"entities": "^2.0.0"
|
||||
}
|
||||
},
|
||||
"domelementtype": {
|
||||
"version": "2.2.0",
|
||||
"resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-2.2.0.tgz",
|
||||
"integrity": "sha512-DtBMo82pv1dFtUmHyr48beiuq792Sxohr+8Hm9zoxklYPfa6n0Z3Byjj2IV7bmr2IyqClnqEQhfgHJJ5QF0R5A=="
|
||||
},
|
||||
"domutils": {
|
||||
"version": "2.7.0",
|
||||
"resolved": "https://registry.npmjs.org/domutils/-/domutils-2.7.0.tgz",
|
||||
"integrity": "sha512-8eaHa17IwJUPAiB+SoTYBo5mCdeMgdcAoXJ59m6DT1vw+5iLS3gNoqYaRowaBKtGVrOF1Jz4yDTgYKLK2kvfJg==",
|
||||
"requires": {
|
||||
"dom-serializer": "^1.0.1",
|
||||
"domelementtype": "^2.2.0",
|
||||
"domhandler": "^4.2.0"
|
||||
}
|
||||
},
|
||||
"nth-check": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/nth-check/-/nth-check-2.0.0.tgz",
|
||||
"integrity": "sha512-i4sc/Kj8htBrAiH1viZ0TgU8Y5XqCaV/FziYK6TBczxmeKm3AEFWqqF3195yKudrarqy7Zu80Ra5dobFjn9X/Q==",
|
||||
"requires": {
|
||||
"boolbase": "^1.0.0"
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -16119,11 +16184,18 @@
|
||||
}
|
||||
},
|
||||
"ws": {
|
||||
"version": "6.2.1",
|
||||
"resolved": "https://registry.npmjs.org/ws/-/ws-6.2.1.tgz",
|
||||
"integrity": "sha512-GIyAXC2cB7LjvpgMt9EKS2ldqr0MTrORaleiOno6TweZ6r3TKtoFQWay/2PceJ3RuBasOHzXNn5Lrw1X0bEjqA==",
|
||||
"version": "6.2.2",
|
||||
"resolved": "https://registry.npmjs.org/ws/-/ws-6.2.2.tgz",
|
||||
"integrity": "sha512-zmhltoSR8u1cnDsD43TX59mzoMZsLKqUweyYBAIvTngR3shc0W6aOZylZmq/7hqyVxPdi+5Ud2QInblgyE72fw==",
|
||||
"requires": {
|
||||
"async-limiter": "~1.0.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"async-limiter": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/async-limiter/-/async-limiter-1.0.1.tgz",
|
||||
"integrity": "sha512-csOlWGAcRFJaI6m+F2WKdnMKr4HhdhFVBk0H/QbJFMCr+uO2kwohwXQPxw/9OCxp05r5ghVBFSyioixx3gfkNQ=="
|
||||
}
|
||||
}
|
||||
},
|
||||
"yargs": {
|
||||
|
||||
@ -9,6 +9,7 @@
|
||||
"bootstrap": "^5.0.1",
|
||||
"react": "^17.0.2",
|
||||
"react-dom": "^17.0.2",
|
||||
"react-responsive-image": "^5.0.0",
|
||||
"react-router-dom": "^5.2.0",
|
||||
"react-scripts": "4.0.3",
|
||||
"web-vitals": "^1.1.2"
|
||||
|
||||
BIN
highneed_react/public/images/img-article-m.jpg
Normal file
BIN
highneed_react/public/images/img-article-m.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 142 KiB |
BIN
highneed_react/public/images/img-article-s.jpg
Normal file
BIN
highneed_react/public/images/img-article-s.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 132 KiB |
BIN
highneed_react/public/images/img-article.jpg
Normal file
BIN
highneed_react/public/images/img-article.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 226 KiB |
BIN
highneed_react/public/images/img-article2-m.jpg
Normal file
BIN
highneed_react/public/images/img-article2-m.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 61 KiB |
BIN
highneed_react/public/images/img-article2-s.jpg
Normal file
BIN
highneed_react/public/images/img-article2-s.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 23 KiB |
BIN
highneed_react/public/images/img-article2.jpg
Normal file
BIN
highneed_react/public/images/img-article2.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 121 KiB |
BIN
highneed_react/public/images/img-map-m.png
Normal file
BIN
highneed_react/public/images/img-map-m.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 398 KiB |
BIN
highneed_react/public/images/img-map-s.png
Normal file
BIN
highneed_react/public/images/img-map-s.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 134 KiB |
BIN
highneed_react/public/images/img-map.png
Normal file
BIN
highneed_react/public/images/img-map.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1019 KiB |
@ -5,8 +5,9 @@ body
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
box-sizing: content-box;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: 'Verdana';
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
45
highneed_react/src/Pages/Home-responsive.css
Normal file
45
highneed_react/src/Pages/Home-responsive.css
Normal file
@ -0,0 +1,45 @@
|
||||
@media screen and (max-width: 416px) {
|
||||
.article-container {
|
||||
padding-top: 3%;
|
||||
padding-bottom: 3%;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.article-img {
|
||||
margin-bottom: 1%;
|
||||
}
|
||||
|
||||
.article2-container {
|
||||
height:300px;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.search-components {
|
||||
width: 170px;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media screen and (min-width: 801px) {
|
||||
.article-container {
|
||||
justify-content: space-evenly;
|
||||
}
|
||||
|
||||
.article2-container {
|
||||
justify-content: space-evenly;
|
||||
}
|
||||
|
||||
p{
|
||||
max-width: 700px;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
107
highneed_react/src/Pages/Home.css
Normal file
107
highneed_react/src/Pages/Home.css
Normal file
@ -0,0 +1,107 @@
|
||||
.homepage {
|
||||
}
|
||||
|
||||
.article-container {
|
||||
padding-top: 2.5%;
|
||||
padding-bottom: 2.5%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.article2-container {
|
||||
padding-top: 2.5%;
|
||||
padding-bottom: 2.5%;
|
||||
background-color: #F0FAF3;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.article4-container {
|
||||
padding-top: 2.5%;
|
||||
padding-bottom: 2.5%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.article-text {
|
||||
padding-left: 1%;
|
||||
padding-right: 1%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.article2-text {
|
||||
padding-left: 1%;
|
||||
padding-right: 1%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.article4-text {
|
||||
height: 300px;
|
||||
padding-left: 1%;
|
||||
padding-right: 1%;
|
||||
}
|
||||
|
||||
|
||||
.article-img {
|
||||
border-radius: 5%;
|
||||
overflow: clip;
|
||||
margin-left: 1%;
|
||||
margin-right: 1%;
|
||||
}
|
||||
|
||||
.article-img2 {
|
||||
border-radius: 50%;
|
||||
overflow: clip;
|
||||
margin-left: 1%;
|
||||
margin-right: 1%;
|
||||
}
|
||||
|
||||
.article-img3 {
|
||||
max-height:500px;
|
||||
overflow:clip;
|
||||
}
|
||||
|
||||
h1 {
|
||||
padding-bottom: 8px;
|
||||
text-align: center;
|
||||
font-size: 20px;
|
||||
color: #347945;
|
||||
}
|
||||
|
||||
p {
|
||||
text-align: justify;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.article-line {
|
||||
height: 5px;
|
||||
width: 100%;
|
||||
background-color: #347945;
|
||||
}
|
||||
|
||||
.center {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.searching {
|
||||
padding-top: 10%;
|
||||
}
|
||||
|
||||
.search-components {
|
||||
width: 205px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.button-icon {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
@ -1,12 +1,126 @@
|
||||
import React from 'react';
|
||||
import '../App.css';
|
||||
import { Link } from 'react-router-dom';
|
||||
import { ResponsiveImage, ResponsiveImageSize } from 'react-responsive-image';
|
||||
import './Home.css'
|
||||
import './Home-responsive.css'
|
||||
import BottomBar from '../components/BottomBar';
|
||||
|
||||
const small = '/images/img-article-s.jpg';
|
||||
const medium = '/images/img-article-m.jpg';
|
||||
const large = '/images/img-article.jpg';
|
||||
|
||||
const small_2 = '/images/img-article2-s.jpg';
|
||||
const medium_2 = '/images/img-article2-m.jpg';
|
||||
const large_2 = '/images/img-article2.jpg';
|
||||
|
||||
const small_3 = '/images/img-map-s.png';
|
||||
const medium_3 = '/images/img-map-m.png';
|
||||
const large_3 = '/images/img-map.png';
|
||||
|
||||
|
||||
function Home() {
|
||||
return (
|
||||
<>
|
||||
Strona główna
|
||||
</>
|
||||
);
|
||||
return (
|
||||
<>
|
||||
<div className='homepage'>
|
||||
<div className='article-container'>
|
||||
<div className='article-img'>
|
||||
<ResponsiveImage>
|
||||
<ResponsiveImageSize
|
||||
minWidth={0}
|
||||
path={small}
|
||||
|
||||
/>
|
||||
<ResponsiveImageSize
|
||||
minWidth={416}
|
||||
path={medium}
|
||||
/>
|
||||
<ResponsiveImageSize
|
||||
minWidth={801}
|
||||
path={large}
|
||||
/>
|
||||
</ResponsiveImage>
|
||||
</div>
|
||||
|
||||
<div className='article-text'>
|
||||
<h1>Witamy na stronie HighNeed</h1>
|
||||
<p>HighNeed.pl jest portalem do planowania aktywności dla rodzin z dziećmi w Poznaniu.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class='article-line'></div>
|
||||
|
||||
<div className='article2-container'>
|
||||
<div className='article2-text'>
|
||||
<h1>Wyszukiwanie wydarzeń w Twojej okolicy</h1>
|
||||
<p>Znajdź grupy i wydarzenia na terenie Poznania, dzięki którym Twoje dziecko rozwinie swoje zainteresowania oraz zawrze nowe znajomości. </p>
|
||||
|
||||
<Link className='center searching' to={'/search-event'}>
|
||||
<button className='button'>
|
||||
<div className='search-components'>
|
||||
<div className='search button-icon'>
|
||||
<svg width="25" height="25" viewBox="0 0 25 25" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M16.9325 15.7562C18.969 13.1408 18.785 9.35694 16.3807 6.95262C13.7772 4.34913 9.55612 4.34913 6.95262 6.95262C4.34913 9.55612 4.34913 13.7772 6.95262 16.3807C9.35694 18.785 13.1408 18.969 15.7562 16.9325C15.7675 16.9453 15.7793 16.9578 15.7915 16.97L19.327 20.5055C19.6524 20.8309 20.1801 20.8309 20.5055 20.5055C20.8309 20.1801 20.8309 19.6524 20.5055 19.327L16.97 15.7915C16.9578 15.7793 16.9453 15.7675 16.9325 15.7562ZM15.2022 8.13113C17.1548 10.0838 17.1548 13.2496 15.2022 15.2022C13.2496 17.1548 10.0838 17.1548 8.13113 15.2022C6.17851 13.2496 6.17851 10.0838 8.13113 8.13113C10.0838 6.17851 13.2496 6.17851 15.2022 8.13113Z" fill="white" />
|
||||
</svg>
|
||||
</div>
|
||||
<div className='search-text'>
|
||||
Wyszukaj wydarzenia
|
||||
</div>
|
||||
</div>
|
||||
</button>
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
<div className='article-img2'>
|
||||
<ResponsiveImage>
|
||||
<ResponsiveImageSize
|
||||
minWidth={0}
|
||||
path={small_2}
|
||||
/>
|
||||
<ResponsiveImageSize
|
||||
minWidth={416}
|
||||
path={medium_2}
|
||||
/>
|
||||
<ResponsiveImageSize
|
||||
minWidth={801}
|
||||
path={large_2}
|
||||
/>
|
||||
</ResponsiveImage>
|
||||
</div>
|
||||
</div>
|
||||
<div class='article-line'></div>
|
||||
|
||||
<div className='article3-container'>
|
||||
<div className='article-img3'>
|
||||
<ResponsiveImage>
|
||||
<ResponsiveImageSize
|
||||
minWidth={0}
|
||||
path={small_3}
|
||||
/>
|
||||
<ResponsiveImageSize
|
||||
minWidth={416}
|
||||
path={medium_3}
|
||||
/>
|
||||
<ResponsiveImageSize
|
||||
minWidth={801}
|
||||
path={large_3}
|
||||
/>
|
||||
</ResponsiveImage>
|
||||
</div>
|
||||
</div>
|
||||
<div class='article-line'></div>
|
||||
|
||||
<div className='article4-container'>
|
||||
<div className='article4-text'>
|
||||
<h1>Nadchodzące wydarzenia</h1>
|
||||
|
||||
<p>* Będzie po połączeniu zaimportowanych wydarzeń *</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class='article-line'></div>
|
||||
|
||||
<BottomBar />
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
export default Home;
|
||||
53
highneed_react/src/components/BottomBar.css
Normal file
53
highneed_react/src/components/BottomBar.css
Normal file
@ -0,0 +1,53 @@
|
||||
.bottom-bar {
|
||||
background-color: #64BE7B;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.contact-info {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 0.5% 1%;
|
||||
}
|
||||
|
||||
.contact-container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.contact {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.contact:hover {
|
||||
color: #347945;
|
||||
}
|
||||
|
||||
.contact-text {
|
||||
height: 22px;
|
||||
font-size: 16px;
|
||||
text-decoration: underline;
|
||||
padding-left: 1%;
|
||||
padding-right: 1%;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 20px;
|
||||
padding-bottom: 0.5%;
|
||||
}
|
||||
|
||||
|
||||
|
||||
@media screen and (max-width: 416px) {
|
||||
h2 {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.contact-text {
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.contact-icon {
|
||||
scale: 90%;
|
||||
}
|
||||
}
|
||||
41
highneed_react/src/components/BottomBar.js
Normal file
41
highneed_react/src/components/BottomBar.js
Normal file
@ -0,0 +1,41 @@
|
||||
import React, { useState } from 'react'
|
||||
import { Link } from 'react-router-dom';
|
||||
import './BottomBar.css';
|
||||
|
||||
function BottomBar() {
|
||||
return (
|
||||
<div className='bottom-bar'>
|
||||
<div className='contact-info'>
|
||||
<h2 center>Kontakt:</h2>
|
||||
|
||||
<div className='contact-container'>
|
||||
<div className='contact-icon'>
|
||||
<svg width="22" height="18" viewBox="0 0 22 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect x="2.19995" y="2.26282" width="17.6" height="13.5771" fill="white" />
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M0.011941 1.22869C0.011941 0.550109 0.559142 0 1.23416 0H20.7778C21.4528 0 22 0.550109 22 1.22869V15.1426C22 16.4998 20.9056 17.6 19.5556 17.6H2.44444C1.09441 17.6 0 16.4998 0 15.1426V1.62705C0 1.56854 0.0040699 1.51099 0.011941 1.45466V1.22869ZM2.44444 3.961V15.1426H19.5556V3.96142L13.5929 9.95559C12.161 11.3951 9.83938 11.3951 8.40748 9.95559L2.44444 3.961ZM4.36617 2.41763H17.6342L11.8645 8.21798C11.3872 8.69778 10.6133 8.69778 10.136 8.21798L4.36617 2.41763Z" fill="#FF0000" />
|
||||
</svg>
|
||||
</div>
|
||||
<div className='contact-text'>
|
||||
<p2>testowymail@mail.com</p2>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<Link className='contact' to={'/fanpage'}>
|
||||
<div className='contact-container'>
|
||||
<div className='contact-icon'>
|
||||
<svg width="22" height="23" viewBox="0 0 22 23" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M22 11.3492C22 5.08071 17.0756 0 11 0C4.92438 0 0 5.08071 0 11.3492C0 17.0145 4.02027 21.7096 9.28219 22.5616V14.6327H6.49151V11.3492H9.28219V8.84927C9.28219 6.00731 10.9216 4.43396 13.4351 4.43396C14.6405 4.43396 15.9003 4.65784 15.9003 4.65784V7.45005H14.514C13.1458 7.45005 12.7238 8.3269 12.7238 9.2224V11.3492H15.7737L15.2855 14.6327H12.7238V22.5616C17.9797 21.7096 22 17.0145 22 11.3492Z" fill="#1877F2" />
|
||||
<path d="M15.2794 14.6327L15.7677 11.3492H12.7178V9.22239C12.7178 8.32689 13.1457 7.45005 14.5079 7.45005H15.8942V4.65783C15.8942 4.65783 14.6345 4.43396 13.429 4.43396C10.9156 4.43396 9.27616 6.0073 9.27616 8.84927V11.3492H6.48547V14.6327H9.27616V22.5616C9.83671 22.6549 10.4093 22.6984 10.994 22.6984C11.5786 22.6984 12.1512 22.6487 12.7118 22.5616V14.6327H15.2794Z" fill="white" />
|
||||
</svg>
|
||||
</div>
|
||||
<div className='contact-text'>
|
||||
<p2>Facebook fanpage</p2>
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default BottomBar;
|
||||
@ -18,16 +18,20 @@ function EventItem(props) {
|
||||
</Link>
|
||||
<div className='events__item__info'>
|
||||
<h5 className='events__item__data'>{props.data}</h5>
|
||||
|
||||
<Link className='events__item__link' to={props.path}>
|
||||
<h4 className='events__item__title'>{props.title}</h4>
|
||||
</Link>
|
||||
<h4 className='events__item__title'>{props.title}</h4>
|
||||
</Link>
|
||||
<h5 className='events__item__category'>{props.category}</h5>
|
||||
<h5 className='events__item__age'>{props.age}</h5>
|
||||
<h5 className='events__item__address'>{props.address}</h5>
|
||||
<Link className='events__item__link' to={props.path}>
|
||||
<button className='button button-details'>Szczegóły</button> </Link>
|
||||
<Link className='events__item__link' to={props.path}>
|
||||
<button className='button button-add'>Dodaj do listy</button> </Link>
|
||||
|
||||
<Link className='events__item__link' to={props.path}>
|
||||
<button className='button button-details'>Szczegóły</button>
|
||||
</Link>
|
||||
<Link className='events__item__link' to={props.path}>
|
||||
<button className='button button-add'>Dodaj do listy</button>
|
||||
</Link>
|
||||
</div>
|
||||
</li>
|
||||
</>
|
||||
|
||||
@ -40,19 +40,16 @@ a
|
||||
color: black;
|
||||
}
|
||||
|
||||
.button
|
||||
{
|
||||
background-color: #64BE7B; /* Green */
|
||||
border: none;
|
||||
color: white;
|
||||
padding: 8px 16px;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
display: inline-block;
|
||||
font-size: 16px;
|
||||
margin: 4px 2px;
|
||||
border-radius: 15px;
|
||||
cursor: pointer;
|
||||
.button {
|
||||
background-color: #64BE7B; /* Green */
|
||||
border: none;
|
||||
color: white;
|
||||
padding: 8px 16px;
|
||||
text-align: center;
|
||||
display: inline-block;
|
||||
font-size: 16px;
|
||||
border-radius: 40px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.button:hover {background-color: #347945}
|
||||
|
||||
@ -1,24 +1,19 @@
|
||||
.navbar
|
||||
{
|
||||
background-color: #64BE7B;
|
||||
.navbar {
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
height: 60px;
|
||||
z-index: 999;
|
||||
}
|
||||
|
||||
.navbar-container
|
||||
{
|
||||
.navbar-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
background-color: #64BE7B;
|
||||
width: 100%;
|
||||
margin: auto;
|
||||
height: 45px;
|
||||
height: 60px;
|
||||
}
|
||||
|
||||
|
||||
.line
|
||||
{
|
||||
.line {
|
||||
height: 5px;
|
||||
width: 100%;
|
||||
background-color: #347945;
|
||||
@ -31,11 +26,10 @@
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.logo-h1
|
||||
{
|
||||
.logo-h1 {
|
||||
color: white;
|
||||
font-size: 18px;
|
||||
font-weight:bold;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.logo-h2 {
|
||||
@ -45,15 +39,12 @@
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.icons
|
||||
{
|
||||
.icons {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.icon-container
|
||||
{
|
||||
.icon-container {
|
||||
height: 45px;
|
||||
width: 45px;
|
||||
display: flex;
|
||||
@ -62,69 +53,55 @@
|
||||
}
|
||||
|
||||
|
||||
li
|
||||
{
|
||||
li {
|
||||
display: flex;
|
||||
padding: 5px;
|
||||
text-align: center;
|
||||
|
||||
}
|
||||
|
||||
.menu-icon-list
|
||||
{
|
||||
.menu-icon-list {
|
||||
position: relative;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
}
|
||||
|
||||
.menu-icon-cross
|
||||
{
|
||||
.menu-icon-cross {
|
||||
position: relative;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
}
|
||||
|
||||
|
||||
.icon-list, .icon-cross
|
||||
{
|
||||
.icon-list, .icon-cross {
|
||||
position: absolute;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.sidebar.disable
|
||||
{
|
||||
.sidebar.disable {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.menu-icon-cross .icon-cross
|
||||
{
|
||||
.menu-icon-cross .icon-cross {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.menu-icon-list .icon-list
|
||||
{
|
||||
.menu-icon-list .icon-list {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
a
|
||||
{
|
||||
a {
|
||||
text-decoration: none;
|
||||
}
|
||||
.nav-links
|
||||
{
|
||||
|
||||
.nav-links {
|
||||
color: black;
|
||||
text-decoration: none;
|
||||
|
||||
}
|
||||
|
||||
ul
|
||||
{
|
||||
ul {
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.sidebar
|
||||
{
|
||||
.sidebar {
|
||||
width: 250px;
|
||||
height: 100%;
|
||||
border-right: black 1px solid;
|
||||
@ -133,17 +110,15 @@ ul
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
.sidebar-icon
|
||||
{
|
||||
.sidebar-icon {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.sidebar-text
|
||||
{
|
||||
.sidebar-text {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding-left:10px ;
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
@ -12,35 +12,35 @@ function NavBar() {
|
||||
<nav className='navbar'>
|
||||
<div className='navbar-container'>
|
||||
|
||||
<div className='menu-icon icon-container' onClick={handleClick}>
|
||||
<div className='menu icon-container' onClick={handleClick}>
|
||||
<div className={click ? 'menu-icon-list' : 'menu-icon-cross'}>
|
||||
<svg className='icon-list' width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<line x1="4.28572" y1="7.92847" x2="25.7143" y2="7.92847" stroke="white" stroke-width="3" />
|
||||
<line x1="4.28572" y1="21.6428" x2="25.7143" y2="21.6428" stroke="white" stroke-width="3" />
|
||||
<line x1="4.28572" y1="14.7856" x2="25.7143" y2="14.7856" stroke="white" stroke-width="3" />
|
||||
</svg>
|
||||
<svg className='icon-cross' width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M18.3 5.70997C17.91 5.31997 17.28 5.31997 16.89 5.70997L12 10.59L7.10997 5.69997C6.71997 5.30997 6.08997 5.30997 5.69997 5.69997C5.30997 6.08997 5.30997 6.71997 5.69997 7.10997L10.59 12L5.69997 16.89C5.30997 17.28 5.30997 17.91 5.69997 18.3C6.08997 18.69 6.71997 18.69 7.10997 18.3L12 13.41L16.89 18.3C17.28 18.69 17.91 18.69 18.3 18.3C18.69 17.91 18.69 17.28 18.3 16.89L13.41 12L18.3 7.10997C18.68 6.72997 18.68 6.08997 18.3 5.70997V5.70997Z" fill="white" />
|
||||
<line x1="4.28577" y1="7.92859" x2="25.7143" y2="7.92859" stroke="white" stroke-width="3" />
|
||||
<line x1="4.28577" y1="21.6428" x2="25.7143" y2="21.6428" stroke="white" stroke-width="3" />
|
||||
<line x1="4.28577" y1="14.7858" x2="25.7143" y2="14.7858" stroke="white" stroke-width="3" />
|
||||
</svg>
|
||||
|
||||
<svg className='icon-cross' width="30" height="30" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M18.3 5.70997C17.91 5.31997 17.28 5.31997 16.89 5.70997L12 10.59L7.10997 5.69997C6.71997 5.30997 6.08997 5.30997 5.69997 5.69997C5.30997 6.08997 5.30997 6.71997 5.69997 7.10997L10.59 12L5.69997 16.89C5.30997 17.28 5.30997 17.91 5.69997 18.3C6.08997 18.69 6.71997 18.69 7.10997 18.3L12 13.41L16.89 18.3C17.28 18.69 17.91 18.69 18.3 18.3C18.69 17.91 18.69 17.28 18.3 16.89L13.41 12L18.3 7.10997C18.68 6.72997 18.68 6.08997 18.3 5.70997V5.70997Z" fill="white" />
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div classname='logo'>
|
||||
<Link to='/' onClick={closeMobileMenu}>
|
||||
<div className = 'logo-h1'> HighNeed.pl </div>
|
||||
<div className ='logo-h1'> HighNeed.pl </div>
|
||||
<div className='logo-h2'> Poznań </div>
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
<div className='icons'>
|
||||
<div className='home-icon icon-container'>
|
||||
<div className='home icon-container'>
|
||||
<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M12.6061 23.7391V17.4347H17.3886V23.7391C17.3886 24.4326 17.9267 25 18.5843 25H22.1712C22.8288 25 23.3668 24.4326 23.3668 23.7391V14.9129H25.3994C25.9494 14.9129 26.2125 14.1942 25.794 13.816L15.7984 4.32153C15.3441 3.89282 14.6506 3.89282 14.1963 4.32153L4.20069 13.816C3.79417 14.1942 4.04526 14.9129 4.59525 14.9129H6.62785V23.7391C6.62785 24.4326 7.16588 25 7.82349 25H11.4104C12.068 25 12.6061 24.4326 12.6061 23.7391Z" fill="white" />
|
||||
</svg>
|
||||
</div>
|
||||
|
||||
<div className='log-in-icon icon-container'>
|
||||
<div className='log-in icon-container'>
|
||||
<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M19.6805 8.1121C19.6805 10.4926 17.6606 12.4224 15.1692 12.4224C12.6777 12.4224 10.6579 10.4926 10.6579 8.1121C10.6579 5.73156 12.6777 3.80176 15.1692 3.80176C17.6606 3.80176 19.6805 5.73156 19.6805 8.1121ZM17.4248 8.1121C17.4248 9.30237 16.415 10.2673 15.1692 10.2673C13.9234 10.2673 12.9135 9.30237 12.9135 8.1121C12.9135 6.92183 13.9234 5.95693 15.1692 5.95693C16.415 5.95693 17.4248 6.92183 17.4248 8.1121Z" fill="white" />
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M7.5 24.6724V17.1724C7.5 15.1012 8.93909 13.4224 10.7143 13.4224H19.2857C21.061 13.4224 22.5 15.1012 22.5 17.1724V24.6724H7.5ZM19.2857 15.9224C19.8775 15.9224 20.3571 16.482 20.3571 17.1724V22.3448H9.64286V17.1724C9.64286 16.482 10.1226 15.9224 10.7143 15.9224H19.2857Z" fill="white" />
|
||||
@ -48,10 +48,10 @@ function NavBar() {
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class='line'></div>
|
||||
</nav>
|
||||
<div className='line'></div>
|
||||
|
||||
<nav className={click ? 'sidebar' : 'sidebar disable'}>
|
||||
<ul>
|
||||
<li>
|
||||
@ -102,6 +102,7 @@ function NavBar() {
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user