The Deep Tech Wiki

User:C/Sandbox Main page 2: Difference between revisions

VisualWikitext
Created page with "<style> →--- TOP SECTION GRID ---: .dtp-top-grid { display: grid; grid-template-columns: 1fr 2fr; gap: 40px; align-items: start; margin-bottom: 40px; } →--- FEATURED GRID ---: .dtp-featured-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 20px; } .dtp-featured-card { border: 1px solid #ddd; padding: 20px; border-radius: 6px; min-height: 120px; } →--- TABLET BREAKPOINT ---: @media (max-width: 900p..."
 
No edit summary
 
(14 intermediate revisions by the same user not shown)
Line 1: Line 1:
<style>
<!-- TOP SECTION -->
/* --- TOP SECTION GRID --- */
<div style="display:flex; flex-wrap:wrap; gap:20px; margin-bottom:20px;">
.dtp-top-grid {
   <!-- Left column (1/3 on desktop, full width on mobile) -->
  display: grid;
   <div style="flex:1 1 300px; max-width:450px;">
  grid-template-columns: 1fr 2fr;
     <h2>
  gap: 40px;
      The Deep Tech Wiki
  align-items: start;
    </h2>
  margin-bottom: 40px;
}
 
/* --- FEATURED GRID --- */
.dtp-featured-grid {
   display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 20px;
}
 
.dtp-featured-card {
  border: 1px solid #ddd;
  padding: 20px;
  border-radius: 6px;
  min-height: 120px;
}
 
/* --- TABLET BREAKPOINT --- */
@media (max-width: 900px) {
  .dtp-top-grid {
    grid-template-columns: 1fr; /* stack top sections */
   }
  .dtp-featured-grid {
    grid-template-columns: repeat(2, 1fr); /* 2 featured columns */
  }
}
 
/* --- MOBILE BREAKPOINT --- */
@media (max-width: 600px) {
  .dtp-featured-grid {
    grid-template-columns: 1fr; /* stack featured cards */
  }
}
</style>
 
<!-- Two-column top layout (responsive) -->
<div class="dtp-top-grid">
 
  <div>
     <h2>The Deep Tech Wiki</h2>
     <p>
     <p>
       Welcome to the Deep Tech Wiki, a wiki for providing a free knowledge resource on the deep tech industry.
       Welcome to the Deep Tech Wiki, a wiki for providing a free knowledge resource
       It is created and maintained by contributors who believe that open sharing strengthens the entire ecosystem.
      on the deep tech industry.
      <br>
      <br>
       It is maintained by contributors who believe that open sharing strengthens the entire ecosystem.
     </p>
     </p>
   </div>
   </div>
 
  <!-- Right column (2/3 on desktop, full width on mobile) -->
   <div>
   <div style="flex:2 1 500px; min-width:300px;">
     <h2>Ecosystem pages</h2>
     <h2>
     <p>We're mapping the ecosystem one stakeholder at a time. Below is a snapshot of what's been created so far:</p>
      Ecosystem map
 
    </h2>
    {{Stakeholder count widget}}
     <p>
 
      We're mapping the ecosystem one stakeholder at a time. Below is a snapshot
      of what's been created so far:
    </p>
{{Stakeholder count widget}}
     <p>
     <p>
       Every page starts with a contributor. Help shape a more complete picture of the industry
       Every page starts with a contributor. Help shape a more complete picture
      [[Help:Contributing|by adding what you know]].
      of the industry [[Help:Contributing|by adding what you know]].
     </p>
     </p>
   </div>
   </div>
 
</div>
<!-- FEATURED SECTION -->
<h2>
  Featured ecosystem players
</h2>
<div style="display:flex; flex-wrap:wrap; gap:5px; margin-top:20px;margin-bottom:20px;">
  <div style="flex:1 1 250px; padding:10px; min-height:120px;">
    <em>
Featured startup
    </em>
  </div>
  <div style="flex:1 1 250px; padding:10px; min-height:120px;">
    <em>
Featured investor
    </em>
  </div>
  <div style="flex:1 1 250px; padding:10px; min-height:120px;">
    <em>
Featured other stakeholder
    </em>
  </div>
</div>
</div>


<h2>Featured pages</h2>
<!--- Informative section --->
    <h2>
      Knowledge repository
    </h2>
<div style="display:flex; flex-wrap:wrap; gap:20px; margin-top:10px;">
  <!-- Left column (1/3 on desktop, full width on mobile) -->
  <div style="flex:1 1 300px; max-width:450px;">


<!-- Featured section (responsive) -->
    <p>
<div class="dtp-featured-grid">
The wiki also maintains informative pages, aiming to:
  <div class="dtp-featured-card">
#Provide a shared resource for readers to get up to speed on diverse range of topics within Deep Tech
     <em>Featured placeholder 1</em><br />
#Offer common terminology and a reference space to improve communication across stakeholders from different backgrounds
    (Future featured-page template goes here)
#Capture learning and insights from across the globe to improve how Deep Tech is understood, developed, and practiced
      <br>
Have some knowledge, insight, or experienced to share? You can help others by [[Help:Contributing|contributing to the wiki]]
     </p>
   </div>
   </div>
 
   <!-- Right column (2/3 on desktop, full width on mobile) -->
   <div class="dtp-featured-card">
   <div style="flex:2 1 500px; min-width:300px;">
    <em>Featured placeholder 2</em><br />
<em>
    (Future featured-page template goes here)
Featured page here
  </div>
</em>
 
   <div class="dtp-featured-card">
    <em>Featured placeholder 3</em><br />
    (Future featured-page template goes here)
   </div>
   </div>
</div>
</div>
Retrieved from "https://deeptech.wiki/wiki/User:C/Sandbox_Main_page_2"