Four days ago, the official GNOME (Linux desktop environment) font Cantarell had a new release where they apparently redesigned it from scratch to interpolate better in bold settings. Next to this needing some adjustment from my part - as it always does when your base font changes 😄 -, it now looks rather horrendous in nebula-ui, for some reason:

As you can see here, the font is incredibly thin and hard to read, even when hovering over it (which lights up the font due to focus). This must be due to the Cantarell update, since it worked fine before.

I opened up the developer tools and played with the nebula-ui settings a bit and it turns out the culprit is the font-weight: 300 setting. Disabling it makes the font look normal again, for example:

I don't know how this will look with other base fonts on Linux, though. I also gave DejaVu Sans Book a whirl, since I think DejaVu is another commonly used font on Linux desktops, and it also benefits from removing the font-weight and experiences thinness with it enabled. Perhaps it would be prudent to just disable it for the Linux platform entirely?

When splitting a file left or right the top tab bars are disproportionate.

Looks to me there is a colour issue for the text on the restart button. It displays on hover, but it's invisible until then. Otherwise, just wanted to say thanks, I love the UI and theme, very pro and love the UX focus!

Hey,

Awesome work! There's a minor problem though, the menubar's are impossible to read. Screenshot attached.

Thanks

Hello

Is it possible that normal progress bars (as shown in the styleguide near the bottom) are not styled?

Thanks in advance

Throw the users some animated screenshots through the theme's README.md , otherwise this may be passed on since it seems to be very similar and non-animated. Good luck!

Three cheers for a well produced and innovative theme! I like the concepts around focus mode and the in-editor interactivity. This is what the web-platform is capable of doing!

Just two minor padding issues (over and above those in the tree view):

• For the neglected crowd on Linux, who do not have the luxury of MacOS's inline title-bar, there is no padding between the tab and the title bar, which 99% of the time will be a different color to the tab background. This makes the vertical alignment of the tabs, especially when hovering over one, a little awkward:

  

• I also thought that the status bar could do with some top padding to, again, reduce the vertical alignment awkwardness:

  

Just my thoughts!

@tjkohli First of all, I love the theme! Wonderful job! I shared it with my team of developers who also use it now! I noticed one small issue where if you use the package git-plus and try to stage files, the check mark to indicate whether a file has been staged is missing. I have attached the screenshots below and a possible solution written in plain css. I could submit a PR if it would help. Thanks!

Solution

.select-list ol.list-group.mark-active li.active:before, .select-list ol.list-group.mark-active li.active:before, .select-list ol.list-group.mark-active li.selected:before {
    margin-right: 0.45454545em;
    color: #73c990;
}

.select-list ol.list-group.mark-active li.active::before, .select-list ol.list-group.mark-active li.active::before {
    font-family: 'Octicons Regular';
    font-weight: normal;
    font-style: normal;
    display: inline-block;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    text-decoration: none;
    font-size: 14px;
    width: 14px;
    height: 14px;
    content: "\f03a";
}
.list-group .selected::before, .list-tree .selected::before {
    position: relative !important;
}

Screenshots

Before

After

Would it be possible to also fade out (Focus Mode) the very popular Atom Tool Bar package until it's hovered? Similar to how the file explorer and mini map and such are faded that is? Thanks!!

Hello

Thanks for fixing #7! I don't know if you noticed my last comment on it, but status-ignored doesn't seem to be styled yet; it has the same styling as an inactive tab, even if it is active.

I figured I'd post a new ticket since I replied on a closed ticket :-).

Also: the active color is now white for every tab, even if it is modified. Currently you can no longer see that a tab is modified in Git if it's active (only if it's inactive, in which case it will be a dark green). Was it perhaps intentional that the color isn't green (but faded out) when inactive and green (full brightness) when active?

Thanks in advance

Hello

Thanks for fixing the padding issues so quickly, it being missing tarnished an otherwise visually very impressive theme :-).

I'm drawn to the screenshot in the README that shows error messages pulsing with animation, but can't seem to achieve that with my error linting - I still get the ol' squiggly lines. Is this something I have to configure or perhaps not compatible with all languages? I'm currently using the widely used linter package to display PHP errors inside the editor.

In case it's helpful, I think it's this line that's handling the styling of the messages in the editor for the linter package.

Thanks in advance

Hello

Active tabs neatly light up to indicate their state via the tab -active class. However, it appears that when you have a tab open that has been added via Git, the highlight is lost; the tab title will be green and when such a tab is active, it will remain the same shade of green, losing the indication of being active.

It seems that, inside the <li class="tab active">, the <div class="title"> becomes <div class="title status-added">, where the status-added class overrides the active styling's color.

Just a minor issue, of course :).

Thanks in advance

Just wondered if in the ReadMe it might be handy to list another font option in the Type section since SF Mono is not available for those outside of Mac? Especially when you consider Windows is the biggest user base of Atom? Personally I would say Fira Code (or at least Fira Mono) is pretty nice too.

I really think the programming ligatures in Fira Code are really slick, and fit in well with your fantastic clean theme goals of legibility, making it easier to focus, etc.

I have really enjoyed this theme! Thanks for all of your work!

Just suggesting that a light version would be great. I like to switch between light and dark depending on the time of day.

I encountered this minor issue whilst testing php-unit-integrator.

It seems the arrow of the dropdown overlaps the text displayed inside it:

This issue is visible in Atom's styleguide as well.

Downloaded theme and syntax via Atom's Installer in the Settings Menu. After setting theme and syntax to Nebula I only get white text. Same in all fonts I tried; other themes/syntax unaffected. OS is Linux Mint Cinnamon 17.3.

Hello

I just wanted to leave a tip about the Atom styleguide here, in case you haven't heard of it. If you have the default Atom styleguide package enabled, you can open the styleguide via Packages → Styleguide → Show.

The styleguide allows you to see a rough overview of how everything looks in the UI theme. For example, I notice that the toggle button's bubble appears to be outside of the button itself. I can't decide if the progress bar is unstyled or purposefully styled as it currently is :P. The checklist check marks you already fixed earlier are also in here, so they now show up nicely!

Thanks for your work and attention to detail in this theme! Feel free to close this ticket as soon as you've read it.

In Atoms built in themes the scroll bars for tree view/code view are small and stylished. With your theme I seem to be getting the huge and ugly default scroll bars that Chromium sports.

Included in the atom-IDE package is a terminal emulator, and it should normally use the UI theme's colours, however in nebula it reverts to black.

Hello

I just noticed that list views that contain selectable items seem to have no checkmark styling.

An example of a plugin using these is git-plus in its Stage Files view. Here, you can press the return key to select the file to stage. In One Dark and other styles, a checkmark will appear in front of the row in the list. It also appears that other themes reserve space for this checkmark so that the item doesn't jump to the right when the item is selected.

The class hierarchy for this is (from top to bottom)

• div class="select-list"
  • ol class="list-group mark-active"
    • li class="selected active", here, selected means that the row is currently selected with the arrow keys, which is already styled. active means that the item is also checked and is not present if it isn't, this currently isn't styled so there is no distinction between checked and unchecked items.
      • The contents of the row

Thanks in advance

In nebula-ui/index.less:

Starting from Atom v1.13.0, the contents of atom-text-editor elements are no longer encapsulated within a shadow DOM boundary. This means you should stop using :host and ::shadow pseudo-selectors, and prepend all your syntax selectors with syntax--. To prevent breakage with existing style sheets, Atom will automatically upgrade the following selectors:

• atom-text-editor[mini] .placeholder-text, atom-text-editor[mini]::shadow .placeholder-text => atom-text-editor[mini] .placeholder-text, atom-text-editor[mini].editor .placeholder-text

• atom-text-editor[mini] .selection .region, atom-text-editor[mini]::shadow .selection .region => atom-text-editor[mini] .selection .region, atom-text-editor[mini].editor .selection .region

Automatic translation of selectors will be removed in a few release cycles to minimize startup time. Please, make sure to upgrade the above selectors as soon as possible.

Hello

I've yet to take this theme for a good test drive in the near future, but wanted to report a small thing I noticed after firing it up for the first time. Could it be that there is a small lack of padding/margin in some area's? Take the following screenshot, for example:

The minor detail I'm referring to is in the left corner of the selected item from the tree view, bordered on the "expando" or arrow icon. The highlighting color seems to stob very abruptly at the expando itself. Also, it appears that the expando is not centered in the highlighting, but positioned higher than the center.

Just a very minor detail, but wanted to let you know anyway :-).

I'm using Linux, in case this is specific to Atom on Linux.

Thanks in advance