Spaces:

OPheno
/

README

Running

App Files Files Community

Make it simple

by hkromminga - opened about 24 hours ago

base: refs/heads/main

←

from: refs/pr/2

Discussion Files changed

+208

-104

Files changed (1) hide show

index.html +208 -104

index.html CHANGED Viewed

@@ -1,3 +1,4 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
@@ -12,14 +13,6 @@
   <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap" rel="stylesheet" />
   <style>
-.container {
-  max-width: 100% !important;
-  width: 100% !important;
-  margin: 0;
-  padding: 0 20px;
-}
     :root{
       --bg:#ffffff;
       --card:#f7f7f8;
@@ -37,13 +30,15 @@
       font-family:"Inter",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
       line-height:1.6;
     }
-    /* Always-visible links */
-    a {
-      color: #000 !important;
-      text-decoration: underline !important;
     }
-    a:hover {
-      text-decoration: underline !important;
     }
     header{
       display:flex;
@@ -53,27 +48,35 @@
       border-bottom:1px solid var(--border);
       margin-bottom:18px;
     }
     .title{
       font-size:26px;
       font-weight:700;
       margin:0;
     }
-section {
-  background: var(--card);
-  border: 1px solid var(--border);
-  border-radius: 14px;
-  padding: 18px;     /* good balance for readability */
-  margin: 14px 0;
-  width: 100%;       /* if you want it full width */
-  box-sizing: border-box;
-}
     .hero h1{
       margin:0 0 6px;
       font-size:28px;
@@ -95,8 +98,8 @@ section {
       font-weight:600;
       border-radius:10px;
       background:var(--accent);
-      color:#000;
-      border:2px solid #000;
     }
     .btn.secondary{
       background:#6c757d;
@@ -128,104 +131,205 @@ section {
       color:var(--muted);
       font-size:14px;
     }
-        footer{
-      margin-top:36px;
-      padding-top:16px;
-      border-top:1px solid var(--border);
-      color:var(--muted);
-      font-size:14px;
     }
   </style>
 </head>
 <body>
   <div class="container">
-  </style>
-</head>
-<body>
-  <div class="container">
-   <!-- HEADER -->
-<header>
-  <div>
-    <h1 class="title">OPheno — Open‑Source Weed Phenology</h1>
-  </div>
-</header>
-<!-- HERO -->
-<section class="hero">
-  <h1>An open, community‑driven space for weed emergence & phenology data</h1>
-  <p class="lead">
-    OPheno aggregates and curates observations related to weed emergence and phenology to support research, education, and modeling across diverse
-    environments and management systems.
-  </p>
-  <div class="cta-row">
-    <a class="btn" href="https://huggingface.co/spaces/OPheno/opheno-submission-portal"
-       target="_blank" rel="noopener">🚀 Submission Portal</a>
   </div>
-</section>
-<!-- ABOUT -->
-<section id="about">
-  <h2>About OPheno</h2>
-  <p>
-    OPheno aims to unite the full spectrum of weed‑science knowledge—from academic research and field trials to industry observations and practical field experience. By providing an open and shared home for emergence andphenology data, OPheno encourages collaboration, improves transparency,
-    and accelerates the development of models and tools that depend on
-    reliable, comparable observations. All datasets hosted under OPheno follow
-    open‑science principles and aim to support anyone interested in
-    understanding or predicting weed development.
-  </p>
-</section>
-<!-- CONTRIBUTE -->
 <section id="contribute">
   <h2>Contribute</h2>
   <p>
-    Contributions from researchers, practitioners, and the community are the
-    heart of the project. If you have observations related to weed emergence
-    or phenology, please submit them via the
-    <a href="https://huggingface.co/spaces/OPheno/OPheno-Submission-Portal"
-       target="_blank" rel="noopener">portal</a>.
-    The maintainers will review and, when feasible, curate contributions into
-    the public datasets. Every submission not ready for curation remains
-    accessible in the submission portal folder for transparency and future
-    iteration.
   </p>
-</section>
-<!-- LICENSE -->
-<section id="license">
-  <h2>License</h2>
-  <p>
-    Unless otherwise noted, data are released under <strong>CC BY 4.0</strong>.
-  </p>
 </section>
 <!-- MAINTAINER -->
 <section id="maintainer">
   <h2>Maintainer</h2>
   <p>
-    OPheno is maintained by
-    <a href="https://de.linkedin.com/in/heiko-kromminga" target="_blank">Heiko
-    Hopke Kromminga (BASF)</a>,
-    <a href="https://de.linkedin.com/in/muhammad-javaid-akhter-40a18975"
-       target="_blank">Muhammad Javaid Akhter (BASF)</a>, and
-    <a href="https://de.linkedin.com/in/jorge-alberto-espejel-padilla-b00840216"
-       target="_blank">Jorge Alberto Espejel Padilla</a>.
   </p>
-</section>
-<!-- ACKNOWLEDGMENTS -->
-<section id="acknowledgments">
-  <h2>Acknowledgments</h2>
   <p>
-    The maintainers acknowledge the use of large language models for assistance
-    in drafting documentation.
   </p>
 </section>
-<footer>
-  <div>© <span id="year"></span> OPheno</div>
-</footer>

 <!DOCTYPE html>
 <html lang="en">
 <head>
   <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap" rel="stylesheet" />
   <style>
     :root{
       --bg:#ffffff;
       --card:#f7f7f8;
       font-family:"Inter",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
       line-height:1.6;
     }
+    a{
+      color:var(--accent);
+      text-decoration:none;
     }
+    a:hover{ text-decoration:underline }
+    .container{
+      max-width:980px;
+      margin:0 auto;
+      padding:28px 20px 64px;
     }
     header{
       display:flex;
       border-bottom:1px solid var(--border);
       margin-bottom:18px;
     }
+    .logo{
+      height:56px;
+      width:auto;
+    }
     .title{
       font-size:26px;
       font-weight:700;
       margin:0;
     }
+    nav{
+      display:flex;
+      flex-wrap:wrap;
+      gap:8px;
+      margin-top:6px;
+    }
+    nav a{
+      padding:6px 10px;
+      border:1px solid var(--border);
+      border-radius:8px;
+      background:#fafafa;
+      color:var(--text)
+    }
+    section{
+      background:var(--card);
+      border:1px solid var(--border);
+      border-radius:14px;
+      padding:18px;
+      margin:14px 0;
+    }
     .hero h1{
       margin:0 0 6px;
       font-size:28px;
       font-weight:600;
       border-radius:10px;
       background:var(--accent);
+      color:#fff;
+      border:none;
     }
     .btn.secondary{
       background:#6c757d;
       color:var(--muted);
       font-size:14px;
     }
+.contributors-title {
+  margin: 0 0 6px 0;
+  font-size: 16px;
+  font-weight: 600;
+  color: #000; /* black text */
+}
+    /* ========================================================= */
+    /*   MINIMALISTIC HORIZONTAL CONTRIBUTORS TICKER (NEW)       */
+    /* ========================================================= */
+    #contributors-ticker {
+      margin: 12px 0 20px;
+      width: 100%;
+      overflow: hidden;
+      white-space: nowrap;
+      border: 1px solid var(--border);
+      border-radius: 8px;
+      background: #fafafa;
+      padding: 6px 0;
+      font-size: 14px;
+      color: var(--muted);
+    }
+    #contributors-ticker .ticker-track {
+      display: inline-block;
+      padding-left: 100%;
+      animation: contributors-scroll 22s linear infinite;
+    }
+    #contributors-ticker:hover .ticker-track {
+      animation-play-state: paused; /* Pause on hover */
+    }
+    @keyframes contributors-scroll {
+      0%   { transform: translateX(0); }
+      100% { transform: translateX(-50%); } /* Seamless loop */
+    }
+    @media (prefers-reduced-motion: reduce) {
+      #contributors-ticker .ticker-track {
+        animation: none;
+        padding-left: 0;
+      }
     }
   </style>
 </head>
 <body>
   <div class="container">
+    <!-- HEADER -->
+    <header>
+      <!-- ✅ Logo is now inside <body> and within the header -->
+      <img src="OPheno_logo.png" alt="OPheno logo" class="logo" />
+      <div>
+        <h1 class="title">OPheno — Open‑Source Weed Phenology</h1>
+        <nav>
+          <!-- Keep org-level nav minimal and high-level -->
+          <a href="#about">About</a>
+          <a href="#contribute">Contribute</a>
+          <a href="#how-to-use">How to Use</a>
+          <a href="#citation">Citation</a>
+          <a href="#license">License</a>
+          <a href="#maintainer">Maintainer</a>
+          <a href="#acknowledgments">Acknowledgments</a>
+        </nav>
+      </div>
+    </header>
+    <!-- HERO -->
+    <section class="hero">
+      <h1>An open, community‑driven space for weed emergence & phenology data</h1>
+      <p class="lead">
+        OPheno aggregates and curates observations related to weed emergence and phenology to support research,
+        education, and modeling across diverse environments and management systems. Detailed schemas, units,
+        and variable definitions are maintained within the respective dataset pages.
+      </p>
+      <div class="cta-row">
+        <a class="btn" href="https://huggingface.co/spaces/OPheno/opheno-submission-portal" target="_blank" rel="noopener">🚀 Submission Portal</a>
+        <a class="btn secondary" href="https://huggingface.co/datasets/OPheno/Weed-phenology" target="_blank" rel="noopener">📚 View Dataset</a>
+      </div>
+    </section>
+   <!-- Title -->
+<h3 class="contributors-title">List of current contributors</h3>
+<!-- CONTRIBUTORS TICKER -->
+<div id="contributors-ticker">
+  <div class="ticker-track">
+    <!-- Add your names here -->
+    Heiko Hopke Kromminga · BASF &nbsp;&nbsp;•&nbsp;&nbsp;
+    Jorge Espejel · BASF &nbsp;&nbsp;•&nbsp;&nbsp;
+    Muhammad Javaid Akhter · BASF &nbsp;&nbsp;•&nbsp;&nbsp;
+    [Name Surname] · [Organization] &nbsp;&nbsp;•&nbsp;&nbsp;
+    [Name Surname] · [University/Lab] &nbsp;&nbsp;•&nbsp;&nbsp;
+    <!-- DUPLICATED LIST for seamless looping -->
+    Heiko Hopke Kromminga · BASF &nbsp;&nbsp;•&nbsp;&nbsp;
+    Jorge Espejel · BASF &nbsp;&nbsp;•&nbsp;&nbsp;
+    Muhammad Javaid Akhter · BASF &nbsp;&nbsp;•&nbsp;&nbsp;
+    [Name Surname] · [Organization] &nbsp;&nbsp;•&nbsp;&nbsp;
+    [Name Surname] · [University/Lab]
   </div>
+</div>
+    <!-- ABOUT  -->
+    <section id="about">
+      <h2>About OPheno</h2>
+      <p>
+OPheno aims to unite the full spectrum of weed‑science knowledge—from academic research and field trials to industry observations and practical field experience. By providing an open and shared home for emergence and phenology data, OPheno encourages collaboration, improves transparency, and accelerates the development of models and tools that depend on reliable, comparable observations.
+All datasets hosted under OPheno follow open‑science principles and aim to support anyone interested in understanding or predicting weed development.
+      </p>
+    </section>
+<!-- CONTRIBUTE (no strict schema here; point to portal/dataset docs) -->
 <section id="contribute">
   <h2>Contribute</h2>
   <p>
+    Contributions from researchers, practitioners, and the community are the heart of the project . If you have observations related
+    to weed emergence or phenology, please submit them via the <a href="https://huggingface.co/spaces/OPheno/OPheno-Submission-Portal"
+       target="_blank"
+       rel="noopener">
+       portal.
+    </a>
+    The maintainers will review and, when feasible, curate contributions into the public datasets. Every submission
+    not ready for curation remains accessible in the  <a href="https://huggingface.co/spaces/OPheno/OPheno-Submission-Portal/tree/main/submissions"
+       target="_blank"
+       rel="noopener">
+       submission portal folder
+    </a> for transparency and future iteration.
   </p>
 </section>
+    <!-- HOW TO USE (minimal; detailed examples live with the dataset) -->
+    <section id="how-to-use">
+      <h2>How to Use</h2>
+      <p>Load datasets directly with the <code>datasets</code> library. See each dataset page for column descriptions and examples.</p>
+      <pre><code>pip install datasets
+from datasets import load_dataset
+ds = load_dataset("OPheno/Weed-phenology")
+# See the dataset page for examples and schema.
+</code></pre>
+    </section>
+    <!-- CITATION -->
+    <section id="citation">
+      <h2>Citation</h2>
+      <pre><code>@misc{opheno_dataset_2026,
+  title        = {OPheno: An Open-Source Weed Phenology Initiative},
+  author       = {Kromminga, Heiko Hopke and Akhter, Muhammad Javaid and Espejel, Jorge},
+  year         = {2026},
+  publisher    = {Hugging Face},
+  howpublished = {https://huggingface.co/datasets/OPheno/Weed-phenology}
+}</code></pre>
+    </section>
+    <!-- LICENSE -->
+    <section id="license">
+      <h2>License</h2>
+      <p>Unless otherwise noted in a specific dataset, data are released under <strong>CC BY 4.0</strong>. Please check the dataset page for any dataset‑specific notices.</p>
+    </section>
 <!-- MAINTAINER -->
 <section id="maintainer">
   <h2>Maintainer</h2>
   <p>
+    OPheno is maintained by
+    <a href="https://de.linkedin.com/in/heiko-kromminga?trk=people-guest_people_search-card" target="_blank" rel="noopener">
+      Heiko Hopke Kromminga (BASF)
+    </a>,
+    <a href="https://de.linkedin.com/in/muhammad-javaid-akhter-40a18975" target="_blank" rel="noopener">
+      Muhammad Javaid Akhter (BASF)
+    </a>, and
+    <a href="https://de.linkedin.com/in/jorge-alberto-espejel-padilla-b00840216" target="_blank" rel="noopener">
+      Jorge Alberto Espejel Padilla
+    </a>.
   </p>
   <p>
+    Please use the Hugging Face Hub's Community tab for questions or discussions.
   </p>
 </section>
+    <!-- ACKNOWLEDGMENTS -->
+    <section id="acknowledgments">
+      <h2>Acknowledgments</h2>
+      <p>The maintainers acknowledge the use of large language models for assistance in drafting documentation sections, generating code examples, and refining text presented in this repository. All final content was reviewed, validated, and finalized by the maintainers.</p>
+    </section>
+    <footer>
+      <div>© <span id="year"></span> OPheno</div>
+    </footer>
+  </div>
+  <script>
+    document.getElementById("year").textContent = new Date().getFullYear();
+  </script>
+</body>
+</html>