separate home, about, select nav item

about.py

@@ -3,29 +3,10 @@ from datetime import datetime
 
 
 def page():
-    # me = Image('https://live.staticflickr.com/65535/53939742438_6ca1a4b3eb.jpg', alt='Nicholas Broad and his dog, Maya in Maine', caption="it'sa me", left=False, width=300)
-    h2s = 'Hi there 👋', 'Work Experience', "Education", "Volunteering",'Hobbies'
-    txts = [Markdown(intro), Markdown(work), Markdown(education), Markdown(volunteering), Markdown(hobbies)]
+    h2s = 'Work Experience', "Education", "Volunteering",'Hobbies'
+    txts = [Markdown(work), Markdown(education), Markdown(volunteering), Markdown(hobbies)]
     secs = Sections(h2s, txts)
-    return BstPage(0, "", *secs)
-
-birthdate = datetime(1994, 3, 18)
-age_in_years = (datetime.now() - birthdate).days // 365
-
-maya_birthdate = datetime(2019, 3, 18)
-maya_age_in_years = (datetime.now() - maya_birthdate).days // 365
-
-intro = f"""
-<div class="row">
-<div class="col-md-7">
-
-I'm Nicholas Broad. I'm currently {age_in_years} years old, living in San Francisco, California. I'm an open-minded, curious, and self-motivated person who enjoys learning new things and working on interesting projects. I like to think of myself as friendly, humble, and a bit goofy. I live with my beautiful dog, <a href="https://www.flickr.com/photos/131470140@N06/albums/72177720295849325/">Maya</a>, who is {maya_age_in_years} years old. You can often find us at parks in SF playing fetch. Maya will almost always be wearing a bandana, as all dogs should.
-</div>
-<div class="col-md-4">
-<a data-flickr-embed="true" href="https://www.flickr.com/photos/131470140@N06/53939742438/in/album-72177720300307682/" title="Nico and Maya"><img src="https://live.staticflickr.com/65535/53939742438_6ca1a4b3eb.jpg" width="333" height="500" alt="Nico and Maya" class="img-fluid rounded"/></a><script async src="//embedr.flickr.com/assets/client-code.js" charset="utf-8"></script>
-</div>
-</div>
-"""
+    return BstPage(1, "", *secs)
 
 hf_start_date = datetime(2021, 12, 6)
 time_at_hf = (datetime.now() - hf_start_date)

app.py

@@ -13,7 +13,7 @@ fh_url = "https://fastht.ml/"
 fh_logo = 'assets/fasthtml_logo.svg'
 
 def BstPage(selidx, title, *c):
-    navitems = [('Home', '/'), ('Blog', '/blog')]
+    navitems = [('Home', '/'), ('About', '/about'), ('Blog', '/blog')]
     
     ra_items = (
         A(Image(src="/assets/hf-logo.svg", width=28, height=28, cls="my-0 px-0 mx-0 py-0", left=False, pad=0), cls="ms-2 my-0 px-1 btn-lg btn", role="button", href="https://hf.co/nbroad"), 

blog.py

@@ -12,7 +12,7 @@ NUM_RECENT_BLOGS = 20
 def full_page():
 
     secs = Sections(["Recent Blogs"], [Div(*[blog_preview(blog_id) for blog_id in sorted_blogs[:NUM_RECENT_BLOGS]])])
-    return BstPage(0, '', *secs)
+    return BstPage(2, '', *secs)
 
 
 def blog_preview(blog_id):

main.py

@@ -1,5 +1,5 @@
 from fh_bootstrap import *
-import about, blog
+import about, blog, home
 
 hdrs = (
     Link(href='/assets/hl-styles.css', rel='stylesheet'),
@@ -10,7 +10,8 @@ hdrs = (
 
 app,rt = fast_app(pico=False, hdrs=bst_hdrs+hdrs, live=False)
 
-app.get('/')(about.page)
+app.get('/')(home.page)
+app.get('/about')(about.page)
 app.get('/blog')(blog.full_page)
 
 @rt("/blog/{blog_id}")