search

oulan / iui

Automatically exported from code.google.com/p/iui
MIT License
0 stars 0 forks source link

"New Items" indicator #143

Open GoogleCodeExporter opened 9 years ago

GoogleCodeExporter commented 9 years ago 
What version of the product are you using? On what operating system?
iui v0.20

Please provide any additional information below.
I added added some CSS & images to my iui in order to display an indicator for 
a specific amount 
of new itmes or a single new item.
You may want to include this as enhancement in a future release of iui.

CSS:
li .newItemIndicator {
    display: block;
    position: absolute;
    margin: 0px 0 0 0;
    left: 80%;
    top: 7px;
    text-align: center;
    font-size: 60%;
    letter-spacing: 0em;
    color: #ffffff;
    font-weight: normal;
    text-decoration: none;
    width: 32px;
    height: 26px;
    padding: 5px 0 0 0;
    background: url(iui/newBatchWide.png) no-repeat;
}

li .newItem {
    display: block;
    position: absolute;
    margin: 5px 0 0 0;
    left: 80%;
    top: 7px;
    text-align: center;
    font-size: 60%;
    letter-spacing: 0em;
    color: #ffffff;
    font-weight: normal;
    text-decoration: none;
    width: 16px;
    height: 16px;
    padding: 5px 0 0 0;
    background: url(iui/newBatchBlueSmall.png) no-repeat;
}

HTML:
<ul id="home" title="New Items Sum">
    <li><a class="linkLabel" href="#list">List with single items
        <span class="newItemIndicator">3</span></li>
</ul>

<ul id="list" title="New Items List">
    <li><a class="linkLabel" href="#item1">New Item 1
        <span class="newItem"></span></li>
    <li><a class="linkLabel" href="#item2">New Item 2
        <span class="newItem"></span></li>
    <li><a class="linkLabel" href="#item3">New Item 3
        <span class="newItem"></span></li>
</ul>

Original issue reported on code.google.com by oliver.r...@gmail.com on 14 Jun 2009 at 5:06

Attachments:

GoogleCodeExporter commented 9 years ago

Original comment by msgilli...@gmail.com on 8 Sep 2009 at 4:52

GoogleCodeExporter commented 9 years ago 
For the CSS element "li .newItem" the following styles can be removed:

text-align: center;
font-size: 60%;
letter-spacing: 0em;
color: #ffffff;
font-weight: normal;
text-decoration: none;
padding: 5px 0 0 0;

Original comment by oliver.r...@gmail.com on 10 Sep 2009 at 9:26

GoogleCodeExporter commented 9 years ago

Original comment by msgilli...@gmail.com on 26 Sep 2011 at 12:03