ianharrigan / haxeui

IMPORTANT NOTE! This repository is no longer maintained. Please consider the newer version: https://github.com/haxeui/haxeui-core
http://haxeui.org/
392 stars 46 forks source link

.even and .odd override each other in css #149

Closed Tumetsu closed 10 years ago

Tumetsu commented 10 years ago

I'm trying to customize listview. Based on gradient theme's css I created this css file:

Root.popup {
    backgroundColor: 0xFFFFFF;
    color: #FFFFFF;
}

ListView {
    paddingLeft: 0;
    paddingRight: 0;
    paddingBottom: 0;
    paddingTop: 0;
    backgroundColor: 0xFFFFFF;

}

ListView #content {
    color: #FFFFFF;
    backgroundColor: #FFFFFF;
    paddingLeft: 0;
    paddingTop: 0;
    paddingBottom: 0;
    paddingRight: 0;
    borderSize:0;
    spacingX: 0;
    spacingY: 0;
    cornerRadius: 0;

}

ListView:disabled {
    borderColor: 0xFFFFFF;
}

.even {
    backgroundColor: #FFF666;
    fontSize: 16;
    fontName: "_sans";
    color: #8ab3cf;
    paddingLeft: 8;
    paddingTop: 8;
    paddingRight: 8;
    paddingBottom: 8;
    borderColor: #ffffff;
    borderSize: 1;
}

.odd {
    backgroundColor: #FFFFFF;
    fontSize: 16;
    fontName: "_sans";
    color: #8ab3cf;
    paddingLeft: 8;
    paddingTop: 8;
    paddingRight: 8;
    paddingBottom: 8;
    borderColor: #8ab3cf;
    borderSize: 1;
}

.even #text, .odd #text {
    color: #4180ab;

}

.even:selected Text, .odd:selected Text, .even:over Text, .odd:over Text {
    color: #000000;
}

//when boxes are not active

//change box to orange when hovering it
.even:over, .odd:over {
    backgroundColor: #f38630;
    borderColor: #f38630;

}

.even:selected, .odd:selected {
    backgroundColor: #f38630;
    borderColor: #f38630;
    color: 0xffffff;
}

ListViewItem #subtext {
    color: 0xffffff;
    fontSize: 11;
}

ListSelector, DateSelector {
    fontSize: 13;
    fontName: "_sans";
    color: 0x000000;
    paddingLeft: 5;
    paddingTop: 2;
    paddingBottom: 2;
    paddingRight: 5;

    backgroundImageScale9: 5,5,15,15;
    backgroundImageRect: 0,0,20,20;

    iconPosition: "right";
    textAlign: "left";
}

ListSelector:over, DateSelector:over {
    color: 0x000000;
    backgroundImageScale9: 5,5,15,15;
    backgroundImageRect: 20,0,20,20;
}

ListSelector:down, DateSelector:down {
    backgroundImageScale9: 5,5,15,15;
    backgroundImageRect: 40,0,20,20;
}

However, only the .odd is recognized and all listitems are stylized in that way, even the even ones. If I swap the order of .odd and .even definitions, the .even defines all the listitems. In short only the latter one remains in effect. Why?

And while we are it, how I define the color of the background of the ListView which shows up if the list has fewer items than there fits? I can only get the default gray to show up and couldn't define the color via css.

ianharrigan commented 10 years ago

Sorry for the late reply... didnt get an email about this... Ill check this out tomorrow and get back to you.

Sorry again for the delay, been out of the loop for a while.

Cheers, Ian

ianharrigan commented 10 years ago

Hi,

Ive just submitted a fix that affected the style cache that it think will fix this. The version is 1.5.7 in haxelib... can you let me know if it fixes it for you?

Cheers, Ian

ianharrigan commented 10 years ago

As for you second question, the component you are looking for is called "container". So this works in the builder:

<?xml version="1.0" encoding="utf-8" ?>
<listview id="theList" width="300" height="100%">
    <style>
        #theList #container {
            backgroundColor: #FF0000;
        }
    </style>
    <array>
        Item 1,
        Item 2,
        Item 3, 
        Item 4,
        Item 5
    </array>
</listview>

This is another failure of good documentation i feel... Something i will (will!) get sorted once im done with my bug hunt!

Cheers, Ian

ianharrigan commented 10 years ago

Ok, i think this should be fixed in version 1.5.11, i think it was related to #161

ianharrigan commented 10 years ago

Im going to close this issue as i cant reproduce it. Im pretty sure its been fixes by various problems with the style cache. Feel free to re-open if im mistaken.

Cheers, Ian