@digigov/css 1.2.0-fd2cea11 → 1.2.0-mobile

package/tailwind.config.js

@@ -41,6 +41,7 @@ const allColors = [
   "warning",
   "error",
   "error-hover",
+  "error-text",
   "focus",
   "link",
   "link-hover",
@@ -107,8 +108,6 @@ module.exports = {
     },
     screens: {
         ...screensWithPixels,
-
-      "2xl": "1280px",
       print: { raw: "print" },
       xsOnly: { min: "0px", max: "639.98px" },
       smOnly: { min: "640px", max: "767.98px" },
@@ -132,6 +131,7 @@ module.exports = {
         fit: "fit-content",
       },
       minWidth: {
+        4: "1rem",
         10: "2.5rem",
         32: "8rem",
         52: "13rem",

package/themes.plugin.js

@@ -4,7 +4,7 @@ const postcss = require("postcss");
 const postcssrc = require("postcss-load-config");
 const postcssJs = require("postcss-js");
 
-const prefix = "govgr";
+const prefix = "ds";
 const mediaQueriesMapping = {
   xs: "@media (min-width: 0px)",
   sm: "@media (min-width: 640px)",

package/defaultTheme/footer.json

@@ -1,8 +0,0 @@
-{
-  "footer__copyright": {
-    "font-size": {
-      "xs": "var(--text-sm)",
-      "md": "var(--text-base)"
-    }
-  }
-}

package/src/pages/admin-filtering-data.js

@@ -1,160 +0,0 @@
-import Head from 'next/head';
-import Image from 'next/image';
-
-export default function Home() {
-  return (
-    <div>
-      <header className="govgr-admin-header" role="banner" data-module="govgr-header">
-        <div className="govgr-admin-header__container">
-          <img className="govgr-header-logo" src="https://www.gov.gr/gov_gr_logo.svg" alt="gov.gr logo" />
-        </div>
-      </header>
-      <div className="govgr-admin-wrapper">
-        <div className="govgr-admin-width-container">
-          <div className="govgr-admin-main-wrapper">
-            <div className="govgr-grid__col-span-12">
-              <h1 className="govgr-heading-xl">Αναζήτηση μεταφραστή</h1>
-              <div className="govgr-field">
-                <label className="govgr-label"> Αναζήτηση με λέξη-κλειδί  </label>
-                <div className="govgr-search">
-                  <input className="govgr-input" type="text" id="business-name" name="business-name" />
-                  <button className="govgr-btn govgr-input__search-btn">
-                    <svg className="govgr-svg-icon--search" focusable="false" viewBox="0 0 24 24" aria-hidden="true" >
-                      <path d="M22,19.9l-5.4-5.4c0.9-1.3,1.4-2.8,1.4-4.5c0-4.4-3.6-8-8-8s-8,3.6-8,8s3.6,8,8,8c1.7,0,3.2-0.5,4.5-1.4l5.4,5.4L22,19.9z M10,15c-2.8,0-5-2.2-5-5s2.2-5,5-5s5,2.2,5,5S12.8,15,10,15z" />
-                    </svg>
-                  </button>
-                </div>
-              </div>
-            </div>
-            <aside className="govgr-admin-side-content">
-              <div className="govgr-filter">
-                <div className="govgr-filter__heading">
-                  <a className="govgr-link govgr-close-btn" href="#">
-                    Κλείσιμο
-                    <svg class="govgr-svg-icon--close" focusable="true" viewBox="0 0 24 24" aria-hidden="true" > <polygon points="14.4,11.8 22,4.2 19.7,1.8 12,9.4 4.4,1.8 2,4.2 9.7,11.9 2.1,19.5 4.4,21.9 12.1,14.3 19.7,21.9 22.1,19.5 " /></svg>
-                  </a>
-                  <h3 className="govgr-heading-md">Φίλτρα</h3>
-                </div>
-                <div className="govgr-filter__content">
-                  {/* <div className="govgr-filter__selected">
-                  <div className="govgr-filter__selected-heading">
-                    <h3 className="govgr-heading-sm">Επιλεγμένα φίλτρα</h3>
-                  </div>
-                  <p className="govgr-hint-sm"> Δεν έχει επιλεχθεί κάποιο φίλτρο. </p>
-                  <p className="govgr-hint-sm"> Για να προσθέσετε φίλτρο, επιλέξτε τουλάχιστον μία από τις παρακάτω επιλογές και πατήστε το κουμπί "Αναζήτηση".</p>
-                </div> */}
-                  <div className="govgr-filter__selected">
-                    <div className="govgr-filter__selected-heading">
-                      <h3 className="govgr-heading-sm">Επιλεγμένα φίλτρα</h3>
-                      <a className="govgr-link" href="#"> Καθαρισμός</a>
-                    </div>
-                    <h4 className="govgr-chip--heading">Περιοχή</h4>
-                    <ul className="govgr-chips">
-                      <li><a className="govgr-chip" href="#">Άλιμος
-                        <svg className="govgr-svg-icon--close" focusable="true" viewBox="0 0 24 24" aria-hidden="true" > <polygon points="14.4,11.8 22,4.2 19.7,1.8 12,9.4 4.4,1.8 2,4.2 9.7,11.9 2.1,19.5 4.4,21.9 12.1,14.3 19.7,21.9 22.1,19.5 " /></svg>
-                      </a></li>
-                      <li><a className="govgr-chip" href="#">Πετρούπολη <div className="govgr-chip--x-icon">
-                        <svg className="govgr-svg-icon--close" focusable="true" viewBox="0 0 24 24" aria-hidden="true" > <polygon points="14.4,11.8 22,4.2 19.7,1.8 12,9.4 4.4,1.8 2,4.2 9.7,11.9 2.1,19.5 4.4,21.9 12.1,14.3 19.7,21.9 22.1,19.5 " /></svg>
-                      </div> </a></li>
-                      <li><a className="govgr-chip" href="#">Δροσιά <div className="govgr-chip--x-icon">
-                        <svg className="govgr-svg-icon--close" focusable="true" viewBox="0 0 24 24" aria-hidden="true" > <polygon points="14.4,11.8 22,4.2 19.7,1.8 12,9.4 4.4,1.8 2,4.2 9.7,11.9 2.1,19.5 4.4,21.9 12.1,14.3 19.7,21.9 22.1,19.5 " /></svg>
-                      </div> </a></li>
-                    </ul>
-                  </div>
-                  <div className="govgr-filter__options">
-                    <div className="govgr-field">
-                      <label className="govgr-heading-sm govgr-label" for="business-name">Αναζήτηση λέξης</label>
-                      <input className="govgr-input" type="text" id="business-name" name="business-name" />
-                    </div>
-                    <div className="govgr-field">
-                      <label className="govgr-heading-sm govgr-label" for="select-list">Περιοχή</label>
-                      <select className="govgr-select" id="select-list" name="select-list">
-                        <option value="popular" selected>France</option>
-                        <option value="recently" selected>Άγιος Δημήτριος</option>
-                        <option value="three" selected>Άλιμος</option>
-                        <option value="four">Άνω Ελευσίνα</option>
-                      </select>
-                    </div>
-                    <div className="govgr-field">
-                      <fieldset className="govgr-fieldset" aria-describedby="checkboxhint">
-                        <legend className="govgr-heading-sm govgr-fieldset__legend">Γλώσσα</legend>
-                        <div className="govgr-checkboxes">
-                          <div className="govgr-checkboxes__item">
-                            <input className="govgr-checkboxes__input" type="checkbox" id="runny-nose" name="runny-nose" value="runny-nose" />
-                            <label className="govgr-label govgr-checkboxes__label" for="runny-nose">Ελληνικά
-                            </label>
-                          </div>
-                          <div className="govgr-checkboxes__item">
-                            <input className="govgr-checkboxes__input" type="checkbox" id="fever" name="fever" value="fever" />
-                            <label className="govgr-label govgr-checkboxes__label" for="fever">Αγγλικά <br />
-                            </label>
-                          </div>
-                          <div className="govgr-checkboxes__item">
-                            <input className="govgr-checkboxes__input" type="checkbox" id="tiredness" name="tiredness" value="tiredness" />
-                            <label className="govgr-label govgr-checkboxes__label" for="tiredness">Γαλλικά <br />
-                            </label>
-                          </div>
-                        </div>
-                      </fieldset>
-                    </div>
-                    <button className="govgr-btn govgr-btn-primary">Αναζήτηση</button>
-                  </div>
-                </div>
-              </div>
-            </aside>
-            <main className="govgr-admin-main-content">
-              <div className="govgr-results-heading">
-                <h3 className="govgr-heading-md">146 Αποτελέσματα</h3>
-                <div className="govgr-results-heading__actions">
-                  <a className="govgr-link" href="#"> Εξαγωγή δεδομένων</a>
-                  <a className="govgr-link govgr-link-filters" href="#"> Φίλτρα</a>
-                </div>
-              </div>
-              <hr className="govgr-section-break govgr-section-break--visible govgr-section-break--md" />
-              <div className="govgr-results-action-bar">
-                <div className="govgr-field">
-                  <label className="govgr-label" for="select-list2"> Ταξινόμηση: </label>
-                  <select className="govgr-select" id="select-list2" name="select-list2">
-                    <option value="popular" selected>Δημοφιλή</option>
-                    <option value="recently">Πρόσφατα</option>
-                  </select>
-                </div>
-                <div className="govgr-field">
-                  <label className="govgr-label" for="select-list2"> Σελίδες ανά σελίδα: </label>
-                  <select className="govgr-select" id="select-list3" name="select-list3">
-                    <option value="popular" selected>12</option>
-                    <option value="recently">24</option>
-                    <option value="recently">48</option>
-                  </select>
-                </div>
-              </div>
-              <div className="govgr-grid govgr-grid__gap-4">
-                <div className="govgr-card govgr-grid__col-span-12">
-                  <div className="govgr-card__body">
-                    <div role="heading" aria-level="2" className="govgr-card__heading">This is a Card</div>
-                    <div className="govgr-card__content">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
-                    </div>
-                  </div>
-                </div>
-                <div className="govgr-card govgr-grid__col-span-12">
-                  <div className="govgr-card__body">
-                    <div role="heading" aria-level="2" className="govgr-card__heading">This is a Card</div>
-                    <div className="govgr-card__content">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet.
-                    </div>
-                  </div>
-                </div>
-                <div className="govgr-card govgr-grid__col-span-12">
-                  <div className="govgr-card__body">
-                    <div role="heading" aria-level="2" className="govgr-card__heading">This is a Card</div>
-                    <div className="govgr-card__content">Lorem ipsum dolor sit amet.
-                    </div>
-                  </div>
-                </div>
-              </div>
-            </main>
-          </div>
-        </div>
-      </div>
-    </div>
-  );
-}

package/src/pages/admin.js

@@ -1,61 +0,0 @@
-export default function Home() {
-  return (
-    <div>
-      <header className="govgr-header" role="banner" data-module="govgr-header">
-        <div className="govgr-admin-header__container">
-          <img className="govgr-header-logo" src="https://www.gov.gr/gov_gr_logo.svg" alt="gov.gr logo" />
-          {/* <div class="govgr-header__container">
-            <input class="govgr-input" type="text" id="business-name" name="business-name" />
-          </div> */}
-        </div>
-      </header>
-      <div className="govgr-admin-main-wrapper">
-        <div className="govgr-admin-side-content">
-          <h4 className="govgr-heading-sm">Σχετικοί Σύνδεσμοι</h4>
-          <nav className="govgr-vertical-nav">
-            <a className="govgr-link govgr-vertical-nav__item govgr-vertical-nav__item--active" href="#"> Σύνδεσμος 1</a>
-            <a className="govgr-link govgr-vertical-nav__item" href="#"> Σύνδεσμος 2</a>
-            <a className="govgr-link govgr-vertical-nav__item" href="#"> Σύνδεσμος 3</a>
-          </nav>
-        </div>
-        <div className="govgr-admin-main-content">
-          <div class="govgr-breadcrumbs">
-            <ol class="govgr-breadcrumbs__list">
-              <li class="govgr-breadcrumbs__list-item">
-                <a class="govgr-breadcrumbs__link" href="#">Αρχική</a>
-              </li>
-              <li class="govgr-breadcrumbs__list-item">
-                <a class="govgr-breadcrumbs__link" href="#">Υγεία και πρόνοια</a>
-              </li>
-              <li class="govgr-breadcrumbs__list-item">
-                <a class="govgr-breadcrumbs__link" href="#">Φάκελος υγείας</a>
-              </li>
-              <li class="govgr-breadcrumbs__list-item">
-                <a class="govgr-breadcrumbs__link" href="#">Άυλη συνταγογράφηση</a>
-              </li>
-            </ol>
-          </div>
-          <span className="govgr-caption-xl"> Caption for h1 </span>
-          <h1 className="govgr-heading-xl">Heading 1 - Κεντρικός τίτλος</h1>
-          <div class="govgr-card--border govgr-card">
-            <div class="govgr-card__body">
-              <div role="heading" aria-level="2" class="govgr-card__heading">This is a Card with border</div>
-              <div class="govgr-card__content">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore   magna aliqua.
-              </div>
-            </div>
-          </div>
-          <div class="govgr-btn-group">
-            <button class="govgr-btn govgr-btn-primary">
-              Save and continue
-            </button>
-            <button class="govgr-btn govgr-btn-secondary">Save as draft</button>
-          </div>
-          <span className="govgr-caption-lg"> Caption for h2 </span>
-          <h2 className="govgr-heading-lg">Heading 2</h2>
-          <span className="govgr-caption-md"> Caption for h3 </span>
-          <h3 className="govgr-heading-md">Heading 2</h3>
-        </div>
-      </div>
-    </div >
-  );
-}

package/src/pages/dropdown.js

@@ -1,249 +0,0 @@
-export default function Dropdown() {
-  return (
-    <div>
-
-      <h1 className="govgr-heading-xl">Dropdowns</h1>
-
-      <p className="govgr-body">
-        So, let's see some implementations for the dropdown.
-      </p>
-      <p className="govgr-body">
-        First, we can add to the dropdown__button our button or link classes. Also, we can add svg icon after the text of the button.
-        Some examples:
-      </p>
-
-
-      <h3 className="govgr-heading-sm">Primary button with arrow icon</h3>
-
-
-      <details className="govgr-dropdown">
-        <summary className="govgr-dropdown__button govgr-btn govgr-btn-primary">
-          Ενέργειες
-          <svg aria-hidden="true" className="govgr-svg-icon govgr-svg-icon--arrow--down" focusable="false" viewBox="0 0 24 24">
-            <path d="M22,8.2l-2.3-2.4L12,13.4L4.4,5.8L2,8.2l10,10L22,8.2z" />
-          </svg>
-        </summary>
-        <div className="govgr-dropdown__content">
-          <p className="govgr-body">
-            Χρειάζεται να γνωρίζουμε τη διεύθυνση κατοικίας σας ώστε να μπορούμε να σας στείλουμε τα έντυπα μέσω ταχυδρομείου. Σε περίπτωση που δεν μπορείτε να παρέχετε μια έγκυρη διεύθυνση κατοικίας, παρακαλούμε επικοινωνήστε μαζί μας.
-          </p>
-        </div>
-      </details>
-
-      <hr className="govgr-section-break govgr-section-break--md" />
-      <h4 className="govgr-heading-sm">Secondary button with more icon and nav</h4>
-
-      <details className="govgr-dropdown">
-        <summary className="govgr-dropdown__button govgr-btn govgr-btn-secondary">
-          Ενέργειες
-          <svg aria-hidden="true" className="govgr-svg-icon govgr-svg-icon--more-vert" focusable="false" viewBox="0 0 24 24">
-            <circle cx="12" cy="5" r="2" />
-            <circle cx="12" cy="12" r="2" />
-            <circle cx="12" cy="19" r="2" />
-          </svg>
-        </summary>
-        <div className="govgr-dropdown__content">
-          <nav className="govgr-vertical-nav">
-            <a href="#" className="govgr-link govgr-vertical-nav__item"> Επεξεργασία </a>
-            <a href="#" className="govgr-link govgr-vertical-nav__item"> Μετακίνηση </a>
-            <a href="#" className="govgr-link govgr-vertical-nav__item"> Οριστική διαγραφή</a>
-          </nav>
-        </div>
-      </details>
-
-      <hr className="govgr-section-break govgr-section-break--md" />
-      <h3 className="govgr-heading-sm">Link with more icon</h3>
-
-      <details className="govgr-dropdown">
-        <summary className="govgr-dropdown__button govgr-link">
-          Ενέργειες
-          <svg aria-hidden="true" className="govgr-svg-icon govgr-svg-icon--more-vert" focusable="false" viewBox="0 0 24 24">
-            <circle cx="12" cy="5" r="2" /><circle cx="12" cy="12" r="2" /><circle cx="12" cy="19" r="2" />
-          </svg>
-        </summary>
-        <div className="govgr-dropdown__content">
-          <p className="govgr-body">
-            Χρειάζεται να γνωρίζουμε τη διεύθυνση κατοικίας σας ώστε να μπορούμε να σας στείλουμε τα έντυπα μέσω ταχυδρομείου. Σε περίπτωση που δεν μπορείτε να παρέχετε μια έγκυρη διεύθυνση κατοικίας, παρακαλούμε επικοινωνήστε μαζί μας.
-          </p>
-        </div>
-      </details>
-
-      <hr className="govgr-section-break govgr-section-break--md" />
-      <h3 className="govgr-heading-md">Secondary button, with rotating arrow</h3>
-      <p className="govgr-body">
-        We can implement a prop at dropdown__button that adds a rotating arrow to the button, like this:
-      </p>
-
-      <details className="govgr-dropdown">
-        <summary className="govgr-dropdown__button govgr-btn govgr-btn-secondary govgr-dropdown__button--chevron">
-          Ενέργειες
-          <svg aria-hidden="true" className="govgr-svg-icon govgr-svg-icon--arrow--down" focusable="false" viewBox="0 0 24 24">
-            <path d="M22,8.2l-2.3-2.4L12,13.4L4.4,5.8L2,8.2l10,10L22,8.2z" />
-          </svg>
-        </summary>
-        <div className="govgr-dropdown__content">
-          <div className="govgr-field">
-            <label className="govgr-label">
-              <span>Όνομα επιχείρησης</span>
-              <input className="govgr-input" type="text" name="business-name" />
-            </label>
-          </div>
-          <hr className="govgr-section-break govgr-section-break--sm govgr-section-break--visible" />
-
-          <nav className="govgr-vertical-nav">
-            <a href="#" className="govgr-link govgr-vertical-nav__item"> Επεξεργασία </a>
-            <a href="#" className="govgr-link govgr-vertical-nav__item"> Μετακίνηση </a>
-            <a href="#" className="govgr-link govgr-vertical-nav__item"> Οριστική διαγραφή</a>
-          </nav>
-
-          <hr className="govgr-section-break govgr-section-break--sm" />
-          <hr className="govgr-section-break govgr-section-break--sm govgr-section-break--visible" />
-
-          <button className="govgr-btn govgr-btn-primary">Αποθήκευση</button>
-
-        </div>
-      </details>
-
-      <p className="govgr-body">
-        Also, the content can be a compination of things: inputs, lists, text, buttons.
-      </p>
-      <hr className="govgr-section-break govgr-section-break--md" />
-      <h4 className="govgr-heading-md">Primary button without icon, position UP</h4>
-
-      <details className="govgr-dropdown govgr-dropdown--up">
-        <summary className="govgr-dropdown__button govgr-btn govgr-btn-primary">
-          Ενέργειες
-        </summary>
-        <div className="govgr-dropdown__content">
-          <p className="govgr-body">
-            Χρειάζεται να γνωρίζουμε τη διεύθυνση κατοικίας σας ώστε να μπορούμε να σας στείλουμε τα έντυπα μέσω ταχυδρομείου. Σε περίπτωση που δεν μπορείτε να παρέχετε μια έγκυρη διεύθυνση κατοικίας, παρακαλούμε επικοινωνήστε μαζί μας.
-          </p>
-        </div>
-      </details>
-
-      <h3 className="govgr-heading-md">Button groups and dropdown combinations</h3>
-
-      <hr className="govgr-section-break govgr-section-break--md" />
-      <h4 className="govgr-heading-sm">Links </h4>
-
-      <div className="govgr-btn-group">
-
-        <details className="govgr-dropdown govgr-dropdown--up">
-          <summary className="govgr-dropdown__button govgr-link">
-            Ενέργειες
-            <svg aria-hidden="true" className="govgr-svg-icon govgr-svg-icon--arrow--down" focusable="false" viewBox="0 0 24 24">
-              <path d="M22,8.2l-2.3-2.4L12,13.4L4.4,5.8L2,8.2l10,10L22,8.2z" />
-            </svg>
-          </summary>
-          <div className="govgr-dropdown__content">
-            <p className="govgr-body">
-              Χρειάζεται να γνωρίζουμε τη διεύθυνση κατοικίας σας ώστε να μπορούμε να σας στείλουμε τα έντυπα μέσω ταχυδρομείου. Σε περίπτωση που δεν μπορείτε να παρέχετε μια έγκυρη διεύθυνση κατοικίας, παρακαλούμε επικοινωνήστε μαζί μας.
-            </p>
-          </div>
-        </details>
-
-        <details className="govgr-dropdown govgr-dropdown--left govgr-dropdown--up">
-          <summary className="govgr-dropdown__button govgr-link  govgr-dropdown__button--chevron">
-            Ενέργειες
-            <svg aria-hidden="true" className="govgr-svg-icon govgr-svg-icon--arrow--down" focusable="false" viewBox="0 0 24 24">
-              <path d="M22,8.2l-2.3-2.4L12,13.4L4.4,5.8L2,8.2l10,10L22,8.2z" />
-            </svg>
-          </summary>
-          <div className="govgr-dropdown__content">
-            <p className="govgr-body">
-              Χρειάζεται να γνωρίζουμε τη διεύθυνση κατοικίας σας ώστε να μπορούμε να σας στείλουμε τα έντυπα μέσω ταχυδρομείου. Σε περίπτωση που δεν μπορείτε να παρέχετε μια έγκυρη διεύθυνση κατοικίας, παρακαλούμε επικοινωνήστε μαζί μας.
-            </p>
-          </div>
-        </details>
-
-      </div>
-
-      <hr className="govgr-section-break govgr-section-break--md" />
-      <h3 className="govgr-heading-md">A group of buttons and dropdowns with icons and various directions</h3>
-
-      <div className="govgr-btn-group">
-
-        <button className="govgr-btn govgr-btn-secondary">Αποθήκευση</button>
-
-        <details className="govgr-dropdown govgr-dropdown--up">
-          <summary className="govgr-dropdown__button govgr-btn govgr-btn-secondary">
-            Ενέργειες
-            <svg aria-hidden="true" className="govgr-svg-icon govgr-svg-icon--arrow--down" focusable="false" viewBox="0 0 24 24">
-              <path d="M22,8.2l-2.3-2.4L12,13.4L4.4,5.8L2,8.2l10,10L22,8.2z" />
-            </svg>
-          </summary>
-          <div className="govgr-dropdown__content">
-            <p className="govgr-body">
-              Χρειάζεται να γνωρίζουμε τη διεύθυνση κατοικίας σας ώστε να μπορούμε να σας στείλουμε τα έντυπα μέσω ταχυδρομείου. Σε περίπτωση που δεν μπορείτε να παρέχετε μια έγκυρη διεύθυνση κατοικίας, παρακαλούμε επικοινωνήστε μαζί μας.
-            </p>
-          </div>
-        </details>
-
-        <details className="govgr-dropdown">
-          <summary className="govgr-dropdown__button govgr-btn govgr-btn-secondary">
-            <svg aria-hidden="true" className="govgr-svg-icon govgr-svg-icon--more-vert" focusable="false" viewBox="0 0 24 24">
-              <circle cx="12" cy="5" r="2" /><circle cx="12" cy="12" r="2" /><circle cx="12" cy="19" r="2" />
-            </svg>
-          </summary>
-          <div className="govgr-dropdown__content">
-            <nav className="govgr-vertical-nav">
-              <a href="#" className="govgr-link govgr-vertical-nav__item"> Επεξεργασία </a>
-              <a href="#" className="govgr-link govgr-vertical-nav__item"> Μετακίνηση </a>
-              <a href="#" className="govgr-link govgr-vertical-nav__item"> Οριστική διαγραφή</a>
-            </nav>
-          </div>
-        </details>
-
-        <details className="govgr-dropdown govgr-dropdown--left ">
-          <summary className="govgr-dropdown__button govgr-btn govgr-btn-secondary">
-            <svg aria-hidden="true" className="govgr-svg-icon govgr-svg-icon--more-vert" focusable="false" viewBox="0 0 24 24">
-              <rect id="govgr-svg-icon--burger__line-1" width="20" height="3.3" /> <rect id="govgr-svg-icon--burger__line-2" width="20" height="3.3" /> <rect id="govgr-svg-icon--burger__line-3" width="20" height="3.3" />
-            </svg>
-          </summary>
-          <div className="govgr-dropdown__content">
-            <nav className="govgr-vertical-nav">
-              <a href="#" className="govgr-link govgr-vertical-nav__item"> Επεξεργασία </a>
-              <a href="#" className="govgr-link govgr-vertical-nav__item"> Μετακίνηση </a>
-              <a href="#" className="govgr-link govgr-vertical-nav__item"> Οριστική διαγραφή</a>
-            </nav>
-          </div>
-        </details>
-
-        <details className="govgr-dropdown govgr-dropdown--left govgr-dropdown--up">
-          <summary className="govgr-dropdown__button govgr-btn govgr-btn-secondary">
-            <svg aria-hidden="true" className="govgr-svg-icon govgr-svg-icon--caret" focusable="false" viewBox="0 0 24 24">
-              <path d="M22,6H2l10,12L22,6z" />
-            </svg>
-          </summary>
-          <div className="govgr-dropdown__content">
-            <nav className="govgr-vertical-nav">
-              <a href="#" className="govgr-link govgr-vertical-nav__item"> Επεξεργασία </a>
-              <a href="#" className="govgr-link govgr-vertical-nav__item"> Μετακίνηση </a>
-              <a href="#" className="govgr-link govgr-vertical-nav__item"> Οριστική διαγραφή</a>
-            </nav>
-          </div>
-        </details>
-      </div>
-
-      <hr className="govgr-section-break govgr-section-break--lg" />
-
-      <footer className="govgr-footer" role="contentinfo">
-        <div className="govgr-container">
-          <div className="govgr-footer__meta">
-            <div className="govgr-footer__meta-item govgr-footer__meta-item--grow">
-              <div className="govgr-footer__content">
-                <p className="govgr-footer__copyright">
-                  Υλοποίηση από το <a href="https://mindigital.gr/" target="_blank" rel="noreferrer noopener" className="govgr-link"> Υπουργείο Ψηφιακής Διακυβέρνησης <span className="govgr-visually-hidden">(ανοίγει σε καινούρια καρτέλα) </span></a>
-                </p>
-              </div>
-            </div>
-            <div className="govgr-footer__meta-item">
-              <img className="govgr-footer__government-logo" src="/img/government-logo2.svg" alt="government logo" />
-            </div>
-          </div>
-        </div>
-      </footer>
-
-    </div>
-  )
-}