docs: More legible font colour in dark mode #577
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
cdrage
force-pushed
the
make-font-more-readable
branch
2 times, most recently
from
362c8df
to
46245b2
Compare
slemeur
requested changes
Oct 12, 2022
website/src/pages/index.tsx
Outdated
|
|
||
| <div className="flex flex-col items-center"> | ||
| <div className="text-left my-4"> | ||
| <p className="-ml-5">Current Podman Desktop plug-ins: Podman, Docker, Lima and CRC/OpenShift Local.</p> | ||
| <p className="-ml-5 text-base">Current Podman Desktop plug-ins: Podman, Docker, Lima and CRC/OpenShift Local.</p> |
There was a problem hiding this comment.
maybe, instead of defining a new class, it should be the "default" color for dark theme which should be changed?
There was a problem hiding this comment.
I believe this is actually missing the class! Most <p> have text-base as the class.
website/src/pages/index.tsx
Outdated
| @@ -117,7 +117,7 @@ function Hero() { | |||
| <h1 className="title-font sm:text-4xl text-3xl lg:text-6xl mb-4 font-medium text-gray-900 dark:text-white"> | |||
| Containers and Kubernetes for application developers | |||
| </h1> | |||
| <p className="text-base text-gray-700 dark:text-gray-500 md:text-lg"> | |||
| <p className="text-base text-gray-700 md:text-lg"> | |||
There was a problem hiding this comment.
text-gray-700 is supposed to be giving the color to the paragraph.
Here, by overriding the class, you are defining the color in another place and it's not following the "tailwind" practices.
I think it would be easier to switch the color of the paragraph to text-gray-100 or something like that.
You can check the colors provided out of the box by tailwind here: https://tailwindcss.com/docs/text-color
cdrage
force-pushed
the
make-font-more-readable
branch
from
46245b2
to
44ccda0
Compare
cdrage
commented
Oct 12, 2022
website/src/pages/index.tsx
Outdated
|
|
||
| <div className="flex flex-col items-center"> | ||
| <div className="text-left my-4"> | ||
| <p className="-ml-5">Current Podman Desktop plug-ins: Podman, Docker, Lima and CRC/OpenShift Local.</p> | ||
| <p className="-ml-5 text-base">Current Podman Desktop plug-ins: Podman, Docker, Lima and CRC/OpenShift Local.</p> |
There was a problem hiding this comment.
I believe this is actually missing the class! Most <p> have text-base as the class.
|
Linter still failing, going to update this PR 👍 |
cdrage
changed the title
cdrage
force-pushed
the
make-font-more-readable
branch
2 times, most recently
from
0de8655
to
720772a
Compare
benoitf
reviewed
Oct 12, 2022
cdrage
force-pushed
the
make-font-more-readable
branch
2 times, most recently
from
bccbea4
to
fcfb0f5
Compare
|
Updated! I've:
|
benoitf
reviewed
Oct 13, 2022
benoitf
reviewed
Oct 13, 2022
benoitf
approved these changes
Oct 13, 2022
cdrage
force-pushed
the
make-font-more-readable
branch
2 times, most recently
from
04a670f
to
5c8e987
Compare
### What does this PR do? * Updates the website with "gray-300" font colour in dark mode, as the previous colour was not very legible to read. ### Screenshot/screencast of this PR <!-- Please include a screenshot or a screencast explaining what is doing this PR --> See below difference: ### What issues does this PR fix or reference? <!-- Please include any related issue from Podman Desktop repository (or from another issue tracker). --> N/A (let me know if I need to open an issue)! It's a quickfix for the website. ### How to test this PR? `yarn run docusaurus start` <!-- Please explain steps to reproduce --> Signed-off-by: Charlie Drage <charlie@charliedrage.com> Signed-off-by: Charlie Drage <charlie@charliedrage.com>
Signed-off-by: Charlie Drage <charlie@charliedrage.com>
cdrage
force-pushed
the
make-font-more-readable
branch
from
5c8e987
to
0ef777a
Compare
|
@slemeur is it ok for you, now ? |
|
LGTM 👍 |
slemeur
approved these changes
Oct 19, 2022
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Website: More legible font colour in dark mode
What does this PR do?
previous colour was not very legible to read.
Screenshot/screencast of this PR
See below difference:
vs
What issues does this PR fix or reference?
N/A (let me know if I need to open an issue)! It's a quickfix for the
website.
How to test this PR?
yarn run docusaurus start