Skip to content

Update layout: Color modes, jQuery removal, and more #186

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Open
wants to merge 18 commits into
base: master
Choose a base branch
from
Open

Update layout: Color modes, jQuery removal, and more #186

wants to merge 18 commits into from

Conversation

robinheidrich
Copy link
Contributor

@robinheidrich robinheidrich commented Jan 6, 2025 •
edited
Loading

This improves the phpMyAdmin website. It updates the layout, many of the pages and cleans everything up a bit.

Changes

  • Updated Bootstrap to 5.3.3, which supports color modes, allowing selection between dark and light mode and auto-detection based on system preference. The color-modes.js script comes from the Bootstrap docs.
  • Removed jQuery and replaced colorbox with bs5-lightbox.
  • Removed Font Awesome and replaced it with SVG icons from Bootstrap Icons.
  • Updated the team page to use GitHub avatars and a better overview.
  • Updated the downloads page to make everything a little clearer, and show requirements of each version.
  • Updated the themes page to no longer use extra JavaScript code, removed the “All” filter and reversed the version listing.
  • And more...

Screenshots

Home page

127 0 0 1_8000_

Home page (light)

127 0 0 1_8000_ (1)

Download modal

image

Docs page

127 0 0 1_8000_docs_

Team page

127 0 0 1_8000_team_

404 page

image

williamdes
williamdes reviewed Jan 6, 2025
View reviewed changes
williamdes
williamdes reviewed Jan 6, 2025
View reviewed changes
pmaweb/static/images/sponsors/weblate.png Outdated
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

same, as svg would be great
ping @ nijel to have the asset if needed

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This should be the one you have: https://github.com/WeblateOrg/graphics/blob/main/logo-text/Logo-Whitetext.svg

You are welcome to choose a different variant from that repo in case the white text is not the best fit.

@williamdes
Copy link
Member

williamdes commented Jan 7, 2025 •
edited
Loading 

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" id="scrutinizer-ci">
  <path d="m3.991 19.862.005-.004.002-.002zM22.2 12.943c.007.014.011.029.017.043l.005.008-.022-.051zm-4.304 10.944c-.131.004-.262.005-.393.008l-.003.001.396-.009z"></path>
  <path fill="#868E91" d="M22.101 19.055a8.207 8.207 0 0 0 .397-2.55 8.346 8.346 0 0 0-.775-3.519 8.583 8.583 0 0 0-2.307-2.859l-.017-.013a6.833 6.833 0 0 0-2.35-.976l-.045-.008c-.246-.06-4.052-.106-7.812-.121l.001-.002c-3.759-.015-7.472 0-7.532.06-.126.126-.06.798.06 1.35a5.66 5.66 0 0 0 1.834 2.753l.01.008a7.501 7.501 0 0 0 3.264 1.581l.049.009c.366.126 1.044.126 4.598.126 4.237 0 4.916.06 5.221.24.142.107.265.23.369.367l.003.005c.18.24.181.307.181.979s-.066.732-.186 1.044a1.48 1.48 0 0 1-.419.362l-.007.004c-.186.12-.307.119-4.358.179-4.671 0-5.156 0-6.321.432a6.458 6.458 0 0 0-2.463 1.352c-1.163 1.038-1.84 2.202-1.96 3.426l.06.611C3.891 23.962 6.591 24 9.3 24c2.577 0 5.146-.037 7.707-.105l.489-.119c.285-.069.531-.153.766-.256l-.029.011.367-.18a7.768 7.768 0 0 0 3.484-4.242l.017-.054z"></path>
  <path fill="#08458E" d="M22.461.12C22.401 0 21.421 0 14.863 0L6.877.06a6.172 6.172 0 0 0-3.732 2.488l-.013.02a6.328 6.328 0 0 0-1.348 2.596l-.009.044-.12.553-.119.857c-.06.799-.06 1.351.12 1.471h5.276c.06 0-.186-.246-.186-.672 0-.738.252-.924.552-1.23.552-.426 2.946-.12 4.729-.246 2.449 0 4.603-.06 4.849-.12 2.701-.427 5.031-2.388 5.524-4.536.121-.547.121-1.105.061-1.165z"></path>
</svg>

https://iconscout.com/free-icon/scrutinizer-ci-3521695
Scrutinizer Ci by Icon 54

Or https://github.com/avmaisak/ngx-simple-icons/blob/develop/ngx-simple-icons/src/lib/icons/scrutinizerci.ts

Ref: https://github.com/search?q=%22scrutinizer%22+%22%3Csvg%22&type=code

Pick the one you want

@robinheidrich
Copy link
Contributor Author

robinheidrich commented Jan 7, 2025 •
edited
Loading

I think one with the name in the logo would be better, to match the others.

Also found more things to check:

  • Michal is linked on https://phpmyadmin.net/about-website/, but he is not on the team page. Should I add him to the previous team members?
  • Microformats is mentioned there too. Is it still up to date? I couldn't really find out what it does. Also, the PAD website seems to be outdated, it comes up with their sitemap.

One more thing, on https://www.phpmyadmin.net/try/ the link to the stable release seems to be broken. It links to https://demo.phpmyadmin.net/STABLE/.

nijel
nijel reviewed Jan 7, 2025
View reviewed changes
pmaweb/templates/team.html Outdated
with databases. One of his passions is to lower the barrier so new contributors can feel comfortable submitting a new pull request and he
enjoys coaching prospective contributors through seeing their work merged. William lives in France.
</p>
<h2>Previous Team Members</h2>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I've randomly noticed this section while looking and new website screenshots after being mentioned for the Weblate logo, and it seems unfair to me. Listing one randomly chosen previous team member and omitting people who spent years on the project is not the best approach. Better to remove previous members here and keep them only on https://docs.phpmyadmin.net/en/latest/credits.html.

Copy link
Member

@williamdes williamdes Jan 7, 2025 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Listing one randomly chosen previous team member and omitting people who spent years on the project is not the best approach.

I think this is mostly due to the fact that Dan never announced leaving the team. So that was me requesting to move him to a new section
But you are right, let's make a nice page for all of them that spent a lifetime maintaining phpMyAdmin
The link should be right after the team members in a visible way

Edit: it would be great to pick some of them an make a page ? or just use credits ?

@robinheidrich
Copy link
Contributor Author

I think the pull request is ready for review now.

I changed the themes page so it doesn't need any extra JavaScript code. I have removed “All” and reversed the list. I noticed that there are still themes for version 2 in themes.py, but since “All” is gone now I think they can be removed?

image

An SVG logo for Scrutinizer is still missing, preferably one with white text. Unfortunately I couldn't find anything.

Furthermore, should I remove all links to planet.phpmyadmin.net?

williamdes
williamdes reviewed Jan 11, 2025
View reviewed changes
pmaweb/static/images/sponsors/scrutinizer.png Outdated
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

no svg ?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Couldn't find one with white text :(

williamdes
williamdes reviewed Jan 11, 2025
View reviewed changes
pmaweb/templates/license.html Outdated
You should have received a copy of the GNU General Public License
along with this program; if not, write to the Free Software
Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
You should have received a copy of the GNU General Public License along with this program; if not, write to the Free Software Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

https://www.gnu.org/licenses/old-licenses/gpl-2.0.txt
https://www.fsf.org/blogs/community/fsf-office-closing-party

maybe the text could be updated or linked to the GNU website

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

There is a link to https://www.gnu.org/licenses/gpl-2.0.html already, should I still update the text or just remove it?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hello @robinheidrich
Sorry for the reply delay, we had a lot of work preparing the 5.2.2 release.
You can update the text, that will be okay

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Done! No worries, I'm happy to see a release again after all this time!

williamdes
williamdes approved these changes Jan 11, 2025
View reviewed changes
Copy link
Member

@williamdes williamdes left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The diff looks good
Thank you for all the work !

@williamdes
Copy link
Member

Furthermore, should I remove all links to planet.phpmyadmin.net?

Yes, please do in a separate commit. I can cherry-pick it right away

I changed the themes page so it doesn't need any extra JavaScript code. I have removed “All” and reversed the list.

Very cool !

I noticed that there are still themes for version 2 in themes.py, but since “All” is gone now I think they can be removed?

Removed from where ? the files. server ?

An SVG logo for Scrutinizer is still missing, preferably one with white text. Unfortunately I couldn't find anything.

Okay, can you give me one that is okay and I can change the text color with Inkscape ?

@robinheidrich
Copy link
Contributor Author

Yes, please do in a separate commit. I can cherry-pick it right away

Alright, will do! Should I also remove all the code and the migration?

Removed from where ? the files. server ?

In the version list on the Themes page there is no tab for version 2. Since “All” is now gone, these are no longer visible. Or should I add version 2 there?

Okay, can you give me one that is okay and I can change the text color with Inkscape ?

Unfortunately I could not find any SVG from Scrutinizer where text is included.

@williamdes
Copy link
Member

williamdes commented Jan 27, 2025 •
edited
Loading

Alright, will do! Should I also remove all the code and the migration?

Yes, remove everything about planet. We can discuss it in the separate PR

In the version list on the Themes page there is no tab for version 2. Since “All” is now gone, these are no longer visible. Or should I add version 2 there?

Maybe we can have a section for "old themes" below the normal ones ?
Edit: let's add a 2.x option ?

Unfortunately I could not find any SVG from Scrutinizer where text is included.

Okay, on it.

@williamdes williamdes mentioned this pull request Jan 27, 2025
Open
@williamdes
Copy link
Member

Unfortunately I could not find any SVG from Scrutinizer where text is included.

After some copy pasting from their website, and Inkscape work I did get a nice logo.

Final version to use (compressed with https://svgomg.net/):
scrutinizer-full_modified_simple_compressed

Less compressed:
scrutinizer-full_modified_simple

Inkscape version:
scrutinizer-full_modified

@robinheidrich
Copy link
Contributor Author

Not quite sure how to make a new PR for removing Planet, wouldn't there be conflicts with this PR?

@williamdes
Copy link
Member

Not quite sure how to make a new PR for removing Planet, wouldn't there be conflicts with this PR?

Okay, you can remove it in this PR then
Keep a separate commit for it

@robinheidrich
Copy link
Contributor Author

Removed everything from Planet and updated the migrations. Is that all right?

@williamdes
Copy link
Member

Removed everything from Planet and updated the migrations. Is that all right?

Probably yes, if @ibennetch can review this PR diff

If it ready for review ?

@robinheidrich
Copy link
Contributor Author

Yes, I think it's ready for review. Other improvements can be made in new PRs, for example I think the screenshots from the demo could use an update. See https://www.phpmyadmin.net/try/.

And then there is test-data, which somehow has no use except to display TEST DATA. See https://www.phpmyadmin.net/test/data.

And contest.html which I think serves no historical purpose, unlike the 15-years page.

@robinheidrich robinheidrich marked this pull request as ready for review January 28, 2025 00:48
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@nijel nijel nijel left review comments

@williamdes williamdes williamdes approved these changes

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
3 participants
@robinheidrich @williamdes @nijel