Move Seven CSS files into css directory

+1 for a css directory for Seven's css files.

There's been a series of recent issues that have put us in re-roll hell, welcome to the party!

Besides your's listed here, there's plenty of current issues that touch Seven's style.css pending, so I'd also like to postpone, although the reality is whenever this would get committed, it risks needed re-rolls.

@yannickoo, patches including future changes won't apply correctly until the dependant patch gets committed. Good idea letting things with Seven settle down a bit.

Let's do this once #1986074: Buttons style update and #1490402: Redesign tabs and the content header are in.

Reopening :-) Lets do this!

Patch

Hopefully fixed the tests

This needs to also remove the old CSS, not just add the new files.
That way git will treat it as a file move.
Note the difference in file size.

I believe the tip here is configure .gitconfig using: renames = copies
https://drupal.org/documentation/git/configure

12: css-2033211-12.patch queued for re-testing.

Rerolled. Would love to get this in soon, then we can start breaking up style.css into components.

The reroll looks good to me, Lewis! http://cl.ly/image/0O0c3X143e1Q.

Marking as RTBC.

I'm having trouble with my local mysql, here's the reroll. Please test :)

Patch does not apply any more.

Sorry, I was wrong ;-) Looks good!

Committed 16e60c4 and pushed to 8.x. Thanks!

I've reverted this... noticed that we're missing updating the image paths in the css to ../images

Reverted 2c93dd6 and pushed to 8.x.

The revert wasn't pushed.

For the short period it was in HEAD, this commit revealed a separate problem:

#2304199: Theme .info.yml file changes are not picked up even after clearing cache or running rebuild.php

That should not hold up this patch though; it can be committed again once the CSS URIs have been adjusted.

I think this is it?

install-page.css also references images/noise-low.png

Also, style.css references the images in the misc folder relatively, so it needs updating to, dialog.theme.css was already in the css folder so it doesn't need updating.

1. +++ b/core/themes/seven/css/jquery.ui.theme.css
   @@ -64,26 +64,26 @@
   -  background-image: url(images/ui-icons-222222-256x240.png);
   +  background-image: url("../images/ui-icons-222222-256x240.png");
   ...
    .ui-state-default .ui-icon {
   -  background-image: url(images/ui-icons-888888-256x240.png);
   +  background-image: url("../images/ui-icons-888888-256x240.png");
    }
   ...
    .ui-state-active .ui-icon {
   -  background-image: url(images/ui-icons-454545-256x240.png);
   +  background-image: url("../images/ui-icons-454545-256x240.png");
   ...
    .ui-state-highlight .ui-icon {
   -  background-image: url(images/ui-icons-800000-256x240.png);
   +  background-image: url("../images/ui-icons-800000-256x240.png");
   ...
    .ui-state-error-text .ui-icon {
   -  background-image: url(images/ui-icons-ffffff-256x240.png);
   +  background-image: url("../images/ui-icons-ffffff-256x240.png");
   

   We don't need to add " or ' characters for images inside CSS URLs: url(../images/image-name.png) will suffice, and this is more consistent with the existing unchanged styles in the theme.

2. Fixed relative image urls found in the misc folder.

3. dialog.theme.css was already in the css folder so it doesn't need updating.

   Yes, that's true, but the urls were quoted with single quotes so got changed in my patch anyway.

@jwilson3 Sounds good to me, thanks!

I have attached some screenshots of pages that look identical.

.ui-progressbar .ui-progressbar-value {
  background: #0072b9 url(../../misc/progress.gif);
  height: 1.5em;
}

in jquery_ui.theme.css is still incorrect.

Fixed #43.

And now, a patch with actual code.

@alexpott @jwilson3 Thanks both. I had searched over all the "url(" instances in seven just to double check, it looks good to me.

+++ b/core/themes/seven/css/dialog.theme.css
@@ -77,7 +77,7 @@
-  background-image: url("../../../misc/loading-small.gif");
+  background-image: url(../../../misc/loading-small.gif);

+++ b/core/themes/seven/css/install-page.css
@@ -8,16 +8,16 @@
-    url('images/noise-low.png'),
+    url(../images/noise-low.png),

Hm. There's been A LOT of changes in these quotes. Now they are all removed again. In the W3C documentation, they always use quotes for the url("") property (eg. http://www.w3.org/TR/CSS2/colors.html). CSS Formatting guidelines also states: 'For property values that require quotes, use double quotes instead of single quotes, e.g.' Now, I don't know if url("") requires quotes or not, but in Bartik it's the same mess. Sometimes no quotes, sometimes single quotes and sometimes double quotes.

So: what is the default for this property? No quotes or double quotes (I suppose single quotes is no option). Could we update the documentation of the CSS Formatting guidelines (https://www.drupal.org/node/1887862) about what the standard is, to sort out this mess?

Good idea, as far as I know there isn't a modern browser that requires the quotes, so they are redundant. Would you like to add the direction in our standards? :) We might need a separate issue for this.

Marking this back to RTBC. We don't have a standard yet so there's nothing to conflicts with this patch.

I've just added a line to the documentation with background-image: url(path) as an example. Reason: there's still some quotes in e.g. Bartik. Since the property does not require quotes (it's optional) we don't add them.

New issue for Bartik: #2309137: Remove quotes from all background-image: url() properties

Committed f0c9d00 and pushed to 8.x. Thanks!