⭕I have added this in-app icon whose name is Trunks Assignment.
🖇️The Rambagh Polo Trunk website is a visually captivating online platform designed for desktop users. The project is characterized by a horizontal format and incorporates specific elements and GIFs to create an immersive and engaging user experience.
Resume | Github | Portfolio | Blogger | Medium | |
---|---|---|---|---|---|
-
HTML5
CSS3
-JavaScript
-
-
Netlify
This project involves the development of a website designed for desktop view with specific elements and GIFs. The design task and collaterals can be reviewed on Figma through the following link: Figma Link - https://www.figma.com/file/G2TGlepwu05zHFMHCiHZvR/Demo-(Task)-For-the-Position-of-a-Developer%2F-Rambagh-Polo-Trunk?type=design&node-id=0%3A1&mode=design&t=tPHVpCCFDdIMumHk-1
⭕ Design Specifications
Key Points to Consider:
✨Desktop View: The design should be tailored specifically for the desktop view without any modifications.
✨GIFs: Incorporate GIFs where appropriate within the design. The provided GIFs are named "Full Screen - Polo GIF.gif" and "HANDLE GIF POLO TRUNK.gif."
✨Image Aspect Ratio: Do not stretch or squeeze any of the images. Maintain their original aspect ratio.
✨Image Quality: While optimizing the page for performance, ensure that the image quality remains at a high standard, avoiding significant degradation.
✨Horizontal Format: Design the website to be in a horizontal format.
The project follows a modular structure with different sections, each fulfilling a specific purpose. Below is a brief overview of the sections:
💫1. Introduction (First Section) Full-screen image with text overlay. Text: "Illuminating spirits of the sport. A relationship."
💫2. Treasuring Passion (Second Section) Card with text about the Polo Trunk. Images: "jockey_blur.png" and "Trunkimg3.png."
💫3. Full-Screen Polo GIF (Third Section) Full-screen GIF: "Full Screen - Polo GIF.gif."
💫4. Crystalware + Polo (Fourth Section) Long section with a card on the left and images on the right. Text: "CRYSTALWARE + POLO."
💫5. Handle (Fifth Section) Long section with images and text. Text: "Handle."
💫To implement the horizontal scrollbar, ensure that the .container class has overflow-x: auto;. Additionally, incorporate the GIFs "Full Screen - Polo GIF.gif" and "HANDLE GIF POLO TRUNK.gif" as specified in the design.
💻Clone the repository or download the project files.
💻Open the index.html file in a web browser to view the website.
💻Ensure the design adheres to the specifications mentioned above.
💻Implement the horizontal scrollbar as required.
💻Incorporate the provided GIFs in their designated sections.
graph TD;
App-->HomePage
--------------------------------------------------⭕THANK YOU⭕------------------------------------------------