@orangesk/cms-templates 1.0.0-beta.0 → 1.0.0-beta.2

package/src/pages/product-page-b2c-prima-volba.mdx

@@ -1,425 +0,0 @@
----
----
-
-import {
-  Accordion,
-  AccordionItem,
-  AnchorNavigation,
-  Bar,
-  BarItem,
-  BlockAction,
-  BlockActionControl,
-  BlockActionOverride,
-  Breadcrumbs,
-  Button,
-  Buttons,
-  Card,
-  CardSection,
-  Carousel,
-  Controls,
-  Divider,
-  Expander,
-  Grid,
-  GridCol,
-  Icon,
-  IconList,
-  Link,
-  Pagination,
-  Pictogram,
-  Pill,
-  PromoBanner,
-  Section,
-  Tag,
-} from "@orangesk/orange-design-system";
-import Page from "../layouts/DefaultPage";
-import { HeroSection } from "../components/HeroSection";
-import { ArticleCard } from "../components/ArticleCard";
-import { FileCard } from "../components/FileCard";
-import { FAQ } from "../components/FAQ";
-import { PageHeadingSimple } from "../components/PageHeading";
-import { SliderCard } from "./product-page-b2c-online-security.mdx";
-import { ActionTiles } from "../components/ActionTile";
-
-export const Product = () => (
-  <Section spacing="default" color="background-secondary" id="prima-volba">
-    <Grid rowGapSize="large">
-      <GridCol size={{ xs: 12, lg: 6 }} align="middle">
-        <h2 className="h4 mb-large">
-          Predplatená karta <br />{" "}
-          <span className="text-accent thin h2">Prima Voľba</span>
-        </h2>
-        <p className="mb-large">
-          Prima Voľba je dobíjacia karta od Orangeu. S kartou môžete volať,
-          SMSkovať a dátovať výhodne za kredit.
-        </p>
-        <p className="text-secondary mb-large">
-          Bez nutnosti sťahovania dodatočného softvéru a aplikácie.
-        </p>
-        <Buttons isStackedOnXs>
-          <Button type="primary" className="mt-small" size="large">
-            Chcem Prima Voľba
-          </Button>
-          <Button className="mt-small" size="large">
-            Viac o karte
-          </Button>
-        </Buttons>
-      </GridCol>
-      <GridCol size={{ xs: 12, lg: 6 }} align="middle">
-        <Bar align="center">
-          <BarItem>
-            <Pill size="xxlarge" color="surface-primary">
-              <Icon name="mobile-data-toggle" size="large" />
-            </Pill>
-          </BarItem>
-          <BarItem isFilling className="h3">
-            30 GB dát v 5G sieti
-          </BarItem>
-        </Bar>
-        <Bar align="center">
-          <BarItem>
-            <Pill size="xxlarge" color="surface-primary">
-              <Icon name="top-up-euro" size="large" />
-            </Pill>
-          </BarItem>
-          <BarItem isFilling className="h3">
-            Nekonečné hovory
-          </BarItem>
-        </Bar>
-        <Bar align="center">
-          <BarItem>
-            <Pill size="xxlarge" color="surface-primary">
-              <Icon name="call" size="large" />
-            </Pill>
-          </BarItem>
-          <BarItem isFilling className="h3">
-            5 € kredit
-          </BarItem>
-        </Bar>
-      </GridCol>
-    </Grid>
-  </Section>
-);
-
-export const PictogramSection = () => (
-  <Section spacing="default" id="kde-ju-ziskat">
-    <h2 className="h2 thin align-center">Prima kartu môžete získať</h2>
-    <Grid>
-      <GridCol
-        size={{ xs: 12, md: 4 }}
-        className="d-flex flex-column align-items-center"
-      >
-        <Pictogram
-          name="pictogram-random-damage"
-          size="xxlarge"
-          className="mb-xsmall"
-        />
-        <p>Cez e-shop</p>
-      </GridCol>
-      <GridCol
-        size={{ xs: 12, md: 4 }}
-        className="d-flex flex-column align-items-center"
-      >
-        <Pictogram
-          name="pictogram-theft"
-          size="xxlarge"
-          className="mb-xsmall"
-        />
-        <p>Zákaznícka linka 905</p>
-      </GridCol>
-      <GridCol
-        size={{ xs: 12, md: 4 }}
-        className="d-flex flex-column align-items-center"
-      >
-        <Pictogram
-          name="pictogram-water-damage"
-          size="xxlarge"
-          className="mb-xsmall"
-        />
-        <p>Partnerské predajné miesta</p>
-      </GridCol>
-    </Grid>
-  </Section>
-);
-
-export const Roaming = () => (
-  <Section spacing="default" className="is-dark" id="dalsie-benefity">
-    <PromoBanner image="/assets/roaming-prima-karta.png">
-      <p className="mb-xsmall">Svetové dáta vás spájajú aj vo svete</p>
-      <h2 className="h1 thin mb-medium">
-        Prvé roamingové balíky pre vašu
-        <span className="text-accent ml-small">{"  "}Prima kartu</span>
-      </h2>
-      <p className="mb-large text-secondary">
-        {`Aktivujte si nové Svetové dáta aj pre vašu kartu Prima, nech sú prílety a odlety dát bezstarostné kdekoľvek na svete.`}
-      </p>
-      <Button type="primary" size="large" className="mb-none">
-        {"Chcem vedieť viac"}
-      </Button>
-    </PromoBanner>
-  </Section>
-);
-
-export const Choose = () => (
-  <Section spacing="default" id="dobijanie-kreditu">
-    <h2 className="h2 thin mb-large">{"Kedy si môžete poistenie uplatniť?"}</h2>
-    <div className="hide-md mb">
-      <Controls
-        icon="chevron-left"
-        data-carousel-controls="carousel-choose"
-        data-carousel-action="prev"
-      />
-      <Controls
-        icon="chevron-right"
-        data-carousel-controls="carousel-choose"
-        data-carousel-action="next"
-      />
-    </div>
-    <Carousel
-      id="carousel-choose"
-      data-swiper-options='{"slidesPerView":1.2,"breakpoints":{"480":{"slidesPerView":1.8} ,"768":{"slidesPerView":2.2},"1024":{"slidesPerView":3}}}'
-      items={[
-        <ArticleCard
-          title="Výhodné balíčky dát, volaní a správ"
-          description="Prispôsobte si vašu Prima kartu pomocou doplnkových balíkov, ktoré vám poskytnú objem dát, SMS alebo hovorov podľa vašej potreby za zvýhodnené ceny."
-          src="/assets/prima-volba-why-1.png"
-          alt="Image alt"
-        >
-          <BlockActionOverride>
-            <Link href="/">
-              Vybrať doplnkový balík
-              <Icon name="chevron-right" className="link__icon-right" />
-            </Link>
-          </BlockActionOverride>
-        </ArticleCard>,
-        <ArticleCard
-          title="Odmeny za pravidelné dobíjanie kreditu"
-          description="Za pravidelné navyšovanie kreditu na Prima karte vás odmeníme skvelými benefitmi. Užívajte si 10 GB víkendových dát a nekonečné víkendové volania."
-          src="/assets/prima-volba-why-2.png"
-          alt="Image alt"
-        >
-          <BlockActionOverride>
-            <Link href="/">
-              Viac o odmenách za dobíjanie
-              <Icon name="chevron-right" className="link__icon-right" />
-            </Link>
-          </BlockActionOverride>
-        </ArticleCard>,
-        <ArticleCard
-          title="Všetko máte aj v apke"
-          description="Aktivujte si doplnkové balíčky, dobíjajte si a kontrolujte kredit na pár klikov v aplikácii Môj Orange."
-          src="/assets/prima-volba-why-3.png"
-          alt="Image alt"
-        />,
-      ]}
-      showScrollbar={true}
-      bleedRight
-    />
-  </Section>
-);
-
-export const addons = [
-  {
-    title: "Denný balík 1 GB",
-    description:
-      "Balík si môžete zakúpiť zaslaním SMS v tvare „DEN1GB A“ na číslo 445. Platnosť balíka je do polnoci dňa aktivácie.",
-    icon: "suitcase",
-    price: "1,03",
-  },
-  {
-    title: "1 GB",
-    description:
-      "Balík si môžete zakúpiť zaslaním SMS v tvare „1GB A“ na číslo 445. Platnosť balíka je 30 dní od poslednej aktivácie.",
-    icon: "internet-usage",
-    price: "3,08",
-  },
-  {
-    title: "3 GB",
-    description:
-      "Balík si môžete zakúpiť zaslaním SMS v tvare „1GB A“ na číslo 445. Platnosť balíka je 30 dní od poslednej aktivácie.",
-    icon: "internet-usage",
-    price: "5,13",
-  },
-  {
-    title: "5 GB",
-    description:
-      "Balík si môžete zakúpiť zaslaním SMS v tvare „1GB A“ na číslo 445. Platnosť balíka je 30 dní od poslednej aktivácie.",
-    icon: "internet-usage",
-    price: "8,20",
-  },
-];
-
-export const AddonCard = (addon) => (
-  <Card>
-    <CardSection color="fill-disabled">
-      <Pill color="transparent" size="xxlarge">
-        <Icon name={addon.icon} size="large" />
-      </Pill>
-    </CardSection>
-    <CardSection>
-      <h3 className="h3">{addon.title}</h3>
-      <p>{addon.description}</p>
-      <p className="h1 normal mb-large">
-        {addon.price}
-        <span className="large bold"> &euro;/mes.</span>
-      </p>
-      <Button type="fill">Aktivovať v Môj Orange</Button>
-    </CardSection>
-  </Card>
-);
-
-export const Packages = () => (
-  <Section
-    spacing="default"
-    className="background-secondary"
-    id="doplnkove-baliky"
-  >
-    <h2 className="h2 thin mb-large">{"Doplnkové balíky"}</h2>
-    <Grid className="mb-xlarge" rowGapSize="large">
-      <GridCol size={{ xs: 12, md: 4 }}>
-        <Pill size="xxlarge" className="mb h2">
-          <span className="h3 mb-none">1</span>
-        </Pill>
-        <p className="h3 bold mb-small">Kúpte si</p>
-        <p>Kúpte si balík zaslaním SMS alebo v Zákazníckej zóne Môj Orange.</p>
-      </GridCol>
-      <GridCol size={{ xs: 12, md: 4 }}>
-        <Pill size="xxlarge" className="mb h2">
-          <span className="h3 mb-none">2</span>
-        </Pill>
-        <p className="h3 bold mb-small">Potvrdenie</p>
-        <p>
-          Obdržíte SMS, že balík bol zakúpený a jeho hodnota sa strhne z vášho
-          kreditu.
-        </p>
-      </GridCol>
-      <GridCol size={{ xs: 12, md: 4 }}>
-        <Pill size="xxlarge" className="mb h2">
-          <span className="h3 mb-none">3</span>
-        </Pill>
-        <p className="h3 bold mb-small">A znova</p>
-        <p>
-          Ak balík miniete, alebo vám vyprší jeho platnosť, môžete si zakúpiť
-          ďalší.
-        </p>
-      </GridCol>
-    </Grid>
-    <Grid className="mb-large" rowGapSize="medium">
-      <GridCol size={{ xs: 12, lg: 10 }}>
-        <Bar
-          space="small"
-          canWrap={false}
-          className="horizontal-scroll mb-none"
-          align="center"
-          role="list"
-          aria-label="Najhľadanejšie krajiny"
-        >
-          <BarItem className="mb-small mb-md-none" role="listitem">
-            <Tag className="is-active" size="large" onClick={() => null}>
-              Dátové balíky
-            </Tag>
-          </BarItem>
-          <BarItem className="mb-small mb-md-none" role="listitem">
-            <Tag size="large" onClick={() => null}>
-              SMS balíky
-            </Tag>
-          </BarItem>
-          <BarItem className="mb-small mb-md-none" role="listitem">
-            <Tag size="large" onClick={() => null}>
-              Hlasové balíky
-            </Tag>
-          </BarItem>
-          <BarItem className="mb-small mb-md-none" role="listitem">
-            <Tag size="large" onClick={() => null}>
-              Všetky
-            </Tag>
-          </BarItem>
-        </Bar>
-      </GridCol>
-      <GridCol size={{ xs: 12, lg: 2 }} className="align-lg-right">
-        <Controls
-          icon="chevron-left"
-          data-carousel-controls="carousel-addons"
-          data-carousel-action="prev"
-        />
-        <Controls
-          icon="chevron-right"
-          data-carousel-controls="carousel-addons"
-          data-carousel-action="next"
-        />
-      </GridCol>
-    </Grid>
-    <Carousel
-      id="carousel-addons"
-      data-swiper-options='{"slidesPerView":1.2,"breakpoints":{"480":{"slidesPerView":1.8} ,"768":{"slidesPerView":2.2},"1024":{"slidesPerView":3}}}'
-      items={addons.map((addon) => (
-        <AddonCard key={addon.title} {...addon} />
-      ))}
-      showScrollbar={true}
-      bleedRight
-    />
-  </Section>
-);
-
-export const Suggestions = () => {
-  return (
-    <ActionTiles
-      title="Môže sa vám hodiť"
-      tiles={[
-        "Dobiť kredit",
-        "Automatické dobitie",
-        "Ostatné možnosti dobitia",
-        "Predajné miesta",
-      ]}
-    />
-  );
-};
-
-<Page>
-  <HeroSection
-    src="/assets/prima-volba.png"
-    alt="Prima voľba"
-    title="Odviažte sa s Prima Voľbou"
-    description="S predplatenou SIM kartou Prima Voľba bez viazanosti získate až 30 GB dát na 3 mesiace pri pravidelnom dobíjaní."
-  />
-  <AnchorNavigation
-    items={[
-      {
-        href: "#prima-volba",
-        isActive: true,
-        label: "Prima Voľba",
-      },
-      {
-        href: "#kde-ju-ziskat",
-        label: "Kde ju získať",
-      },
-      {
-        href: "#dalsie-benefity",
-        label: "Dalšie benefity",
-      },
-      {
-        href: "#dobijanie-kreditu",
-        label: "Dobíjanie kreditu",
-      },
-      {
-        href: "#doplnkove-baliky",
-        label: "Doplnkové balíky",
-      },
-    ]}
-  >
-    <div className="align-lg-right mb-none ">
-      <span>5,00 &euro;</span>
-      <br />
-      <span className="text-secondary">Bez viazanosti</span>
-    </div>
-    <Button type="primary" className="mb-none">
-      {"Chcem Prima Voľba"}
-    </Button>
-  </AnchorNavigation>
-  <Product />
-  <PictogramSection />
-  <Roaming />
-  <Choose />
-  <Packages />
-  <Suggestions />
-  <FAQ />
-</Page>

package/src/pages/roaming-b2b.mdx

@@ -1,11 +0,0 @@
----
-theme: dark
-disableThemeSwitcher: true
----
-
-import Page from "../layouts/DefaultPage";
-import { RoamingB2C } from "./roaming-b2c.mdx";
-
-<Page isDark>
-  <RoamingB2C />
-</Page>