alaahong commented on code in PR #642: URL: https://github.com/apache/fesod/pull/642#discussion_r2422903446
########## website/src/pages/team/index.css: ########## @@ -19,101 +19,101 @@ /* Derived from https://github.com/apache/streampark-website/tree/dev/src/pages/team */ .team_page { - margin-top: 50px !important; + margin-top: 50px !important; } .team_page h1:first-child { - font-size: 3rem; + font-size: 3rem; } .team_page a { - text-decoration: none; + text-decoration: none; } .team_page .team_title { - margin-top: 40px; + margin-top: 40px; } .team_page .team_desc { - margin-bottom: 40px; + margin-bottom: 40px; } .team_page .team_indent { - line-height: 40px; + line-height: 40px; } .team_page .desc { - font-size: 1rem; - margin-left: .5rem; + font-size: 1rem; + margin-left: 0.5rem; } .team-row { - --bs-gutter-x: 1.5rem; - --bs-gutter-y: 0; - display: -ms-flexbox; - display: flex; - -ms-flex-wrap: wrap; - flex-wrap: wrap; - margin-top: calc(-1 * var(--bs-gutter-y)); - margin-right: calc(-0.5 * var(--bs-gutter-x)); - margin-left: calc(-0.5 * var(--bs-gutter-x)); + --bs-gutter-x: 1.5rem; + --bs-gutter-y: 0; + display: -ms-flexbox; + display: flex; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-top: calc(-1 * var(--bs-gutter-y)); + margin-right: calc(-0.5 * var(--bs-gutter-x)); + margin-left: calc(-0.5 * var(--bs-gutter-x)); } .team-box { - width: 20% !important; - padding: 12px; + width: 20% !important; + padding: 12px; } .team-user-img { - width: 80px; - border-radius: 50%; - border: 2px solid #fff; + width: 80px; + border-radius: 50%; + border: 2px solid #fff; } .bg-team { - margin-top: -1.5rem !important; - padding: 2.5rem 1rem 0.5rem 1rem; - background-color: #ffffff !important; - border-radius: 0.75rem; - box-shadow: 0 0.375rem 1.5rem 0 rgba(0, 0, 0, 0.16) !important; + margin-top: -1.5rem !important; + padding: 2.5rem 1rem 0.5rem 1rem; + background-color: #ffffff !important; + border-radius: 0.75rem; + box-shadow: 0 0.375rem 1.5rem 0 rgba(0, 0, 0, 0.16) !important; } .team-link { - background-color: #fff; - border-radius: 50%; - width: 1.5rem; - height: 1.5rem; - display: inline-flex; - align-items: center; - justify-content: center; - text-align: center; - font-size: 75%; - line-height: normal; - margin-right: 0.25rem; + background-color: #fff; + border-radius: 50%; + width: 1.5rem; + height: 1.5rem; + display: inline-flex; + align-items: center; + justify-content: center; + text-align: center; + font-size: 75%; + line-height: normal; + margin-right: 0.25rem; } .team-link .github-icon { - width: 20px; - height: 20px; - color: #fff; + width: 20px; + height: 20px; + color: #fff; } [data-theme="dark"] .team-link { - background-color: #95999c; + background-color: #95999c; } [data-theme="dark"] .bg-team { - background-color: #0e1114 !important; + background-color: #0e1114 !important; } .divider { - width: 100%; - height: 1px; - background-color: #dfdfdf; + width: 100%; + height: 1px; + background-color: #dfdfdf; } -.block { - width: 1200px; - padding: 0 20px; - margin: 0 auto; +@media (max-width: 780px) { Review Comment: why max-width is 780px? Seems not a common value? And meanwhile, should we concern single column with small screen and third column with large screen? Here is current popular mobile screen resolution ratio: <img width="1831" height="221" alt="image" src="https://github.com/user-attachments/assets/d005e9ab-7842-4e19-b925-348bdd29c075"; /> Tablet <img width="1936" height="273" alt="image" src="https://github.com/user-attachments/assets/8e0ac9af-6fbc-419a-a176-040fd6a0623d"; /> Reference: https://gs.statcounter.com/screen-resolution-stats/mobile/worldwide/ -- 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] --------------------------------------------------------------------- To unsubscribe, e-mail: [email protected] For additional commands, e-mail: [email protected]
