Currently, the CSS files are the Sass files generated to CSS and then tweaked.

This "tweaking" is accomplished by doing a long, painful "git diff" on the generated CSS and reverting back bits that are in previous versions of the CSS files. When I was the only maintainer, this was reasonable so that we had feature parity between the CSS and Sass files. Now that we have 3 maintainers, its unreasonable to expect all of us to maintain a cumbersome process like that.

I need to write a shell script that automates the process.

Comments

JohnAlbin’s picture

Assigned: JohnAlbin » echoz
Priority: Major » Critical
Status: Active » Needs review

Ok. I've pushed new code for this. If you are on a Mac or UNIX machine this should work:

  1. cd zen-internals
  2. ./generate.sh

The generate.sh script will pull in various pieces of code and text from the zen-internals/extras folder and run compass watch (twice) in order to get the STARTERKIT/css files and zen-internals/css files generated.

This needs review by both Kris and Ellie! Does this work for you two?

echoz’s picture

Works fine :-)

All zen's files remain the same after running ./generate.sh
The cli output is:

./generate.sh
remove css/styles-rtl.css
remove css/styles.css
create css/styles-fixed-rtl.css
create css/styles-fixed.css
create css/styles-rtl.css
create css/styles.css
remove .sass-cache/
create css/css-global-states-rtl.css
create css/css-global-states.css
create css/css-layout-fixed-rtl.css
create css/css-layout-fixed.css
create css/css-layout-responsive-rtl.css
create css/css-layout-responsive.css
create css/css-modular-styles-rtl.css
create css/css-modular-styles.css
create css/css-normalize-rtl.css
create css/css-normalize.css
create css/css-print.css
create css/styles-rtl.css
create css/styles.css

JohnAlbin’s picture

Assigned: echoz » KrisBulman

Yayz! :-D

Ok, let's have Kris review it now.

BTW, I have no illusions that I will be the sole maintainer of the generate.sh script; it is a bear of a script chock full of ancient sed-based regular expressions. :-p

KrisBulman’s picture

Awesome! I'll review this shortly

KrisBulman’s picture

Assigned: JohnAlbin » KrisBulman

hmm, having some problems.

  • OSX 10.7.5
  • Compass 12.2
  • Sass 3.2.3
  • ruby-1.9.3-p125
  • rvm 1.12.1
  • perl 5.16.0

cloned a fresh copy:

$ git clone --recursive --branch 7.x-5.x KrisBulman@git.drupal.org:project/zen.git
Cloning into 'zen'...
remote: Counting objects: 8978, done.
remote: Compressing objects: 100% (2311/2311), done.
remote: Total 8978 (delta 6620), reused 8952 (delta 6600)
Receiving objects: 100% (8978/8978), 2.50 MiB | 6 KiB/s, done.
Resolving deltas: 100% (6620/6620), done.

ran script:

$ cd zen/zen-internals/
$ ./generate.sh 
   remove css/styles-rtl.css 
   remove css/styles.css 
   create css/styles-fixed-rtl.css 
   create css/styles-fixed.css 
   create css/styles-rtl.css 
   create css/styles.css 
   remove .sass-cache/ 
   create css/css-global-states-rtl.css 
   create css/css-global-states.css 
   create css/css-layout-fixed-rtl.css 
   create css/css-layout-fixed.css 
   create css/css-layout-responsive-rtl.css 
   create css/css-layout-responsive.css 
   create css/css-modular-styles-rtl.css 
   create css/css-modular-styles.css 
   create css/css-normalize-rtl.css 
   create css/css-normalize.css 
   create css/css-print.css 
   create css/styles-rtl.css 
   create css/styles.css 
sed: 1: "1h;1!H;$ {g;s/\}\n\n\(\ ...": RE error: parentheses not balanced
sed: 1: "1h;1!H;$ {g;s/\}\n\n\(\ ...": RE error: parentheses not balanced
sed: 1: "1h;1!H;$ {g;s/\}\n\n\(\ ...": RE error: parentheses not balanced
sed: 1: "1h;1!H;$ {g;s/\}\n\n\(\ ...": RE error: parentheses not balanced
sed: 1: "1h;1!H;$ {g;s/\}\n\n\(\ ...": RE error: parentheses not balanced
sed: 1: "1h;1!H;$ {g;s/\}\n\n\(\ ...": RE error: parentheses not balanced
sed: 1: "1h;1!H;$ {g;s/\}\n\n\(\ ...": RE error: parentheses not balanced
sed: 1: "1h;1!H;$ {g;s/\}\n\n\(\ ...": RE error: parentheses not balanced
sed: 1: "1h;1!H;$ {g;s/\}\n\n\(\ ...": RE error: parentheses not balanced
sed: 1: "1h;1!H;$ {g;s/\}\n\n\(\ ...": RE error: parentheses not balanced
sed: 1: "1h;1!H;$ {g;s/\}\n\n\(\ ...": RE error: parentheses not balanced
FATAL ERROR: The following file contents were not found: modular-styles--navigation-links--search.txt
KrisBulman’s picture

Assigned: KrisBulman » JohnAlbin
KrisBulman’s picture

Assigned: KrisBulman » JohnAlbin

Looks like this is a problem with OS X's BSD Sed which behaves a little differently, so I installed gnu-sed via homebrew with

brew install --default-names gnu-sed

Which got rid of the "parentheses not balanced" messages, however I now get this :\

kgbulman:zen-internals kgbulman$ ./generate.sh 
   remove css/styles-rtl.css 
   remove css/styles.css 
   create css/styles-fixed-rtl.css 
   create css/styles-fixed.css 
   create css/styles-rtl.css 
   create css/styles.css 
   remove .sass-cache/ 
   create css/css-global-states-rtl.css 
   create css/css-global-states.css 
   create css/css-layout-fixed-rtl.css 
   create css/css-layout-fixed.css 
   create css/css-layout-responsive-rtl.css 
   create css/css-layout-responsive.css 
   create css/css-modular-styles-rtl.css 
   create css/css-modular-styles.css 
   create css/css-normalize-rtl.css 
   create css/css-normalize.css 
   create css/css-print.css 
   create css/styles-rtl.css 
   create css/styles.css 
FATAL ERROR: The following file contents were not found: normalize--font-face--search.txt

There seems to be a problem with these two files and the script (in my case):

  1. normalize--font-face--search.txt
  2. normalize--links--search.txt

What do these files have in common you ask? apostrophes. By removing the apostrophes from both normalize.scss and these two search.txt files, the script runs like a charm.

Now.. to track down the apostrophe problem in the regex..

echoz’s picture

OS X 10.8.2 here.

KrisBulman’s picture

Tried everything I can here, still fails on apostrophes (only) :(

echoz’s picture

The other difference on my system (same compass 0.12.2 + sass 3.2.3) is ruby 1.8.7

KrisBulman’s picture

I use rvm to switch between ruby versions, I swapped back to the system ruby just to be sure (although it doesn't seem like a likely culprit) and it still chokes on apostrophes. Hoping John has some insight.. perhaps the perl regex just needs to be tweaked?

KrisBulman’s picture

@echoz can you try replacing this line

  sed -e "/^TEXT-REPLACEMENT\$/{r $REPLACE_FILE" -e 'd;}' | #-e '/^TEXT-REPLACEMENT$/! d;' |

with this one:

  sed -e "/^TEXT-REPLACEMENT\$/{r $REPLACE_FILE" -e 'd;}' | sed -e "s/\'/ /g" |

And tell me if you get the same output as before?

echoz’s picture

now i get the error - my result:

./generate.sh
remove .sass-cache/
remove css/styles-rtl.css
remove css/styles.css
create css/styles-fixed-rtl.css
create css/styles-fixed.css
create css/styles-rtl.css
create css/styles.css
remove .sass-cache/
create css/css-global-states-rtl.css
create css/css-global-states.css
create css/css-layout-fixed-rtl.css
create css/css-layout-fixed.css
create css/css-layout-responsive-rtl.css
create css/css-layout-responsive.css
create css/css-modular-styles-rtl.css
create css/css-modular-styles.css
create css/css-normalize-rtl.css
create css/css-normalize.css
create css/css-print.css
create css/styles-rtl.css
create css/styles.css
FATAL ERROR: The following file contents were not found: normalize--font-face--search.txt

KrisBulman’s picture

Interesting, that's what fixes mine! :\

echoz’s picture

Considering 10.8 ? An improvement over Lion.

KrisBulman’s picture

well, actually it doesn't really fix it.. it adds a bunch of whitespace at the end of each line.

I have another mac at work I will try the original script on (both have xcode 4.2 installed).

KrisBulman’s picture

yeah, will have to time-machine this one but i will update it if it gets me going.

JohnAlbin’s picture

Assigned: JohnAlbin » KrisBulman

I am on OS x 10.8 as well. The script uses the standard 10.8-installed versions of perl and sed. It really sucks that there's a difference with 10.7. ugh. Trying to get the sed regexs to work properly in the first place was a total pain.

Kris, the script implements a draconian measures if a text replacement fails to occur; it deletes all the generated CSS. I've updated the script so that it at least leaves the file that generated the error, so you can more easily figure out which perl/sed bits are failing.

so there are 3 places the script could be failing:

  1. # Convert search string to a sed-compatible regular expression.
  2. # Replace search string with "TEXT-REPLACEMENT" token.

    somewhre before: # Replace "TEXT-REPLACEMENT" token with contents of replacement file.

Trying adding echo $FIND at line 102. Then we can determine which of the 2 places are failing.

KrisBulman’s picture

Here is the output after adding the echo $FIND

$ ./generate.sh 
   remove .sass-cache/ 
   remove css/styles-rtl.css 
   remove css/styles.css 
   create css/styles-fixed-rtl.css 
   create css/styles-fixed.css 
   create css/styles-rtl.css 
   create css/styles.css 
   remove .sass-cache/ 
   create css/css-global-states-rtl.css 
   create css/css-global-states.css 
   create css/css-layout-fixed-rtl.css 
   create css/css-layout-fixed.css 
   create css/css-layout-responsive-rtl.css 
   create css/css-layout-responsive.css 
   create css/css-modular-styles-rtl.css 
   create css/css-modular-styles.css 
   create css/css-normalize-rtl.css 
   create css/css-normalize.css 
   create css/css-print.css 
   create css/styles-rtl.css 
   create css/styles.css 
\#navigation\ \.links\,\n
\.openid\-link\,\n\.user\-link\ {\ \/\*\ The\ \"Cancel\ OpenID\ login\"\ link\.\ \*\/\n
\#user\-login\-form\ li\.openid\-link\ {\n
\.page\-\-title\,\n\.node\-\-title\,\n\.block\-\-title\,\n\.comments\-\-title\,\n\.comments\-\-form\-title\,\n\.comment\-\-title\ {\ \/\*\ Comment\ title\ \*\/\n
\#navigation\ \.links\,\n
html\ input\[type\=\"button\"\]\,\n
fieldset\ {\n\ \ border\-color\:\ \#c0c0c0\;\n\ \ margin\:\ 0\ 2px\;\ \/\*\ Apply\ borders\ and\ padding\ that\ keep\ the\ vertical\ rhythm\.\ \*\/\n\ \ border\-top\-style\:\ solid\;\n\ \ border\-top\-width\:\ 0\.0625em\;\n\ \ padding\-top\:\ 0\.4625em\;\n\ \ border\-bottom\-style\:\ solid\;\n\ \ border\-bottom\-width\:\ 0\.0625em\;\n\ \ padding\-bottom\:\ 0\.9125em\;\n\ \ border\-left\-style\:\ solid\;\n\ \ border\-left\-width\:\ 0\.0625em\;\n\ \ padding\-left\:\ 0\.9125em\;\n\ \ border\-right\-style\:\ solid\;\n\ \ border\-right\-width\:\ 0\.0625em\;\n\ \ padding\-right\:\ 0\.9125em\;\n}\n
\n\ \ \ Since\ we\'re\ using\ Sass\,\ you\'ll\ need\ to\ declare\ your\ font\ faces\ here\,\ then\ you\n\ \ \ can\ add\ them\ to\ the\ font\ variables\ in\ the\ _base\.scss\ partial\.\n
FATAL ERROR: The following file contents were not found: normalize--font-face--search.txt
JohnAlbin’s picture

Okay. So the perl script is properly returning \n\ \ \ Since\ we\'re\ using\ Sass\,\ you\'ll\ need\ to\ declare\ your\ font\ faces\ here\,\ then\ you\n\ \ \ can\ add\ them\ to\ the\ font\ variables\ in\ the\ _base\.scss\ partial\.\n for the $FIND variable in line 101. That means line 105 is failing.

Interestingly, that's the only sed command that uses double quotes for its commands (since it needs to let the shell expand $FIND.)

Okay, I've pushed a change which limits the double quotes to a just a single sed command, instead of the entire series of sed commands on that line. Try it again, Kris?

KrisBulman’s picture

Status: Needs review » Closed (fixed)

Still a no go, but I figured 20 bucks is a small price to pay to resolve this ticket.. after the OS X 10.8 upgrade everything works as it should and a diff after running generate.sh returns an empty patch, so we're good!

echoz’s picture

Assigned: KrisBulman » Unassigned
Priority: Critical » Normal
Status: Closed (fixed) » Active

Something new to report.
I believe it was after I updated to Sass 3.2.5 that I noticed my compile from ./generate.sh differs from yours in that it compiles to 6 digit hex color numbers rather than the shorthand 3 digit. Now yours has come back with the shorthand (which I prefer, btw) and on my end, testing still results in 6 digits. It also does 0.5em to your .5em for one instance of padding.

JohnAlbin’s picture

Status: Active » Fixed

I just upgraded to Sass 3.2.6. And I've got the long-form hex colors and 0.5em instead of .5em.

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.

echoz’s picture

... and Sass 3.2.7 brings us back to shorthand 3 digit hex, etc. A bleep in Sass development :-)