Using Web Components
What does it take to use web components? Trying Google’s Lit .
Dated Apr 18, 2024; last modified on Thu, 18 Apr 2024
What does it take to use web components? Trying Google’s Lit .
Random Link ¯\_(ツ)_/¯ | ||
Apr 18, 2024 | » | Wiki Page
2 min; updated Apr 18, 2024
Overview Starting with this page because it’s mostly static. The body is basically: <div class="topnav">...</div> <div id="main_div"> <div id="study_buddy_details"> <div class="details_section">...</div> <div class="details_section">...</div> ... <div class="details_section">...</div> </div> </div> <footer>...</footer> The corresponding web components would be something along the lines of: <nav-bar></nav-bar> <wiki-container> {Table of Contents} <wiki-section></wiki-section> <wiki-section></wiki-section> </wiki-container> <wiki-container> Maybe <wiki-section> can be a template owned by <wiki-container>? Nah, there are benefits to a separate <wiki-section> component, e.g., each component can define its title for use in the ToC.... |
Apr 19, 2024 | » | App Layout
1 min; updated Apr 19, 2024
Is there a use-case for the container that lays out the various app elements? When considering a <nav-bar> , the conclusion was that a web component wasn’t necessary. Possible Organization The high-level picture is: <body> <nav> <div id="topnav-banner">...</div> <ul id="topnav-items">...</ul> </nav> <div id="main_div">...</div> <footer>...</footer> </body> We should move #topnav-banner out of the <nav> so that we can potentially apply lateral spacing to #topnav-items and #main_div without it applying to #topnav-banner.... |