mypgs 2.0.0 → 3.0.0

package/{templates → reference}/react/components/notification.jsx

@@ -1,6 +1,6 @@
 const notificationData = {
-    title: "Titolo",
-    message: "Messaggio",
+    title: "Title",
+    message: "Message",
     element: "notification",
     type: "info",
     icon: null,
@@ -10,7 +10,7 @@ const notificationData = {
 
 const toastData = {
     title: "Benvenuto",
-    message: "Messaggio",
+    message: "Message",
     element: "toast",
     type: "info",
     icon: null,

package/{templates → reference}/react/components/search.jsx

@@ -1,8 +1,8 @@
 export default function Search() {
     return (
-        <form pgs="buttonNohover search" autoComplete="off" action="" method="get">
-            <button type="submit" title="Cerca"><i className="fa-solid fa-search"></i></button>
-            <input type="search" name="s" placeholder="Cerca" defaultValue="" />
+        <form pgs="button search" pgs-option="buttonNohover" autoComplete="off" action="" method="get">
+            <button type="submit" title="Search"><i className="fa-solid fa-search"></i></button>
+            <input type="search" name="s" placeholder="Search" defaultValue="" />
             <ul pgs="search-suggestions"></ul>
         </form>
     );
@@ -11,22 +11,22 @@ export default function Search() {
 export function SearchModal() {
     return (
         <div pgs="modal search-modal" pgs-option="containerPGS[header]">
-            <button type="button" pgs="modal-button buttonIcon" title="Cerca">
+            <button type="button" pgs="modal-button button" pgs-option="buttonIcon" title="Search">
                 <i className="fa-solid fa-search"></i>
             </button>
 
             <dialog>
                 <div pgs="flexRow section search-mobile">
-                    <form pgs="buttonNohover search" autoComplete="off" action="/" method="get">
-                        <button type="submit" title="Cerca">
+                    <form pgs="button search" pgs-option="buttonNohover" autoComplete="off" action="/" method="get">
+                        <button type="submit" title="Search">
                             <i className="fa-solid fa-search"></i>
                         </button>
 
-                        <input type="search" name="s" placeholder="Cerca" defaultValue="" />
+                        <input type="search" name="s" placeholder="Search" defaultValue="" />
                         <ul pgs="search-suggestions"></ul>
                     </form>
 
-                    <button type="button" pgs="modal-close buttonIcon">
+                    <button type="button" pgs="modal-close button" pgs-option="buttonIcon">
                         <i className="fa-solid fa-close"></i>
                     </button>
                 </div>

package/{templates → reference}/react/components/slides.jsx

@@ -1,7 +1,7 @@
 const slides = [
-    ["Slide uno", "Contenuto della prima slide.", "https://placehold.co/800x500?text=Slide+1", "Slide 1"],
-    ["Slide due", "Contenuto della seconda slide.", "https://placehold.co/800x500?text=Slide+2", "Slide 2"],
-    ["Slide tre", "Contenuto della terza slide.", "https://placehold.co/800x500?text=Slide+3", "Slide 3"],
+    ["Slide uno", "First slide content.", "https://placehold.co/800x500?text=Slide+1", "Slide 1"],
+    ["Slide due", "Second slide content.", "https://placehold.co/800x500?text=Slide+2", "Slide 2"],
+    ["Slide tre", "Third slide content.", "https://placehold.co/800x500?text=Slide+3", "Slide 3"],
 ];
 
 export default function Slides() {
@@ -12,7 +12,7 @@ export default function Slides() {
                     <li key={title}>
                         <article pgs="card flexColumn">
                             <img pgs="card-img imgCover" src={src} alt={alt} />
-                            <div pgs="flexColumnTexts">
+                            <div pgs="flexColumn">
                                 <h3>{title}</h3>
                                 <p>{text}</p>
                             </div>

package/{templates → reference}/react/components/stepTabs.jsx

@@ -1,29 +1,29 @@
 export default function StepTabs() {
     return (
-        <div pgs="stepTabs flexColumnElements">
+        <div pgs="stepTabs flexColumn gapElements">
             <div pgs="stepTabs-dots" aria-label="Avanzamento"></div>
 
             <div pgs="stepTabs-container">
-                <section pgs="tab flexColumnTexts" tabIndex="-1" pgs-option="tabIcon[fa-user]">
-                    <h3>Dati personali</h3>
-                    <p>Contenuto del primo tab.</p>
+                <section pgs="tab flexColumn" tabIndex="-1" pgs-option="tabIcon[fa-user]">
+                    <h3>Personal details</h3>
+                    <p>First tab content.</p>
                 </section>
 
-                <section pgs="tab flexColumnTexts" tabIndex="-1" pgs-option="tabIcon[fa-list-check]">
-                    <h3>Preferenze</h3>
-                    <p>Contenuto del secondo tab.</p>
+                <section pgs="tab flexColumn" tabIndex="-1" pgs-option="tabIcon[fa-list-check]">
+                    <h3>Preferences</h3>
+                    <p>Second tab content.</p>
                 </section>
 
-                <section pgs="tab flexColumnTexts" tabIndex="-1" pgs-option="tabIcon[fa-check]">
-                    <h3>Conferma</h3>
-                    <p>Contenuto del terzo tab.</p>
+                <section pgs="tab flexColumn" tabIndex="-1" pgs-option="tabIcon[fa-check]">
+                    <h3>Confirmation</h3>
+                    <p>Third tab content.</p>
                 </section>
             </div>
 
             <div pgs="flexRow">
                 <button pgs="stepTabs-prev button" type="button">
                     <i className="fa-solid fa-arrow-left" aria-hidden="true"></i>
-                    Indietro
+                    Back
                 </button>
 
                 <button pgs="stepTabs-restart button" type="button">
@@ -31,7 +31,7 @@ export default function StepTabs() {
                 </button>
 
                 <button pgs="stepTabs-next button" pgs-option="buttonReverse" type="button">
-                    Avanti
+                    Next
                     <i className="fa-solid fa-arrow-right" aria-hidden="true"></i>
                 </button>
             </div>

package/reference/react/components/summary.jsx

@@ -0,0 +1,18 @@
+export default function Summary() {
+    return (
+        <div pgs="summary">
+            <div pgs="summary-content">
+                <p>
+                    This demonstration text is long enough to span multiple lines and show the summary component behavior. Content can include text, links, and other inline elements without requiring additional markup.
+                </p>
+                <p>
+                    When content exceeds three lines, a button is shown to expand or collapse the visible area.
+                </p>
+            </div>
+
+            <button pgs="summary-button" type="button">
+                Show more
+            </button>
+        </div>
+    );
+}

package/{templates → reference}/react/components/table.jsx

@@ -4,7 +4,7 @@ export default function Table() {
             <table>
                 <thead>
                     <tr>
-                        <th>Nome</th>
+                        <th>Name</th>
                         <th>Stato</th>
                         <th>Data</th>
                     </tr>
@@ -13,7 +13,7 @@ export default function Table() {
                 <tbody>
                     <tr>
                         <td>Elemento uno</td>
-                        <td>Attivo</td>
+                        <td>Active</td>
                         <td>2026-01-01</td>
                     </tr>
                     <tr>

package/{templates → reference}/react/components/tooltip.jsx

@@ -1,7 +1,7 @@
 export default function Tooltip() {
     return (
         <span pgs="dropdown tooltip">
-            <button pgs="dropdown-button buttonMini tooltip-button" title="open-tooltip" type="button">
+            <button pgs="dropdown-button button tooltip-button" pgs-option="buttonMini" title="open-tooltip" type="button">
                 <i className="fa-solid fa-info"></i>
             </button>
             <div pgs="dropdown-content tooltip-content">

package/{templates → reference}/react/layout/pageShell.jsx

@@ -4,7 +4,7 @@ function Aside() {
     return (
         <aside pgs="pageShell-aside">
             <div pgs="pageShell-aside-scroll">
-                <div pgs="flexColumnTexts">
+                <div pgs="flexColumn">
                     <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Ab modi ut sunt est illum accusantium dolores eum aut cum itaque.</p>
                 </div>
             </div>
@@ -15,7 +15,7 @@ function Aside() {
 function MainContent() {
     return (
         <main pgs="pageShell-content">
-            <section pgs="flexColumnElements" id="sezione-uno">
+            <section pgs="flexColumn gapElements" id="sezione-uno">
                 <strong>Lorem ipsum</strong>
                 <p>{contentText}</p>
             </section>

package/reference/react/layout/responsive.jsx

@@ -0,0 +1,61 @@
+const flexColumns = [
+    ["Column one", "First flex column."],
+    ["Column two", "Second flex column."],
+    ["Column three", "Third flex column."],
+];
+
+const gridColumns = [
+    ["Column one", "First grid column."],
+    ["Column two", "Second grid column."],
+    ["Column three", "Third grid column."],
+    ["Column four", "Fourth grid column."],
+];
+
+function Column({ title, text }) {
+    return (
+        <article pgs="box flexColumn">
+            <strong>{title}</strong>
+            <p>{text}</p>
+        </article>
+    );
+}
+
+export default function Responsive() {
+    return (
+        <div pgs="flexColumn gapSections">
+            <section>
+                <strong>Flex</strong>
+                <div pgs="flexRow" pgs-option="column-2 m2e">
+                    {flexColumns.map(([title, text]) => (
+                        <Column key={title} title={title} text={text} />
+                    ))}
+                </div>
+            </section>
+
+            <section>
+                <strong>Grid</strong>
+                <div pgs="grid" pgs-option="column-4 m2e">
+                    {gridColumns.map(([title, text]) => (
+                        <Column key={title} title={title} text={text} />
+                    ))}
+                </div>
+            </section>
+
+            <section pgs="flexRow">
+                <strong>Gap</strong>
+                <div pgs="flexRow gapTexts wrap">
+                    <span pgs="box">Text gap</span>
+                    <span pgs="box">Text gap</span>
+                </div>
+                <div pgs="flexRow gapElements wrap">
+                    <span pgs="box">Element gap</span>
+                    <span pgs="box">Element gap</span>
+                </div>
+                <div pgs="flexRow gapSections nowrap">
+                    <span pgs="box">Section gap</span>
+                    <span pgs="box">Section gap</span>
+                </div>
+            </section>
+        </div>
+    );
+}

package/reference/react/layout/section.jsx

@@ -0,0 +1,44 @@
+export default function Section() {
+    return (
+        <div pgs="flexColumn gapSections">
+            <section pgs="section flexColumn gapElements">
+                <div pgs="container flexColumn">
+                    <strong>Standard section</strong>
+                    <p>Centered content inside a MyPGS section.</p>
+                </div>
+            </section>
+
+            <section pgs="sectionFull flexColumn gapElements">
+                <div pgs="container flexColumn">
+                    <strong>Full-width section</strong>
+                    <p>Centered content inside a MyPGS section.</p>
+                </div>
+            </section>
+
+            <section pgs="sectionSpecificity flexColumn gapElements">
+                <div pgs="container flexColumn">
+                    <strong>Specificity section</strong>
+                    <p>Centered content inside a MyPGS section.</p>
+                </div>
+                <div pgs="sectionSpecificity-child container flexColumn">
+                    <strong>Specificity-child section</strong>
+                    <p>Centered content inside a MyPGS section.</p>
+                </div>
+            </section>
+
+            <section pgs="sectionMax flexColumn gapElements" style={{ backgroundColor: "var(--color-primary-soft)" }}>
+                <div pgs="container flexColumn">
+                    <strong>Max-width section</strong>
+                    <p>Centered content inside a MyPGS section.</p>
+                </div>
+            </section>
+
+            <section pgs="sectionNoPadding flexColumn gapElements">
+                <div pgs="container flexColumn">
+                    <strong>No-padding section</strong>
+                    <p>Centered content inside a MyPGS section.</p>
+                </div>
+            </section>
+        </div>
+    );
+}

package/{templates → reference}/react/patterns/cookieConsent.jsx

@@ -8,11 +8,11 @@ export default function CookieConsent({
 
     return (
         <div id="cookieConsent" pgs="cookieConsent" role="dialog" aria-modal="true" data-ga-id={gaMeasurementId} hidden tabIndex="-1">
-            <p><i className="fa-duotone fa-solid fa-cookie-bite"></i> Cookie e privacy <br /></p>
+            <p><i className="fa-duotone fa-solid fa-cookie-bite"></i> Cookies and privacy <br /></p>
             <h2>La tua privacy prima di tutto</h2>
 
             <p>
-                Utilizziamo cookie tecnici per offrire il servizio e, previo consenso, cookie analitici di
+                We use essential cookies to provide the service and, with your consent, analytics cookies from
                 <strong>Google Analytics</strong> per misurare in modo anonimo il traffico e migliorare i contenuti.
                 Puoi modificare la scelta in qualsiasi momento.
             </p>
@@ -22,17 +22,17 @@ export default function CookieConsent({
                 <a href={cookiePolicyUrl} target="_blank" rel="noopener noreferrer">Cookie Policy</a>
             </p>
 
-            <div pgs="cookieConsent-panel flexColumn" role="group" aria-label="Preferenze cookie">
+            <div pgs="cookieConsent-panel flexColumn" role="group" aria-label="Cookie preferences">
                 <div pgs="flexRow nowrap cookieConsent-featureEssential">
                     <div>
                         <p>
                             <strong>Cookie tecnici</strong>
                             <br />
-                            <small>Sempre attivi per garantire il corretto funzionamento del sito.</small>
+                            <small>Always active to ensure the website works correctly.</small>
                         </p>
                     </div>
 
-                    <span pgs="cookieConsent-panel-badge">Attivi</span>
+                    <span pgs="cookieConsent-panel-badge">Active</span>
                 </div>
 
                 <div pgs="flexRow cookieConsent-featureAnalytics">
@@ -40,7 +40,7 @@ export default function CookieConsent({
                         <p>
                             <strong>Analytics</strong>
                             <br />
-                            <small>Dati di navigazione raccolti in forma aggregata per statistiche anonime.</small>
+                            <small>Browsing data collected in aggregate form for anonymous statistics.</small>
                         </p>
 
                         <input type="checkbox" pgs="cookieConsent-toggleAnalytics" aria-label="Abilita Google Analytics" />
@@ -50,11 +50,11 @@ export default function CookieConsent({
 
             <div pgs="flexRow">
                 <button type="button" pgs="button cookieConsent-actionReject">
-                    <i className="fa-solid fa-duotone fa-sliders"></i>Solo selezionati
+                    <i className="fa-solid fa-duotone fa-sliders"></i>Selected only
                 </button>
 
-                <button type="button" pgs="buttonStrong cookieConsent-actionAccept">
-                    <i className="fa-solid fa-check"></i> Accetta tutto
+                <button type="button" pgs="button cookieConsent-actionAccept" pgs-option="buttonStrong">
+                    <i className="fa-solid fa-check"></i> Accept all
                 </button>
             </div>
         </div>

package/{templates → reference}/react/patterns/footer.jsx

@@ -1,12 +1,12 @@
 export default function Footer() {
     return (
         <footer pgs="footer">
-            <button pgs="button toggleDarkmode" type="button" aria-label="Cambia tema">
+            <button pgs="button toggleDarkmode" type="button" aria-label="Change theme">
                 <i className="fa-solid fa-moon"></i>
             </button>
 
             <section pgs="footer-top section">
-                <div pgs="footer-top-content flex-3">
+                <div pgs="footer-top-content flexRow" pgs-option="column-3">
                     <div pgs="footer-brand">
                         <a aria-label="Logo" pgs="logo" href="/">
                             <span pgs="logo-text">MyPGS</span>
@@ -28,11 +28,11 @@ export default function Footer() {
 
             <section pgs="footer-legal section">
                 <div pgs="footer-legal-content">
-                    <button type="button" pgs="button cookieConsent-actionOpen">Preferenze cookie</button>
+                    <button type="button" pgs="button cookieConsent-actionOpen">Cookie preferences</button>
                     <p><a href="">Privacy Policy</a></p>
                     <p><a href="">Cookie Policy</a></p>
                     <p><a href="">Termini e Condizioni</a></p>
-                    <p>© 2026 MyPgs. Nessun diritto riservato.</p>
+                    <p>© 2026 MyPgs. No rights reserved.</p>
                 </div>
             </section>
         </footer>

package/{templates → reference}/react/patterns/header.jsx

@@ -30,7 +30,7 @@ export default function Header() {
                 </div>
 
                 <div pgs="header-element-onlyDesktop">
-                    <nav pgs="menu" pgs-option="horizontal menuHeader" aria-label="Menu principale">
+                    <nav pgs="menu" pgs-option="horizontal menuHeader" aria-label="Main menu">
                         <ul>
                             <li><a href="/">Home</a></li>
                             <li><a href="#componenti">Componenti</a></li>
@@ -42,17 +42,17 @@ export default function Header() {
                 <div pgs="header-element-onlyMobile"></div>
 
                 <div pgs="header-element-alwaysOnLast">
-                    <button pgs="buttonIcon toggleDarkmode" type="button" aria-label="Cambia tema">
+                    <button pgs="button toggleDarkmode" pgs-option="buttonIcon" type="button" aria-label="Change theme">
                         <i className="fa-solid fa-moon"></i>
                     </button>
                 </div>
 
                 <div pgs="header-element-hamburger modal" pgs-option="containerPGS[header] ">
-                    <button pgs="buttonIcon modal-button modal-close header-element-hamburger-button" type="button"></button>
+                    <button pgs="button modal-button modal-close header-element-hamburger-button" pgs-option="buttonIcon" type="button"></button>
 
                     <dialog pgs="modal-dialog" pgs-option="right">
                         <div pgs="modal-dialog-content">
-                            <nav pgs="menu" pgs-option="vertical menuHeader" aria-label="Menu mobile">
+                            <nav pgs="menu" pgs-option="vertical menuHeader" aria-label="Mobile menu">
                                 <ul>
                                     <li><a href="/">Home</a></li>
                                     <li><a href="#componenti">Componenti</a></li>

package/scripts/generate-component-docs.js

@@ -6,7 +6,7 @@ const fs = require("fs");
 const path = require("path");
 
 const PROJECT_ROOT = path.resolve(__dirname, "..");
-const TEMPLATE_ROOT = path.join(PROJECT_ROOT, "templates", "html");
+const REFERENCE_ROOT = path.join(PROJECT_ROOT, "reference", "html");
 const DOCS_ROOT = path.join(PROJECT_ROOT, "docs");
 const MANAGED_DOC_DIRECTORIES = ["components", "layout", "patterns"]
     .map(directory => path.join(DOCS_ROOT, directory));
@@ -18,7 +18,7 @@ const SOURCE_ROOTS = [
 const TAG_ORDER = ["title", "description", "pgs", "pgs-option", "pgs-state", "api", "related", "return"];
 const LIST_TAGS = new Set(["pgs", "pgs-option", "pgs-state", "api", "related"]);
 const REQUIRED_TAGS = ["title", "description", "pgs"];
-const GENERATED_MARKER = /^<!-- File generato automaticamente da (templates\/html\/.+\.html)\. Modificare \1 e rieseguire npm run docs:generate\. -->$/;
+const GENERATED_MARKER = /^<!-- (?:Automatically generated from ((?:reference|templates)\/html\/.+\.html)\. Edit \1 and run npm run docs:generate again\.|File generato automaticamente da ((?:reference|templates)\/html\/.+\.html)\. Modificare \2 e rieseguire npm run docs:generate\.) -->$/;
 
 function toPosix(value) {
     return value.split(path.sep).join("/");
@@ -29,7 +29,7 @@ function relativeToProject(value) {
 }
 
 function getOutputPath(template) {
-    const relativeTemplate = path.relative(TEMPLATE_ROOT, template);
+    const relativeTemplate = path.relative(REFERENCE_ROOT, template);
     return path.join(DOCS_ROOT, relativeTemplate.replace(/\.html$/i, ".md"));
 }
 
@@ -441,14 +441,14 @@ function renderList(items) {
 
 function renderMarkdown(template, documentation, markup) {
     const relativeTemplate = relativeToProject(template);
-    const marker = `<!-- File generato automaticamente da ${relativeTemplate}. Modificare ${relativeTemplate} e rieseguire npm run docs:generate. -->`;
+    const marker = `<!-- Automatically generated from ${relativeTemplate}. Edit ${relativeTemplate} and run npm run docs:generate again. -->`;
     const sections = [marker, "", `# ${documentation.title}`, "", documentation.description];
     const sectionMap = [
         ["PGS", documentation.pgs],
         ["PGS Options", documentation["pgs-option"]],
         ["PGS States", documentation["pgs-state"]],
-        ["API JavaScript", documentation.api],
-        ["Elementi correlati", documentation.related],
+        ["JavaScript API", documentation.api],
+        ["Related elements", documentation.related],
     ];
 
     sectionMap.forEach(([title, items]) => {
@@ -460,7 +460,7 @@ function renderMarkdown(template, documentation, markup) {
 
     const runs = [...markup.matchAll(/`+/g)].map(match => match[0].length);
     const fence = "`".repeat(Math.max(3, (runs.length ? Math.max(...runs) : 0) + 1));
-    sections.push("", "## Esempio", "", `${fence}html`, markup, fence, "");
+    sections.push("", "## Example", "", `${fence}html`, markup, fence, "");
     return sections.join("\n");
 }
 
@@ -477,11 +477,11 @@ function printErrors(errors) {
 }
 
 function main() {
-    const templates = walkFiles(TEMPLATE_ROOT, file => path.extname(file).toLowerCase() === ".html");
+    const references = walkFiles(REFERENCE_ROOT, file => path.extname(file).toLowerCase() === ".html");
     const errors = [];
     const outputPaths = new Map();
 
-    templates.forEach(template => {
+    references.forEach(template => {
         const output = toPosix(path.relative(DOCS_ROOT, getOutputPath(template))).toLowerCase();
         if (!outputPaths.has(output)) outputPaths.set(output, []);
         outputPaths.get(output).push(template);
@@ -493,7 +493,7 @@ function main() {
 
     const sources = loadSources();
     const allSourceContent = sources.map(source => source.content).join("\n");
-    const parsedTemplates = templates.map(template => {
+    const parsedReferences = references.map(template => {
         const source = fs.readFileSync(template, "utf8");
         const parsed = parseDocumentationBlock(template, source);
         errors.push(...validateTemplate(template, parsed, sources, allSourceContent));
@@ -509,7 +509,7 @@ function main() {
     const expected = new Set();
     const counts = { created: 0, updated: 0, unchanged: 0, removed: 0 };
 
-    parsedTemplates.forEach(({ template, parsed }) => {
+    parsedReferences.forEach(({ template, parsed }) => {
         const output = getOutputPath(template);
         const content = renderMarkdown(template, parsed.data, parsed.markup);
         expected.add(path.resolve(output));
@@ -546,7 +546,7 @@ function main() {
         });
 
     console.log("");
-    console.log(`Riepilogo: ${templates.length} template validati; ${counts.created} creati; ${counts.updated} aggiornati; ${counts.unchanged} invariati; ${counts.removed} obsoleti rimossi.`);
+    console.log(`Riepilogo: ${references.length} riferimenti HTML validati; ${counts.created} creati; ${counts.updated} aggiornati; ${counts.unchanged} invariati; ${counts.removed} obsoleti rimossi.`);
 }
 
 try {

package/assets/scss/layout/_flex.scss

@@ -1,49 +0,0 @@
-@use "../mixin/mixin" as *;
-
-
-//= FLEX 
-
-//== FLEX COLUMN
-[pgs~=flexColumn] {
-    @include flexColumn();
-}
-
-[pgs~=flexColumnTexts] {
-    @include flexColumn();
-}
-
-[pgs~=flexColumnElements] {
-    @include flexColumnElements();
-}
-
-[pgs~=flexColumnSections] {
-    @include flexColumnSections();
-}
-
-//== FLEX ROW
-[pgs~=flexRow] {
-    @include flexRow();
-}
-
-[pgs~=flexRowTexts] {
-    @include flexRow();
-}
-
-[pgs~=flexRowElements] {
-    @include flexRowElements();
-}
-
-[pgs~=flexRowSection] {
-    @include flexRowSection();
-}
-
-//== responsive flex
-@for $i from 1 through 10 {
-    [pgs~=flex-#{$i}] {
-        @include rFlex($i);
-    }
-
-    [pgs~=flex-#{$i}-m2e] {
-        @include rFlex($i, true);
-    }
-}

package/assets/scss/layout/_gap.scss

@@ -1,21 +0,0 @@
-//# GAP
-[pgs~=gapTexts] {
-    gap: var(--gap-texts);
-}
-
-[pgs~=gapElements] {
-    gap: var(--gap-elements);
-}
-
-[pgs~=gapSections] {
-    gap: var(--gap-sections);
-}
-
-//# wrap
-[pgs~=nowrap] {
-    flex-wrap: nowrap;
-}
-
-[pgs~=wrap] {
-    flex-wrap: wrap;
-}

package/assets/scss/layout/_grid.scss

@@ -1,13 +0,0 @@
-@use "../mixin/mixin" as *;
-
-//== GRID
-@for $i from 1 through 10 {
-    [pgs~=grid-#{$i}] {
-        @include rGrid($i);
-    }
-
-    [pgs~=grid-#{$i}-m2e] {
-        @include rGrid($i, true);
-    }
-}
-