make headers selective

components/ContentLayout.js

@@ -6,6 +6,19 @@ import Head from "next/head";
 import styled from "styled-components";
 
 const Style = styled.div`
+  h4,
+  h3 {
+    text-align: center;
+    font-weight: bold;
+  }
+  width: 55vw;
+  margin: auto;
+  @media only screen and (max-width: 768px) {
+    width: 80vw;
+  }
+`;
+
+const StyleUnderline = styled.div`
   h3 {
     font-weight: bold;
     text-decoration: underline;
@@ -55,9 +68,15 @@ const ContentLayout = ({ meta, children }) => {
         <Header title={meta?.title} subtitle={meta?.subtitle} />
       )}
       <div className="desktop-flex-row bolded-color-div">
-        <Style>
-          <MDXProvider>{children}</MDXProvider>
-        </Style>
+        {meta?.underline ? (
+          <StyleUnderline>
+            <MDXProvider>{children}</MDXProvider>
+          </StyleUnderline>
+        ) : (
+          <Style>
+            <MDXProvider>{children}</MDXProvider>
+          </Style>
+        )}
         <TableOfContents />
       </div>
     </>

pages/bioinformatics.mdx

@@ -5,6 +5,7 @@ import Link from "../components/Link.js";
 export const meta = {
   title: "Bioinformatics",
   subtitle: "",
+    underline: true,
 };
 
 <div className="padded-content">

pages/contribution.mdx

@@ -6,6 +6,7 @@ import Link from "../components/Link.js";
 export const meta = {
   title: "Contribution",
   subtitle: "",
+  underline: true,
 };
 
 export const Page = ({ children }) => (

pages/description.mdx

@@ -19,7 +19,7 @@ reality faced by the pharmaceutical industry in the recent years of the
 COVID-19 pandemic. As of September 2023, approximately 13.5 million
 vaccines have been administered globally as reported by the WHO[^1].
 
-#### What if this scale of biomanufactured vaccines was applied to other pharmaceuticals and biologics?
+### What if this scale of biomanufactured vaccines was applied to other pharmaceuticals and biologics?
 
 Our team was inspired by seeing the scale that a bio production process
 can achieve, and have set our sights on integrating a highly scalable
@@ -55,7 +55,7 @@ demand for resources in developing biologics has patients and health
 care professionals calling for the ease of developability of these life
 saving therapeutics.**
 
-#### Adapting biomanufacturing to synthetic biology systems
+### Adapting biomanufacturing to synthetic biology systems
 
 While there is no shortage of innovation for biologics, our team this
 year is focusing on tackling the **biologics production process as the
@@ -101,7 +101,7 @@ resources on a global scale, there is an urgent need to develop
 sustainable and low-waste methods for expressing and purifying proteins
 efficiently and rapidly.
 
-## The problem with current platforms
+### The problem with current platforms
 
 Synthetic biology technologies have emerged to eliminate such barriers
 to whole cell protein production _in vitro_ by harnessing cell free
@@ -147,7 +147,7 @@ has engineered new foundational advance approaches to underpin the CFPS
 approach and combine protein biosynthesis, purification, and preliminary
 validation into one harmonious process.
 
-#### How can we merge intrinsic genetic tools with CFPS?
+### How can we merge intrinsic genetic tools with CFPS?
 
 While CFPS is not a newcomer to foundational advanced biomanufacturing
 platforms, our team hopes to highlight the magnitudes of difference in

pages/design.mdx

@@ -5,6 +5,7 @@ import Pillars from "@/components/description/Pillars";
 export const meta = {
   title: "Design",
   subtitle: "",
+  underline: true,
 };
 
 export const Page = ({ children }) => (
@@ -145,15 +146,15 @@ CFPS preparations. Among such bacteria, the Gram-negative
 γ-proteobacterium _Vibrio natriegens_ (VN) represents a promising
 candidate that possesses remarkably high growth and substrate
 consumption rates[^7][^8][^9]. A natural halophile, _V. nats_ exhibits
-**60% greater ribosome density** relative to *E. coli* and doubles in half
-the time of *E. coli*[^10]. The extremely high quantity of ribosomes from
+**60% greater ribosome density** relative to _E. coli_ and doubles in half
+the time of _E. coli_[^10]. The extremely high quantity of ribosomes from
 _V. nats_ cell lysates allows **high-throughput protein synthesis**,
 especially in techniques such as ribosome display, where the limiting
 factor in library size is the number of ribosomes.
 
-_V. nats_ also has many advantages over *E. coli* in terms of CFPS
+_V. nats_ also has many advantages over _E. coli_ in terms of CFPS
 preparation; _V. nats_ cultures can be grown to stationary phase for
-optimal cell lysate quality while *E. coli* cell lysate must be harvested
+optimal cell lysate quality while _E. coli_ cell lysate must be harvested
 at early exponential phase, limiting lysate yields per litre of culture
 [^11]. Its halophilic nature allows it to grow comfortably in saltwater,
 reducing freshwater demands, while also providing the benefit of
@@ -166,7 +167,7 @@ With the extensive support provided by UBC Biofoundry, we obtained a
 strain of _Vibrio natriegens_ Vmax. Using this strain and plasmids under
 the control of a T7 promoter, protein yields are over 25-fold higher
 than those achieved using commercial strains and more than 10-fold
-higher than those achieved using *E. coli*[^12].
+higher than those achieved using _E. coli_[^12].
 
 ### Energy Usage Efficiency
 
@@ -264,7 +265,7 @@ IPTG mimics the structure of allolactose and thus binds to the lac
 repressor thereby preventing from inhibiting reporter gene expression.
 It is well studied and shown that expression of recombinant proteins
 under the control of this promoter is 8 times faster than protein
-expression under the control of the *E. coli* RNA polymerase[^21].
+expression under the control of the _E. coli_ RNA polymerase[^21].
 
 ### Expression Vector
 
@@ -603,7 +604,7 @@ out.
 
 [^1]:
     Markets & Markets (2022). Protein expression market by type
-    (*E. coli*, Mammalian, CHO, HEK 293, Insect, Pichia, Cell-free), Products
+    (_E. coli_, Mammalian, CHO, HEK 293, Insect, Pichia, Cell-free), Products
     (Reagents, Vectors, Competent Cells, Instruments, Service), Application
     (Therapeutic, Industrial), End User & Region - Global Forecast to 2027.
     https://www.marketsandmarkets.com/Market-Reports/protein-expression-market-180323924.html

pages/education.mdx

@@ -4,6 +4,7 @@ import Figure from "@/components/Figure";
 export const meta = {
   title: "Education",
   subtitle: "",
+    underline: true,
 };
 
 export const Page = ({ children }) => (

pages/engineering.mdx

@@ -9,6 +9,7 @@ export const meta = {
     "https://static.igem.wiki/teams/4796/wiki/engineeringsucc/image26-cropp.png",
   rotating: false,
   showTitle: true,
+    underline: true,
 };
 
 export const Page = ({ children }) => (

pages/hardware.mdx

@@ -7,6 +7,7 @@ import Link from "../components/Link.js";
 export const meta = {
   title: "Hardware: Bioreactor",
   subtitle: "",
+    underline: true,
 };
 
 <div className="padded-content">

pages/human-practices.mdx

@@ -4,6 +4,7 @@ import Figure from "@/components/Figure";
 export const meta = {
   title: "Human Practices",
   subtitle: "",
+    underline: true,
 };
 
 export const Page = ({ children }) => (

pages/model.mdx

@@ -5,6 +5,7 @@ import Link from "../components/Link.js";
 export const meta = {
   title: "Protein and Math Modeling",
   subtitle: "",
+    underline: true,
 };
 
 export const Page = ({ children }) => (

pages/results.mdx

@@ -9,6 +9,7 @@ export const meta = {
     "https://static.igem.wiki/teams/4796/wiki/results/img-6074.jpg",
   rotating: false,
   showTitle: true,
+    underline: true,
 };
 
 export const Page = ({ children }) => (

pages/safety.mdx

@@ -4,6 +4,7 @@ import Figure from "@/components/Figure";
 export const meta = {
   title: "Safety",
   subtitle: "",
+    underline: true,
 };
 
 <div className="padded-content">

pages/usermanual.mdx

@@ -13,6 +13,7 @@ export const meta = {
   coverImage: true,
   image: "https://static.igem.wiki/teams/4796/wiki/usermanual/cover.svg",
   rotating: false,
+  underline: true,
 };
 
 <div className="alternate-colors-curved-background padded-content">