dev21w38b

This commit is contained in:
Victor Westerlund 2021-09-22 10:34:11 -04:00
parent ea033cea92
commit 94007b1f5d
2 changed files with 15 additions and 7 deletions

View file

@ -1,6 +1,7 @@
/* Victor Westerlund - www.victorwesterlund.com */ /* Victor Westerlund - www.victorwesterlund.com */
:root { :root {
--padding: 20px; --padding: 20px;
--max-width: 800px;
} }
html, html,
@ -12,6 +13,7 @@ header {
display: flex; display: flex;
align-items: center; align-items: center;
height: 100px; height: 100px;
min-height: 80px;
} }
header h1 { header h1 {
@ -27,7 +29,7 @@ header h1 {
border: none; border: none;
font-size: 16px; font-size: 16px;
width: calc(100vw - (var(--padding) * 2)); width: calc(100vw - (var(--padding) * 2));
max-width: 800px; max-width: var(--max-width);
text-transform: lowercase; text-transform: lowercase;
padding: var(--padding); padding: var(--padding);
} }
@ -48,18 +50,20 @@ header h1 {
/* -- Results -- */ /* -- Results -- */
#results { #results {
width: 100%; width: calc(var(--max-width) + (var(--padding) * 4));
max-width: 1000px; max-width: 100%;
box-sizing: border-box; box-sizing: border-box;
padding: var(--padding); padding: var(--padding);
display: flex; display: flex;
flex-wrap: wrap; flex-direction: column;
overflow-y: auto;
gap: var(--padding);
} }
.card { .card {
padding: var(--padding); padding: var(--padding);
box-sizing: border-box; box-sizing: border-box;
width: clamp(100%,100%,200px); width: 100%;
overflow: auto; overflow: auto;
border: solid 1px var(--swatch-contrast); border: solid 1px var(--swatch-contrast);
} }

View file

@ -19,8 +19,12 @@
</div> </div>
<div id="results"> <div id="results">
<div class="card"> <div class="card">
<h3>hello</h3> <div>
<p>mafriend</p> <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path fill-rule="evenodd" d="M3 2.75A2.75 2.75 0 0 1 5.75 0h14.5a.75.75 0 0 1 .75.75v20.5a.75.75 0 0 1-.75.75h-6a.75.75 0 0 1 0-1.5h5.25v-4H6A1.5 1.5 0 0 0 4.5 18v.75c0 .716.43 1.334 1.05 1.605a.75.75 0 0 1-.6 1.374A3.25 3.25 0 0 1 3 18.75v-16zM19.5 1.5V15H6c-.546 0-1.059.146-1.5.401V2.75c0-.69.56-1.25 1.25-1.25H19.5z" fill="currentColor"/><path d="M7 18.25a.25.25 0 0 1 .25-.25h5a.25.25 0 0 1 .25.25v5.01a.25.25 0 0 1-.397.201l-2.206-1.604a.25.25 0 0 0-.294 0L7.397 23.46a.25.25 0 0 1-.397-.2v-5.01z" fill="currentColor"/></svg>
<p>github/victorwesterlund.com</p>
</div>
<div class="spacer">
<p>Lorem ipsum</p>
</div> </div>
</div> </div>
</body> </body>