Git Product home page Git Product logo

zz-file-icons's Introduction

Coming soon ...

Sublime File Icons

Release Downloads Make a donation at patreon.com

This package adds file specific icons to Sublime Text for improved visual grepping. It's heavily inspired by Atom File Icons.

Its aims are:

  • be a tmPreferences storage for UI themes those support file icons,
  • provide file type icons for themes those don't (fully) support file icons.

If you have some problems, first search for a similar issue, and then report with new one. Please read the known issues before reporting a new one.

Users

Getting Started

Getting Started with Sublime File Icons

Installation

Package Control (coming soon)

The easiest way to install is using Package Control, where it's listed as zz File Icons.

  1. Open Command Palette using menu item Tools → Command Palette...
  2. Choose Package Control: Install Package
  3. Find zz File Icons and hit Enter

Download

  1. Download the .zip
  2. Unzip and rename the folder to zz File Icons
  3. Copy the folder into Packages directory, which you can find using the menu item Preferences → Browse Packages...

Note: Don't forget to restart Sublime Text after installing this package.

Customization

You can change the color, opacity level and size of the icons by modifying your user preferences file, which you can find using:

  • menu item Preferences → Package Settings → File Icons → Settings,
  • choose File Icons: Settings in Command Palette.

Themes

I'm happy to announce that Boxy Theme and Material Theme bring the support of this package in the next releases. So you'll be able to choose what icons you want to use – provided by the theme or provided by the package.

Troubleshooting

If something going wrong try to:

  1. Open Command Palette using menu item Tools → Command Palette...
  2. Choose File Icons: Clean Up
  3. Restart Sublime Text

Wrong Icons

Sublime Text file type icons use syntax scopes. That's why the icons for packages provided by the community require them to be installed.

See the list of custom packages those you may need to install to see the right icon.

Missing Icons

In some cases you can see that some icons from your current theme are missing. You can:

  • Request support of this package from the theme's developer
  • Submit a request to add missing icons if the theme already supports it

More details here →

Sublime Linter Setup

This package adds some syntax aliases which Sublime Linter doesn't recognize. Just update your Sublime Linter settings, e.g.:

  "syntax_map": {
    "html (django)": "html",
    "html (rails)": "html",
    "html 5": "html",
    "javascript (babel)": "javascript",
    "javascript (gruntfile)": "javascript",
    "javascript (gulpfile)": "javascript",
    "json (bower)": "json",
    "json (npm)": "json",
    "json (settings)": "json",
    "magicpython": "python",
    "php": "html",
    "python django": "python",
    "pythonimproved": "python"
  },

Full list of the syntax aliases can be found here.

Developers

Bring Support to Your Theme

If you are a theme developer and you want to have support of zz File Icons, you should:

  • Remove all stuff related to the icon setup: .tmPreferences, .sublime-settings and .tmLanguage files
  • Rename all your icons to match these ones
  • Add .zz-file-icons file to the root of your theme (this is how we check if the theme is supported)

Also see MIGRATION.md. It contains a list of tasks those you have to do to support the next version of the zz File Icons.

How It Works

In simple terms, zz File Icons does next steps:

  1. Searches all installed and supported themes
  2. Checks if themes those don't support it are already patched, if not
  3. Patches them
    • Generates <theme-name>.sublime-theme files from template
    • Puts them into dist/zpatches/ directory
  4. For the themes those have support of it, it just provides .tmPreferences files by default (user can override icons provided by the theme via "force_override": true)
  5. After restarting Sublime Text, the patched themes will be enhanced to use the icons provided by zz File Icons

It does these steps when:

  • you've installed it,
  • plugins loaded,
  • you've changed its preferences.

The real process is just a little bit more complex to minimize hard drive I/O.

Contributing

Want to contribute some code? Excellent! Read up on our guidelines.

Together we will make Sublime File Icons even better than it is today!

Resources

Colors

Colors are from the Boxy Theme icon color palette. They are bright because they should look good with the most themes. However you can change the color and the opacity level of all icons, see customization.

Palette

Icons

This package contains icons provided by:

Source icons provided in SVG format (currently Sublime Text doesn't support it). We convert them to @1x, @2x and @3x PNG assets before each release via gulp task.

Rasterized icons can be found in dist/zpatches folder.

Change Log

See CHANGELOG.md.

Known Issues

  1. This package requires you to restart Sublime Text for the applied icons to take effect when:
    • you've installed it,
    • you've changed its preferences,
    • you've installed a new theme that should be patched.
  2. The icons for custom packages require them to be installed. E.g. if you want to see SCSS icon you should install one of the SCSS syntax packages.

Share The Love

I've put a lot of time and effort into making Sublime File Icons awesome. If you love it, you can buy me a coffee. I promise it will be a good investment 😉

Donate with: Patreon.

zz-file-icons's People

Stargazers

 avatar  avatar

Watchers

 avatar  avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.