You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
78 lines
2.8 KiB
78 lines
2.8 KiB
<header>
|
|
<nav>
|
|
<b><a href="/demos/xoracademy" use:link><Icon name="edit-3" color="var(--color-text)" /> Xor.Academy</a></b>
|
|
<input placeholder="Search">
|
|
<ul>
|
|
<li><a href="/demos/login" use:link><button>Log In</button></a></li>
|
|
<li><a>Sign Up</a></li>
|
|
</ul>
|
|
</nav>
|
|
</header>
|
|
<main>
|
|
<figure>
|
|
<img src="https://via.placeholder.com/1280x720?text=Video">
|
|
<figcaption>
|
|
<a>#tag</a> <a>#anothertag</a>
|
|
<p>Title And Stuff</p>
|
|
<video-actions>
|
|
<likes>Likes Other Stats</likes>
|
|
<video-buttons>
|
|
<Icon name="thumbs-up" color="#999" /> 1.1K
|
|
<Icon name="thumbs-down" color="#999" /> 22
|
|
<Icon name="corner-up-right" color="#999" /> SHARE
|
|
<Icon name="menu" color="#999" /> SAVE
|
|
<Icon name="vertical-more" />
|
|
</video-buttons>
|
|
</video-actions>
|
|
</figcaption>
|
|
</figure>
|
|
<lower>
|
|
<promotion>
|
|
<nav>
|
|
<card>
|
|
<img src="https://via.placeholder.com/64x64?text=ME">
|
|
<info>
|
|
<h4>Zed A. Shaw</h4>
|
|
<subs>1 subscriber</subs>
|
|
</card>
|
|
<button id="subscribe">SUBSCRIBE</button>
|
|
</nav>
|
|
|
|
<content> Sed ut perspiciatis unde omnis iste natus error sit voluptatem
|
|
accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae
|
|
ab illo inventore veritatis et quasi architecto beatae vitae dicta
|
|
sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit
|
|
aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos
|
|
qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui
|
|
dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed
|
|
quia non numquam eius modi tempora incidunt ut labore et dolore magnam
|
|
aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum
|
|
exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex
|
|
ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in
|
|
ea voluptate velit esse quam nihil molestiae consequatur, vel illum
|
|
qui dolorem eum fugiat quo voluptas nulla pariatur
|
|
</content>
|
|
</promotion>
|
|
<hr>
|
|
<comments>
|
|
<nav>
|
|
<span>125 Comments</span> <sort><Icon name="bar-chart" color="var(--sub-color)" /> SORT BY</sort>
|
|
</nav>
|
|
|
|
{#each cards as card}
|
|
<card>
|
|
<img src="https://via.placeholder.com/64x64?text=Person">
|
|
<info>
|
|
<h4>Guys</h4>
|
|
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem
|
|
accusantium doloremque laudantium, totam rem aperiam, eaque</p>
|
|
<nav id="vote-nav">
|
|
<Icon name="thumbs-up" color="var(--sub-color)" /> 233
|
|
</nav>
|
|
<reply><Icon name="chevron-down" /> View replies</reply>
|
|
</info>
|
|
</card>
|
|
{/each}
|
|
</comments>
|
|
</lower>
|
|
</main>
|
|
|