An experiment in cleaning up CSS by just avoiding dis-features and focusing on flexbox and CSS grids.
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.
|
|
|
|
header.svelte-khlxmc.svelte-khlxmc{}main.svelte-khlxmc.svelte-khlxmc{}footer.svelte-khlxmc.svelte-khlxmc{display:flex;flex:flex-grow;flex-direction:row}footer.svelte-khlxmc nav.svelte-khlxmc{flex:1}@import 'sass/_variables';.inactive.svelte-1iby9by{stroke:var(--color-inactive);fill:var(--color-bg)}hero.svelte-rf35ix.svelte-rf35ix{display:block;padding:3rem;background-color:var(--color-bg-secondary)}hero.svelte-rf35ix h1.svelte-rf35ix{font-size:3rem}aside.svelte-rf35ix a.svelte-rf35ix{--text-decoration:underline}rationale.svelte-rf35ix.svelte-rf35ix{display:flex;flex-direction:column;font-size:1.5em;padding-left:4rem;padding-right:4rem}images.svelte-1bny7ze.svelte-1bny7ze{display:grid;grid-template-columns:1fr 1fr}figure:hover content{filter:grayscale(1) blur(6px);background-color:var(--color-bg-secondary);cursor:pointer}figure.svelte-1bny7ze.svelte-1bny7ze{padding:0.5em;position:sticky}figure.svelte-1bny7ze figcaption.svelte-1bny7ze{display:none;color:var(--color-text);font-size:6em;filter:drop-shadow(10px 5px 5px var(--color-shadow-secondary));font-weight:bold}figure.svelte-1bny7ze:hover figcaption.svelte-1bny7ze{display:flex;padding-top:2em;width:100%;justify-content:center;position:absolute;top:0;left:0}content.svelte-bnvc6y.svelte-bnvc6y.svelte-bnvc6y{border:1px solid #ddd;display:flex;flex-direction:row;flex:flex-grow;flex-basis:100%;grid-column:1/3;padding:0rem}left.svelte-bnvc6y.svelte-bnvc6y.svelte-bnvc6y{display:flex;flex-basis:200px;flex-direction:column;border-right:1px solid var(--color-bg-secondary);padding:1em;font-size:1.2em}middle.svelte-bnvc6y.svelte-bnvc6y.svelte-bnvc6y{display:flex;flex:2;flex-direction:column}right.svelte-bnvc6y.svelte-bnvc6y.svelte-bnvc6y{display:flex;flex-basis:300px;flex-direction:column;border-left:1px solid var(--color-bg-secondary)}header.svelte-bnvc6y.svelte-bnvc6y.svelte-bnvc6y{width:100%;text-align:unset}header.svelte-bnvc6y nav.svelte-bnvc6y.svelte-bnvc6y{justify-content:left}header.svelte-bnvc6y nav h4.svelte-bnvc6y.svelte-bnvc6y{}header.svelte-bnvc6y nav back.svelte-bnvc6y.svelte-bnvc6y{padding-left:1rem;padding-right:1rem}header.svelte-bnvc6y nav name h4.svelte-bnvc6y.svelte-bnvc6y{margin:unset;padding:unset}header.svelte-bnvc6y nav name span.svelte-bnvc6y.svelte-bnvc6y{font-size:0.8em;font-weight:normal}middle.svelte-bnvc6y images.svelte-bnvc6y.svelte-bnvc6y{display:grid;grid-template-columns:1fr min-content}middle.svelte-bnvc6y images figure#background.svelte-bnvc6y.svelte-bnvc6y{z-index:-1;grid-column:1/2;grid-row:1/ span 2}figure#background.svelte-bnvc6y img.svelte-bnvc6y.svelte-bnvc6y{height:200px;min-width:500px}middle.svelte-bnvc6y images figure#avatar.svelte-bnvc6y.svelte-bnvc6y{z-index:5;grid-column:1/1;grid-row:2/2}middle.svelte-bnvc6y images figure#avatar img.svelte-bnvc6y.svelte-bnvc6y{z-index:5;position:relative;top:90px;left:10px;width:128px}figure#avatar.svelte-bnvc6y img.svelte-bnvc6y.svelte-bnvc6y{border-radius:50%;border:5px white solid}button#follow.svelte-bnvc6y.svelte-bnvc6y.svelte-bnvc6y{padding:0.8rem;border-radius:30px;border:1px var(--color) solid;background:var(--color-bg);color:var(--color);position:relative;top:60px;left:220px}button#signup.svelte-bnvc6y.svelte-bnvc6y.svelte-bnvc6y{border-radius:30px;padding:0.5rem;width:100%;font-size:0.9em}aside#newperson.svelte-bnvc6y p.svelte-bnvc6y.svelte-bnvc6y{font-size:0.8em;color:var(--color-inactive)}recent-media.svelte-bnvc6y.svelte-bnvc6y.svelte-bnvc6y{display:grid;grid-template-columns:1fr 1fr 1fr;grid-gap:1px}profile.svelte-bnvc6y.svelte-bnvc6y.svelte-bnvc6y{margin-top:6rem;margin-left:1rem;margin-right:1rem}tweet.svelte-bnvc6y.svelte-bnvc6y.svelte-bnvc6y{display:flex;flex-direction:row}tweet.svelte-bnvc6y post.svelte-bnvc6y.svelte-bnvc6y{padding-left:1em;flex-grow:2;margin-bottom:1rem}tweet.svelte-bnvc6y figure#avatar.svelte-bnvc6y img.svelte-bnvc6y{min-width:64px;height:64px}tweet.svelte-bnvc6y post h4.svelte-bnvc6y.svelte-bnvc6y{margin:unset}tweet.svelte-bnvc6y post p.svelte-bnvc6y.svelte-bnvc6y{margin-bottom:0.5rem}tweet.svelte-bnvc6y post actions.svelte-bnvc6y.svelte-bnvc6y{display:flex;just
|
