Themes Not Working Fully

SkyHacks commented 8 years ago

If I add a plugin for a theme like "hyperterm-oceanic-next" or "hyperterm-spacegray" in the .hyperterm.js file, it will download the package and refresh the terminal but only some of the styles are applied. I have tried several themes and they all seem to have the same issue. The background colors are applied but none of the font colors seem to work. Any advice?

insanityfarm commented 8 years ago

I think I experienced this myself but when I opened a new window the theme was correctly applied to it. Is that the same thing you're seeing? So the problem is specifically that the theme is not applying to the current window, if that helps anyone troubleshoot.

SkyHacks commented 8 years ago

I'm sorry, I forgot to mention that I tried that as well. Unfortunately, it didn't resolve the issue for me.

zanedev commented 8 years ago

Seeing same thing theme not applied, in fact everything went monochrome and can't get back to original colors after removing the themes from the plugin list.

zanedev commented 8 years ago

Still a problem with latest 0.7.0 (0.7.0.26) I can't get any theme to apply it basically reverts to a monochrome color scheme fonts. I noticed its not pulling in the packages into ~/.hyperterm_plugins/node_modules automatically for some reason so I tried cloning the theme into local and no dice :(

arnaubt commented 7 years ago

I'm having the same issue with hyperterm-atom-dark. Tried restarting various times but nothing changes.

alo commented 7 years ago

Same problem with hyperseti, hyperterm-monokai, ... always same font

haluvibe commented 7 years ago

Same problem with hyper-seti and hyper-seit-monokia - actually almost nothing changes for me. Here is my .hyper.js file which is the default with hyper-seti-monokai added....

// ~/.hyper.js
module.exports = {
  config: {
    //default config stuff
    fontSize: 15,
    colors: [], // etc...

    // theme overrides
    themeOptions: {
      accentColor: 'orange'
    }
  },

  // add the theme
  plugins: [
    'hyper-seti-monokai'
  ]
};

haluvibe commented 7 years ago

I just realised my themes aren't working in iTerm either, so must be something other than Hyper causing my issue. Maybe this will help others?

jacoboar commented 7 years ago

I have the same problem with all themes. Only the background-color works. Any solution?

Hyper 1.3.1 Windows 10 x64

lucamezzalira commented 7 years ago

I added on .bash_profile the command export CLICOLOR=1 then I reload Hyper and it was working

jacoboar commented 7 years ago

Thanks. I'll try it

CyrisXD commented 7 years ago

I'm having this same problem.

Windows 10 x64

Can someone please let me know if you've gotten it fixed and how I can achieve that?

jacoboar commented 7 years ago

It doesn't work. Sorry

chabou commented 7 years ago

Can you give a specific theme name and a screenshot?

leojcollard commented 7 years ago

I had a similar problem and it turned out that Hyper was not the issue; both my regular Terminal.app and Hyper did not properly show font colours. The solution provided here fixed the issue for me. It turns out my ~/.bash_profile file had gotten messed up somehow. Hope this helps someone!

jrichard8 commented 7 years ago

You have to change the default shell to :

shell: 'C:\Windows\System32\bash.exe',

Enjoy

albinekb commented 7 years ago

What version of hyper? @schmittyjd

schmty commented 7 years ago

@albinekb version 2.0.4

bhat-ganesh commented 7 years ago

I tried hyper-one-light and this is what it looks like

This is my hyper version: hyper-vresion

I also did what @leojcollard mentioned but it didnt help.

I personally prefer light theme, but stuck using default dark theme that hyper comes with.

Any pointers to what the issue might be is much appreciated.

bhat-ganesh commented 7 years ago

Seeing the same issue on Hyper 2.0.4 as well.

bhat-ganesh commented 6 years ago

Update: the reason my themes were not working was because of "hyperborder" plugin. Removing it fixed my theme.

Raised an issue on hyperborder https://github.com/webmatze/hyperborder/issues/38

webmatze commented 6 years ago

Author of hyperborder here. Thanks for the reports. I will investigate this issue.

webmatze commented 6 years ago

@kingmomo I looked into the issue with your hyper-one-light theme together with the hyperborder plugin.

For hyperborder to work correctly it is essential to set a backgroundColor in your .hyper.js config. So hyperborder will use that value to set your background.

When hyper generates that configuration for the first time, it always sets the backgroundColor to #000 so it will be black by default.

When a theme uses a different background color, then you have to explicitly set your backgroundColor value to the color used in that theme to work together with hyperborder.

hyper-one-light uses #fafafa.

So it is not really an error but just the way hyperborder works as it uses background gradients and colors to generate the desired effects.

But I am not sure if this solves the problem of this issue, as not everyone here seems to use hyperborder.

bhat-ganesh commented 6 years ago

@webmatze you are right, my issue with theme+hyperborder may not be the same as others in this thread. It just might be a case where the final outcome looked similar.

And thanks for the info on bg color with your plugin.

kuntashov commented 6 years ago

I'm faced with the same issue using 'hyper-solarized-light' ver. 0.1.2 plugin.

See screenshot:

on the left is Hyper with 'hyper-solarized-light' plugin enabled: background is from solirized theme but font colors are wrong (default colors);
on the right is xterm with Solirezed theme - all colors are just as expected

screenshot_20180112_233716

My environment:

[x] OS: Linux Mint 17.3 Rosa with Xfce 4.12
[x] Hyper 2.0.0-canary.9 (canary)
[x] Plugins:
- hyper-solarized-light (0.1.2),
- hyper-native-window-decoration (0.0.4),
- hyper-tab-icons (2.1.0),
- hypercwd (1.1.1)

How can I help to localize the reasons of this issue?

bhat-ganesh commented 6 years ago

@kuntashov remove all other plugins and keep only "hyper-solarized-light" and see if you still have the issue. Then add one plugin at a time. Most likely one the plugins is clashing with hyper-solarized-light and causing the issue.

kuntashov commented 6 years ago

@kingmomo I've removed all plugins except hyper-solarized-light and restarted hyper but colors still are wrong

bhat-ganesh commented 6 years ago

@kuntashov im not sure what the issue is then. Have you tried other actions mentioned in this thread? Like setting the shell in your .hyper.js, that seems to have worked for few.

kuntashov commented 6 years ago

I've checked several different themes from the bnb/awesome-hyper:

an-old-hype
hyper-adventure-time
hyper-atom-dark-transparent
hyper-aurora
hyper-ayu
hyper-ayu-light
hyper-ayu-mirage

up to 'hyper-monochrome' and all they work as expected.

Then I compare index.js from 'hyper-solarized-light' and other themes. Most of the themes use object map to define colors, i.e.

const colors = {
    black: '#000000',
    red: '#ff0000',
    // etc ...
}

And 'hyper-solarized-light' uses array do define colors, i.e.

const colors = [
  backgroundColor,
  '#dc322f', // red
  // etc ...
]

I've just changed colors const from array to color map object (kuntashov/hyper-solarized-light/commit/f63c8d8) and then I've got what I want (hyper is on the left and xterm on the right):

screenshot_20180113_023501

In ~/.hyper.js I can see comment before color map:

    // the full list. if you're going to provide the full color palette,
    // including the 6 x 6 color cubes and the grayscale map, just provide
    // an array here instead of a color map object

I'm not familiar with Hyper architecture and can't figure out what difference between array and map object in context of defining theme colors.

Can anyone help to figure out does it 'hyper-solarized-light' bug or something wrong with Hyper when colors defined as array 'including the 6 x 6 color cubes and the grayscale map'?

methodbox commented 6 years ago

I too am having this issue. Trying Hyper for the first time, new install, one plugin - hyperterm-monokai - no dice.

The background changed to grey (vs. black) and that's it - still stupid white text, no highlighting, etc.

As an example, this is .hyper.js viewed in Vi:

There should be at least minimal syntax highlighting. Instead it's all white text.

And another using cat (so we can avoid the idea that this is due to Vi in some way):

I installed this app to check out the customization options - was hoping it would be like Atom where there are names & classes assigned to every element, making it easy to target in JS and CSS only to find out this is not the case.

Not really sure how you can call it highly customizable if you need to insert target IDs or classes just to change the text color. It's nifty that you can add plugins so easily, but they don't seem to work correctly, and I'm not really looking for exploding text or animations. With Atom, I don't need plugins or themes - I can just edit it directly and mock it just like like mocking it w/dev tools in the browser.

The solution here is probably to added proper ids to each major element to allow targeting in CSS.

I really just want to be able to customize the different context of text like my name in terminal, SSH, SSH, file types, folder types, etc. but it seems maybe this isn't the right app for that as it stands.

I would propose treating elements on the "page" like those in Atom - starting w/the terminal user name field being a separate element from the text that is typed - right now, they are the same element:

<x-row>MyMac:~ MyUser$ #text I just typed</x-row>

Atom might handle it like this:

<x-row>MyMac:~ MyUser$ <span  class='x-row-typed-text'>#text I just typed</span></x-row>

The alternative is to imperatively target the nth-child, etc. in CSS via JS, then apply the CSS dynamically every time to whatever appears after the $, which of course is just begging to break.

kuntashov commented 6 years ago

@methodbox

As an example, this is .hyper.js viewed in Vi:

Hyper is not responsible for syntax highlighting in text editors. Are you sure you've enabled syntax highlighting in Vi (set syntax=on)?

All other things you are described are offtopic for this issue.

Please try to be more patient and constructive. I've managed to solve all issues I wrote about recently and now I see that Hyper is really great software.

methodbox commented 6 years ago

@kuntashov

1) The other issues are absolutely on-topic. The same thing is still happening.

2) I was trying to be constructive by proposing a sane way of customization (classes and ids for each element and a separate element for dynamically typed text a la Atom).

3) Syntax highlighting is enabled in Vi and works in Terminal.

Again, the theme gets applied, it doesn’t work other than changing the background color. ALL text is white. There’s really no theme at all.

I am going to try my hand at isolating the cause when I get some free time.

But I still think addressing the fact that customization without writing a theme as a plugin is sorely lacking when the app itself is dynamic HTML markup without basic classes and ids on the primary elements.

There are classes on many elements but not, for example, on an x-row generated element.

There is no element separating typed text from the static shell text of user@host. It’s bad design.

rafmjr commented 6 years ago

@leojcollard thanks a lot! Adding the following to my ~/.bash_profile did the trick for me:

export PS1="[\033[36m]\u[\033[m]@[\033[32m]\h:[\033[33;1m]\w[\033[m]\$ " export CLICOLOR=1 export LSCOLORS=ExFxBxDxCxegedabagacad alias ls='ls -GFh'

Then you do you source ~/.bash_profile, reload hyper and my life is back in technicolor :)!

chabou commented 6 years ago

Please retry with our v2 and open a new issue if it is relevant

AriPal commented 6 years ago

Here is a solution that worked for me. What seemed to be the problem lies in .bashrc file, and since I cannot exactly identify what command causes the theme error, I decided to restore the whole file.

Restore .bashrc file, added by souravc.

/bin/cp /etc/skel/.bashrc ~/
source ~/.bashrc

Now that you've restored the file, the next step is to follow what @lucamezzalira has commented.

I added on .bash_profile the command export CLICOLOR=1 then I reload Hyper and it was working

Remember, after you've restored .bashrc, remember to update it by running source .bashrc, exit and re-enter the terminal.

methodbox commented 6 years ago

What you guys are referring to is bash and LS colors; they work in and out of Hyper (theoretically) and are a function of bash and BSD/Unix not Hyper.

See this (which I assume is where the above poster pulled it from, since it’s identical): http://osxdaily.com/2013/02/05/improve-terminal-appearance-mac-os-x/

You can follow the pattern and set your own colors.

If Hyper is only allowing customization through the .bash files then it isn’t really customizing Hyper at all; you can do this in the native terminal.

In fact, since it’s built in Electron, it’s kind of a backwards way to handle customization since you should be able to use CSS.

For example, on macOS install the Monokai.terminal theme and then set the LSCOLORS in ~/.bash_profile.

This isn’t the same as being able to manage customization by managing this through CSS (like Atom) ... which is kind of the whole point of Hyper, isn’t it?