This combination of colours used in Files V23Nov17_DARK for the sidebar, headerbar and other elements is my favorite so far. It just looks so clean. Modern too, even without the transparency. The shade of black I used for the headerbar (#181818) seems like way too much in comparison.
I managed to recreate the Ubuntu dots (pretty closely, I think): See here.
I’ll continue looking for the original since I can swear I once saw it for download on the Ubuntu brand assets page.
I see you should find the reference in the unity-greeter source package (for lightdm). However, I like the pure svg option, we can imagine transitions later on, or having a dynamic GDM screen with more and more dots as we get closer to the release date But that’s not for V1, let’s dream again about dynamic wallpapers
I remember seeing the dots on the branding site too. Perhaps the design-team can provide the original ones? @popey will know who to contact. Isn’t the pure CSS thing an option?
@godlyranchdressing I’m not sure I understand how the transparency thing works? Is it something that we can add and if it isn’t supported it will just show a solid white (like HTML) or will the theme simply be broken if it’s unsupported? ( Sorry for the tech newbie questions )
I’m not sure. I’ve tried using them in the past but it seems like complicated gradients like that aren’t available for the Shell. I actually thought gradients weren’t possible at all until Ambiance, which did it using:
So only simple gradients are possible, it seems. There’s also the benefit of the svg option being a simple file swap.
What transparency thing? Sorry for the confused person question.
EDIT: I forgot to mention this in regards to the login screen mockup. The “Unlock” button is the only one that’s available to easily style (it’s in the “.default” class, whereas the Cancel button is just a regular button). It’s minor but just letting you know as well as others.
I wasn’t sure how to illustrate this, so I made a video
These controls are a bit bigger and when hovered, you can see the clickable area. Maybe the min,max and close icons are a bit too far a part (the square is the same width as the titlebar height). And maybe the hover color shouldn’t be orange.
I vote for it only to be used for the headerbar/titlebar, but that’s only if we’re going to be using a dark headerbar. Are we? With a light headerbar the transparency is either distracting or so subtle that there’s no point in using it. In the case of a dark headerbar, the #181818 that’s being used is a little jarring (Unity 8’s titlebar didn’t have the issue since it was so much smaller, and yes, I know it’s darker than that in the United theme, but whatever). Today I did some testing:
I lightened the black a little (#252525 as opposed to the #323232 from your mockups) and made it a little transparent (0.96).
I find the transparency does a good job of softening the headerbar’s black without having to brighten it further (if that’s something we don’t want). I also made unfocused and maximized windows have a solid headerbar and so far it’s a decent way to distinguish between focused and unfocused windows, something that @CraigD points out is a problem with dark themes.
Transparency in the headerbar also carries over to GTK2 programs without issue and I think a consistent look between GTK3 and GTK2 apps should be something we prioritize.
I vote for it only to be used for the headerbar/titlebar, too. (0.96) it’s the ideal value of transparency for me. windows get a modern look with some transparency.
Some windows have an ID and we can modify them, for example “Nautilus”, then we can use transparency in headerbar and list widgets.
I think (having been there), that we should limit the amount of per-application hacks at the maximum. We used it in the past and it makes slightely different applications not looking consistent. So starting from the great common denominator is maybe more beneficial? And then, we refine case-by-case once we get the general ideas in.
Does it make sense?
Perfect sense. I would support transparent sidebars if we could guarantee a consistent look at least across the stock apps, but the same workaround to get transparency in Nautilus doesn’t apply to every other app. Also, not every app uses unique classes/IDs that would let us use hacks without consequence.
@luxamman, I really the desktop login of V27Nov17, it really feels like Ubuntu!
Also, about the terminal. As a red/green colorblind person, I really like the default terminal color scheme of ambiance, it makes the colors easy to distinguish for me. I don’t know who created that but they really put some effort in that! Adwaita’s default color scheme on a light background is unusable for me. In general, dark terminal color schemes are better imo.
Might be interesting to see if someone has done some research on terminal color schemes and accessibility, there’s like a whole community dedicated solely to terminal color schemes…
Sure we can think about the color’s in the terminal (I guess they are part of the theme as well) to find a solution for all of us to work. Even if it is just the change of a color, so as not to get too close to red/green. An interesting aspect that I would not have come to!
Personally, I also like the dark terminal much more. The slight red in the background is also a hint that this system is using Ubuntu. The white background in Gnome combined with the bright green is also for me a problem, the contrast is so little, you always have to focus on the words that just make the eye tired and is hard to read.
The tab concept seen in Files 26Nov17_Tabs might not be possible (without relying on external assets, anyway). How about something like this?
I think if we’re removing the headerbar button borders then it should only be for buttons that aren’t linked to something else. This is useful for maintaining relationships between buttons but also (and mostly) to avoid situations like the following:
you are doing an awesome work, there are something with corners and transparencies, I made a video about the windows behavior. maybe it helps you to take a decision about this.