I have list of items with alternating background colors. I'm currently using the :nth-child(odd) selector to make the alternating row colors. Users have the ability to add new items to the top of the list asynchronously using jquery -- this poses an issue that makes the form a bit unintuitive:
When a new entry is added to the top of the list, all the previously existing rows gets pushed down by one, so they all change alternating colors (since odd rows become even, and vice versa). I'd like to keep the existing alternating colors when a new row is added -- one way to do it would be to calculate odd/even nth-child starting from the bottom of the list... Any way to do this?
Additional info: New entries must be added to 'top' of list. Adding "odd"/"even" class names to rows not practical in this case.
Thanks in advance!
You will want to use the :nth-last-child(2n+0). This is working from the last child instead of the first/newest child. Hope this helps.
Related
Working with a Material UI react data grid for the first time and I need to apply a custom background color to only the first 3 rows, each being a different color. The custom coloring of these rows is static, nothing that's supposed to happen after an event takes place. Is there any way to point to only one row and apply a background color to it from my scss file?
On a slightly related note, how do I extend column separators so they fill the data grid?
Thank you in advance!
use nth-child(1){}
for style the number 1 child.
I would like to create a mdl-data-table such that when I click on it.
My guess is just to add a row with colspan == number of columns when I choose to expand the row. I was wondering if there was a better version than that. Something that makes it look like that it is expanded with some existing styles rather than creating a new style.
In addition, if it can be "animated" as a slide down that pushes the other elements that would be a bonus.
Note the answer does not have to handle the clicking part, but just the "expanded" part
I have QTreeWidget containing 5 columns. I want to remove column from the tree when user uses remove column menu. How can I remove column from the tree?
If it's purely for UI purposes you can hide the corresponding section in the QHeaderView used by your tree view:
treeview->header()->hideSection(4)
I know this is an old one, but the solution was rather simple.
QTreeWidget::setColumnCount( 0 );
They reload the headerLabels using
QTreeWidget::setHeaderLabels
This will make sure the the "removed" column is actually removed
I have a list which displays votes cast on things in a descending order (=the dataprovider has a sort assigned).
The elements have variable height, but there are not so many elements, so i do not need to use a virtual layout
My problem is that this list needs to be updated real-time and i want to make this happen with a nice animation.
(e.g. if an item overtakes another by votes, then they swap places.)
Anyone knows how to make this animation with Flex 4.5 (spark list)?
Do i need to write a custom layout?
Thanks
If I were you, I'd just create a custom component which would have a simple layout (VGroup, maybe within a Scroller if you need a scrollbar) which then dynamically add item renderers to it. The thing about this one though is that your item renderer never changes it's data property. Make sure that the item renderer uses binding for it's data, and then on whatever you're sorting, have an animation between indexes of 2 items, make sure you set 'includeInLayout=false' before the animation for both items and just tween between their positions.
There are other ways of doing it using List, but then you'd have to make duplicates of the item renderers for the animations while the real ones are hidden and change their values. Not sure which one would be best in this case...
I'm Trying to create a 3 column ordered list in Joomla. I've tried these methods for continuing the numbering:
<ol style="counter-reset: item 11;">
to start the numbering from 11 for column two. And also this:
<ol start="11">
But neither of these work. Are there any restrictions on this in Joomla?
Thanks!
You could probably split a single list into columns by styling the list with a fixed height, then styling your list items so that they're positioned where you want. You could assign each list item in a given column a class, then give the columns a margin-left.
Alternatively you could absolutely position your list items.
Both solutions are pretty dirty, but I think they would work.
Is this something you'll need other users to be able to do for themselves in Joomla?