@use "@styles/abstracts/functions" as fun;

.wrapper {
  .link {
    width: clamp(#{fun.convert-px(44)}, 6vw, #{fun.convert-px(55)});
    height: clamp(#{fun.convert-px(44)}, 6vw, #{fun.convert-px(55)});

    svg {
      width: 100%;
    }

    :global {
      .arrow-head {
        transform: translateY(30%) scale(1.2);
        transition: all 0.45s ease-in-out 0s;
      }

      .arrow-bar {
        opacity: 0;
        transform: translateY(30%) scaleY(0);
        transition: transform 0.45s ease-in-out 0s, opacity 0.1s linear 0.2s;
      }
    }

    &:hover,
    &:focus {
      :global {
        .arrow-head {
          transform: translateY(0) scale(1);
        }

        .arrow-bar {
          opacity: 1;
          transform: translateY(0) scaleY(1);
        }
      }

      svg {
        :global {
          animation: pulse 1.2s ease-in-out 0.6s infinite;
        }
      }
    }

    &:active {
      svg {
        animation-play-state: paused;
      }
    }
  }
}
 onchange='this.form.submit();'>
<option value='main' selected='selected'>main</option>
</select> <input type='submit' value='switch'/></form></td></tr>
<tr><td class='sub'>The frontend of my personal website.</td><td class='sub right'>Armand Philippot</td></tr></table>
<table class='tabs'><tr><td>
<a href='/www.armandphilippot.com/about/'>about</a><a href='/www.armandphilippot.com/'>summary</a><a href='/www.armandphilippot.com/refs/?id=c3cde71e60ae22d17c1d162f678f592915ac5398'>refs</a><a href='/www.armandphilippot.com/log/src/styles/pages/cv.module.scss'>log</a><a class='active' href='/www.armandphilippot.com/tree/src/styles/pages/cv.module.scss?id=c3cde71e60ae22d17c1d162f678f592915ac5398'>tree</a><a href='/www.armandphilippot.com/commit/src/styles/pages/cv.module.scss?id=c3cde71e60ae22d17c1d162f678f592915ac5398'>commit</a><a href='/www.armandphilippot.com/diff/src/styles/pages/cv.module.scss?id=c3cde71e60ae22d17c1d162f678f592915ac5398'>diff</a><a href='/www.armandphilippot.com/stats/src/styles/pages/cv.module.scss'>stats</a></td><td class='form'><form class='right' method='get' action='/www.armandphilippot.com/log/src/styles/pages/cv.module.scss'>
<input type='hidden' name='id' value='c3cde71e60ae22d17c1d162f678f592915ac5398'/><select name='qt'>
<option value='grep'>log msg</option>
<option value='author'>author</option>
<option value='committer'>committer</option>
<option value='range'>range</option>
</select>
<input class='txt' type='search' size='10' name='q' value=''/>
<input type='submit' value='search'/>
</form>
</td></tr></table>
<div class='path'>path: <a href='/www.armandphilippot.com/tree/?id=c3cde71e60ae22d17c1d162f678f592915ac5398'>root</a>/<a href='/www.armandphilippot.com/tree/src?id=c3cde71e60ae22d17c1d162f678f592915ac5398'>src</a>/<a href='/www.armandphilippot.com/tree/src/styles?id=c3cde71e60ae22d17c1d162f678f592915ac5398'>styles</a>/<a href='/www.armandphilippot.com/tree/src/styles/pages?id=c3cde71e60ae22d17c1d162f678f592915ac5398'>pages</a>/<a href='/www.armandphilippot.com/tree/src/styles/pages/cv.module.scss?id=c3cde71e60ae22d17c1d162f678f592915ac5398'>cv.module.scss</a></div><div class='content'>blob: 615c50d09a768af80dacc4453f1b8c64c0dac890 (<a href='/www.armandphilippot.com/plain/src/styles/pages/cv.module.scss?id=c3cde71e60ae22d17c1d162f678f592915ac5398'>plain</a>)
<table summary='blob content' class='blob'>
<tr><td class='linenumbers'><pre><a id='n1' href='#n1'>1</a>
<a id='n2' href='#n2'>2</a>
<a id='n3' href='#n3'>3</a>
</pre></td>
<td class='lines'><pre><code>