hmn
/
hmn
4
Fork 9
Code Issues 59 Pull Requests 1 Releases Activity

Fix mobile nav issues and add circuit logo

This commit is contained in:
Ben Visness 2021-10-27 22:44:08 -05:00
parent 2882c49b2b
commit 60aef6d032
6 changed files with 127 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
public/style.css
View File

@ -8767,6 +8767,10 @@ header .root-item > a {
header .root-item .svgicon {
font-size: 0.7em; }
header:not(.clicked) .root-item:not(:hover) > .submenu,
header.clicked .root-item:not(.clicked) > .submenu {
display: none; }
header .submenu {
background-color: #f8f8f8;
background-color: var(--content-background);

7
src/rawdata/scss/_header.scss
View File

@ -74,6 +74,13 @@ header {
}
}
&:not(.clicked) .root-item:not(:hover),
&.clicked .root-item:not(.clicked) {
> .submenu {
display: none;
}
}
.submenu {
@extend .bw1;
@include usevar(background-color, content-background);

4
src/templates/src/include/header.html
View File

@ -103,7 +103,9 @@
}
}
function clickDropdown(el) {
function clickDropdown(el) {
header.classList.add('clicked');
if (el.classList.contains('clicked')) {
clearDropdowns();
} else {

11
src/templates/src/landing.html
View File

@ -112,6 +112,13 @@
font-family: 'MohaveHMN', sans-serif;
font-weight: 400;
font-size: 4rem;
display: flex;
justify-content: center;
}
#welcome-logo svg {
height: 100%;
fill: currentColor;
}
#welcome-content a {
@ -148,7 +155,9 @@
}
</style>
<div id="welcome" class="br3 pa3 pa4-ns bg--card f5">
<h2 id="welcome-logo" class="tc pb3">HANDMADE</h2> <!-- TODO: logo -->
<div id="welcome-logo" class="h4 mb4">
{{ svg "hmn_circuit" }}
</div>
<div id="welcome-content" class="center-layout" style="max-width: 51rem">
<p class="b">We are a community of programmers committed to producing quality software through deeper understanding.</p>
<p>Originally inspired by Casey Muratori's <a href="https://handmadehero.org/" target="_blank">Handmade Hero</a>, we have grown into a thriving community focused on building truly high-quality software. We're not low-level in the typical sense. Instead we realize that to write great software, you need to understand things at more than a surface level.</p>

2
src/templates/src/user_profile.html
View File

@ -14,7 +14,7 @@
{{ with or .ProfileUser.Bio .ProfileUser.Blurb }}
<div class="mb3">{{ . }}</div>
{{ end }}
<div class="w-100 w-auto-ns">
<div class="w-100 w-auto-ns w-100-l">
{{ if .ProfileUser.Email }}
<div class="pair flex">
<div class="key flex-auto flex-shrink-0 mr2">Email</div>

102
src/templates/svg/hmn_circuit.svg Normal file
View File

@ -0,0 +1,102 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg viewBox="0 0 3706 1082" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
<g id="Banner-Logo" serif:id="Banner Logo" transform="matrix(48.7805,0,0,48.7805,-9370.23,-9931.81)">
<g transform="matrix(1,0,0,1,-0.497771,-0.118656)">
<g transform="matrix(1,0,0,-1,-0.808418,430.006)">
<path d="M193.396,215.074L201.366,215.074" style="fill:none;"/>
</g>
<g transform="matrix(1,0,0,-1,-0.808418,430.006)">
<path d="M194.555,216.234C193.915,216.234 193.396,215.714 193.396,215.074C193.396,214.434 193.915,213.915 194.555,213.915C195.195,213.915 195.715,214.434 195.715,215.074C195.715,215.714 195.195,216.234 194.555,216.234ZM194.555,215.461C194.768,215.461 194.942,215.288 194.942,215.074C194.942,214.861 194.768,214.688 194.555,214.688C194.342,214.688 194.169,214.861 194.169,215.074C194.169,215.288 194.342,215.461 194.555,215.461Z" style=""/>
</g>
<g transform="matrix(1,0,0,-1,-0.808418,430.006)">
<path d="M195.328,214.688L201.366,214.688C201.579,214.688 201.753,214.861 201.753,215.074C201.753,215.288 201.579,215.461 201.366,215.461L195.328,215.461C195.115,215.461 194.942,215.288 194.942,215.074C194.942,214.861 195.115,214.688 195.328,214.688Z" style=""/>
</g>
<g transform="matrix(-1,0,0,-1,461.953,430.006)">
<path d="M193.396,215.074L201.366,215.074" style="fill:none;"/>
</g>
<g transform="matrix(-1,0,0,-1,461.953,430.006)">
<path d="M194.555,213.915C193.915,213.915 193.396,214.434 193.396,215.074C193.396,215.714 193.915,216.234 194.555,216.234C195.195,216.234 195.715,215.714 195.715,215.074C195.715,214.434 195.195,213.915 194.555,213.915ZM194.555,214.688C194.768,214.688 194.942,214.861 194.942,215.074C194.942,215.288 194.768,215.461 194.555,215.461C194.342,215.461 194.169,215.288 194.169,215.074C194.169,214.861 194.342,214.688 194.555,214.688Z" style=""/>
</g>
<g transform="matrix(-1,0,0,-1,461.953,430.006)">
<path d="M195.328,215.461L201.366,215.461C201.579,215.461 201.753,215.288 201.753,215.074C201.753,214.861 201.579,214.688 201.366,214.688L195.328,214.688C195.115,214.688 194.942,214.861 194.942,215.074C194.942,215.288 195.115,215.461 195.328,215.461Z" style=""/>
</g>
<g transform="matrix(1,0,0,-1,0.0431238,430.006)">
<path d="M200.515,215.074L201.656,213.933" style="fill:none;"/>
</g>
<g transform="matrix(1,0,0,-1,0.0431238,430.006)">
<path d="M200.241,214.801L201.383,213.66L201.929,214.206L200.788,215.348L200.241,214.801Z" style=""/>
</g>
<g transform="matrix(1,0,0,-1,58.9314,428.865)">
<path d="M200.515,215.074L201.656,213.933" style="fill:none;"/>
</g>
<g transform="matrix(1,0,0,-1,58.9314,428.865)">
<path d="M200.241,214.801L201.383,213.66L201.929,214.206L200.788,215.348L200.241,214.801Z" style=""/>
</g>
<g transform="matrix(1,0,0,-1,1.04312,431.006)">
<path d="M205.833,209.755L207.639,207.95" style="fill:none;"/>
</g>
<g transform="matrix(1,0,0,-1,1.04312,431.006)">
<path d="M205.56,209.482L207.365,207.677L207.912,208.223L206.107,210.029L205.56,209.482Z" style=""/>
</g>
<g transform="matrix(1,0,0,-1,1.04312,431.006)">
<path d="M229.737,206.754C229.436,207.055 228.946,207.055 228.644,206.754C228.342,206.452 228.342,205.962 228.644,205.66C228.946,205.359 229.436,205.359 229.737,205.66C230.039,205.962 230.039,206.452 229.737,206.754ZM229.191,206.207C229.191,206.207 229.191,206.207 229.191,206.207Z" style=""/>
</g>
<g transform="matrix(1,0,0,-1,1.04312,431.006)">
<path d="M207.639,207.564L227.288,207.564C227.288,207.564 228.644,206.207 228.644,206.207C228.795,206.056 229.04,206.056 229.191,206.207C229.342,206.358 229.342,206.603 229.191,206.754C228.534,207.411 227.721,208.223 227.721,208.223C227.648,208.296 227.55,208.337 227.448,208.337L207.639,208.337C207.425,208.337 207.252,208.163 207.252,207.95C207.252,207.737 207.425,207.564 207.639,207.564Z" style=""/>
</g>
<g transform="matrix(1,0,0,-1,1.04312,431.006)">
<path d="M230.737,207.564L251.13,207.564C251.233,207.564 251.331,207.604 251.403,207.677L253.209,209.482L252.662,210.029L250.97,208.337C250.97,208.337 230.737,208.337 230.737,208.337L230.737,207.564Z" style=""/>
</g>
<g transform="matrix(-1,0,0,1,459.812,-1.40971)">
<path d="M205.833,209.755L207.639,207.95" style="fill:none;"/>
</g>
<g transform="matrix(-1,0,0,1,459.812,-1.40971)">
<path d="M205.56,209.482L207.365,207.677L207.912,208.223L206.107,210.029L205.56,209.482Z" style=""/>
</g>
<g transform="matrix(-1,0,0,1,459.812,-1.40971)">
<path d="M229.737,206.754C229.436,207.055 228.946,207.055 228.644,206.754C228.342,206.452 228.342,205.962 228.644,205.66C228.946,205.359 229.436,205.359 229.737,205.66C230.039,205.962 230.039,206.452 229.737,206.754Z" style=""/>
</g>
<g transform="matrix(-1,0,0,1,459.812,-1.40971)">
<path d="M207.639,207.564L227.288,207.564C227.288,207.564 228.644,206.207 228.644,206.207C228.795,206.056 229.04,206.056 229.191,206.207C229.342,206.358 229.342,206.603 229.191,206.754C228.534,207.411 227.721,208.223 227.721,208.223C227.648,208.296 227.55,208.337 227.448,208.337L207.639,208.337C207.425,208.337 207.252,208.163 207.252,207.95C207.252,207.737 207.425,207.564 207.639,207.564Z" style=""/>
</g>
<g transform="matrix(-1,0,0,1,459.812,-1.40971)">
<path d="M230.737,207.564L251.13,207.564C251.233,207.564 251.331,207.604 251.403,207.677L253.209,209.482L252.662,210.029L250.97,208.337C250.97,208.337 230.737,208.337 230.737,208.337L230.737,207.564Z" style=""/>
</g>
<g transform="matrix(-1,0,0,-1,469.812,412.749)">
<path d="M240.737,208.337L250.97,208.337C250.97,208.337 251.662,209.029 251.662,209.029L252.209,208.482L251.403,207.677C251.331,207.604 251.233,207.564 251.13,207.564L240.737,207.564L240.737,208.337Z" style=""/>
</g>
<g transform="matrix(1,0,0,-1,-36.8607,412.749)">
<path d="M243.737,207.564L251.13,207.564C251.233,207.564 251.331,207.604 251.403,207.677L252.209,208.482L251.662,209.029L250.97,208.337C250.97,208.337 243.737,208.337 243.737,208.337L243.737,207.564Z" style=""/>
</g>
<g transform="matrix(1,0,0,-1,-31.3696,432.749)">
<path d="M242.737,207.564L251.13,207.564C251.233,207.564 251.331,207.604 251.403,207.677L253.209,209.482L252.662,210.029L250.97,208.337C250.97,208.337 242.737,208.337 242.737,208.337L242.737,207.564Z" style=""/>
</g>
<g transform="matrix(-1,0,0,-1,487.321,432.821)">
<path d="M242.737,208.337L250.97,208.337C250.97,208.337 252.662,210.029 252.662,210.029L253.209,209.482L251.403,207.677C251.331,207.604 251.233,207.564 251.13,207.564L242.737,207.564L242.737,208.337Z" style=""/>
</g>
<g transform="matrix(-1,0,0,1,492.867,-3.15102)">
<path d="M242.737,207.564L251.13,207.564C251.233,207.564 251.331,207.604 251.403,207.677L253.209,209.482L252.662,210.029L250.97,208.337C249.81,208.337 242.737,208.337 242.737,208.337L242.737,207.564Z" style=""/>
</g>
<g transform="matrix(1,0,0,1,-9.29379,0)">
<path d="M217.976,223.056L215.686,225.346" style="fill:none;"/>
</g>
<g transform="matrix(1,0,0,1,-9.29379,0)">
<path d="M216.233,225.892L217.326,224.799L216.233,223.706L215.139,224.799L216.233,225.892Z" style=""/>
</g>
<g transform="matrix(1,0,0,1,-9.29379,0)">
<path d="M217.702,222.783C217.702,222.783 216.89,223.595 216.233,224.252L216.779,224.799C217.436,224.142 218.249,223.329 218.249,223.329L217.702,222.783Z" style=""/>
</g>
</g>
<g id="Name-3" serif:id="Name 3" transform="matrix(1,0,0,1,-4.57363,22.1201)">
<path d="M213.538,196.869L213.538,188.32L214.496,188.32L214.496,192.663L216.491,192.663L216.491,188.32L217.448,188.32L217.448,196.869L216.491,196.869L216.491,193.62L214.496,193.62L214.496,196.869L213.538,196.869Z" style="fill-opacity:0.85;fill-rule:nonzero;"/>
<path d="M221.267,188.32L223.079,196.869L222.087,196.869L221.757,195.216L219.751,195.216L219.409,196.869L218.417,196.869L220.241,188.32L221.267,188.32ZM219.922,194.258L221.586,194.258L220.754,190.03L219.922,194.258Z" style="fill-opacity:0.85;fill-rule:nonzero;"/>
<path d="M227.331,188.32L228.242,188.32L228.242,196.869L227.433,196.869L225.131,190.816L225.131,196.869L224.219,196.869L224.219,188.32L225.028,188.32L227.331,194.372L227.331,188.32Z" style="fill-opacity:0.85;fill-rule:nonzero;"/>
<path d="M229.496,196.869L229.496,188.32L231.457,188.32C232.072,188.32 232.566,188.514 232.939,188.901C233.311,189.289 233.497,189.798 233.497,190.429L233.497,194.76C233.497,195.391 233.311,195.9 232.939,196.287C232.566,196.675 232.072,196.869 231.457,196.869L229.496,196.869ZM230.454,195.911L231.457,195.911C231.784,195.911 232.046,195.807 232.243,195.598C232.441,195.389 232.54,195.11 232.54,194.76L232.54,190.429C232.54,190.079 232.441,189.8 232.243,189.591C232.046,189.382 231.784,189.277 231.457,189.277L230.454,189.277L230.454,195.911Z" style="fill-opacity:0.85;fill-rule:nonzero;"/>
<path d="M239.265,188.32L240.222,188.32L240.222,196.869L239.31,196.869L239.31,191.306L237.84,196.869L237.122,196.869L235.663,191.306L235.663,196.869L234.751,196.869L234.751,188.32L235.708,188.32L237.487,195.113L239.265,188.32Z" style="fill-opacity:0.85;fill-rule:nonzero;"/>
<path d="M244.212,188.32L246.024,196.869L245.032,196.869L244.702,195.216L242.696,195.216L242.354,196.869L241.362,196.869L243.186,188.32L244.212,188.32ZM242.867,194.258L244.531,194.258L243.699,190.03L242.867,194.258Z" style="fill-opacity:0.85;fill-rule:nonzero;"/>
<path d="M247.05,196.869L247.05,188.32L249.01,188.32C249.626,188.32 250.12,188.514 250.492,188.901C250.864,189.289 251.051,189.798 251.051,190.429L251.051,194.76C251.051,195.391 250.864,195.9 250.492,196.287C250.12,196.675 249.626,196.869 249.01,196.869L247.05,196.869ZM248.007,195.911L249.01,195.911C249.337,195.911 249.599,195.807 249.797,195.598C249.994,195.389 250.093,195.11 250.093,194.76L250.093,190.429C250.093,190.079 249.994,189.8 249.797,189.591C249.599,189.382 249.337,189.277 249.01,189.277L248.007,189.277L248.007,195.911Z" style="fill-opacity:0.85;fill-rule:nonzero;"/>
<path d="M255.758,188.32L255.758,189.277L253.262,189.277L253.262,192.081L255.45,192.081L255.45,193.039L253.262,193.039L253.262,195.911L255.758,195.911L255.758,196.869L252.304,196.869L252.304,188.32L255.758,188.32Z" style="fill-opacity:0.85;fill-rule:nonzero;"/>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 11 KiB