Skip to content
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.

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

Style/theme rebranding #585

Merged
merged 5 commits into from
Oct 17, 2024
Merged

Style/theme rebranding #585

merged 5 commits into from
Oct 17, 2024

Conversation

AnjaMis
Copy link
Contributor

@AnjaMis AnjaMis commented Oct 14, 2024

This PR:

  • updates theme palette and fonts after axone rebranding
  • updates images
  • edits text where necessary
  • updates favicon

Summary by CodeRabbit

  • New Features

    • Updated tutorial on the Axone blockchain, including corrected naming conventions and revised URLs for accessing test tokens.
  • Documentation

    • Enhanced clarity in the whitepaper's introduction, emphasizing the transition to a data-centric society and detailing the roles of digital services.
  • Style

    • Comprehensive updates to typography and color scheme, modernizing the design across the application.
  • Chores

    • Updated copyright information and licensing details for the Anton font.
    • Removed outdated Montserrat font documentation files.

Copy link

vercel bot commented Oct 14, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
docs ✅ Ready (Inspect) Visit Preview 💬 Add feedback Oct 15, 2024 5:04pm

Copy link
Member

@bot-anik bot-anik left a comment

Choose a reason for hiding this comment

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

Device URL
desktop http://localhost:3000/

Device URL
mobile http://localhost:3000/

Not what you expected? Are your scores flaky? GitHub runners could be the cause.
Try running on Foo instead

@AnjaMis AnjaMis force-pushed the style/theme-rebranding branch from 3d203e8 to 6d265de Compare October 15, 2024 17:02
@AnjaMis AnjaMis marked this pull request as ready for review October 15, 2024 17:13
Copy link
Contributor

coderabbitai bot commented Oct 15, 2024

Walkthrough

The pull request introduces several modifications across multiple documents and files. Key changes include updates to naming conventions and URLs related to the Axone blockchain, enhancements in the clarity and coherence of the whitepaper's introduction, significant updates to font-face declarations and CSS properties in the stylesheet, formatting adjustments in a React component, and updates to copyright information in font files. Additionally, some font-related files were deleted, reflecting a shift in the font resources used.

Changes

File Path Change Summary
docs/tutorials/keplr-1.mdx Updated naming from "AXON" to "AXONE" and changed URLs for the Axone faucet. Adjusted tutorial steps for token management.
docs/whitepaper/introduction.md Enhanced clarity in the introduction, rephrased definitions, and updated image references. Improved organization of challenges related to decentralized infrastructure.
src/scss/custom.scss Replaced font-face declarations and updated CSS custom properties for typography and color scheme.
src/theme/NavbarItem/DocsVersionDropdownNavbarItem.js Simplified formatting by removing unnecessary line breaks and semicolons in the component.
static/fonts/Anton/OFL.txt Updated copyright year and holder, and modified the licensing URL.
static/fonts/Montserrat/OFL.txt, static/fonts/Montserrat/README.txt Deleted both files, removing the license text and README information for the Montserrat font.

Sequence Diagram(s)

sequenceDiagram
    participant User
    participant Keplr Wallet
    participant Axone Network
    User->>Keplr Wallet: Request test tokens
    Keplr Wallet->>Axone Network: Fetch tokens from faucet
    Axone Network-->>Keplr Wallet: Provide tokens
    Keplr Wallet-->>User: Tokens received
    User->>Keplr Wallet: Check balance
    Keplr Wallet->>Axone Network: Request balance
    Axone Network-->>Keplr Wallet: Return balance
    Keplr Wallet-->>User: Display balance
Loading

🐰 "In the land of code, where changes bloom,
Axone's name shines bright, dispelling the gloom.
Fonts now dance with a modern flair,
Clarity reigns in the whitepaper's air.
With tokens in hand, let us hop and play,
In this vibrant world, we’ll code all day!" 🌼


Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media?

❤️ Share
🪧 Tips

Chat

There are 3 ways to chat with CodeRabbit:

  • Review comments: Directly reply to a review comment made by CodeRabbit. Example:
    • I pushed a fix in commit <commit_id>, please review it.
    • Generate unit testing code for this file.
    • Open a follow-up GitHub issue for this discussion.
  • Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
    • @coderabbitai generate unit testing code for this file.
    • @coderabbitai modularize this function.
  • PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
    • @coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
    • @coderabbitai read src/utils.ts and generate unit testing code.
    • @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.
    • @coderabbitai help me debug CodeRabbit configuration file.

Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments.

CodeRabbit Commands (Invoked using PR comments)

  • @coderabbitai pause to pause the reviews on a PR.
  • @coderabbitai resume to resume the paused reviews.
  • @coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
  • @coderabbitai full review to do a full review from scratch and review all the files again.
  • @coderabbitai summary to regenerate the summary of the PR.
  • @coderabbitai resolve resolve all the CodeRabbit review comments.
  • @coderabbitai configuration to show the current CodeRabbit configuration for the repository.
  • @coderabbitai help to get help.

Other keywords and placeholders

  • Add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
  • Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
  • Add @coderabbitai anywhere in the PR title to generate the title automatically.

Documentation and Community

  • Visit our Documentation for detailed information on how to use CodeRabbit.
  • Join our Discord Community to get help, request features, and share feedback.
  • Follow us on X/Twitter for updates and announcements.

@AnjaMis AnjaMis requested review from ccamel and amimart October 15, 2024 17:13
@AnjaMis AnjaMis self-assigned this Oct 15, 2024
Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 1

🧹 Outside diff range and nitpick comments (3)
docs/tutorials/keplr-1.mdx (1)

43-47: LGTM: Button text and chain name updates are correct.

The changes accurately reflect the Axone rebranding. The button text and chain name updates are consistent with the PR objectives.

Consider adding a brief explanation of what "dentrite" means in the context of Axone, as it might not be immediately clear to all users.

src/scss/custom.scss (2)

8-9: Consistently capitalize font-family names

In the @font-face declaration, the font family is specified as anton without capitalization:

font-family: anton;

For consistency and to prevent potential issues, consider capitalizing the font family name to match standard naming conventions:

font-family: "Anton";

23-23: Update hover overlay color to match new primary color

While you've updated the primary color to #ff773d, the hover overlay color still references the old primary color:

--ifm-hover-overlay: rgb(255 149 0 / 12%);

Consider updating it to align with the new primary color for consistency:

--ifm-hover-overlay: rgb(255 149 0 / 12%);
+--ifm-hover-overlay: rgba(255, 119, 61, 0.12);
📜 Review details

Configuration used: .coderabbit.yaml
Review profile: CHILL

📥 Commits

Files that changed from the base of the PR and between c9c1d7f and 6d265de.

⛔ Files ignored due to path filters (58)
  • static/fonts/Anton/Anton-Regular.ttf is excluded by !**/*.ttf
  • static/fonts/Barlow/Barlow-Black.ttf is excluded by !**/*.ttf
  • static/fonts/Barlow/Barlow-BlackItalic.ttf is excluded by !**/*.ttf
  • static/fonts/Barlow/Barlow-Bold.ttf is excluded by !**/*.ttf
  • static/fonts/Barlow/Barlow-BoldItalic.ttf is excluded by !**/*.ttf
  • static/fonts/Barlow/Barlow-ExtraBold.ttf is excluded by !**/*.ttf
  • static/fonts/Barlow/Barlow-ExtraBoldItalic.ttf is excluded by !**/*.ttf
  • static/fonts/Barlow/Barlow-ExtraLight.ttf is excluded by !**/*.ttf
  • static/fonts/Barlow/Barlow-ExtraLightItalic.ttf is excluded by !**/*.ttf
  • static/fonts/Barlow/Barlow-Italic.ttf is excluded by !**/*.ttf
  • static/fonts/Barlow/Barlow-Light.ttf is excluded by !**/*.ttf
  • static/fonts/Barlow/Barlow-LightItalic.ttf is excluded by !**/*.ttf
  • static/fonts/Barlow/Barlow-Medium.ttf is excluded by !**/*.ttf
  • static/fonts/Barlow/Barlow-MediumItalic.ttf is excluded by !**/*.ttf
  • static/fonts/Barlow/Barlow-Regular.ttf is excluded by !**/*.ttf
  • static/fonts/Barlow/Barlow-SemiBold.ttf is excluded by !**/*.ttf
  • static/fonts/Barlow/Barlow-SemiBoldItalic.ttf is excluded by !**/*.ttf
  • static/fonts/Barlow/Barlow-Thin.ttf is excluded by !**/*.ttf
  • static/fonts/Barlow/Barlow-ThinItalic.ttf is excluded by !**/*.ttf
  • static/fonts/Helvetica/HelveticaNeueBlack.otf is excluded by !**/*.otf
  • static/fonts/Helvetica/HelveticaNeueBlackItalic.otf is excluded by !**/*.otf
  • static/fonts/Helvetica/HelveticaNeueBold.otf is excluded by !**/*.otf
  • static/fonts/Helvetica/HelveticaNeueBoldItalic.otf is excluded by !**/*.otf
  • static/fonts/Helvetica/HelveticaNeueHeavy.otf is excluded by !**/*.otf
  • static/fonts/Helvetica/HelveticaNeueHeavyItalic.otf is excluded by !**/*.otf
  • static/fonts/Helvetica/HelveticaNeueItalic.ttf is excluded by !**/*.ttf
  • static/fonts/Helvetica/HelveticaNeueLight.otf is excluded by !**/*.otf
  • static/fonts/Helvetica/HelveticaNeueLightItalic.otf is excluded by !**/*.otf
  • static/fonts/Helvetica/HelveticaNeueMedium.otf is excluded by !**/*.otf
  • static/fonts/Helvetica/HelveticaNeueMediumItalic.otf is excluded by !**/*.otf
  • static/fonts/Helvetica/HelveticaNeueRoman.otf is excluded by !**/*.otf
  • static/fonts/Helvetica/HelveticaNeueThin.otf is excluded by !**/*.otf
  • static/fonts/Helvetica/HelveticaNeueThinItalic.otf is excluded by !**/*.otf
  • static/fonts/Helvetica/HelveticaNeueUltraLight.otf is excluded by !**/*.otf
  • static/fonts/Helvetica/HelveticaNeueUltraLightItalic.otf is excluded by !**/*.otf
  • static/fonts/Montserrat/Montserrat-Italic-VariableFont_wght.ttf is excluded by !**/*.ttf
  • static/fonts/Montserrat/Montserrat-VariableFont_wght.ttf is excluded by !**/*.ttf
  • static/fonts/Montserrat/static/Montserrat-Black.ttf is excluded by !**/*.ttf
  • static/fonts/Montserrat/static/Montserrat-BlackItalic.ttf is excluded by !**/*.ttf
  • static/fonts/Montserrat/static/Montserrat-Bold.ttf is excluded by !**/*.ttf
  • static/fonts/Montserrat/static/Montserrat-BoldItalic.ttf is excluded by !**/*.ttf
  • static/fonts/Montserrat/static/Montserrat-ExtraBold.ttf is excluded by !**/*.ttf
  • static/fonts/Montserrat/static/Montserrat-ExtraBoldItalic.ttf is excluded by !**/*.ttf
  • static/fonts/Montserrat/static/Montserrat-ExtraLight.ttf is excluded by !**/*.ttf
  • static/fonts/Montserrat/static/Montserrat-ExtraLightItalic.ttf is excluded by !**/*.ttf
  • static/fonts/Montserrat/static/Montserrat-Italic.ttf is excluded by !**/*.ttf
  • static/fonts/Montserrat/static/Montserrat-Light.ttf is excluded by !**/*.ttf
  • static/fonts/Montserrat/static/Montserrat-LightItalic.ttf is excluded by !**/*.ttf
  • static/fonts/Montserrat/static/Montserrat-Medium.ttf is excluded by !**/*.ttf
  • static/fonts/Montserrat/static/Montserrat-MediumItalic.ttf is excluded by !**/*.ttf
  • static/fonts/Montserrat/static/Montserrat-Regular.ttf is excluded by !**/*.ttf
  • static/fonts/Montserrat/static/Montserrat-SemiBold.ttf is excluded by !**/*.ttf
  • static/fonts/Montserrat/static/Montserrat-SemiBoldItalic.ttf is excluded by !**/*.ttf
  • static/fonts/Montserrat/static/Montserrat-Thin.ttf is excluded by !**/*.ttf
  • static/fonts/Montserrat/static/Montserrat-ThinItalic.ttf is excluded by !**/*.ttf
  • static/fonts/Norse/Norse-Bold.woff is excluded by !**/*.woff
  • static/fonts/Norse/Norse.woff is excluded by !**/*.woff
  • static/img/favicon.ico is excluded by !**/*.ico
📒 Files selected for processing (7)
  • docs/tutorials/keplr-1.mdx (2 hunks)
  • docs/whitepaper/introduction.md (2 hunks)
  • src/scss/custom.scss (1 hunks)
  • src/theme/NavbarItem/DocsVersionDropdownNavbarItem.js (1 hunks)
  • static/fonts/Anton/OFL.txt (1 hunks)
  • static/fonts/Montserrat/OFL.txt (0 hunks)
  • static/fonts/Montserrat/README.txt (0 hunks)
💤 Files with no reviewable changes (2)
  • static/fonts/Montserrat/OFL.txt
  • static/fonts/Montserrat/README.txt
✅ Files skipped from review due to trivial changes (1)
  • static/fonts/Anton/OFL.txt
🧰 Additional context used
🪛 LanguageTool
docs/whitepaper/introduction.md

[typographical] ~27-~27: Two consecutive dots
Context: ... or not, that may be further interpreted.. This includes anything from sensor read...

(DOUBLE_PUNCTUATION)

🔇 Additional comments (20)
src/theme/NavbarItem/DocsVersionDropdownNavbarItem.js (4)

1-3: LGTM: Import statements are correctly formatted.

The removal of semicolons from the import statements aligns with modern JavaScript style guides. The necessary dependencies are correctly imported.


7-9: LGTM: Conditional rendering logic is sound.

The component correctly uses the useActiveDocContext hook and conditionally renders based on the presence of an active document. This is a good practice for ensuring the dropdown is only displayed when relevant.


11-16: LGTM: Return statement simplified for better readability.

The return statement has been cleaned up by removing unnecessary line breaks, improving code readability. The use of the spread operator to pass all props to DocsVersionDropdownNavbarItem is maintained, which is an efficient React pattern.


1-16: Summary: Formatting improvements align with PR objectives.

The changes in this file are primarily formatting improvements, including the removal of unnecessary semicolons and line breaks. These modifications enhance code consistency and readability, which aligns with the PR's objective of updating the project's styling. The component's functionality remains unchanged, maintaining its role in the navigation system.

docs/tutorials/keplr-1.mdx (7)

37-41: LGTM: Branding and URL updates are correct.

The changes accurately reflect the Axone rebranding. The emphasis on "AXONE" and the updated faucet URL are consistent with the PR objectives.


53-58: LGTM: Network name and instructions are updated correctly.

The changes accurately reflect the new Axone network name and provide clear instructions for users to find and enable the network in Keplr.


104-108: LGTM: Explorer URL and token name are updated correctly.

The changes accurately reflect the new Axone branding, including the updated explorer URL and consistent use of "$AXONE" for the token name.

Please verify that the new Axone explorer URL is functional:

#!/bin/bash
# Check if the Axone explorer URL is accessible
if curl -s --head https://explore.axone.xyz/ | head -n 1 | grep "HTTP/1.[01] [23].." > /dev/null; then
    echo "Axone explorer URL is accessible"
else
    echo "Warning: Axone explorer URL might not be accessible"
fi

Line range hint 1-124: Overall, the changes effectively implement the Axone rebranding.

The updates to this tutorial document consistently reflect the new Axone branding, including:

  1. Renaming of the token from AXON to AXONE
  2. Updating network names and identifiers
  3. Changing URLs to the new axone.xyz domain
  4. Updating image references

These changes align well with the PR objectives and should provide users with an up-to-date guide for interacting with the Axone blockchain.

To ensure completeness, please run a final check for any remaining references to the old branding:

#!/bin/bash
# Check for any remaining references to old branding
echo "Checking for old branding references:"
grep -ni -E 'okp4|OKP4|AXON' docs/tutorials/keplr-1.mdx

If this script returns any results, please review those lines to ensure they don't need updating.


72-80: LGTM: Image path and address instructions are updated correctly.

The changes accurately reflect the new Axone branding in the instructions for finding and copying the Axone address.

Please ensure that the new image at /img/content/tutorials/keplr-10.webp has been updated to reflect the new Axone branding and UI.

#!/bin/bash
# Verify if the new image exists
if [ -f "static/img/content/tutorials/keplr-10.webp" ]; then
    echo "New image exists: static/img/content/tutorials/keplr-10.webp"
else
    echo "Warning: New image not found: static/img/content/tutorials/keplr-10.webp"
fi

Line range hint 83-99: LGTM: Image paths and token name are updated correctly.

The changes accurately reflect the new Axone branding, including the token name update to "AXONE".

Please ensure that the new images at /img/content/tutorials/keplr-10.webp and /img/content/tutorials/keplr-12.webp have been updated to reflect the new Axone branding and UI.

#!/bin/bash
# Verify if the new images exist
for img in keplr-10.webp keplr-12.webp; do
    if [ -f "static/img/content/tutorials/$img" ]; then
        echo "New image exists: static/img/content/tutorials/$img"
    else
        echo "Warning: New image not found: static/img/content/tutorials/$img"
    fi
done

61-69: LGTM: Image path and instructions are updated correctly.

The changes accurately reflect the new Axone branding in the instructions and token amount.

Please ensure that the new image at /img/content/tutorials/keplr-8.webp has been updated to reflect the new Axone branding and UI.

✅ Verification successful

Verified: Image path and instructions are updated correctly.

The new image at /img/content/tutorials/keplr-8.webp exists and accurately reflects the updated Axone branding and UI.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Verify if the new image exists
if [ -f "static/img/content/tutorials/keplr-8.webp" ]; then
    echo "New image exists: static/img/content/tutorials/keplr-8.webp"
else
    echo "Warning: New image not found: static/img/content/tutorials/keplr-8.webp"
fi

Length of output: 290


Script:

#!/bin/bash
# Verify if the new image exists
if [ -f "static/img/content/tutorials/keplr-8.webp" ]; then
    echo "New image exists: static/img/content/tutorials/keplr-8.webp"
else
    echo "Warning: New image not found: static/img/content/tutorials/keplr-8.webp"
fi

Length of output: 183

docs/whitepaper/introduction.md (4)

Line range hint 29-33: LGTM: Enhanced explanation of Digital Services.

The expanded section on Digital Services provides a more comprehensive and clear explanation of their role in processing data and generating knowledge. This improvement enhances the overall understanding of the topic.

🧰 Tools
🪛 LanguageTool

[typographical] ~27-~27: Two consecutive dots
Context: ... or not, that may be further interpreted.. This includes anything from sensor read...

(DOUBLE_PUNCTUATION)


Line range hint 67-73: LGTM: Improved structure for Decentralized Infrastructure Challenges.

The restructuring of this section with clear bullet points for each challenge (Trustlessness, Permissionless, Availability and Sustainability) significantly improves readability. The content accurately describes each challenge and its relevance to decentralized infrastructure.

🧰 Tools
🪛 LanguageTool

[typographical] ~27-~27: Two consecutive dots
Context: ... or not, that may be further interpreted.. This includes anything from sensor read...

(DOUBLE_PUNCTUATION)


Line range hint 105-113: LGTM: Enhanced coverage of Interoperability Challenges.

The expanded section on Interoperability Challenges provides a more comprehensive view of the topic. The addition of new points (Technology Agnostic, Interpretability, No tech lock-in, and Interconnection between independent systems) enhances the depth of the discussion and accurately represents the challenges in this area.

🧰 Tools
🪛 LanguageTool

[grammar] ~112-~112: There seems to be a noun/verb agreement error. Did you mean “aspires” or “aspired”?
Context: ...s is where the protocol comes in. Axone aspire to interconnect a multitude of datasets...

(SINGULAR_NOUN_VERB_AGREEMENT)


114-114: Verify new image file exists.

The update to the image reference from "intro-6-okp4" to "intro-6" is consistent with the rebranding effort.

Please run the following script to ensure the new image file exists:

src/scss/custom.scss (5)

13-14: Verify font format compatibility for "Helvetica bold"

The font file HelveticaNeueBold.otf is in OpenType (.otf) format. Ensure that all target browsers and platforms support this format. For broader compatibility, consider including additional font formats like Web Open Font Format (.woff, .woff2) and TrueType (.ttf), and update the src property accordingly.

Would you like assistance in modifying the @font-face rule to include multiple font formats?


18-19: Verify font format compatibility for "Helvetica regular"

Similar to the previous comment, the HelveticaNeueRoman.otf file is in OpenType format. Ensure cross-browser and cross-platform compatibility by possibly including additional font formats.


26-28: Ensure font-family names match between declarations and usage

The font families specified in the CSS custom properties should match exactly with those defined in the @font-face declarations. For example:

  • --ifm-font-family-base is set to "Helvetica regular", which matches the @font-face declaration.
  • --ifm-heading-font-family is set to "Helvetica bold", also matching the @font-face declaration.
  • --ifm-h1-font-family is set to anton, while the @font-face declaration uses anton (consider capitalizing as per earlier comment).

29-32: Confirm adequate color contrast for accessibility

You've changed several font and heading colors to #0d0d0d, which is very dark. Ensure that this color provides sufficient contrast against all background colors used in the application to meet accessibility standards (WCAG AA or AAA).

You might use tools like the WebAIM Contrast Checker to validate contrast ratios.


38-40: Maintain consistency with updated branding colors

The updates to --ifm-article-anchor-color and --ifm-knowledge-graph-data-fill-color align with the new primary color #ff773d. Ensure that this color is consistently used across all components and elements to maintain cohesive branding.

docs/whitepaper/introduction.md Show resolved Hide resolved
Copy link
Member

@amimart amimart left a comment

Choose a reason for hiding this comment

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

Nice thanks!

Copy link
Member

@ccamel ccamel left a comment

Choose a reason for hiding this comment

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

Great! Thanks for the improvements 👍

@AnjaMis AnjaMis merged commit d077f86 into main Oct 17, 2024
15 checks passed
@AnjaMis AnjaMis deleted the style/theme-rebranding branch October 17, 2024 07:39
This was referenced Oct 25, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants