title: In Adobe AEM, how does the parsys component inject styles into the design css file?
body: <p>In Adobe AEM ( formerly CQ5 ) the foundation component parsys' design_dialog allows the user to set the "Cell Padding".  Whatever value is entered into the text field will show up in the design css.</p>
  
  <p>For example:</p>
  
  <p>Given that the current page is using /etc/designs/my-design the page output will include reference to the /etc/designs/my-design.css stylesheet virtual path.</p>
  
  <p>If the user configured the parsys cell padding to be 30px then the my-design.css file will include the following:</p>
  
  <pre><code>.page_full .par div.section {
    padding: 30px;
  }
  </code></pre>
  
  <p>The string "30px" is stored in the jcr:content/page/par/section attribute called div.padding, however, I can't figure out how the parsys.jsp injects it into the my-design.css.</p>
  
  <p><strong>EDIT:</strong> 
  To be clear, the <code>currentDesign.writeCssIncludes(pageContext);</code> call in the foundation page headlibs.jsp is the code that sets up the design css includes like so:</p>
  
  <pre><code>&lt;link href="/etc/designs/my-design/static.css" rel="stylesheet" type="text/css"/&gt;
  &lt;link href="/etc/designs/my-design.css" rel="stylesheet" type="text/css"/&gt;
  </code></pre>
  
  <p>However, it is not clear how to get your own CSS included in the <em>response body</em> of the /etc/designs/my-design.css request.</p>