スタイラス：正方形のコンポーネントの中のターゲット行

Question

divsで構成された正方形のターゲットスタイラス線を取ろうとします。

私は原則を理解することができないので、forループでうまくいっていませんでした。

sqrt(x) 
    return math(x, 'sqrt') 
$n = 100 // Items 
$rn = sqrt($n) 
$length = 1...($n + 1) 
for $i in $length 
    if ($i < ($rn + 1)) 
    $col = '' + L1 + '' 
    else if ($i < (($rn * 2) + 1)) 
    $col = '' + L2 + '' 
    else if ($i < (($rn * 3) + 1)) 
    $col = '' + L3 + '' 
    // etc... 
    else 
    $col = '' + L0 + '' // Feedback 
    screen :nth-child({$i})::after 
    content $col 

Example online：問題を説明するために

、ここで私は現在の行番号と、各項目に番号を求めるれるコードです。今の

/他の場合、私は条件付きラインをターゲットが、私は事前に進める方法

...の数を知らなくても、私のラインを集中したいので、それは満足のいくものではありませんか？

Answer 1

いいですね。ここでは最適化されたコード：

sqrt(x) 
    return math(x, 'sqrt') 

$n = 100 // Items 
$rn = sqrt($n) 
$length = 1...($n + 1) 

for $i in $length 
    screen :nth-child({$i})::after 
    $col = '' + 'L' + (floor(($i - 1)/$rn) + 1) + '' 
    content $col 

Example online 1

Example online 2