fix primer markup (more work needed)
This commit is contained in:
parent
d798d8e8c0
commit
44114da22d
|
@ -16,9 +16,18 @@ body { /* establish document colors and font */
|
|||
text-align: center;
|
||||
}
|
||||
|
||||
.text-orange {
|
||||
color: #ff8f23;
|
||||
}
|
||||
|
||||
.text-blue {
|
||||
color: #4fbad5;
|
||||
}
|
||||
|
||||
/* only strong part of header is bolded */
|
||||
|
||||
h1, h2 {
|
||||
color: #dee2e6; /* off white text */
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
|
@ -36,6 +45,10 @@ h2 img {
|
|||
height: 1.5em;
|
||||
}
|
||||
|
||||
p {
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
/* class to display a floated gallery of card elements */
|
||||
|
||||
.gallery-flex {
|
||||
|
@ -49,6 +62,8 @@ h2 img {
|
|||
.gallery-flex .card {
|
||||
background-color: #35333f; /* lighter gray background for cards */
|
||||
border-radius: 8px;
|
||||
color: #dee2e6; /* off white text */
|
||||
font-weight: normal;
|
||||
margin: 0.5em;
|
||||
padding: 0.5em;
|
||||
min-width: 25.5em;
|
||||
|
@ -66,27 +81,25 @@ h2 img {
|
|||
</head>
|
||||
|
||||
<body>
|
||||
<h3 style="background-color:#212529;text-align:center;">
|
||||
<img src="images/title.png" style="height:2em;min-height:initial;" />
|
||||
</h3>
|
||||
<h1 style="background-color:#212529;text-align:center;">
|
||||
<strong class="text-blue">Libre</span><strong class="text-orange">Gaming</span>
|
||||
</h1>
|
||||
|
||||
<p><img src="images/banner.png" alt="banner" title="" /></p>
|
||||
|
||||
<h1><img src="images/libregaming-logo.svg" alt="logo" /> Libre Games: By <strong>Everyone</strong> for <strong>Everyone</strong></h1>
|
||||
<h1><img src="icons/libregaming.svg" alt="logo" /> Libre Games: By <strong>Everyone</strong> for <strong>Everyone</strong></h1>
|
||||
|
||||
<p><span style="color:#ff8f23">Libre games are fun games owned by the
|
||||
community: Everyone who <strong>plays</strong> the game, <strong>develops</strong> it, and
|
||||
<strong>shares</strong> it.</span></p>
|
||||
|
||||
<h2><img src="images/team-lg.svg" alt="icon" /> Community owned games</h2>
|
||||
<h2><img src="icons/team-line.svg" alt="icon" /> Community owned games</h2>
|
||||
|
||||
<p><span style="color:#ff8f23">When a game is owned by the <strong>community</strong>
|
||||
everyone can do anything they like with it!</span></p>
|
||||
|
||||
<div class="gallery-flex">
|
||||
<div class="card">
|
||||
<h1 class="text-orange">Modding</h1>
|
||||
<h1><img alt="tools icon" src="images/tools-lg.svg" /></h1>
|
||||
<h1>Modding</h1>
|
||||
<h1><img alt="tools icon" src="icons/tools-line.svg" /></h1>
|
||||
<ul>
|
||||
<li>Create and share a <strong>modified</strong> project
|
||||
</li>
|
||||
|
@ -96,8 +109,8 @@ everyone can do anything they like with it!</span></p>
|
|||
</div>
|
||||
|
||||
<div class="card">
|
||||
<h1 class="text-orange">Sharing</h1>
|
||||
<h1><img alt="team icon" src="images/team-lg.svg" /></h1>
|
||||
<h1>Sharing</h1>
|
||||
<h1><img alt="team icon" src="icons/team-line.svg" /></h1>
|
||||
<ul>
|
||||
<li><strong>Share</strong> copies of the game!</li>
|
||||
<li><strong>Freely</strong> use the game's content on any platform!</li>
|
||||
|
@ -105,8 +118,8 @@ everyone can do anything they like with it!</span></p>
|
|||
</div>
|
||||
|
||||
<div class="card">
|
||||
<h1 class="text-orange">Learning</h1>
|
||||
<h1><img alt="book icon" src="images/book-open-lg.svg" /></h1>
|
||||
<h1>Learning</h1>
|
||||
<h1><img alt="book icon" src="icons/book-open-line.svg" /></h1>
|
||||
<ul>
|
||||
<li><strong>Learn</strong> how the game is built by looking
|
||||
<strong>under the hood</strong>.</li>
|
||||
|
@ -114,8 +127,8 @@ everyone can do anything they like with it!</span></p>
|
|||
</div>
|
||||
|
||||
<div class="card">
|
||||
<h1 class="text-orange">Collaborating</h1>
|
||||
<h1><img alt="service icon" src="images/service-lg.svg" /></h1>
|
||||
<h1>Collaborating</h1>
|
||||
<h1><img alt="service icon" src="icons/service-line.svg" /></h1>
|
||||
<ul>
|
||||
<li><strong>Participate</strong> in the game's development by
|
||||
<strong>improving</strong> it and/or giving
|
||||
|
@ -126,8 +139,8 @@ everyone can do anything they like with it!</span></p>
|
|||
</div>
|
||||
|
||||
<div class="card">
|
||||
<h1 class="text-orange">Preserving</h1>
|
||||
<h1><img alt="fingerprint icon" src="images/fingerprint-lg.svg" /></h1>
|
||||
<h1>Preserving</h1>
|
||||
<h1><img alt="fingerprint icon" src="icons/fingerprint-line.svg" /></h1>
|
||||
<ul>
|
||||
<li>Help port the game to new platforms and ensure it
|
||||
<strong>lives forever</strong>.</li>
|
||||
|
@ -140,8 +153,8 @@ everyone can do anything they like with it!</span></p>
|
|||
|
||||
<div class="gallery-flex">
|
||||
<div class="card">
|
||||
<h1 class="text-orange">Sharing</h1>
|
||||
<h1><img alt="team icon" src="images/team-lg.svg" /></h1>
|
||||
<h1>Sharing</h1>
|
||||
<h1><img alt="team icon" src="icons/team-line.svg" /></h1>
|
||||
<p><strong>Everything</strong> needed to make the game:</p>
|
||||
<ul>
|
||||
<li>Code</li>
|
||||
|
|
Loading…
Reference in New Issue