Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Window control buttons are misplaced when using non-default layout #9

Closed
hiunnhue opened this issue Feb 16, 2019 · 5 comments
Closed

Comments

@hiunnhue
Copy link

please see harveycabaguio/firefox-elementary-theme#15

@Zonnev
Copy link
Owner

Zonnev commented Feb 16, 2019

This theme tries to blend in elementary OS default theme and layout. I can not adjust the theme for non default button layouts. The buttons are spread because they are using align center and justify with space between. There is no other way to get them positioned like they are now. So with non default button layouts the theme breaks. But you are of course free to fork this theme and adjust it to your likings.

@kkinder
Copy link

kkinder commented May 9, 2019

One simple way to hide the problem, at least, is to disappear the minimize button only from Firefox. It's not ideal, but it will make it somewhat presentable:

.titlebar-min {
  display: none;
}

@Zonnev The CSS file is pretty big and I'm not super-familiar with Firefox theming. Would you mind pointing out where they're spread out by aligning them center?

@kkinder
Copy link

kkinder commented May 9, 2019

Also, do you mind me asking what you're using as a reference for what elements exist to be styled? I'm not finding it. Thanks a bunch -- and nice work on this theme!

@Zonnev
Copy link
Owner

Zonnev commented May 10, 2019

@kkinder First of all thanks for your bit of css to add. I will add it soon.
On line 104 in the userChrome, 'space-between' does the spreading of the window controls.

I don't know exactly what you mean by your second question, but elementary os icons which are used as a reference, can be found here: https://github.com/elementary/icons

Or maybe you mean: how I do the styling of Firefox browser elements?
First: searching for an element in the Firefox browser works as follows:

  1. In Firefox, open the web developer tools.
  2. Search for settings in the 3 dots menu.
  3. In settings, mark "Enable browser chrome and add-on debugging toolboxes".
  4. Close the web developer tools and go to menu > web developer > browser toolbox.
  5. Now you can select elements of the browser and see what styling they have. This information you can use in the userChrome to do your own custom styling.

@kkinder
Copy link

kkinder commented May 13, 2019

Thanks, @Zonnev , that's what I was wondering about.

@Zonnev Zonnev closed this as completed Nov 10, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants