├── .gitignore
├── static
    ├── css
    │   ├── footer.css
    │   ├── animate.css
    │   ├── header.css
    │   ├── main.css
    │   └── index.css
    ├── img
    │   ├── portfolio.png
    │   └── texture.svg
    └── js
    │   └── index.js
├── go.mod
├── main.go
├── templates
    └── index.html
└── go.sum


/.gitignore:
--------------------------------------------------------------------------------
1 | tmp


--------------------------------------------------------------------------------
/static/css/footer.css:
--------------------------------------------------------------------------------
1 | 
2 | footer {
3 |   grid-area:footer;
4 |   text-align: center;
5 |   padding: 1em;
6 | }


--------------------------------------------------------------------------------
/static/img/portfolio.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Phillip-England/landing-page/main/static/img/portfolio.png


--------------------------------------------------------------------------------
/static/css/animate.css:
--------------------------------------------------------------------------------
 1 | @keyframes wave {
 2 |   0% { transform: rotate(0deg); }
 3 |   25% { transform: rotate(-10deg); }
 4 |   50% { transform: rotate(10deg); }
 5 |   75% { transform: rotate(-10deg); }
 6 |   100% { transform: rotate(0deg); }
 7 | }
 8 | 
 9 | @keyframes glow {
10 |   0% {
11 |     box-shadow: 0 0 5px red;
12 |   }
13 |   50% {
14 |     box-shadow: 0 0 20px red;
15 |   }
16 |   100% {
17 |     box-shadow: 0 0 5px red;
18 |   }
19 | }
20 | 


--------------------------------------------------------------------------------
/static/js/index.js:
--------------------------------------------------------------------------------
 1 | class ActiveLink extends HTMLElement {
 2 |   constructor() {
 3 |     super();
 4 |     this.path = window.location.pathname
 5 |     this.href = this.getAttribute('href')
 6 |     if (this.path == this.href) {
 7 |       this.setAttribute('active', 'true')
 8 |     } else {
 9 |       this.setAttribute('active', 'false')
10 |     }
11 |     this.addEventListener('click', () => {
12 |       window.location = this.href
13 |     })
14 |   }
15 | }
16 | 
17 | customElements.define('active-link', ActiveLink);


--------------------------------------------------------------------------------
/go.mod:
--------------------------------------------------------------------------------
 1 | module github.com/Phillip-England/landing-page
 2 | 
 3 | go 1.23.3
 4 | 
 5 | require (
 6 | 	github.com/Phillip-England/vbf v0.1.0 // indirect
 7 | 	github.com/PuerkitoBio/goquery v1.8.1 // indirect
 8 | 	github.com/a-h/templ v0.2.771 // indirect
 9 | 	github.com/alecthomas/chroma/v2 v2.14.0 // indirect
10 | 	github.com/andybalholm/cascadia v1.3.1 // indirect
11 | 	github.com/dlclark/regexp2 v1.11.0 // indirect
12 | 	github.com/yuin/goldmark v1.7.4 // indirect
13 | 	github.com/yuin/goldmark-highlighting/v2 v2.0.0-20230729083705-37449abec8cc // indirect
14 | 	golang.org/x/net v0.28.0 // indirect
15 | )
16 | 


--------------------------------------------------------------------------------
/static/css/header.css:
--------------------------------------------------------------------------------
 1 | 
 2 | header {
 3 |   grid-area: header;
 4 |   display: grid;
 5 |   grid-template-columns:auto;
 6 |   grid-template-areas:
 7 |     "img nav"
 8 |   ;
 9 | }
10 | 
11 | header img {
12 |   grid-area:img;
13 |   border-radius: 100%;
14 |   padding:1rem;
15 |   width: fit-content;
16 | }
17 | 
18 | header nav {
19 |   grid-area: nav;
20 |   display:grid;
21 |   align-items:center;
22 |   justify-content: end;
23 | }
24 | 
25 | header nav ul {
26 |   display:flex;
27 |   flex-direction: row;
28 |   list-style: none;
29 |   gap:2em;
30 | }
31 | 
32 | header nav ul active-link {
33 |   font-size:1.2em;
34 |   user-select: none;
35 |   cursor: pointer;
36 | }
37 | 
38 | header nav ul active-link[active='true'] {
39 |   border-bottom: solid red 4px;
40 | }
41 | 
42 | 


--------------------------------------------------------------------------------
/main.go:
--------------------------------------------------------------------------------
 1 | package main
 2 | 
 3 | import (
 4 | 	"html/template"
 5 | 	"net/http"
 6 | 
 7 | 	"github.com/Phillip-England/vbf"
 8 | )
 9 | 
10 | const KEY_TEMPLATES = "TEMPLATES"
11 | 
12 | func main() {
13 | 
14 | 	mux, gCtx := vbf.VeryBestFramework()
15 | 
16 | 	templates, err := vbf.ParseTemplates("./templates", nil)
17 | 	if err != nil {
18 | 		panic(err)
19 | 	}
20 | 	vbf.SetGlobalContext(gCtx, KEY_TEMPLATES, templates)
21 | 
22 | 	vbf.HandleStaticFiles(mux)
23 | 	vbf.HandleFavicon(mux)
24 | 
25 | 	vbf.AddRoute("GET /", mux, gCtx, func(w http.ResponseWriter, r *http.Request) {
26 | 		templates, _ := vbf.GetContext(KEY_TEMPLATES, r).(*template.Template)
27 | 		vbf.ExecuteTemplate(w, templates, "index.html", nil)
28 | 	}, vbf.MwLogger)
29 | 
30 | 	err = vbf.Serve(mux, "8080")
31 | 	if err != nil {
32 | 		panic(err)
33 | 	}
34 | 
35 | }
36 | 


--------------------------------------------------------------------------------
/static/css/main.css:
--------------------------------------------------------------------------------
 1 | 
 2 | main {
 3 |   display: flex;
 4 |   justify-content: center;
 5 |   align-items: center;
 6 |   flex-direction: column;
 7 |   gap: 2rem;
 8 |   grid-area:main;
 9 | }
10 | 
11 | main section {
12 |   padding-bottom: 15em;
13 |   display: flex;
14 |   align-items: center;
15 |   flex-direction: column;
16 |   gap:2rem;
17 | }
18 | 
19 | main h1 {
20 |   font-size: 2.5rem;
21 |   text-align: center;
22 | }
23 | 
24 | 
25 | main a {
26 |   background-color: red;
27 |   color: white;
28 |   padding: 0.5rem 1rem;
29 |   border-radius: 5px;
30 |   font-size: 1.5rem;
31 |   text-decoration: none;
32 |   display: inline-block;
33 |   animation: glow 1.5s infinite alternate ease-in-out;
34 |   cursor: pointer;
35 |   user-select: none;
36 |   
37 | }
38 | 
39 | main section span.hand {
40 |   display: inline-block; 
41 |   font-size: 2rem;
42 |   transform-origin: bottom center; 
43 |   animation: wave 1.5s ease-in-out infinite;
44 |   /* padding-right: 0.5em; */
45 | }


--------------------------------------------------------------------------------
/templates/index.html:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE html>
 2 | <html lang="en">
 3 | <head>
 4 |   <meta charset="UTF-8">
 5 |   <meta name="viewport" content="width=device-width, initial-scale=1.0">
 6 |   <link rel="stylesheet" href="/static/css/index.css"/>
 7 |   <title>Phillip England - Software Developer</title>
 8 | </head>
 9 | <body>
10 | 
11 |   <div id="root">
12 | 
13 |     <header>
14 |       <img src="/static/img/portfolio.png" height="70" width="70"/>
15 |       <nav>
16 |         <ul>
17 |           <li>
18 |             <active-link href="/">Home</active-link>
19 |           </li>
20 |           <li>
21 |             <active-link href="/about">About</active-link>
22 |           </li>
23 |           <li>
24 |             <active-link href="/projects">Projects</active-link>
25 |           </li>
26 |         </ul>
27 |       </nav>
28 |     </header>
29 | 
30 |     <main>
31 | 
32 |       <section>
33 |         <div>
34 |           <h1><span class="hand">👋</span>Hi! I'm Phillip England,</h1>
35 |           <h1>nice to meet you!</h1>
36 |         </div>
37 |         <a href="/about">Yes, I'm Hirable!</a>
38 |       </section>
39 | 
40 | 
41 |     </main>
42 | 
43 |     <footer>Built with ❤️ using HTML, CSS, and JS</footer>
44 | 
45 |     <script src="/static/js/index.js"></script>
46 |   </div>
47 |   
48 | </body>
49 | </html>


--------------------------------------------------------------------------------
/static/img/texture.svg:
--------------------------------------------------------------------------------
1 | <svg version="1.1" viewBox="0.0 0.0 100.0 100.0" fill="none" stroke="none" stroke-linecap="square" stroke-miterlimit="10" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg"><clipPath id="p.0"><path d="m0 0l100.0 0l0 100.0l-100.0 0l0 -100.0z" clip-rule="nonzero"/></clipPath><g clip-path="url(#p.0)"><path fill="#000000" fill-opacity="0.0" d="m0 0l100.0 0l0 100.0l-100.0 0z" fill-rule="evenodd"/><path fill="#d9d9d9" d="m3.8976378 7.1889763l0 0c0 -1.6699004 1.4171772 -3.023622 3.1653543 -3.023622l0 0c0.83950424 0 1.6446247 0.31855917 2.238243 0.88559866c0.59361935 0.567039 0.9271116 1.3361092 0.9271116 2.1380234l0 0c0 1.6699009 -1.4171782 3.0236225 -3.1653547 3.0236225l0 0c-1.748177 0 -3.1653543 -1.3537216 -3.1653543 -3.0236225z" fill-rule="evenodd"/><path fill="#cccccc" d="m46.834644 50.0l0 0c0 -1.669899 1.4171791 -3.0236206 3.1653557 -3.0236206l0 0c0.83950424 0 1.6446228 0.31855774 2.238243 0.8855972c0.5936203 0.5670395 0.9271126 1.3361092 0.9271126 2.1380234l0 0c0 1.669899 -1.4171791 3.0236206 -3.1653557 3.0236206l0 0c-1.7481766 0 -3.1653557 -1.3537216 -3.1653557 -3.0236206z" fill-rule="evenodd"/><path fill="#cccccc" d="m90.52493 93.28609l0 0c0 -1.669899 1.4171753 -3.0236206 3.1653595 -3.0236206l0 0c0.8395004 0 1.6446228 0.31855774 2.238243 0.8855972c0.5936127 0.5670395 0.92710876 1.336113 0.92710876 2.1380234l0 0c0 1.669899 -1.4171753 3.0236206 -3.1653519 3.0236206l0 0c-1.7481842 0 -3.1653595 -1.3537216 -3.1653595 -3.0236206z" fill-rule="evenodd"/></g></svg>


--------------------------------------------------------------------------------
/static/css/index.css:
--------------------------------------------------------------------------------
 1 | @import './header.css';
 2 | @import './main.css';
 3 | @import './animate.css';
 4 | @import './footer.css';
 5 | @import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
 6 | 
 7 | :root {
 8 |   --c-black:#111111;
 9 |   --c-white:#eeeeee;
10 | }
11 | 
12 | 
13 | * {
14 |   margin: 0;
15 |   padding: 0;
16 | }
17 | 
18 | html, body {
19 |   box-sizing: border-box;
20 |   width: 100%;
21 |   height: 100%;
22 |   min-height: max-content;
23 |   font-family: "Roboto", sans-serif;
24 |   background-color: var(--c-white);
25 |   color:var(--c-black);
26 |   
27 | }
28 | 
29 | body {
30 | }
31 | 
32 | #root {
33 |   background-image: url('/static/img/texture.svg');
34 |   background-repeat: repeat;
35 |   background-size: auto 10px;
36 |   background-color: var(--c-white);
37 |   display: grid;
38 |   height: 100%;
39 |   grid-template-rows: auto 1fr auto;
40 |   grid-template-columns: 5% 90% 5%;
41 |   grid-template-areas:
42 |     ". header ."
43 |     ". main ."
44 |     ". footer ."
45 |   ;
46 | }
47 | 
48 | @media screen and (min-width: 500px) {
49 |   #root {
50 |     grid-template-columns: 5% 90% 5%;
51 |     grid-template-areas:
52 |       ". header ."
53 |       ". main ."
54 |       ". footer ."
55 |     ;
56 |   }
57 | }
58 | 
59 | @media screen and (min-width: 768px) {
60 |   #root {
61 |     grid-template-columns: 10% 80% 10%;
62 |     grid-template-areas:
63 |       ". header ."
64 |       ". main ."
65 |       ". footer ."
66 |     ;
67 |   }
68 | }
69 | 
70 | @media screen and (min-width: 1200px) {
71 |   #root {
72 |     grid-template-columns: 15% 70% 15%;
73 |     grid-template-areas:
74 |       ". header ."
75 |       ". main ."
76 |       ". footer ."
77 |     ;
78 |   }
79 | }
80 | 


--------------------------------------------------------------------------------
/go.sum:
--------------------------------------------------------------------------------
 1 | github.com/Phillip-England/vbf v0.1.0 h1:wIJUpKGVqwaYpS4k3Ruq3TETVEkK9PISTaTx5TXkjXs=
 2 | github.com/Phillip-England/vbf v0.1.0/go.mod h1:hqZAzPU2+uEvab2BEcCHiB0cMQaXBTyXKDOSeTqi3co=
 3 | github.com/PuerkitoBio/goquery v1.8.1 h1:uQxhNlArOIdbrH1tr0UXwdVFgDcZDrZVdcpygAcwmWM=
 4 | github.com/PuerkitoBio/goquery v1.8.1/go.mod h1:Q8ICL1kNUJ2sXGoAhPGUdYDJvgQgHzJsnnd3H7Ho5jQ=
 5 | github.com/a-h/templ v0.2.771 h1:4KH5ykNigYGGpCe0fRJ7/hzwz72k3qFqIiiLLJskbSo=
 6 | github.com/a-h/templ v0.2.771/go.mod h1:lq48JXoUvuQrU0VThrK31yFwdRjTCnIE5bcPCM9IP1w=
 7 | github.com/alecthomas/chroma/v2 v2.2.0/go.mod h1:vf4zrexSH54oEjJ7EdB65tGNHmH3pGZmVkgTP5RHvAs=
 8 | github.com/alecthomas/chroma/v2 v2.14.0 h1:R3+wzpnUArGcQz7fCETQBzO5n9IMNi13iIs46aU4V9E=
 9 | github.com/alecthomas/chroma/v2 v2.14.0/go.mod h1:QolEbTfmUHIMVpBqxeDnNBj2uoeI4EbYP4i6n68SG4I=
10 | github.com/alecthomas/repr v0.0.0-20220113201626-b1b626ac65ae/go.mod h1:2kn6fqh/zIyPLmm3ugklbEi5hg5wS435eygvNfaDQL8=
11 | github.com/andybalholm/cascadia v1.3.1 h1:nhxRkql1kdYCc8Snf7D5/D3spOX+dBgjA6u8x004T2c=
12 | github.com/andybalholm/cascadia v1.3.1/go.mod h1:R4bJ1UQfqADjvDa4P6HZHLh/3OxWWEqc0Sk8XGwHqvA=
13 | github.com/davecgh/go-spew v1.1.0/go.mod h1:J7Y8YcW2NihsgmVo/mv3lAwl/skON4iLHjSsI+c5H38=
14 | github.com/davecgh/go-spew v1.1.1/go.mod h1:J7Y8YcW2NihsgmVo/mv3lAwl/skON4iLHjSsI+c5H38=
15 | github.com/dlclark/regexp2 v1.4.0/go.mod h1:2pZnwuY/m+8K6iRw6wQdMtk+rH5tNGR1i55kozfMjCc=
16 | github.com/dlclark/regexp2 v1.7.0/go.mod h1:DHkYz0B9wPfa6wondMfaivmHpzrQ3v9q8cnmRbL6yW8=
17 | github.com/dlclark/regexp2 v1.11.0 h1:G/nrcoOa7ZXlpoa/91N3X7mM3r8eIlMBBJZvsz/mxKI=
18 | github.com/dlclark/regexp2 v1.11.0/go.mod h1:DHkYz0B9wPfa6wondMfaivmHpzrQ3v9q8cnmRbL6yW8=
19 | github.com/pmezard/go-difflib v1.0.0/go.mod h1:iKH77koFhYxTK1pcRnkKkqfTogsbg7gZNVY4sRDYZ/4=
20 | github.com/stretchr/objx v0.1.0/go.mod h1:HFkY916IF+rwdDfMAkV7OtwuqBVzrE8GR6GFx+wExME=
21 | github.com/stretchr/testify v1.7.0/go.mod h1:6Fq8oRcR53rry900zMqJjRRixrwX3KX962/h/Wwjteg=
22 | github.com/yuin/goldmark v1.4.13/go.mod h1:6yULJ656Px+3vBD8DxQVa3kxgyrAnzto9xy5taEt/CY=
23 | github.com/yuin/goldmark v1.4.15/go.mod h1:6yULJ656Px+3vBD8DxQVa3kxgyrAnzto9xy5taEt/CY=
24 | github.com/yuin/goldmark v1.7.4 h1:BDXOHExt+A7gwPCJgPIIq7ENvceR7we7rOS9TNoLZeg=
25 | github.com/yuin/goldmark v1.7.4/go.mod h1:uzxRWxtg69N339t3louHJ7+O03ezfj6PlliRlaOzY1E=
26 | github.com/yuin/goldmark-highlighting/v2 v2.0.0-20230729083705-37449abec8cc h1:+IAOyRda+RLrxa1WC7umKOZRsGq4QrFFMYApOeHzQwQ=
27 | github.com/yuin/goldmark-highlighting/v2 v2.0.0-20230729083705-37449abec8cc/go.mod h1:ovIvrum6DQJA4QsJSovrkC4saKHQVs7TvcaeO8AIl5I=
28 | golang.org/x/crypto v0.0.0-20190308221718-c2843e01d9a2/go.mod h1:djNgcEr1/C05ACkg1iLfiJU5Ep61QUkGW8qpdssI0+w=
29 | golang.org/x/crypto v0.0.0-20210921155107-089bfa567519/go.mod h1:GvvjBRRGRdwPK5ydBHafDWAxML/pGHZbMvKqRZ5+Abc=
30 | golang.org/x/mod v0.6.0-dev.0.20220419223038-86c51ed26bb4/go.mod h1:jJ57K6gSWd91VN4djpZkiMVwK6gcyfeH4XE8wZrZaV4=
31 | golang.org/x/net v0.0.0-20190620200207-3b0461eec859/go.mod h1:z5CRVTTTmAJ677TzLLGU+0bjPO0LkuOLi4/5GtJWs/s=
32 | golang.org/x/net v0.0.0-20210226172049-e18ecbb05110/go.mod h1:m0MpNAwzfU5UDzcl9v0D8zg8gWTRqZa9RBIspLL5mdg=
33 | golang.org/x/net v0.0.0-20210916014120-12bc252f5db8/go.mod h1:9nx3DQGgdP8bBQD5qxJ1jj9UTztislL4KSBs9R2vV5Y=
34 | golang.org/x/net v0.0.0-20220722155237-a158d28d115b/go.mod h1:XRhObCWvk6IyKnWLug+ECip1KBveYUHfp+8e9klMJ9c=
35 | golang.org/x/net v0.7.0/go.mod h1:2Tu9+aMcznHK/AK1HMvgo6xiTLG5rD5rZLDS+rp2Bjs=
36 | golang.org/x/net v0.28.0 h1:a9JDOJc5GMUJ0+UDqmLT86WiEy7iWyIhz8gz8E4e5hE=
37 | golang.org/x/net v0.28.0/go.mod h1:yqtgsTWOOnlGLG9GFRrK3++bGOUEkNBoHZc8MEDWPNg=
38 | golang.org/x/sync v0.0.0-20190423024810-112230192c58/go.mod h1:RxMgew5VJxzue5/jJTE5uejpjVlOe/izrB70Jof72aM=
39 | golang.org/x/sync v0.0.0-20220722155255-886fb9371eb4/go.mod h1:RxMgew5VJxzue5/jJTE5uejpjVlOe/izrB70Jof72aM=
40 | golang.org/x/sys v0.0.0-20190215142949-d0b11bdaac8a/go.mod h1:STP8DvDyc/dI5b8T5hshtkjS+E42TnysNCUPdjciGhY=
41 | golang.org/x/sys v0.0.0-20201119102817-f84b799fce68/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs=
42 | golang.org/x/sys v0.0.0-20210423082822-04245dca01da/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs=
43 | golang.org/x/sys v0.0.0-20210615035016-665e8c7367d1/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
44 | golang.org/x/sys v0.0.0-20220520151302-bc2c85ada10a/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
45 | golang.org/x/sys v0.0.0-20220722155257-8c9f86f7a55f/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
46 | golang.org/x/sys v0.5.0/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
47 | golang.org/x/term v0.0.0-20201126162022-7de9c90e9dd1/go.mod h1:bj7SfCRtBDWHUb9snDiAeCFNEtKQo2Wmx5Cou7ajbmo=
48 | golang.org/x/term v0.0.0-20210927222741-03fcf44c2211/go.mod h1:jbD1KX2456YbFQfuXm/mYQcufACuNUgVhRMnK/tPxf8=
49 | golang.org/x/term v0.5.0/go.mod h1:jMB1sMXY+tzblOD4FWmEbocvup2/aLOaQEp7JmGp78k=
50 | golang.org/x/text v0.3.0/go.mod h1:NqM8EUOU14njkJ3fqMW+pc6Ldnwhi/IjpwHt7yyuwOQ=
51 | golang.org/x/text v0.3.3/go.mod h1:5Zoc/QRtKVWzQhOtBMvqHzDpF6irO9z98xDceosuGiQ=
52 | golang.org/x/text v0.3.6/go.mod h1:5Zoc/QRtKVWzQhOtBMvqHzDpF6irO9z98xDceosuGiQ=
53 | golang.org/x/text v0.3.7/go.mod h1:u+2+/6zg+i71rQMx5EYifcz6MCKuco9NR6JIITiCfzQ=
54 | golang.org/x/text v0.7.0/go.mod h1:mrYo+phRRbMaCq/xk9113O4dZlRixOauAjOtrjsXDZ8=
55 | golang.org/x/tools v0.0.0-20180917221912-90fa682c2a6e/go.mod h1:n7NCudcB/nEzxVGmLbDWY5pfWTLqBcC2KZ6jyYvM4mQ=
56 | golang.org/x/tools v0.0.0-20191119224855-298f0cb1881e/go.mod h1:b+2E5dAYhXwXZwtnZ6UAqBI28+e2cm9otk0dWdXHAEo=
57 | golang.org/x/tools v0.1.12/go.mod h1:hNGJHUnrk76NpqgfD5Aqm5Crs+Hm0VOH/i9J2+nxYbc=
58 | golang.org/x/xerrors v0.0.0-20190717185122-a985d3407aa7/go.mod h1:I/5z698sn9Ka8TeJc9MKroUUfqBBauWjQqLJ2OPfmY0=
59 | gopkg.in/check.v1 v0.0.0-20161208181325-20d25e280405/go.mod h1:Co6ibVJAznAaIkqp8huTwlJQCZ016jof/cbN4VW5Yz0=
60 | gopkg.in/yaml.v3 v3.0.0-20200313102051-9f266ea9e77c/go.mod h1:K4uyk7z7BCEPqu6E+C64Yfv1cQ7kz7rIZviUmN+EgEM=
61 | 


--------------------------------------------------------------------------------