latest version of the site, I'm a graphic designer now

This commit is contained in:
Brian Picciano 2022-04-11 21:00:39 -06:00
parent 7b207b5b01
commit b5ce8cb1ac
9 changed files with 1755 additions and 110 deletions

Binary file not shown.

88
css/main-index.css Normal file
View File

@ -0,0 +1,88 @@
@font-face {
font-family: "SourceCode-Pro";
src: url("source-code-pro.woff") format('woff');
}
@font-face {
font-family: "PlayfairDisplay-Regular";
src: url("playfair-display-regular.ttf");
}
@font-face {
font-family: "AbrilFatface-Regular";
src: url("AbrilFatface-Regular.ttf");
}
html {
font-family: Helvetica, sans-serif;
background-color: #fafafa;
color: #050505;
}
.container-wrap {
width: 100%;
}
.sep {
display: block;
width: 100%;
}
.button-primary {
background-color: #0F2E4D !important;
color: #E1EDF9 !important;
border: none !important;
text-decoration: none;
font-size: 3rem;
padding: 2rem;
height: auto !important;
}
.large {
color: #0F2E4D;
font-size: 3rem;
}
.neutral {
color: #0F2E4D;
font-family: "AbrilFatface-Regular", serif;
}
h1 {
font-size: 9rem;
font-weight: normal;
}
h2 {
font-size: 7rem;
font-weight: normal;
}
.design {
background-color: #991F3B;
color: #FFEDF1;
font-size: 2rem;
}
.design h2 {
font-family: "PlayfairDisplay-Regular", serif;
}
.develop {
background-color: #66991F;
color: #F8FFED;
font-size: 2rem;
}
.develop h2 {
font-family: "SourceCode-Pro", monospace, sans-serif;
}
em {
font-style: normal;
font-weight: bold;
}
a, a:active {
color: #5762AD;
}

View File

@ -8,17 +8,6 @@ html {
background-color: #f2f2f2; background-color: #f2f2f2;
} }
@font-face {
font-family: "Overpass";
src: url("overpass-regular.woff") format('woff');
}
/*
h1, h2, h3, h4, h5, h6, .button-primary, .button {
font-family: "Overpass", Helvetica, sans-serif;
}
*/
h1 { color: #008700; } h1 { color: #008700; }
h2 { color: #0087af; } h2 { color: #0087af; }
h3 { color: #8700af; } h3 { color: #8700af; }

Binary file not shown.

Binary file not shown.

264
img/a.svg Normal file
View File

@ -0,0 +1,264 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="1000"
height="50"
viewBox="0 0 264.58333 13.229167"
version="1.1"
id="svg5"
sodipodi:docname="a.svg"
inkscape:version="1.1.2 (0a00cf5339, 2022-02-04)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview886"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="true"
showgrid="false"
inkscape:snap-page="true"
inkscape:zoom="0.76438243"
inkscape:cx="793.45099"
inkscape:cy="-35.976756"
inkscape:window-width="1920"
inkscape:window-height="1060"
inkscape:window-x="0"
inkscape:window-y="20"
inkscape:window-maximized="1"
inkscape:current-layer="g5282" />
<defs
id="defs2">
<symbol
id="symbol1980">
<path
style="fill:#991f3b;stroke-width:3.51251;stroke-linejoin:round"
d="m 0,4.9229759 h 5.2916667 v 1.3229167 h -5.2916667 z"
id="path1876" />
<path
style="fill:#991f3b;stroke-width:3.51251;stroke-linejoin:round"
d="m 5.2916667,6.2458926 h 5.2916673 v 1.3229166 h -5.2916673 z"
id="path1876-1" />
</symbol>
</defs>
<g
id="g5282">
<g
id="g5400"
transform="matrix(1.0298971,-0.03882691,0.04001789,0.99924595,-0.50198934,5.1482287)">
<use
xlink:href="#symbol1980"
id="use1984"
x="0"
y="0"
width="100%"
height="100%" />
<use
xlink:href="#symbol1980"
id="use1984-0"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(10.583334)" />
<use
xlink:href="#symbol1980"
id="use1984-9"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(21.166668)" />
<use
xlink:href="#symbol1980"
id="use1984-3"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(31.750002)" />
<use
xlink:href="#symbol1980"
id="use1984-6"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(42.333336)" />
<use
xlink:href="#symbol1980"
id="use1984-06"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(52.91667)" />
<use
xlink:href="#symbol1980"
id="use1984-2"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(63.500004)" />
<use
xlink:href="#symbol1980"
id="use1984-61"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(74.083338)" />
<use
xlink:href="#symbol1980"
id="use1984-8"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(84.666672)" />
<use
xlink:href="#symbol1980"
id="use1984-7"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(95.250006)" />
<use
xlink:href="#symbol1980"
id="use1984-92"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(105.83334)" />
<use
xlink:href="#symbol1980"
id="use1984-02"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(116.41667)" />
<use
xlink:href="#symbol1980"
id="use1984-37"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(127)" />
<use
xlink:href="#symbol1980"
id="use1984-5"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(137.58333)" />
<use
xlink:href="#symbol1980"
id="use1984-922"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(148.16666)" />
<use
xlink:href="#symbol1980"
id="use1984-89"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(158.74999)" />
<use
xlink:href="#symbol1980"
id="use1984-73"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(169.33332)" />
<use
xlink:href="#symbol1980"
id="use1984-612"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(179.91665)" />
<use
xlink:href="#symbol1980"
id="use1984-93"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(190.49998)" />
<use
xlink:href="#symbol1980"
id="use1984-1"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(201.08331)" />
<use
xlink:href="#symbol1980"
id="use1984-94"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(211.66664)" />
<use
xlink:href="#symbol1980"
id="use1984-78"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(222.24997)" />
<use
xlink:href="#symbol1980"
id="use1984-4"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(232.8333)" />
<use
xlink:href="#symbol1980"
id="use1984-50"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(243.41663)" />
<use
xlink:href="#symbol1980"
id="use1984-36"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(253.99996)" />
<rect
style="fill:#991f3b;stroke-width:5.67329;stroke-linejoin:round"
id="rect3610"
width="264.58328"
height="18.63422"
x="5.2529296e-05"
y="7.4083333"
ry="0" />
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 6.5 KiB

809
img/b.svg Normal file
View File

@ -0,0 +1,809 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="1000"
height="100"
viewBox="0 0 264.58333 26.458334"
version="1.1"
id="svg5"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs
id="defs2" />
<path
style="fill:#66991f;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
d="m 0,26.458333 v -20.521259 h 264.58333 l 0,20.521259 z"
id="path1612" />
<path
style="fill:#991f3b;fill-opacity:1;stroke:none;stroke-width:1.5875;stroke-linejoin:round;stroke-opacity:1"
d="m 0,0 v 5.937074 l 264.58333,13.229167 v -13.229167 -5.937074"
id="path1055" />
<g
id="g4033"
transform="rotate(3.0045567,446.71555,-135.62883)">
<g
id="use2015">
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1440"
cx="2.6458333"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1442"
cx="7.9375"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1444"
cx="2.6458333"
cy="29.104166"
r="1.3229166" />
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1446"
cx="7.9375"
cy="29.104166"
r="1.3229166" />
</g>
<g
id="use2015-5"
transform="translate(10.583333)">
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1450"
cx="2.6458333"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1452"
cx="7.9375"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1454"
cx="2.6458333"
cy="29.104166"
r="1.3229166" />
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1456"
cx="7.9375"
cy="29.104166"
r="1.3229166" />
</g>
<g
id="use2015-6"
transform="translate(21.166667)">
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1460"
cx="2.6458333"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1462"
cx="7.9375"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1464"
cx="2.6458333"
cy="29.104166"
r="1.3229166" />
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1466"
cx="7.9375"
cy="29.104166"
r="1.3229166" />
</g>
<g
id="use2015-5-2"
transform="translate(31.75)">
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1470"
cx="2.6458333"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1472"
cx="7.9375"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1474"
cx="2.6458333"
cy="29.104166"
r="1.3229166" />
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1476"
cx="7.9375"
cy="29.104166"
r="1.3229166" />
</g>
<g
id="use2015-9"
transform="translate(42.333334)">
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1480"
cx="2.6458333"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1482"
cx="7.9375"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1484"
cx="2.6458333"
cy="29.104166"
r="1.3229166" />
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1486"
cx="7.9375"
cy="29.104166"
r="1.3229166" />
</g>
<g
id="use2015-5-1"
transform="translate(52.916667)">
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1490"
cx="2.6458333"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1492"
cx="7.9375"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1494"
cx="2.6458333"
cy="29.104166"
r="1.3229166" />
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1496"
cx="7.9375"
cy="29.104166"
r="1.3229166" />
</g>
<g
id="use2015-6-2"
transform="translate(63.500001)">
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1500"
cx="2.6458333"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1502"
cx="7.9375"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1504"
cx="2.6458333"
cy="29.104166"
r="1.3229166" />
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1506"
cx="7.9375"
cy="29.104166"
r="1.3229166" />
</g>
<g
id="use2015-5-2-7"
transform="translate(74.083334)">
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1510"
cx="2.6458333"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1512"
cx="7.9375"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1514"
cx="2.6458333"
cy="29.104166"
r="1.3229166" />
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1516"
cx="7.9375"
cy="29.104166"
r="1.3229166" />
</g>
<g
id="use2015-0"
transform="translate(84.666667)">
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1520"
cx="2.6458333"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1522"
cx="7.9375"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1524"
cx="2.6458333"
cy="29.104166"
r="1.3229166" />
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1526"
cx="7.9375"
cy="29.104166"
r="1.3229166" />
</g>
<g
id="use2015-5-9"
transform="translate(95.25)">
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1530"
cx="2.6458333"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1532"
cx="7.9375"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1534"
cx="2.6458333"
cy="29.104166"
r="1.3229166" />
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1536"
cx="7.9375"
cy="29.104166"
r="1.3229166" />
</g>
<g
id="use2015-6-3"
transform="translate(105.83333)">
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1540"
cx="2.6458333"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1542"
cx="7.9375"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1544"
cx="2.6458333"
cy="29.104166"
r="1.3229166" />
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1546"
cx="7.9375"
cy="29.104166"
r="1.3229166" />
</g>
<g
id="use2015-5-2-6"
transform="translate(116.41666)">
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1550"
cx="2.6458333"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1552"
cx="7.9375"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1554"
cx="2.6458333"
cy="29.104166"
r="1.3229166" />
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1556"
cx="7.9375"
cy="29.104166"
r="1.3229166" />
</g>
<g
id="use2015-9-0"
transform="translate(127)">
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1560"
cx="2.6458333"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1562"
cx="7.9375"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1564"
cx="2.6458333"
cy="29.104166"
r="1.3229166" />
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1566"
cx="7.9375"
cy="29.104166"
r="1.3229166" />
</g>
<g
id="use2015-5-1-6"
transform="translate(137.58333)">
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1570"
cx="2.6458333"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1572"
cx="7.9375"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1574"
cx="2.6458333"
cy="29.104166"
r="1.3229166" />
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1576"
cx="7.9375"
cy="29.104166"
r="1.3229166" />
</g>
<g
id="use2015-6-2-2"
transform="translate(148.16667)">
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1580"
cx="2.6458333"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1582"
cx="7.9375"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1584"
cx="2.6458333"
cy="29.104166"
r="1.3229166" />
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1586"
cx="7.9375"
cy="29.104166"
r="1.3229166" />
</g>
<g
id="use2015-5-2-7-6"
transform="translate(158.75)">
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1590"
cx="2.6458333"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1592"
cx="7.9375"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1594"
cx="2.6458333"
cy="29.104166"
r="1.3229166" />
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1596"
cx="7.9375"
cy="29.104166"
r="1.3229166" />
</g>
<g
id="use2015-59"
transform="translate(169.33333)">
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1600"
cx="2.6458333"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1602"
cx="7.9375"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1604"
cx="2.6458333"
cy="29.104166"
r="1.3229166" />
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1606"
cx="7.9375"
cy="29.104166"
r="1.3229166" />
</g>
<g
id="use2015-5-22"
transform="translate(179.91666)">
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1610"
cx="2.6458333"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1612"
cx="7.9375"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1614"
cx="2.6458333"
cy="29.104166"
r="1.3229166" />
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1616"
cx="7.9375"
cy="29.104166"
r="1.3229166" />
</g>
<g
id="use2015-6-8"
transform="translate(190.5)">
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1620"
cx="2.6458333"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1622"
cx="7.9375"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1624"
cx="2.6458333"
cy="29.104166"
r="1.3229166" />
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1626"
cx="7.9375"
cy="29.104166"
r="1.3229166" />
</g>
<g
id="use2015-5-2-9"
transform="translate(201.08333)">
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1630"
cx="2.6458333"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1632"
cx="7.9375"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1634"
cx="2.6458333"
cy="29.104166"
r="1.3229166" />
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1636"
cx="7.9375"
cy="29.104166"
r="1.3229166" />
</g>
<g
id="use2015-9-7"
transform="translate(211.66666)">
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1640"
cx="2.6458333"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1642"
cx="7.9375"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1644"
cx="2.6458333"
cy="29.104166"
r="1.3229166" />
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1646"
cx="7.9375"
cy="29.104166"
r="1.3229166" />
</g>
<g
id="use2015-5-1-3"
transform="translate(222.25)">
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1650"
cx="2.6458333"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1652"
cx="7.9375"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1654"
cx="2.6458333"
cy="29.104166"
r="1.3229166" />
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1656"
cx="7.9375"
cy="29.104166"
r="1.3229166" />
</g>
<g
id="use2015-6-2-6"
transform="translate(232.83333)">
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1660"
cx="2.6458333"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1662"
cx="7.9375"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1664"
cx="2.6458333"
cy="29.104166"
r="1.3229166" />
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1666"
cx="7.9375"
cy="29.104166"
r="1.3229166" />
</g>
<g
id="use2015-5-2-7-1"
transform="translate(243.41666)">
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1670"
cx="2.6458333"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1672"
cx="7.9375"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1674"
cx="2.6458333"
cy="29.104166"
r="1.3229166" />
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1676"
cx="7.9375"
cy="29.104166"
r="1.3229166" />
</g>
<g
id="use2015-9-7-2"
transform="translate(254)">
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1680"
cx="2.6458333"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1682"
cx="7.9375"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1684"
cx="2.6458333"
cy="29.104166"
r="1.3229166" />
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1686"
cx="7.9375"
cy="29.104166"
r="1.3229166" />
</g>
<g
id="use2015-5-1-3-9"
transform="translate(264.58334)">
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1690"
cx="2.6458333"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1692"
cx="7.9375"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1694"
cx="2.6458333"
cy="29.104166"
r="1.3229166" />
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1696"
cx="7.9375"
cy="29.104166"
r="1.3229166" />
</g>
<g
id="use2015-6-2-6-3"
transform="translate(275.16667)">
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1700"
cx="2.6458333"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1702"
cx="7.9375"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1704"
cx="2.6458333"
cy="29.104166"
r="1.3229166" />
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1706"
cx="7.9375"
cy="29.104166"
r="1.3229166" />
</g>
<g
id="use2015-5-2-7-1-1"
transform="translate(285.75)">
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1710"
cx="2.6458333"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:1.5875;stroke-linejoin:round"
id="circle1712"
cx="7.9375"
cy="29.104166"
r="2.6458333" />
<circle
style="fill:#991f3b;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1714"
cx="2.6458333"
cy="29.104166"
r="1.3229166" />
<circle
style="fill:#66991f;fill-opacity:1;stroke-width:2.01952;stroke-linejoin:round"
id="circle1716"
cx="7.9375"
cy="29.104166"
r="1.3229166" />
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 25 KiB

502
img/c.svg Normal file
View File

@ -0,0 +1,502 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="1000"
height="50"
viewBox="0 0 264.58333 13.229167"
version="1.1"
id="svg5"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs
id="defs2">
<symbol
id="symbol9023">
<path
style="fill:#fafafa;fill-opacity:1;stroke:none;stroke-width:0.264583;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="m 0,7.6184998 1.201303,1.201303 1.201303,-1.201303 -0.017298,-0.1576054 -2.3853076,-0.058815 z"
id="path6933" />
<path
style="fill:#66991f;fill-opacity:1;stroke:none;stroke-width:0.264583;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="m 2.402606,7.6184998 1.201303,-1.201303 1.201303,1.201303 -0.017298,0.1576054 -2.3853076,0.058815 z"
id="path6933-3" />
</symbol>
</defs>
<g
id="g10886"
transform="matrix(0.99934047,-0.03631283,-0.03631283,-0.99934047,-3.5983112,19.407054)">
<rect
style="fill:#66991f;fill-opacity:1;stroke:none;stroke-width:0.735948;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none"
id="rect6514"
width="276.88617"
height="17.238796"
x="0"
y="7.6184998"
ry="0" />
<use
xlink:href="#symbol9023"
id="use9027"
x="0"
y="0"
width="100%"
height="100%" />
<use
xlink:href="#symbol9023"
id="use9027-3"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(4.805212)" />
<use
xlink:href="#symbol9023"
id="use9027-0"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(9.610424)" />
<use
xlink:href="#symbol9023"
id="use9027-7"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(14.415636)" />
<use
xlink:href="#symbol9023"
id="use9027-8"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(19.220848)" />
<use
xlink:href="#symbol9023"
id="use9027-3-6"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(24.02606)" />
<use
xlink:href="#symbol9023"
id="use9027-0-8"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(28.831272)" />
<use
xlink:href="#symbol9023"
id="use9027-7-8"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(33.636484)" />
<use
xlink:href="#symbol9023"
id="use9027-4"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(38.441696)" />
<use
xlink:href="#symbol9023"
id="use9027-3-3"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(43.246908)" />
<use
xlink:href="#symbol9023"
id="use9027-0-1"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(48.05212)" />
<use
xlink:href="#symbol9023"
id="use9027-7-4"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(52.857332)" />
<use
xlink:href="#symbol9023"
id="use9027-9"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(57.662544)" />
<use
xlink:href="#symbol9023"
id="use9027-3-2"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(62.467756)" />
<use
xlink:href="#symbol9023"
id="use9027-0-0"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(67.272968)" />
<use
xlink:href="#symbol9023"
id="use9027-7-6"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(72.07818)" />
<use
xlink:href="#symbol9023"
id="use9027-89"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(76.883392)" />
<use
xlink:href="#symbol9023"
id="use9027-3-26"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(81.688604)" />
<use
xlink:href="#symbol9023"
id="use9027-0-6"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(86.493816)" />
<use
xlink:href="#symbol9023"
id="use9027-7-49"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(91.299028)" />
<use
xlink:href="#symbol9023"
id="use9027-5"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(96.10424)" />
<use
xlink:href="#symbol9023"
id="use9027-3-0"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(100.90946)" />
<use
xlink:href="#symbol9023"
id="use9027-0-4"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(105.71467)" />
<use
xlink:href="#symbol9023"
id="use9027-7-87"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(110.51988)" />
<use
xlink:href="#symbol9023"
id="use9027-7-4-7"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(115.32509)" />
<use
xlink:href="#symbol9023"
id="use9027-9-7"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(120.1303)" />
<use
xlink:href="#symbol9023"
id="use9027-3-2-6"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(124.93551)" />
<use
xlink:href="#symbol9023"
id="use9027-0-0-7"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(129.74072)" />
<use
xlink:href="#symbol9023"
id="use9027-7-6-3"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(134.54594)" />
<use
xlink:href="#symbol9023"
id="use9027-89-6"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(139.35115)" />
<use
xlink:href="#symbol9023"
id="use9027-3-26-5"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(144.15636)" />
<use
xlink:href="#symbol9023"
id="use9027-0-6-6"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(148.96157)" />
<use
xlink:href="#symbol9023"
id="use9027-7-49-3"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(153.76678)" />
<use
xlink:href="#symbol9023"
id="use9027-5-9"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(158.57199)" />
<use
xlink:href="#symbol9023"
id="use9027-3-0-4"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(163.37721)" />
<use
xlink:href="#symbol9023"
id="use9027-0-4-8"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(168.18242)" />
<use
xlink:href="#symbol9023"
id="use9027-7-87-1"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(172.98763)" />
<use
xlink:href="#symbol9023"
id="use9027-7-4-2"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(177.79284)" />
<use
xlink:href="#symbol9023"
id="use9027-9-9"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(182.59805)" />
<use
xlink:href="#symbol9023"
id="use9027-3-2-3"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(187.40327)" />
<use
xlink:href="#symbol9023"
id="use9027-0-0-9"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(192.20848)" />
<use
xlink:href="#symbol9023"
id="use9027-7-6-0"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(197.01369)" />
<use
xlink:href="#symbol9023"
id="use9027-89-8"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(201.8189)" />
<use
xlink:href="#symbol9023"
id="use9027-3-26-8"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(206.62411)" />
<use
xlink:href="#symbol9023"
id="use9027-0-6-5"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(211.42933)" />
<use
xlink:href="#symbol9023"
id="use9027-7-49-0"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(216.23454)" />
<use
xlink:href="#symbol9023"
id="use9027-5-96"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(221.03975)" />
<use
xlink:href="#symbol9023"
id="use9027-3-0-3"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(225.84497)" />
<use
xlink:href="#symbol9023"
id="use9027-0-4-85"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(230.65018)" />
<use
xlink:href="#symbol9023"
id="use9027-7-87-6"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(235.45539)" />
<use
xlink:href="#symbol9023"
id="use9027-7-4-1"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(240.2606)" />
<use
xlink:href="#symbol9023"
id="use9027-9-1"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(245.06581)" />
<use
xlink:href="#symbol9023"
id="use9027-3-2-5"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(249.87103)" />
<use
xlink:href="#symbol9023"
id="use9027-0-0-98"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(254.67624)" />
<use
xlink:href="#symbol9023"
id="use9027-7-6-4"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(259.48145)" />
<use
xlink:href="#symbol9023"
id="use9027-89-81"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(264.28666)" />
<use
xlink:href="#symbol9023"
id="use9027-3-26-0"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(269.09187)" />
<use
xlink:href="#symbol9023"
id="use9027-0-6-3"
x="0"
y="0"
width="100%"
height="100%"
transform="translate(273.89709)" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 11 KiB

View File

@ -4,7 +4,7 @@
<!-- Basic Page Needs --> <!-- Basic Page Needs -->
<meta charset="utf-8"> <meta charset="utf-8">
<title>Brian Picciano - Freelance Developer</title> <title>Brian Picciano - Freelance Web Design and Development</title>
<meta name="author" content="Brian Picciano"> <meta name="author" content="Brian Picciano">
<!-- No favicon --> <!-- No favicon -->
@ -16,130 +16,123 @@
<!-- CSS --> <!-- CSS -->
<link rel="stylesheet" href="css/normalize.css"> <link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/skeleton.css"> <link rel="stylesheet" href="css/skeleton.css">
<link rel="stylesheet" href="css/main.css"> <link rel="stylesheet" href="css/main-index.css">
</head> </head>
<body> <body>
<div class="header"> <div class="container" style="margin-top: 5rem;">
<div class="selected tab">/index</div><!--
--><div class="tab"><a href="resume.html">/resume</a></div><!--
--><div class="tab"><a href="contact.html">/contact</a></div>
<div class="x">X</div>
</div>
<div class="container"> <p class="large">
Hello! I'm Brian Picciano, a freelance graphic designer and web
developer. My passion is creating <em>beautiful</em> websites that
<em>delight</em> their users.
</p>
<h1>Brian Picciano</h1> <p class="large">
<h2>Freelance Developer</h2> <a href="mailto:bgpicciano@gmail.com">Contact me</a>
if I can help you with...
</p>
<p> </div>
Hello! My name is <strong>Brian Picciano</strong>. I'm a full-stack
developer with a focus on designing <em>secure</em> and
<em>scalable</em> backends for web applications.
</p>
<p>
I have gained experience with an <em>extremely diverse</em> set of
languages, databases, and products over the last <em>ten years</em>,
and I'm always looking for more.
</p>
<p>
Remote work has been my life since 2015. No matter where in the
<em>world</em> your team is, I can work with them smoothly and
effectively over a variety of communication platforms.
</p>
<h2>What I Do</h2> <img class="sep" src="img/a.svg" />
<p> <div class="container-wrap design" style="padding: 5rem 0 2rem 0;"><div class="container">
I help you <em>solve your problems</em>, no matter what stage of
development you're at. <a href="contact.html">Contact me</a> if you
need someone to:
</p>
<ul>
<li>
Create a <em>development roadmap</em>, so your app can scale
globally starting from <em>now</em>.
</li>
<li>
Analyze or design your <em>system architecture</em> with an eye to
performance, scaling, security, and visibility.
</li>
<li>
Get down into the weeds to <em>debug</em> those pesky network and
operating system adjacent issues which eat so much dev time when
they show up.
</li>
<li>
Be the <em>one extra super-dev</em> you need to grind out that
crucial feature before deadline.
</li>
<li>
Try something new and different! I'm a quick learner and can
execute research spikes and MVPs for ideas that have yet to be
proven or even fully understood.
</li>
</ul>
<h2>What I've Done</h2> <div class="row">
<p> <div class="eight columns">
You can see a breakdown of all my past work at my <h2>Graphic Design</h2>
<a href="resume.html">resume</a> page. Feel free to <p>
<a href="contact.html">reach out to me</a> if you have any questions Design is expression, so we will work together to understand what
about my past work. exactly your brand and product express. The result will be a
</p> <em>vivid</em> and <em>sincere</em> reflection of your brand's
identity.
</p>
<p>
Offerings include logos, graphics, styleguides, and even full
website mockups.
</p>
</div>
<h2>Next Steps</h2> <div class="four columns">
&nbsp;
<p> </div>
Drop by my <a href="contact.html">contact</a> page to schedule a
<em>free</em>, 45 minute consultation. We will discuss your project,
what sort of assistance you need from me, and a timeline to get it
to you.
</p>
</div> </div>
<div class="footer"> </div></div>
<div class="scrollpos" id="scrollpos">---</div>
<img class="sep" src="img/b.svg" />
<div class="container-wrap develop"><div class="container">
<div class="row">
<div class="four columns">
&nbsp;
</div>
<div class="eight columns">
<h2>Web Development</h2>
<p>
With over 10+ years experience on the web, I can pretty much build
anything. Whether you need a brand new site, a complete overhaul,
or minor adjustments to an existing site, you can count on me.
</p>
<p>
Where other developers might work with bulky frameworks which
result in a frustrating user experience, I will get down in the
weeds to craft your site by hand. The result is code which is
lightweight, fast, and responsive for all of your users, not just
those with the latest hardware.
</p>
</div>
</div> </div>
<script> </div></div>
function getScrollPct() { <img class="sep" src="img/c.svg" />
const heightOfWindow = window.innerHeight, <div class="container">
contentScrolled = window.pageYOffset,
bodyHeight = document.body.offsetHeight;
if(bodyHeight - contentScrolled <= heightOfWindow) { <h1 class="neutral" style="text-align: center; padding: 2rem 0 4rem 0;">
Next Steps
</h1>
return "Bot"; <div class="row">
} else if (contentScrolled == 0) { <div class="six columns" style="text-align: center;">
<a href="mailto:bgpicciano@gmail.com">
<button class="button-primary">Contact me!</button></a>
</div>
return "Top"; <div class="six columns">
<p>
I work remotely and can adapt to any timezone constraints you may
have. So hit the big button and we'll get started right away!
</p>
<p>
During our initial, free, 45-minute consultation, we will discuss
the work you'd like done, timelines on both of our ends, and
compensation. If we choose to continue then work will begin
promptly, with weekly progress reports from me so you can give
feedback as necessary.
</p>
<p>
Thank you for your time, and I look forward to hearing from you.
</p>
- Brian Picciano
<p>
</p>
</div>
} else { </div>
const total = bodyHeight - heightOfWindow, </div>
got = contentScrolled,
percent = parseInt((got/total) * 100);
return percent + "%"
}
}
const scrollposEl = document.getElementById("scrollpos");
scrollposEl.textContent = getScrollPct();
window.addEventListener("scroll", (event) => {
scrollposEl.textContent = getScrollPct();
});
</script>
</body> </body>
</html> </html>