[create-theme]: Mac Like Buttons

[alpeerkaraca]

Name

Mac Like Buttons

Description

With this theme, you can make your title bar buttons look like those on macOS.

Homepage

https://github.com/alpeerkaraca/zen-mac-like-buttons

Image

https://raw.githubusercontent.com/alpeerkaraca/zen-mac-like-buttons/refs/heads/main/assets/screenshot.png

Type

• JSON Color Theme

Theme Styles

.titlebar-buttonbox {
    padding: 9px !important;
  }

  .titlebar-button:hover {
    background-color: var(--button-hover-bgcolor) !important;
  }

  .toolbarbutton-icon:hover {
    color: #fd5754 !important;
  }

  .titlebar-min {
    width: 15px !important;
    height: 15px !important;
    padding: 8px !important;
    margin-left: 8px !important;
    margin-right: 8px !important;
    margin-top: 4px !important;
    border-radius: 50% !important;
    scale: 1.2;
    background-color: #34c648 !important;
    color: transparent !important;
    transition: background-color 0.2s;
  }

  .titlebar-min:hover {
    background-color: #2ba33b !important;
    color: transparent !important;
    transition: background-color 0.2s;
  }

  .titlebar-max,
  .titlebar-restore {
    width: 15px !important;
    height: 15px !important;
    padding: 8px !important;
    margin-left: 8px !important;
    margin-right: 8px !important;
    margin-top: 4px !important;
    border-radius: 50% !important;

    background-color: #febb40 !important;
    color: transparent !important;
    scale: 1.2;
    transition: background-color 0.2s;
  }

  .titlebar-max:hover,
  .titlebar-restore:hover {
    background-color: #d49d35 !important;
    color: transparent !important;
    transition: background-color 0.2s;
  }

  .titlebar-close {
    width: 15px !important;
    height: 15px !important;
    padding: 8px !important;
    margin-left: 8px !important;
    margin-right: 8px !important;
    margin-top: 4px !important;
    border-radius: 50% !important;
    scale: 1.2;

    background-color: #fd5754 !important;
    color: transparent !important;
    transition: background-color 0.2s;
  }

  .titlebar-close:hover {
    background-color: #960906 !important;
    list-style-image: none !important;
    transition: background-color 0.2s;
  }

  @media (-moz-bool-pref: "mac-like-button-position-left.enabled") {

    #nav-bar {
      flex-direction: row-reverse !important;
      padding-right: 36px !important;
    }

    #nav-bar-customization-target {
      order: 1 !important;
    }

    #PanelUI-menu-button {
      order: 2 !important;
    }

    .titlebar-buttonbox {
      flex-direction: row-reverse !important;
    }
  }

Readme

# Mac Like Buttons

With this theme, you can make your title bar buttons look like those on macOS.

Preferences

{
    "mac-like-button-position-left.enabled":"Move the buttons to the left side of the title bar"
}

[github-actions]

Thank you for your contribution! 🎉

Your theme has been successfully submitted. The maintainers will review it and get back to you soon.

Here are some details about your submission:

• Your theme has been requested into this PR.
• It has been created into the create-theme-744 branch.

If you have any questions or need help, feel free to ask in the comments below or in the PR.