diff --git a/app.js b/app.js index e69de29..ef2774a 100644 --- a/app.js +++ b/app.js @@ -0,0 +1,38 @@ +//Import modules +const express = require('express'); +const path = require('path'); + +// initialize the app +const app = express(); + +// Set up the port +const PORT = process.env.PORT || 3000; + +// Serve static files +// This tells Express to serve files from the 'public' directory +app.use(express.static(path.join(__dirname, 'public'))); + +// Set up views directory for HTML files +app.set('views', path.join(__dirname, 'views')); + +// Serve HTML pages on different routes +app.get('/', (req, res) => { + res.sendFile(path.join(__dirname, 'views/home.html')); +}); + +app.get('/about', (req, res) => { + res.sendFile(path.join(__dirname, 'views/about.html')); +}); + +app.get('/works', (req, res) => { + res.sendFile(path.join(__dirname, 'views/works.html')); +}); + +app.get('/gallery', (req, res) => { + res.sendFile(path.join(__dirname, 'views/PhotoGallery.html')); + }); + + // Start the server + app.listen(PORT, () => { + console.log(`Server is running on http://localhost:${PORT}`); + }); \ No newline at end of file diff --git a/package.json b/package.json new file mode 100644 index 0000000..6010a14 --- /dev/null +++ b/package.json @@ -0,0 +1,5 @@ +{ + "dependencies": { + "express": "^4.21.0" + } +} diff --git a/public/CONRA1.png b/public/CONRA1.png new file mode 100644 index 0000000..c4b5009 Binary files /dev/null and b/public/CONRA1.png differ diff --git a/public/CONRA10.png b/public/CONRA10.png new file mode 100644 index 0000000..3503a21 Binary files /dev/null and b/public/CONRA10.png differ diff --git a/public/CONRA11.png b/public/CONRA11.png new file mode 100644 index 0000000..32ea641 Binary files /dev/null and b/public/CONRA11.png differ diff --git a/public/CONRA12.png b/public/CONRA12.png new file mode 100644 index 0000000..b4df3f2 Binary files /dev/null and b/public/CONRA12.png differ diff --git a/public/CONRA2.png b/public/CONRA2.png new file mode 100644 index 0000000..3868f3e Binary files /dev/null and b/public/CONRA2.png differ diff --git a/public/CONRA3.png b/public/CONRA3.png new file mode 100644 index 0000000..f1db7fd Binary files /dev/null and b/public/CONRA3.png differ diff --git a/public/CONRA4.png b/public/CONRA4.png new file mode 100644 index 0000000..3ff8100 Binary files /dev/null and b/public/CONRA4.png differ diff --git a/public/CONRA5.png b/public/CONRA5.png new file mode 100644 index 0000000..41113d1 Binary files /dev/null and b/public/CONRA5.png differ diff --git a/public/CONRA6.png b/public/CONRA6.png new file mode 100644 index 0000000..3ae2896 Binary files /dev/null and b/public/CONRA6.png differ diff --git a/public/CONRA7.png b/public/CONRA7.png new file mode 100644 index 0000000..c8dfe73 Binary files /dev/null and b/public/CONRA7.png differ diff --git a/public/CONRA8.png b/public/CONRA8.png new file mode 100644 index 0000000..86b748f Binary files /dev/null and b/public/CONRA8.png differ diff --git a/public/app.css b/public/app.css new file mode 100644 index 0000000..50d2c54 --- /dev/null +++ b/public/app.css @@ -0,0 +1,333 @@ +body { + font-family: Arial, sans-serif; + margin: 0; + padding: 0; + background-color: #f0f0f0; + height: 100vh; +} + +footer { + color: rgb(0, 0, 0); + text-align: center; + height: 30px; + position: fixed; + bottom: 0; + background-color: #f0f0f0; + width: 100%; +} + +nav ul { + list-style: none; + padding: 20px 0 ; +margin: 0; +} + +nav ul li { + display: inline; + padding: 20px; + +} + +nav ul li:hover{ + background-color: #ba904881; +} + +nav ul li a { + text-decoration: none; + color: #333; + font-weight: bold; +} + +.home-section { + text-align: center; + display: flex; + justify-content: center; + align-items: center; +} + +footer p { + margin: 0; + padding: 5px; + font-size: smaller; +} + + +.conradoh1{ + font-weight: bold; + background-image: url('https://media.gettyimages.com/id/930591096/es/foto/vancouver-bc-conrado-roura-of-argentina-scores-during-game-argentina-vs-samoa-pool-b-match-at.jpg?s=612x612&w=0&k=20&c=yrYAexRHTqq_i6Ue3AjRKQ5GYTx9y_qOvL32FrTVXFI='); + background-size: cover; + background-position: center; + -webkit-background-clip: text; + color: transparent; + font-size: 7rem; +} + +.div-home:hover{ + transition: all 4s ease; +/* height: 70%; */ + width: 100%; + background-image: url('https://media.gettyimages.com/id/930591096/es/foto/vancouver-bc-conrado-roura-of-argentina-scores-during-game-argentina-vs-samoa-pool-b-match-at.jpg?s=612x612&w=0&k=20&c=yrYAexRHTqq_i6Ue3AjRKQ5GYTx9y_qOvL32FrTVXFI='); + background-size: cover; + background-repeat: no-repeat; + background-position: center; + z-index: 10; +} + + +.about-section { + display: flex; + justify-content: center; + align-items: center; + height: 70vh; + + + +} + +.cards{ + display: flex; + justify-content: center; +flex-direction: row; + align-items: center; +} + +.card { + margin: 10px; + width: 22rem; + height: 20rem; +position: relative; +} + +.card-inner { + position: relative; + width: 90%; + height: 100%; + transition: transform 1s; +} + + + +.card-front, .card-back { + position: absolute; + top: 0; + left: 0; + border-radius: 10px; + width: 100%; + height: 100%; + backface-visibility: hidden; /* Hides the back when not visible */ + display: flex; + transition: opacity 0.6s ease-in-out; /* Smooth transition */ + + justify-content: center; + align-items: center; + flex-direction: row; +} + +.card-front { + box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.4); +z-index: 1; + opacity: 1; +} + +.card-back { + z-index: 0; + opacity: 0; + box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.288); +} + +.card-back p{ + padding: 20px; +} + +.card:hover .card-front { + opacity: 0; +} +.card:hover .card-back { + z-index: 1; + opacity: 1; +} + +.biography .card-front { + background-image: url('/conraBiografia.png'); + background-size: cover; + background-position: center; + color: rgb(0, 0, 0); + display: flex; + justify-content: center; + align-items: center; +} + +.card-front h2{ +background-color: #ffffff56; +width: 100%; +text-align: center; +padding: 10px; + +} + +.career .card-front{ + background-image: url('/careerConra.png'); + color: rgb(0, 0, 0); +} + +.legacy .card-front{ + background-image: url('/legacy.png'); +} +/* Photo Gallery Grid */ +.photo-gallery { + padding: 20px; + display: flex; + justify-content: center; + align-items: center; + background-color: white; +} + +/* Masonry effect using columns */ +.gallery-grid { + column-count: 4; /* Number of columns, adjust as needed */ + column-gap: 10px; /* Space between columns */ + width: 90%; + max-width: 1200px; +} + +/* Styling for individual images */ +.gallery-grid img { + width: 100%; + margin-bottom: 10px; /* Space between images vertically */ + object-fit: cover; + border-radius: 5px; + transition: transform 0.3s ease; +} + +/* Hover effect */ +.gallery-grid img:hover { + transform: scale(1.05); /* Slight zoom effect on hover */ +} + +/* Responsive adjustments */ +@media screen and (max-width: 1200px) { + .gallery-grid { + column-count: 3; /* Reduce columns on smaller screens */ + } +} + +@media screen and (max-width: 768px) { + .gallery-grid { + column-count: 2; + } +} + +@media screen and (max-width: 480px) { + .gallery-grid { + column-count: 1; + } +} + + +/* Scrollbar Styles for Webkit-based browsers (Chrome, Safari, etc.) */ +::-webkit-scrollbar { + width: 5px; /* Width of the scrollbar */ +} + +::-webkit-scrollbar-track { + background: #f0f0f0; + border-radius: 50px; +} + +::-webkit-scrollbar-thumb { + background-color: #545454; /* Thumb color */ + border-radius: 50px; /* Rounded corners for the thumb */ + border: 3px solid #f0f0f0; /* Adds space between the thumb and the track */ +} + +::-webkit-scrollbar-thumb:hover { + background-color: #ba9048; /* Darker thumb color on hover */ +} + +/* For Firefox */ +* { + scrollbar-width: thin; /* Makes the scrollbar thinner */ + scrollbar-color: #f0f0f0 #cececec4; /* Thumb color and track color */ +} + + +.professional-board { + padding: 20px; + background-color: #f5f5f5; + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; + gap: 20px; + +} + +.profile-overview { + text-align: left; +display: flex; +flex-direction: row; +justify-content: center; +align-items: center; + width:25rem; + background-color: white; + border: 1px solid #ccc; +} + +.profile-overview img { + border-radius: 10px; + width: 200px; + height: 300px; + object-fit: cover; + margin-bottom: 10px; +} +.div-of-divs{ + column-count: 4; + column-gap: 10px; + display: grid; + grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); /* Grid layout for responsive columns */ +} + +.text-profile-overview{ + padding: 0 20px ; +} + +.profile-overview h1, .profile-overview h2 { + margin: 0; + padding: 10px 0; +} + +.profile-overview h2{ +font-size: smaller; +text-align: center; +} + +.profile-overview, .career-timeline, .skills-section, .testimonials, .media-section { + background-color: white; + border: 1px solid #ccc; + padding: 20px; + margin: 1rem; + width: 30rem; + border-radius: 10px; +} + +.career-timeline ul, .skills-section ul { + list-style-type: none; + padding-left: 0; +} + +.career-timeline ul li, .skills-section ul li { + padding: 5px 0; +} + +.testimonials blockquote { + font-style: italic; + padding: 10px; + border-left: 5px solid #ccc; + margin: 0; +} + +.media-section a { + color: #007bff; + text-decoration: none; +} + diff --git a/public/careerConra.png b/public/careerConra.png new file mode 100644 index 0000000..22d7730 Binary files /dev/null and b/public/careerConra.png differ diff --git a/public/conraBiografia.png b/public/conraBiografia.png new file mode 100644 index 0000000..b08087f Binary files /dev/null and b/public/conraBiografia.png differ diff --git a/public/legacy.png b/public/legacy.png new file mode 100644 index 0000000..a03ac4c Binary files /dev/null and b/public/legacy.png differ diff --git a/public/profileConra.png b/public/profileConra.png new file mode 100644 index 0000000..4b5374f Binary files /dev/null and b/public/profileConra.png differ diff --git a/views/About.html b/views/About.html new file mode 100644 index 0000000..b66a72d --- /dev/null +++ b/views/About.html @@ -0,0 +1,67 @@ + + +
+ + ++ Conrado Roura was born on 28 February 1996 in Argentina, is a celebrated rugby player known for his passion and dedication to the sport. Starting his journey at local club Palermo Bajo, Roura quickly rose through the ranks, showcasing exceptional talent and a deep love for rugby. +
++ He plays as a flanker and has also showcased his skills for Peñarol in the Súper Liga Americana de Rugby and the Dallas Jackals in Major League Rugby. Roura previously represented Argentina Sevens, competing in 13 tournaments between 2017 and 2018. +
++ Conrado Roura is not only an inspiring athlete but also a testament to the growth of Argentine rugby on the international stage. At just 28 years old, he continues to play professionally, currently with Rangers Vicenza in Italy. His dedication and contributions to the sport have made him a role model for aspiring rugby players, showcasing the potential of Argentine talent in global competitions. +
+
+
+
+
+
+
+
+
+
+
+
+
+ "Conrado is a true leader both on and off the field." - Curry+