GitLand

About

GitLand: Custom Backgrounds for GitHub Profiles and Repositories

GitLand is a Chrome extension designed to personalize your GitHub experience by allowing you to customize the background of GitHub profiles and repositories. Whether you're looking to add a splash of color or use your favorite background image, GitLand gives you full control over the visual feel of your GitHub environment.

➤  Key Functionalities:
• Custom Backgrounds: Set your desired background images or colors for GitHub profiles and repository pages. You can choose from a variety of options to create a more engaging or branded experience.
• Always On: Each time a user navigates to a GitHub profile or repository, the extension performs a check to retrieve the latest main Configuration "github_customization.json". This "always-on" functionality ensures that users experience consistent and up-to-date background customization, allowing for a dynamic and personalized GitHub interface at all times..
• Dynamic CSS Variable Support: The extension interacts with the CSS variables used by GitHub, allowing you to modify background colors and borders with ease.
• Advanced Customization: Apply overlays and opacity settings to ensure readability over complex background images. You can manage the opacity of background colors to match your personal preferences.

➤  How Configurations Work:
Configurations in GitLand allow you to apply custom settings across different GitHub pages. For each page (profiles, repositories), GitLand checks for a repository named "background_profile" with the main Configuration file named "github_customization.json". The extension offers flexibility depending on the page or section you're browsing.
• Local Storage: GitLand uses Chrome's storage and follows a priority-based approach for fetching configurations. This priority is stored locally and determines whether the extension pulls configurations from the user's profile or the visited profile.

➤  Color Configuration:
The color customization system within GitLand is based on CSS variables used across GitHub’s design. Once the extension loads, it fetches the current color configuration from the repository and allows you to edit it via a color picker. For each CSS variable (like --bgColor-default or --borderColor-default), you can select a new color, and GitLand will dynamically apply this to the page. Also it is possible download selected color configurations directly from the extension for easy sharing, backup or upload in repository.

➤  Configuration Template:
• github_customization.json: https://github.com/m4zinga/GitLand/blob/main/assets/configuration_example/github_customization.json
• style.json: https://github.com/m4zinga/GitLand/blob/main/assets/configuration_example/style.json

➤  How GitLand use Configurations:

    ➤  Saving Configurations in Repositories:
        • If you want to see only your personal configurations, create a repository (either public or 
          private) named background_profile.
        • Inside this repository, create a file named github_customization.json for image and 
          background settings. For color settings, create a file named style.json.
        • Make sure all resource links (such as images, GIFs, or color configurations) are in raw 
          mode, as shown in the example file github_customization_example.json.

    ➤  Configuration Priority:
        •If the priority is set to personal, the extension will search for your personal configuration in 
         your background_profile repository and apply it.
        •If the priority is set to internet, the extension will search for a background_profile repository 
          in the visited GitHub profile and use it as the configuration source. If no configuration is 
           found, it will fall back to your personal configuration.
        • If no configuration is available, the extension will not modify any visuals.


For users who want a seamless and fully personalized GitHub experience, GitLand is your go-to extension for customizing the look and feel of the platform.