[consulting] Color.module -- How do I find the CSS id's and classes used to dipslay the preview.png?

[Adam Gregory]

this question is best suited for the development list development at drupal.org.
You might try resending it to that list and see what response you can get.

-----
Adam A. Gregory
Blog: AdamAGregory.com
Twitter: twitter.com/adamgregory
Skype: aagregory2
Cell: 706.761.7375


On Thu, Nov 19, 2009 at 1:18 PM, Holly Ferree <hferree at gmail.com> wrote:

>  Hello all,
>
> I sent this to the themes group and didn't get any repsonses, so I'm
> sending it here hoping that someone might know the answer since it is more
> of a coding question. :)
>
> Does anyone know where I can find a list of the id's and classes used in
> preview.css to display the preview.png as an exact small replica? I need to
> find the classes for the top header and the bottom header.
>
> I have not found any documentation specifying the id's and classes that can
> be used when styling areas in the preview.png, and am out of possible names
> they could be. I've even looked at other themes that use the color module
> and have not had success. I've read the color.module and it's css file and
> no luck. The book page on drupal is helpful for creating the color.inc and
> the base.png but misses the preview.png information. If a solution does
> exist I plan on adding a comment to the page with the solution. My theme
> colorizes perfectly so the what I thought as the hard part works.
>
> Background:
> I decided to learn more and create my own theme that integrates the
> color.module. I have everything working and the colors switch to mercury,
> ash, etc. without any trouble. :o) (very happy that it works)
>
> But I am having difficulty with the preview.png showing correctly. It wants
> to combine the top header color and the bottom header color in a gradient,
> that is not used in my theme. And I figure that since the colors display
>  properly when a different theme color set is chosen, it would be nice for
> the preview.png to show the user an exact preview before they select their
> new color set.
>
> My theme uses the top header (with brown) and the bottom header (with
> blue). There is no gradient used, so I want it to reflect that in the
> preview.png.
>
> Issue:
> Need the know the css tag for displaying the top header and the bottom
> header colors.
>
> I have it semi working for the top 16px -- it shows the base color if I use
> the css pasted below (but I want the top header color, since that is the
> actual color it will be).
>
> The bottom header area that is 48px high wants to display the gradient (top
> header and bottom header...all I want is the bottom header color). Does
> anyone know the correct css to insert so that it doesn't use the gradient
> but uses the bottom header color?
>
> Thanks in advance,
> Holly Ferree
>
> ----------------------
> Preview.css:
> (the top:17px allows the top header color to display perfectly :D. However
> the height: 48px displays the gradient which I would like it to display the
> bottom header color but I don't know the correct css tag. I've tried
> changing #gradient to #bottom, #header, #headerbottom, and #header-bottom,
> but no luck for either)
>
> #preview #gradient { <-- what should I put here? #preview #_______?
>   position: absolute;
>   left: 0;
>   right: 0;
>   top: 17px; <-- this space gives the top header the base color
>   height: 48px; <-- since the name is #gradient, this puts a gradient
> below the top header
>   z-index: 2;
> }
>
> *******************************
> Color.inc:
>
> fill' => array(
>     'base' => array(0, 74, 900, 426),
>     'top' => array(0, 0, 900, 17),
>     'bottom' => array(0, 17, 900, 48),
>   ),
>
> Example of the preview.png layout using Belgian Chocolate theme:
> ------------------------------------------
> Top header, dark brown, #6c420e, height: 17px
> ------------------------------------------
> Bottom Header, red, #971702, height: 48px;
>
> ------------------------------------------
> THIS AREA IS DISPLAYING PERFECTLY
>
> Content Area
>
> base color, tan #d5b048
> height: auto;
>
> Link color: dark brown #6c420e
> Text color: dark red, #494949
> ------------------------------------------
>
> _______________________________________________
> consulting mailing list
> consulting at drupal.org
> http://lists.drupal.org/mailman/listinfo/consulting
>
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://lists.drupal.org/pipermail/consulting/attachments/20091119/f0009158/attachment.html