Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

new way to concat css files together

adding css/concat directory with the css files named in the order they should be included.
the build script then concats these files in alphabetical order and replaces their block with the concated file using the same method as the .js swap (looks for the surrounding comments).
  • Loading branch information...
commit 0928889ddc85ce04f08461841d8e4cec51f03917 1 parent 5e26749
@darktable darktable authored
View
45 build/build.xml
@@ -492,9 +492,6 @@
<fileset dir="${dir.source}/${dir.js}">
<include name="**/*.js"/>
<exclude name="**/*.min.js"/>
- <!-- minifying these is unnecessary, and will cause them to include themselves on the next build -->
- <!--<exclude name="scripts-concat.js"/>-->
- <!--<exclude name="libs-concat.js"/>-->
</fileset>
<arg line="-jar"/>
<arg path="./${dir.build.tools}/${tool.yuicompressor}"/>
@@ -559,37 +556,26 @@
<echo>Remove favicon.ico reference if it is pointing to the root</echo>
<replaceregexp match="&lt;link rel=[&quot;']shortcut icon[&quot;'] href=[&quot;']/favicon\.ico[&quot;']&gt;" replace="">
- <fileset dir="./${dir.intermediate}" includes="${page-files}"/>
+ <fileset dir="${dir.intermediate}" includes="${page-files}"/>
</replaceregexp>
<!-- we maintain the apple-touch-icon reference for Android 2.2 www.ravelrumba.com/blog/android-apple-touch-icon
<replace token="&lt;link rel=&quot;apple-touch-icon&quot; href=&quot;/apple-touch-icon.png&quot;>" value="">
- <fileset dir="./${dir.intermediate}" includes="${page-files}"/>
+ <fileset dir="${dir.intermediate}" includes="${page-files}"/>
</replace>
-->
<echo message="Update the HTML to reference our concatenated script file: ${scripts.js}"/>
<!-- style.css replacement handled as a replacetoken above -->
<replaceregexp match="&lt;!-- scripts concatenated [\d\w\s\W]*?!-- end ((scripts)|(concatenated and minified scripts))--&gt;" replace="&lt;script src='${scripts.js}\'&gt;&lt;/script&gt;" flags="m">
- <fileset dir="./${dir.intermediate}" includes="${page-files}"/>
+ <fileset dir="${dir.intermediate}" includes="${page-files}"/>
</replaceregexp>
<!--[! use comments like this one to avoid having them get minified -->
<echo message="Updating the HTML with the new css filename: ${style.css}"/>
- <if>
- <isset property="gae.css_dir" />
- <then>
- <replaceregexp match="href=[&quot;']([\/]?)${gae.css_dir}\/style.css[&quot;']"
- replace="href=&quot;\1${style.css}&quot;" flags="g">
- <fileset dir="./${dir.intermediate}" includes="${page-files}"/>
- </replaceregexp>
- </then>
- <else>
- <replaceregexp match="href=[&quot;']([\/]?)${dir.css}\/style.css[&quot;']"
- replace="href=&quot;\1${style.css}&quot;" flags="g">
- <fileset dir="./${dir.intermediate}" includes="${page-files}"/>
- </replaceregexp>
- </else>
- </if>
+
+ <replaceregexp match="&lt;!-- CSS concatenated [\d\w\s\W]*?!-- end CSS--&gt;" replace="&lt;link rel='stylesheet' href='${style.css}'&gt;" flags="m">
+ <fileset dir="${dir.intermediate}" includes="${page-files}"/>
+ </replaceregexp>
</target>
@@ -662,17 +648,22 @@
<target name="-css" depends="-mkdirs" description="Concatenates and Minifies any stylesheets listed in the file.stylesheets property">
<echo message="Concatenating css..."/>
+ <fileset dir="${dir.source}/${dir.css}" includes="${stylesheet-files}" id="css.references"/>
+
+ <pathconvert pathsep="," property="css.list" refid="css.references"/>
+ <sortlist property="sorted.css.list" value="${css.list}" delimiter=","/>
+
<!-- overwrite=no here means not to overwrite if the target is newer than the sources -->
- <concat destfile="./${dir.intermediate}/${dir.css}/style-concat.css" overwrite="no">
- <filelist dir="./${dir.source}/${dir.css}" files="${stylesheet-files}"/>
+ <concat destfile="${dir.intermediate}/${dir.css}/style-concat.css" overwrite="no">
+ <filelist files="${sorted.css.list}"/>
</concat>
<echo message="Minifying css..."/>
<apply executable="java" parallel="false">
- <fileset dir="./${dir.intermediate}/${dir.css}/" includes="style-concat.css"/>
+ <fileset dir="${dir.intermediate}/${dir.css}/" includes="style-concat.css"/>
<arg line="-jar"/>
- <arg path="./${dir.build.tools}/${tool.yuicompressor}"/>
+ <arg path="${dir.build.tools}/${tool.yuicompressor}"/>
<srcfile/>
<arg line="-o"/>
<mapper type="merge" to="${basedir}/${dir.intermediate}/${dir.css}/style-concat.min.css"/>
@@ -694,9 +685,9 @@
<echo message="Minifying any unconcatenated css files..."/>
<apply executable="java" parallel="false">
- <fileset dir="./${dir.source}/${dir.css}/" excludes="${stylesheet-files}" includes="**/*.css"/>
+ <fileset dir="${dir.source}/${dir.css}/" excludes="${stylesheet-files}" includes="**/*.css"/>
<arg line="-jar"/>
- <arg path="./${dir.build.tools}/${tool.yuicompressor}"/>
+ <arg path="${dir.build.tools}/${tool.yuicompressor}"/>
<srcfile/>
<arg line="-o"/>
<mapper type="glob" from="*.css" to="${basedir}/${dir.publish}/${dir.css}/*.css"/>
View
2  build/config/default.properties
@@ -49,7 +49,7 @@ file.default.exclude = .gitignore, .project, .settings, README.markdown,
#
# Default Stylesheet
#
-file.default.stylesheets = style.css
+file.default.stylesheets = concat/**/*.css
#
# Script Optimisation
View
89 css/style.css → css/concat/00_normalize.css
@@ -194,92 +194,3 @@ input:invalid, textarea:invalid { background-color: #f0dddd; }
========================================================================== */
table { border-collapse: collapse; border-spacing: 0; }
-
-
-/* =============================================================================
- Primary styles
- Author:
- ========================================================================== */
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-/* =============================================================================
- Non-semantic helper classes
- Please define your styles before this section.
- ========================================================================== */
-
-/* For image replacement */
-.ir { display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; }
-.ir br { display: none; }
-
-/* Hide for both screenreaders and browsers:
- css-discuss.incutio.com/wiki/Screenreader_Visibility */
-.hidden { display: none; visibility: hidden; }
-
-/* Hide only visually, but have it available for screenreaders: by Jon Neal.
- www.webaim.org/techniques/css/invisiblecontent/ & j.mp/visuallyhidden */
-.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
-
-/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: drupal.org/node/897638 */
-.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
-
-/* Hide visually and from screenreaders, but maintain layout */
-.invisible { visibility: hidden; }
-
-/* Contain floats: nicolasgallagher.com/micro-clearfix-hack/ */
-.clearfix:before, .clearfix:after { content: ""; display: table; }
-.clearfix:after { clear: both; }
-.clearfix { zoom: 1; }
-
-
-
-/* =============================================================================
- PLACEHOLDER Media Queries for Responsive Design.
- These override the primary ('mobile first') styles
- Modify as content requires.
- ========================================================================== */
-
-@media only screen and (min-width: 480px) {
- /* Style adjustments for viewports 480px and over go here */
-
-}
-
-@media only screen and (min-width: 768px) {
- /* Style adjustments for viewports 768px and over go here */
-
-}
-
-
-
-/* =============================================================================
- Print styles.
- Inlined to avoid required HTTP connection: www.phpied.com/delay-loading-your-print-css/
- ========================================================================== */
-
-@media print {
- * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: sanbeiji.com/archives/953 */
- a, a:visited { color: #444 !important; text-decoration: underline; }
- a[href]:after { content: " (" attr(href) ")"; }
- abbr[title]:after { content: " (" attr(title) ")"; }
- .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } /* Don't show links for images, or javascript/internal links */
- pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
- thead { display: table-header-group; } /* css-discuss.incutio.com/wiki/Printing_Tables */
- tr, img { page-break-inside: avoid; }
- img { max-width: 100% !important; }
- @page { margin: 0.5cm; }
- p, h2, h3 { orphans: 3; widows: 3; }
- h2, h3{ page-break-after: avoid; }
-}
View
19 css/concat/01_primary.css
@@ -0,0 +1,19 @@
+/* =============================================================================
+ Primary styles
+ Author:
+ ========================================================================== */
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
View
29 css/concat/02_helpers.css
@@ -0,0 +1,29 @@
+/* =============================================================================
+ Non-semantic helper classes
+ Please define your styles before this section.
+ ========================================================================== */
+
+/* For image replacement */
+.ir { display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; }
+.ir br { display: none; }
+
+/* Hide for both screenreaders and browsers:
+ css-discuss.incutio.com/wiki/Screenreader_Visibility */
+.hidden { display: none; visibility: hidden; }
+
+/* Hide only visually, but have it available for screenreaders: by Jon Neal.
+ www.webaim.org/techniques/css/invisiblecontent/ & j.mp/visuallyhidden */
+.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
+
+/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: drupal.org/node/897638 */
+.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
+
+/* Hide visually and from screenreaders, but maintain layout */
+.invisible { visibility: hidden; }
+
+/* Contain floats: nicolasgallagher.com/micro-clearfix-hack/ */
+.clearfix:before, .clearfix:after { content: ""; display: table; }
+.clearfix:after { clear: both; }
+.clearfix { zoom: 1; }
+
+
View
16 css/concat/03_responsive.css
@@ -0,0 +1,16 @@
+/* =============================================================================
+ PLACEHOLDER Media Queries for Responsive Design.
+ These override the primary ('mobile first') styles
+ Modify as content requires.
+ ========================================================================== */
+
+@media only screen and (min-width: 480px) {
+ /* Style adjustments for viewports 480px and over go here */
+
+}
+
+@media only screen and (min-width: 768px) {
+ /* Style adjustments for viewports 768px and over go here */
+
+}
+
View
19 css/concat/04_print.css
@@ -0,0 +1,19 @@
+/* =============================================================================
+ Print styles.
+ Inlined to avoid required HTTP connection: www.phpied.com/delay-loading-your-print-css/
+ ========================================================================== */
+
+@media print {
+ * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: sanbeiji.com/archives/953 */
+ a, a:visited { color: #444 !important; text-decoration: underline; }
+ a[href]:after { content: " (" attr(href) ")"; }
+ abbr[title]:after { content: " (" attr(title) ")"; }
+ .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } /* Don't show links for images, or javascript/internal links */
+ pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
+ thead { display: table-header-group; } /* css-discuss.incutio.com/wiki/Printing_Tables */
+ tr, img { page-break-inside: avoid; }
+ img { max-width: 100% !important; }
+ @page { margin: 0.5cm; }
+ p, h2, h3 { orphans: 3; widows: 3; }
+ h2, h3{ page-break-after: avoid; }
+}
View
8 index.html
@@ -21,7 +21,13 @@
<!-- Place favicon.ico and apple-touch-icon.png in the root directory: mathiasbynens.be/notes/touch-icons -->
<!-- CSS: implied media="all" -->
- <link rel="stylesheet" href="css/style.css">
+ <!-- CSS concatenated and minified via ant build script-->
+ <link rel="stylesheet" href="css/concat/00_normalize.css">
+ <link rel="stylesheet" href="css/concat/01_primary.css">
+ <link rel="stylesheet" href="css/concat/02_helpers.css">
+ <link rel="stylesheet" href="css/concat/03_responsive.css">
+ <link rel="stylesheet" href="css/concat/04_print.css">
+ <!-- end CSS-->
<!-- More ideas for your <head> here: h5bp.com/docs/#head-Tips -->
Please sign in to comment.
Something went wrong with that request. Please try again.