Web Development - WAYWO - #8

[daniel_c]

[QUOTE=Lexic;42396167]help I'm doing monsterous things with Less
[img]http://i.imgur.com/4xQEh66.png[/img]
[css] table {
width: 100%;
border-spacing: 0;
text-align: center;
position: relative;
tbody {
counter-reset: number;
tr {
counter-increment: number;
td:first-child
{
&:before {
content: counter(number);
}
&:after {
content: 'th';
}
}
&:nth-child( 1 ) {
td:first-child:after {
content: 'st';
}
}
&:nth-child( 2 ) {
td:first-child:after {
content: 'nd';
}
}
&:nth-child( 3 ) {
td:first-child:after {
content: 'rd';
}
}
&:nth-child( 2n - 1 ) {
background: rgba( 0, 0, 0, 0.5 );
td:first-child {
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
}
td:last-child {
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
}
}
}

}
}[/css][/QUOTE]

1st?

[Lexic]

[QUOTE=daniel_c;42396372]1st?[/QUOTE]

Oops, forgot to update the image when I fixed that.

[Miljaker]

Isn't it "You're a winner"?
You're winner sounds a bit weird.

Or is meant like a joke?

[benjojo]

[QUOTE=Miljaker;42396917]Isn't it "You're a winner"?
You're winner sounds a bit weird.

Or is meant like a joke?[/QUOTE]

The joke is from a game called Big Rigs ( a very very bad game )
[url]http://www.youtube.com/watch?v=J_fNY6uLlF0[/url]

[Miljaker]

[QUOTE=benjojo;42397341]The joke is from a game called Big Rigs ( a very very bad game )
[url]http://www.youtube.com/watch?v=J_fNY6uLlF0[/url][/QUOTE]

I know, but it seems kinda silly to copy a bad game. Unless thats the point... then nvm.

[TerabyteS_]

[QUOTE=Lexic;42396167]help I'm doing monsterous things with Less
[img]http://i.imgur.com/4xQEh66.png[/img]
[css] table {
width: 100%;
border-spacing: 0;
text-align: center;
position: relative;
tbody {
counter-reset: number;
tr {
counter-increment: number;
td:first-child
{
&:before {
content: counter(number);
}
&:after {
content: 'th';
}
}
&:nth-child( 1 ) {
td:first-child:after {
content: 'st';
}
}
&:nth-child( 2 ) {
td:first-child:after {
content: 'nd';
}
}
&:nth-child( 3 ) {
td:first-child:after {
content: 'rd';
}
}
&:nth-child( 2n - 1 ) {
background: rgba( 0, 0, 0, 0.5 );
td:first-child {
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
}
td:last-child {
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
}
}
}

}
}[/css][/QUOTE]
Why are you using CSS to add "st", "nd", and "rd"? It's part of the content, not the presentation, so it should be in the HTML imo.

[KmartSqrl]

[QUOTE=TerabyteS_;42398633]Why are you using CSS to add "st", "nd", and "rd"? It's part of the content, not the presentation, so it should be in the HTML imo.[/QUOTE]

I definitely agree with this. It's totally not worth doing this in CSS.

[Vietnow]

Anyone played around with Firefox OS yet?

[commander204]

[QUOTE=KmartSqrl;42398715]I definitely agree with this. It's totally not worth doing this in CSS.[/QUOTE]

That requires you to detect it though and can make it even more a pain than in CSS, besides unless you do i18n it's not going to change anyway. Imo this is one of the cases where it's more practical to do it in css rather than in your script.

Edit:

A compromise would be to do something like

<li data-suffix="st" >

and then in the css

content: attr(data-suffix)

[TerabyteS_]

[QUOTE=commander204;42406374]That requires you to detect it though and can make it even more a pain than in CSS, besides unless you do i18n it's not going to change anyway. Imo this is one of the cases where it's more practical to do it in css rather than in your script.

Edit:

A compromise would be to do something like

<li data-suffix="st" >

and then in the css

content: attr(data-suffix)

[/QUOTE]

Putting it in an attribute would require to detect it as you say as well. Plus I don't really see how hard it can be to write a piece of code that does that. This is some crappy quick code and it does just that:

def position(number)
  mod = number % 10
  if mod == 1 && number != 11
    "#{number}st"
  elsif mod == 2 && number != 12
    "#{number}nd"
  elsif mod == 3 && number != 13
    "#{number}rd"
  else
    "#{number}th"
  end
end

[commander204]

[QUOTE=TerabyteS_;42406535]Putting it in an attribute would require to detect it as you say as well. Plus I don't really see how hard it can be to write a piece of code that does that. This is some crappy quick code and it does just that:

def position(number)
  mod = number % 10
  if mod == 1 && number != 11
    "#{number}st"
  elsif mod == 2 && number != 12
    "#{number}nd"
  elsif mod == 3 && number != 13
    "#{number}rd"
  else
    "#{number}th"
  end
end

[/QUOTE]

That is just one use case and is tied to a specific array, whereas a pure css solution would be not data-source dependent but order.

[TerabyteS_]

[QUOTE=commander204;42406730]That is just one use case and is tied to a specific array, whereas a pure css solution would be not data-source dependent but order.[/QUOTE]

It's not tied to a specific array, you'd literally just be calling it on every entry when building the html.

[asciid]

Does this look any good? Its all jQuery and Facebook magic
[URL="http://snip.so/VpHM"][IMG]http://snip.so/VpHM.png[/IMG][/URL]

[rsk_]

[QUOTE=asciid;42407080]Does this look any good? Its all jQuery and Facebook magic
-imgsnip-[/QUOTE]

Need more padding between the "Comments" and the first comment and here as well
[IMG]http://puu.sh/4Hpjm.png[/IMG]

[KmartSqrl]

[QUOTE=commander204;42406730]That is just one use case and is tied to a specific array, whereas a pure css solution would be not data-source dependent but order.[/QUOTE]

That piece of code is definitely not tied to a single data source at all. It's reusable.

[Jelly_]

-snip-

[Lexic]

That was running on a static page before - it's not any more. The CSS is gone and replaced with a wonderfully incomprehensible one liner.

( 1 === i ? 'st' : 2 === i ? 'nd' : 3 === i ? 'rd' : 'th' )

[Agent766]

Why not replace it with a wonderfully comprehensible function?

[dexon]

[url=gloading.com/loading/ipchat/ipchat.php]gloading.com/loading/ipchat/ipchat.php[/url]
Just made an ip chat. So basically, you can enter your friend's ip and send him a message so when your friend will open that page, he'll receive the message.
So I got a cheap facebook chat style... and this script is completely useless.
I'm just proud of that new system I made :D

P.S. : I'm also giving its source code so... if you want it, just send me a pm or mail (can be found on dexon.hostzi.com) and i'll just send you his mediafire link.

[TerabyteS_]

[QUOTE=dexon;42415270]P.S. : I'm also giving its source code so... if you want it, just send me a pm or mail (can be found on dexon.hostzi.com) and i'll just send you his mediafire link.[/QUOTE]
Why not put it on Github?

[j4NZKUE]

[QUOTE=asciid;42407080]Does this look any good? Its all jQuery and Facebook magic
[URL="http://snip.so/VpHM"][IMG]http://snip.so/VpHM.png[/IMG][/URL][/QUOTE]

I would recommend some other font for the context or the name or just some more variation in the name and the comment text. But looks nice! :)

[Liota]

Any opinions on this? I'm not a good designer, but I really have to re-write from the ground up my sort of portfolio.
[thumb]http://www.mediafire.com/convkey/9674/3nurjn5bdd2u080fg.jpg[/thumb]

[josm]

[QUOTE=Liota;42419828]Any opinions on this? I'm not a good designer, but I really have to re-write from the ground up my sort of portfolio.
[thumb]http://www.mediafire.com/convkey/9674/3nurjn5bdd2u080fg.jpg[/thumb][/QUOTE]

Believe me, we've seen way worse. It looks good to me. Maybe remove the box around the text and format it as a sort of Resume?

[Liota]

Like this?
[thumb]http://www.mediafire.com/convkey/cdcf/v0x3qvl3sxcca0sfg.jpg[/thumb]

[Killervalon]

[QUOTE=Liota;42420157]Like this?
[thumb]http://www.mediafire.com/convkey/cdcf/v0x3qvl3sxcca0sfg.jpg[/thumb][/QUOTE]

Why is the title offset? Seems stupid to me

[Cronos]

[QUOTE=dexon;42415270][url=gloading.com/loading/ipchat/ipchat.php]gloading.com/loading/ipchat/ipchat.php[/url]
Just made an ip chat. So basically, you can enter your friend's ip and send him a message so when your friend will open that page, he'll receive the message.
So I got a cheap facebook chat style... and this script is completely useless.
I'm just proud of that new system I made :D

P.S. : I'm also giving its source code so... if you want it, just send me a pm or mail (can be found on dexon.hostzi.com) and i'll just send you his mediafire link.[/QUOTE]

are the - instead of . due to [del]code limitation or[/del] experience or is it to make it more like traditional "Friend code" style messaging or networking systems? curious

[TerabyteS_]

[QUOTE=Liota;42420157]Like this?
[thumb]http://www.mediafire.com/convkey/cdcf/v0x3qvl3sxcca0sfg.jpg[/thumb][/QUOTE]

Holy shit you're italian

[acpm]

[QUOTE=TerabyteS_;42422691]Holy shit you're italian[/QUOTE]

now kiss

[Ac!dL3ak]

Oh jesus christ javascript

implicit conversions everywhere

that's terrible in a non-typed language

[dexon]

[QUOTE=Cronos Dage;42422446]are the - instead of . due to [del]code limitation or[/del] experience or is it to make it more like traditional "Friend code" style messaging or networking systems? curious[/QUOTE]

i would say experience and when i tested it, my friend where afraid about giving me their ip so.. replacing dots with slashes makes it looks less... like a hacking thing if i may say so i didn't look about fixing this.
Edit: if you fix it, would be appreciate you share it :)