Giter VIP home page Giter VIP logo

city-lights-ui-atom's Introduction

City Lights UI Theme

Image of the city lights UI theme

Image of the city lights UI theme

Image of the city lights UI theme

Image of the city lights UI theme

The City Lights UI Theme is a beautiful dark matte Atom UI theme that is designed with a developer's focus in mind. Enrich your Atom setup with a optimized Search & Replace toolbar, prettier error messages and many interface icons custom designed for the City Lights UI Theme.

This City Lights UI Theme is a part of City Lights; suite of beautiful matte dark themed goodies for Atom & Visual Studio Code. Make sure to also install the City Lights Syntax Theme and City Lights Icon Package for the best experience. For more information, please go to http://citylights.xyz

Install

Install the City Lights UI Theme via Atom by going to [Preferences/Settings > Install] and search for City Lights UI Theme (make sure you're searching under 'Themes'), or install through CLI $ apm install city-lights-ui

Feedback/Issues

Are you enjoying the City Lights UI Theme? Don't hesitate to share your excitement. Also let us know if you run into bugs or have any other feedback by creating a Github issue.

License

The following licensing applies to City Lights Syntax Theme: Attribution-NonCommercial-NoDerivatives 4.0 International (CC BY-NC-ND 4.0). For more information go to https://creativecommons.org/licenses/by-nc-nd/4.0/

Donate

The City Lights UI Theme is available for free. If you're enjoying the City Lights UI Theme, feel free to help us crank out updates even faster by donating a coffee to us via PayPal.

Built with ♥ by Yummygum
yummygum.com
twitter.com/yummygum
instagram.com/yummygum

city-lights-ui-atom's People

Contributors

alexesprit avatar alhadis avatar luukk avatar noudadrichem avatar paradoxxxzero avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar

city-lights-ui-atom's Issues

.rspec icon is cut off

If this is not the correct project to file this issue please let me know. The rspec icon in the sidebar is cutoff. Attached is a screenshot.

This seems to happen in both Atom v1.22.0 and Atom Beta v1.23.0-beta0 running city-lights-ui v1.1.6. Let me know if you need anymore information.

Thanks!

atom-city-lights-ui-rspec-cutoff

Wrong indentation on files in file tree?

My file tree doesn't look like in the provided screenshots in this repo, for me all files get the same indentation no matter where in the folder structure they live:
https://i.imgur.com/6u7nN6V.png?1

common.coffee lives under test/src and index.html under test, but mocha-3.2.0.css lives under test/vendor/styles, but like this it's near impossible to be sure it's not just in the same folder as index.html

.s icon missing

When using ASM files, atom will default the icon to the default atom icon because there is none in the icon pack

Icons in list menu are misplaced

Hello, very nice theme!

For some reason icons in settings menu (as well as in tree view) are misplaced a little (or text is misplaced)

screen shot 2018-08-26 at 15 12 51

I've tried digging into it but unsuccessful.

Fonts Suddenly Bolder

After the most recent Atom update to 1.39.1 on MacOS Mojave all the fonts are suddenly bolder. As a developer I recognized this as the issue caused by the antialiasing property with lighter text over a dark background.

I was able to get back to the prior weight by setting -webkit-font-smoothing: antialiased; in my Atom stylesheet.

Any chance to get this fixed in the theme, or make an option to control this setting if it's actually a desired or intentional change?

Icons not showing in tabs

Uninstalled and reinstalled both themes and icons package and nothing. Icons do not show in the tabs as they used to before.

captura de pantalla 2018-10-18 00 31 39

[Request] Terminal theme

Hi guys!

Can be closed and kept just a reminder for a feature request, following the short talk we had on Twitter.

A Terminal theme to match City Lights would be very awesome. I often have Atom and Terminal open at the same time and I like them to have the same colors. ๐Ÿ™‚

Not urgent btw.

Find/Replace font color is hard to read

Let me start with saying that I really love the City Lights theme so far! Thanks for the great work!

One thing that bothers me is that I find the font color in the "Find" box hard to read:
image

It looks like it's a different color from e.g. the "New File" dialog, or the fuzzy finder.

Would it be possible to make the font color in the Find/Replace input fields a bit brighter so it's easier to read them?

I don't have any custom style settings, other than using "Source Code Pro for Powerline" as the editor font, with size 14. While checking that, I found that the font color in the settings is also a bit too unobtrusive, e.g. in the "Font Family" field, it's hard to see a difference to the fields that have the default value:

image

Visual issues on Win 10

Hi! First of all, congrats on an awesome looking theme! ๐Ÿ˜Ž

I found some visual bugs on Atom on Win 10, where the UI font and the scrollbars are not being themed correctly, I assume there's no actual support on Windows?

image

I hope there is proper support on Windows soon because this is the first theme that actually makes me want to change the default One Dark.

Thanks!

File navigator window has no horizontal scroll

Thank you for an awesome theme!

Feature request: horizontal scroll bars in the file navigator window.

Context: It's impossible to navigate projects with a deep directory structure unless I expand the file navigator window. It does produce scroll bars when I make the file navigator window very narrow, however it does not scroll enough to see all the files. I've attached a screenshot below that demonstrates my issue:

screen shot 2017-11-04 at 6 34 35 pm

A lot of Atom themes allow me to scroll the file navigator window horizontally to see all the files/folders in a project without adjusting the width of the window. I think it would be awesome to include this functionality in an awesome theme! ๐Ÿ˜„

Thank you!

styleguide shows a black screen

If you load the styleguide (default ctrl-shift-g) with this theme active the entire ui goes black. The only way to fix it is to switch tabs (ctrl-tab) or close the window (ctrl-w). Not a big deal but may be indicative of a larger issue.

Folder icon color change

Hi, first of all i love the theme, syntax and icons, really nice work guys!. The only issue for me it's when i change a file inside a folder the folder icon color doesn't change, and it's a little difficult to know where i changed a file, that's all thanks :D

Missing "System" icon

Last Atom version has System tab in the Settings menu. It would be nice to add an icon.

Indicate if file/directory is ignored

Some other UI themes grey out the files that are matched against the .gitignore list.
It would be nice to differentiate the ignored files from the rest of my project files.

Adaptive color scheme

Themes like one-dark-ui are able to adapt to selected syntax theme (see FAQ section at the bottom) to look more natural when users use non-matching UI+Syntax themes. (e.g. city-lights-ui + solarized-dark)

I think it would ease the adoption of this theme and makes sense in general.

Match UI with syntax theme

I quite like the layout of this theme, such as how the file search and atom command things open up in the center of the screen, however it does not match well with my syntax theme since I'm not the biggest fan of the City Lights syntax colours.

It would be nice if City Lights UI was made to use colours from the selected syntax theme, instead of having hardcoded colours built into it (Atom Material UI does this).

Outline hanging indent too deep

This is just like, my opinion but in the 'outline' where you see a list of classes, functions, etc, in the current file, there's a hanging indent for all properties, methods, etc. under a particular class. This indent is very deep. As a result, I need to keep the outline pane a bit wider than I'd like. I think that indent would be fine with about half the current width.

Project Title Highlight

The portion of the tree-view with the project name has a background similar to that of the active tab among your open code files. When I restart Atom and set the UI to City-Lights, this doesn't happen. But, the moment I close Atom and reopen a project, this weird UI glitch shows up.

Ctrl+Shift+G | Stylesheet goes black

When I have the city lights ui theme selected and press Ctrl+Shift+G the stylesheet is displayed for a moment and the fades to a black screen. This behaviour does not occur with any of the themes that come standard with atom.

Scrollbar match theme

Hey all! This is a great theme, in combination with the Syntax and Icons it's really well thought out. Very nice!

I found it odd that the scrollbars weren't styled. Would you be open to a pull request? I came up with this as a solution (locally):

@import "ui-variables";

::-webkit-scrollbar-corner {
  background-color: transparent;
}

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-thumb {
  border-radius: 2px;
  background: @text-color-highlight;
}

Screenshot:
screen shot 2017-11-07 at 11 42 24 am

Keybindings clipboard icon is invisible

In keybindings setting, clipboard icon is invisible.
'Invisible' means I can click icons because mouse cursor changes to finger around keystroke command.

city-lights
screen shot 2018-06-23 at 14 04 01

atom-dark
screen shot 2018-06-23 at 14 04 26

Ability to scroll the tree-view horizontally

Nice UI/Color Scheme but I have a problem with scrolling the tree-view horizontally because i work multiple layers of folder and in order for me to get thru to file is by resizing the tree-view and i like my tree-view to be small.

Modified files should always have the indicator visible

Currently, the 'file is modified' indicator is only visible if that tab is active. I've added this to my stylesheets to fix it, but should be native, or at lease an option.

.tab-bar .tab.modified:not(:hover) .close-icon {
  // keep the modified indicator live regardless of active-ness
  opacity: 1;
}

Tree view tabs on the right are not hidden

Currently the theme itself hides the first available tab list (ref), which happens to be the one on the left; moving tree view to the right breaks this behavior.

Maybe this could be solved by

  • iterating through .list-inline.tab-bar.inset-panel, or
  • indirectly refer to the parent of .tab[data-type='TreeView']?

Thanks for making the theme! Really love the vibe in City Lights (ใƒปฯ‰ใƒป)ใƒŽ

Configurable padding for file tree view

I find that the directories and such in the tree view are a tad too closer together for me.

It would be nice if there was an configurable setting to increase the number of px between each element in the tree view.

Big cursor size in shell

Is it possible to reduce the cursor size in the shell ? It seems larger than the other them .
cusrsor_shell_size

UI Theme issue

Beautiful theme, thanks for your contribution.

Whenever switching to CityLights UI, the fonts becomes all messed up. The syntax theme works correctly. All fonts are set to default.
weird

Atom 1.21.2 @ Ubuntu 16.04

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.