Prakash1185 opened a new pull request, #993:
URL: https://github.com/apache/dolphinscheduler-website/pull/993

   ## Summary
   - This PR improves the overall responsiveness of the homepage 
   - Improves the css in all the sections of the homepage
   
   ---
   
   ## Problem
   
   - Herosection : Buttons overflow, no carousel in smaller screens , blank 
github and fork data.
   - Tasks : Non responsive title style, overflow of tasks item images.
   - Why DolphinScheduler : After 640px and below 1100px the cards were 
overlapping each other.
   - Features : Each features cards were not centre aligned on smaller screen.
   - Community : Blank github start and fork data , not centred , image was not 
visible on smaller screens.
   - Latest Post : Image not visible on smaller screens , overflow on tablet 
screen sizes.
   - Stay connect : Extra space in y direction
   - Footer : contact and email not visible on smaller screen sizes , not 
centred in smaller screens.
   ---
   
   ## Changes Made
   
   - Fixed all the above problems with proper css , media queries with 
breakpoints.
   
   
   ## Breakpoints
   
   ```
   1280px - Large desktop
   1024px - Tablet landscape
   768px  - Tablet portrait
   640px  - Large mobile
   480px  - Small mobile
   ```
   ---
   
   ## 📸 Screenshots ( Desktop , Mobile , Tablet )
   
   ### Before vs After
   
   #### Herosection
   
   | Before | After |
   |--------|-------|
   |<img width="1919" height="806" alt="Screenshot 2026-01-26 223600" 
src="https://github.com/user-attachments/assets/c16523c1-bedc-48dc-8480-16aca7190a2d";
 /> |<img width="1917" height="811" alt="Screenshot 2026-01-26 223537" 
src="https://github.com/user-attachments/assets/4ed9fc24-20b9-4b05-a704-fde00180f9c4";
 />|
   |<img width="396" height="583" alt="Screenshot 2026-01-26 223905" 
src="https://github.com/user-attachments/assets/0cbb3e33-23e4-48e7-8b0e-02a801501bd3";
 />|<img width="400" height="770" alt="Screenshot 2026-01-26 223851" 
src="https://github.com/user-attachments/assets/61a35f7e-1d42-4fb3-bb22-d84f3e2295e0";
 />|
   |<img width="478" height="386" alt="Screenshot 2026-01-26 224116" 
src="https://github.com/user-attachments/assets/c7e75477-e9e8-4759-8ccf-77db057b3cf5";
 />|<img width="479" height="580" alt="Screenshot 2026-01-26 224122" 
src="https://github.com/user-attachments/assets/af26a818-9986-4a6d-97dc-352b9235a2c6";
 />|
   
   #### Tasks
   
   | Before | After |
   |--------|-------|
   | <img width="1919" height="806" alt="Screenshot 2026-01-26 223613" 
src="https://github.com/user-attachments/assets/42678b69-ca74-45f4-b27d-84a02078f612";
 />|<img width="1919" height="808" alt="Screenshot 2026-01-26 223627" 
src="https://github.com/user-attachments/assets/83138535-1ed7-4a02-8430-1751b1100f71";
 />|
   |<img width="411" height="432" alt="Screenshot 2026-01-26 223915" 
src="https://github.com/user-attachments/assets/37d94821-0153-41a1-a6d0-6648b0615f51";
 />|<img width="395" height="438" alt="Screenshot 2026-01-26 223920" 
src="https://github.com/user-attachments/assets/9258c3ef-bb8c-4fe8-a242-4003389bc7dc";
 />|
   |<img width="485" height="439" alt="Screenshot 2026-01-26 224128" 
src="https://github.com/user-attachments/assets/006c9909-a31a-4e02-b689-657ec35c215a";
 />|<img width="478" height="464" alt="Screenshot 2026-01-26 224134" 
src="https://github.com/user-attachments/assets/42809af8-a66c-4447-85ce-1facf1970344";
 />|
   
   #### Why DolphinScheduler 
   | Before | After |
   |--------|-------|
   |<img width="1919" height="807" alt="Screenshot 2026-01-26 223643" 
src="https://github.com/user-attachments/assets/88b3edea-ffab-4d70-b6ab-91be0fa2c9c3";
 />|<img width="1919" height="808" alt="Screenshot 2026-01-26 223649" 
src="https://github.com/user-attachments/assets/cc557d58-5cbb-49d5-a3a9-973ab14567ec";
 />|
   |<img width="398" height="547" alt="Screenshot 2026-01-26 223925" 
src="https://github.com/user-attachments/assets/d8085406-f18c-423a-a927-f01741987072";
 />|<img width="398" height="736" alt="Screenshot 2026-01-26 223936" 
src="https://github.com/user-attachments/assets/708fc499-1579-4a74-8ec9-1e3ae3dde74f";
 />|
   |<img width="475" height="664" alt="Screenshot 2026-01-26 224140" 
src="https://github.com/user-attachments/assets/a5a1c66e-5eeb-453b-8afd-8b2cea8969d4";
 />|<img width="486" height="730" alt="Screenshot 2026-01-26 224155" 
src="https://github.com/user-attachments/assets/6f4a3f45-df7c-443e-8b13-cb547343ebbd";
 />|
   
   #### Features
   | Before | After |
   |--------|-------|
   |<img width="1919" height="817" alt="Screenshot 2026-01-26 223701" 
src="https://github.com/user-attachments/assets/97d23021-5a02-447b-9b08-f5f5c8074871";
 />|<img width="1919" height="809" alt="Screenshot 2026-01-26 223714" 
src="https://github.com/user-attachments/assets/b91106c5-8481-470b-aeb4-17da5ad30f68";
 />|
   |<img width="400" height="733" alt="Screenshot 2026-01-26 223945" 
src="https://github.com/user-attachments/assets/32fc9604-5d53-43bf-89b1-73ab2f0e982d";
 />|<img width="395" height="731" alt="Screenshot 2026-01-26 223952" 
src="https://github.com/user-attachments/assets/520a9c4d-ea23-41e4-9eaa-cfbcf8c9ff77";
 />|
   |<img width="478" height="489" alt="Screenshot 2026-01-26 224200" 
src="https://github.com/user-attachments/assets/f34aee2b-6ed6-40eb-8192-fb271a2d18bd";
 />|<img width="483" height="512" alt="Screenshot 2026-01-26 224206" 
src="https://github.com/user-attachments/assets/a3a4371f-e7ce-4473-8949-a267b5e74fed";
 />|
   
   #### Community
   | Before | After |
   |--------|-------|
   |<img width="1919" height="811" alt="Screenshot 2026-01-26 223721" 
src="https://github.com/user-attachments/assets/86ca6787-42ae-42c1-b30f-73a3d5703c10";
 />|<img width="1919" height="758" alt="Screenshot 2026-01-26 223728" 
src="https://github.com/user-attachments/assets/46b030b9-15d1-42d2-8d00-cd83e6e6b51b";
 />|
   |<img width="395" height="516" alt="Screenshot 2026-01-26 223957" 
src="https://github.com/user-attachments/assets/d1055a34-93fa-4e0a-b745-6a94b829cebb";
 />|<img width="400" height="609" alt="Screenshot 2026-01-26 224013" 
src="https://github.com/user-attachments/assets/9704a5da-75ec-401b-89f5-3291d4c567c0";
 />|
   |<img width="481" height="353" alt="Screenshot 2026-01-26 224211" 
src="https://github.com/user-attachments/assets/7e88a54b-c2f1-4402-8c91-1bbd4c6d0f5a";
 />|<img width="478" height="510" alt="Screenshot 2026-01-26 224216" 
src="https://github.com/user-attachments/assets/0b1bcd99-3cd2-4344-b04f-5a5768fce141";
 />|
   
   #### Latest Posts
   | Before | After |
   |--------|-------|
   |<img width="1764" height="665" alt="Screenshot 2026-01-26 223739" 
src="https://github.com/user-attachments/assets/1734250d-55c0-4bf6-a312-4db9caa0e30c";
 />|<img width="1731" height="653" alt="Screenshot 2026-01-26 223747" 
src="https://github.com/user-attachments/assets/0854dcbc-241d-49f5-a356-7c4692f6ad84";
 />|
   |<img width="401" height="366" alt="Screenshot 2026-01-26 224020" 
src="https://github.com/user-attachments/assets/44db1660-f12e-4a04-a292-16ad2abb9fe5";
 />|<img width="397" height="452" alt="Screenshot 2026-01-26 224026" 
src="https://github.com/user-attachments/assets/5bfae715-9c0e-41b6-80d7-c5ee0540df1e";
 />|
   |<img width="478" height="353" alt="Screenshot 2026-01-26 224220" 
src="https://github.com/user-attachments/assets/bb2ad8ac-f745-41ab-a22b-093f6c42b8f6";
 />|<img width="481" height="418" alt="Screenshot 2026-01-26 224226" 
src="https://github.com/user-attachments/assets/d675c3f4-22b6-49d3-98b8-df9b6c3fb6ec";
 />|
   
   
   #### Stay connect
   | Before | After |
   |--------|-------|
   |<img width="1769" height="465" alt="Screenshot 2026-01-26 223756" 
src="https://github.com/user-attachments/assets/d692cf1a-2e1b-447f-b44a-b2f98377740a";
 />|<img width="1913" height="521" alt="Screenshot 2026-01-26 223814" 
src="https://github.com/user-attachments/assets/6778ee1e-b4d0-4512-81dd-13653b6cd0cc";
 />|
   |<img width="397" height="353" alt="Screenshot 2026-01-26 224035" 
src="https://github.com/user-attachments/assets/3bbbdc62-1bce-4717-a3fd-106191f5334e";
 />|<img width="397" height="330" alt="Screenshot 2026-01-26 224039" 
src="https://github.com/user-attachments/assets/f412fc4f-0b0f-4ae2-b171-67175d7faafe";
 />|
   |<img width="477" height="233" alt="Screenshot 2026-01-26 224231" 
src="https://github.com/user-attachments/assets/ceb59fdf-85df-45b7-bf98-c292d7c8b12b";
 />|<img width="475" height="199" alt="Screenshot 2026-01-26 224235" 
src="https://github.com/user-attachments/assets/5eb4de7b-4531-4167-8c00-f70a93bcee1a";
 />|
   
   #### Footer
   | Before | After |
   |--------|-------|
   |<img width="1919" height="336" alt="Screenshot 2026-01-26 223819" 
src="https://github.com/user-attachments/assets/d26acd69-cc3e-4eea-831e-024d1b3a1717";
 />|<img width="1919" height="417" alt="Screenshot 2026-01-26 223822" 
src="https://github.com/user-attachments/assets/c51eb241-b29d-43d1-88ba-8cd2868ef955";
 />|
   |<img width="398" height="249" alt="Screenshot 2026-01-26 224044" 
src="https://github.com/user-attachments/assets/2e5f1ea7-824b-4bc3-9f9c-601c36526982";
 />|<img width="402" height="314" alt="Screenshot 2026-01-26 224050" 
src="https://github.com/user-attachments/assets/d59acd30-0267-4842-9715-5fe211cd40ef";
 />|
   |<img width="485" height="174" alt="Screenshot 2026-01-26 224239" 
src="https://github.com/user-attachments/assets/358115d7-dc8f-4636-9551-219adc4c134a";
 />|<img width="484" height="344" alt="Screenshot 2026-01-26 224244" 
src="https://github.com/user-attachments/assets/38584619-f1ba-4cf5-a5d3-12881893a6d8";
 />|
   
   ---


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: [email protected]

For queries about this service, please contact Infrastructure at:
[email protected]

Reply via email to