Add More General Support for Cascading #545

Merged
merged 3 commits into from Aug 18, 2013

Conversation

Projects
None yet
2 participants
Contributor

amro commented Aug 16, 2013

Oliver,

Here is more general cascading support. It essentially adds id and element name cascading.

Here's my crazy test case:

    <head>
        <style>
            div {
                line-height: 150%;
            }

            .foo .bar {
                font-size: 25pt;
            }

            .foo .bar .bing {
                color: green;
            }

            .foo .bing {
                font-weight: bold;
            }

            .bar .bing {
                text-decoration: underline;
            }

            .zing {
                color: orange;
            }

            .meow {
                font-weight: normal;
            }

            .bar .zing {
                font-style: italic;
            }

            #blargh .zing {
                text-decoration: line-through;
            }

            #fizz #blargh {
                color: purple;
            }

            div div span .bling {
                color: orange;
            }

            div #moo {
                color: #777;
            }

            span .bling {
                text-decoration: underline;
            }

            /* intentionally inconsistent spacing to test selector cleanup */
            #fizz  .bling  {
                font-style: italic;
                line-height: 175%;
            }
            </style>
    </head>
    <body>
        <div id="fizz" class="foo">
            <div>
                <div class="bar">
                    <div class="bing">
                        me
                        <span id="blargh"> buzz <span class="zing  meow ">owzers</span></span>
                    </div>
                    <span style="color:red;">Me<span class="bing">ow</span></span>
                    <span><p class="bling">this is a test of by tag name styles targeted by class on an ancestor.</p></span>
                    <p id="moo">i'm gray text</p>
                </div>
            </div>
        </div>
    </body>
</html>

which renders like so in the simulator:

screen shot 2013-08-16 at 11 18 19 am

For comparison, here's Safari rendering the same markup and styles at a similar width:

screen shot 2013-08-16 at 11 19 49 am

Collaborator

odrobnik commented Aug 16, 2013

Could you please add unit tests to the pull request? See the one I made for the last pull request.

Contributor

amro commented Aug 16, 2013

Sure, give me a few

Collaborator

odrobnik commented Aug 16, 2013

Take your time, 6.1.4 has already sailed

Sent from my iPhone

On 16.08.2013, at 17:25, Amro Mousa notifications@github.com wrote:

Sure, give me a few


Reply to this email directly or view it on GitHub.

Contributor

amro commented Aug 16, 2013

Updated the test. Sorry I missed that before. Understood re:1.6.4. I'll temporarily use a forked version for our impending release.

odrobnik added a commit that referenced this pull request Aug 18, 2013

Merge pull request #545 from amro/add_general_css_cascading
Add More General Support for Cascading

@odrobnik odrobnik merged commit 2d748f9 into Cocoanetics:develop Aug 18, 2013

@ghost ghost assigned odrobnik Aug 18, 2013

Contributor

amro commented Aug 18, 2013

Thanks for accepting this

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment