127 lines
3.5 KiB
HTML
127 lines
3.5 KiB
HTML
<html>
|
|
<head>
|
|
<link rel="stylesheet" href="style.css">
|
|
</head>
|
|
<body>
|
|
<div class="operating-system-card">
|
|
<div class="distro-header">
|
|
<div>
|
|
<h2>Operating System</h2>
|
|
</div>
|
|
<div>
|
|
<img class="distro-icon" src="assets/distro-fedora.png">
|
|
</div>
|
|
</div>
|
|
<div class="distro-links">
|
|
<a>wiki</a><a>download</a><a>website</a>
|
|
</div>
|
|
<p class="os-quick-summary">
|
|
Non nesciunt voluptatibus numquam quidem in fugit. Error perspiciatis qui tempore labore architecto vitae. Id et ut harum molestiae fugit cupiditate. Nesciunt quidem rerum exercitationem aperiam optio cum dolorum quia.
|
|
</p>
|
|
<div class="operating-system-columns">
|
|
<span>
|
|
<h3>Freedom</h3>
|
|
<ul>
|
|
<li p>Ducimus fuga</li>
|
|
<li p>Quaerat nostrum</li>
|
|
<li p>Ducimus fuga</li>
|
|
<li p>Quaerat nostrum</li>
|
|
<li p>Quaerat nostrum</li>
|
|
<br>
|
|
<li n>Possimus delectus</li>
|
|
<li n>Possimus delectus</li>
|
|
<li n>Possimus delectus</li>
|
|
<li n>Possimus delectus</li>
|
|
</ul>
|
|
</span>
|
|
<span>
|
|
<h3>Usability</h3>
|
|
<ul>
|
|
<li p>Ducimus fuga</li>
|
|
<li p>Quaerat nostrum</li>
|
|
<li p>Ducimus fuga</li>
|
|
<li p>Ducimus fuga</li>
|
|
<li p>Quaerat nostrum</li>
|
|
<li p>Quaerat nostrum</li>
|
|
<br>
|
|
<li n>Possimus delectus</li>
|
|
<li n>Possimus delectus</li>
|
|
</ul>
|
|
</span>
|
|
<span>
|
|
<h3>Privacy</h3>
|
|
<ul>
|
|
<li p>Ducimus fuga</li>
|
|
<li p>Quaerat nostrum</li>
|
|
<br>
|
|
<li n>Possimus delectus</li>
|
|
<li n>Possimus delectus</li>
|
|
<li n>Possimus delectus</li>
|
|
<li n>Possimus delectus</li>
|
|
</ul>
|
|
<p>
|
|
</p>
|
|
</span>
|
|
</div>
|
|
<div class="star-columns">
|
|
<span>
|
|
<img class="star" src="assets/icons_star.svg">
|
|
<img class="star" src="assets/icons_star.svg">
|
|
<img class="star" src="assets/icons_star.svg">
|
|
<img class="star" src="assets/icons_star-empty.svg">
|
|
<img class="star" src="assets/icons_star-empty.svg">
|
|
</span>
|
|
<span>
|
|
<img class="star" src="assets/icons_star.svg">
|
|
<img class="star" src="assets/icons_star.svg">
|
|
<img class="star" src="assets/icons_star.svg">
|
|
<img class="star" src="assets/icons_star-empty.svg">
|
|
<img class="star" src="assets/icons_star-empty.svg">
|
|
</span>
|
|
<span>
|
|
<img class="star" src="assets/icons_star.svg">
|
|
<img class="star" src="assets/icons_star.svg">
|
|
<img class="star" src="assets/icons_star.svg">
|
|
<img class="star" src="assets/icons_star-empty.svg">
|
|
<img class="star" src="assets/icons_star-empty.svg">
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div class="operating-system-card">
|
|
<h2>Operating System</h2>
|
|
<p class="os-quick-summary">
|
|
Non nesciunt voluptatibus numquam quidem in fugit. Error perspiciatis qui tempore labore architecto vitae. Id et ut harum molestiae fugit cupiditate. Nesciunt quidem rerum exercitationem aperiam optio cum dolorum quia.
|
|
</p>
|
|
<div class="operating-system-columns">
|
|
<span>
|
|
<h3>Freedom</h3>
|
|
<ul>
|
|
<li p>a</li>
|
|
<li n>a</li>
|
|
<li p>a</li>
|
|
</ul>
|
|
<h2 class="score"><span>5/10</span></h2>
|
|
</span>
|
|
<span>
|
|
<h3>Usability</h3>
|
|
<ul>
|
|
<li p>a</li>
|
|
<li n>a</li>
|
|
<li p>a</li>
|
|
</ul>
|
|
<h2 class="score"><span>5/10</span></h2>
|
|
</span>
|
|
<span>
|
|
<h3>Privacy</h3>
|
|
<ul>
|
|
<li p>a</li>
|
|
<li n>a</li>
|
|
<li p>a</li>
|
|
</ul>
|
|
<h2 class="score"><span>5/10</span></h2>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|