01 | Typography

Headings and paragraphs

Heading 1 - size: 30px

Heading 2 - size: 24px

Heading 3 - size: 18px

Heading 4 - size 16px

Paragraph - Roboto, size: 16px


Font-size

Lorem ipsum

Lorem ipsum

Lorem ipsum

Lorem ipsum

Lorem ipsum

Lorem ipsum


List

Seznamy:

  • Lorem ipsum
  • Lorem ipsum
  • Lorem ipsum
  1. An unordered list 1
  2. An unordered list 2
  3. An unordered list 3
02 | Buttons

Primary

Button

Secondary

Button

Inverse

Button

Inactive

Button



Share button


Copy button

03 | Colors
Default
#262626
Secondary
#7C7C7C
Link
#007FAF
Gradient
#FF359D ⇢ #E20074

#529AD6
#7C7C7C
#007FAF
#FFFFFF
#FF9A1E
#71CE06

#000000
#4B4B4B
#A4A4A4
#D0D0D0
#E6E6E6
#EDEDED
04 | Happy Fridays

HF - Kartička

Pátky v apce

20. 3.

20% sleva na společenské hry
Happy Fridays - ikonka

Chci slevu

<div class="container max margin-large">
<div class="row">
<div class="col-xs-12">
<h1 class="happy-friday"><strong>Pátky v apce</strong></h1>
<div class="background-stripe">
<p class="day">20. 3.</p>
<div class="current-gift">20% sleva na společesnké hry</div>
<img src="https://www.t-mobile.cz/dcpublic/HF_discount.png" alt="Happy Fridays - ikonka" class="img-responsive present">
</div>
<p class="text-center" style="margin-bottom: 0px;"><a class="btn btn-app" style="margin: 20px 0;" href="https://www.t-mobile.cz/hf-detail">Chci slevu</a></p>
</div>
</div>


HF - Countdown

Pátky v apce

27. 3.

Do pátku zbývá

dny
hodiny
minuty


<div class="container max margin-large">
<div class="row">
<div class="col-xs-12">
<h1 class="happy-friday-cd"><strong>Pátky v apce</strong></h1>
<div class="background-stripe-cd" style="position: relative;">
<h3 class="day-cd">27. 3.</h3>
<img src="https://www.t-mobile.cz/dcpublic/present-fridays.png" class="img-responsive present-cd">
<h2 class="left">Do pátku zbývá</h2>
<div class="row countdown">
<div class="col-xs-4 countdown_box">
dny <br>
<span id="days"></span>
</div>
<div class="col-xs-4 countdown_box middle">
hodiny <br>
<span id="hours"></span>
</div>
<div class="col-xs-4 countdown_box">
minuty <br>
<span id="minutes"></span>
</div>
</div>
<p id="show"></p>
</div>
</div>
</div>
05 | Practical examples

Nadpis H1 + text

Aenean tristique lacus non lacinia suscipit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas at placerat justo. Proin neque libero, aliquet nec sodales non, pulvinar a turpis. In sit amet nisl imperdiet urna aliquam vestibulum in eu augue.

Chci slevu

Nadpis H2 + infobox


<div class="container max margin-large">
<div class="row">
<div class="col-xs-12">
<div class="background-white">
<h1>Nadpis H1 + text</h1>
<p>Aenean tristique lacus non lacinia suscipit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas at placerat justo. Proin neque libero, aliquet nec sodales non, pulvinar a turpis. In sit amet nisl imperdiet urna aliquam vestibulum in eu augue.</p>
<p><a class="btn btn-app" style="margin: 13px 0 20px 0;" href="https://www.t-mobile.cz/hf-detail">Chci slevu</a></p>
<h2 class="text-left">Nadpis H2 + infobox</h2>
<div class="alert alert-flex background-gray-lighter text-large" role="alert">
<div class="alert-content">
<p class="text-left">Nová aplikace měla v lednu 546 465 zákazníků. Výherce jsme již kontaktovali. Gratulujeme!</p>
</div>
</div>
</div>
</div>
</div>
</div>

T-Mobile nabídky


<div class="container max">
<div class="row">
<div class="col-xs-12">
<div class="background-white">
<h1 class="h2">T-Mobile nabídky</h1>
<div class="row middle-xs like-table-row js-clickable">
<div class="col-xs-10">
<div class="v-center">
<img src="https://www.t-mobile.cz/dcpublic/fotbal_ikonka_ND.png" alt="Fanklub fotbalové reprezentace - ikona" width="40" height="40" style="margin-right: 15px;">
<h4 class="no-margin">Fanklub fotbalové reprezentace</h4>
</div>
</div>
<div class="col-xs-2 text-right">
<a href="/fanklub-fotbal-v-srdci">
<i class="ico-chevron-right right fill-light-blue" data-ico-width="24" data-ico-height="12" aria-hidden="true"><svg class="svg-chevron-right fill-blue" width="24" height="12"><use xlink:href="#chevron-right"></use></svg></i>
</a>
</div>
</div>
<div class="row middle-xs like-table-row js-clickable">
<div class="col-xs-10">
<div class="v-center">
<img src="https://www.t-mobile.cz/dcpublic/kredit_ikonka_ND.png" alt="50% bonus na Twist kredit - ikona" width="40" height="40" style="margin-right: 15px;">
<h4 class="no-margin">50% bonus na Twist kredit</h4>
</div>
</div>
<div class="col-xs-2 text-right">
<a href="/twist-kredit-bonus-25">
<i class="ico-chevron-right right fill-light-blue" data-ico-width="24" data-ico-height="12" aria-hidden="true"><svg class="svg-chevron-right fill-blue" width="24" height="12"><use xlink:href="#chevron-right"></use></svg></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>

Podmínky


<div class="container max">
 <div class="row">
  <div class="col-xs-12">
   <div class="background-white">
    <h2 id="podminky">Podmínky</h2>
     <div class="row middle-xs like-table-row js-clickable">
      <div class="col-xs-8 col-sm-10">
       <div class="v-center">
        <i class="ico-pdf" data-ico-width="30" data-ico-height="30"><svg class="svg-pdf" width="30" height="30"><use xlink:href="#pdf"></use></svg></i>
        <h4>Podmínky soutěže <span class="text-gray-dark no-bold text-small">(108 kB)</span></h4>
       </div>
      </div>
      <div class="col-xs-4 col-sm-2 text-right">
       <a href="https://www.seznam.cz/soutez-3gb/obchodni-podminky" class="bold">Zobrazit</a>
      </div>
      </div>
      </div>
     </div>
    </div>
   </div>
  </div>
 </div>
</div>
Telefon Honor 10 - obrázek k soutěži

V únoru můžete vyhrát:

3x telefon


<div class="container max margin-large">
 <div class="row">
  <div class="col-xs-12">
   <div class="background-darkblue">
    <img class="img-responsive center-block" src="https://www.t-mobile.cz/dcpublic/soutez_brezen_768x462.jpg" alt="Telefon Honor 10 - obrázek k soutěži">
    <h1 class="h3">V únoru můžete vyhrát:</h1>
    <p>3x telefon</p>
   </div>
  </div>
 </div>
</div>

3 možnosti datové svobody

Vyberte si tarif s neomezenými daty podle svých potřeb.


20 GB

plnou rychlostí

3 Mbit/s

rychlost po vyčerpání 20 GB, stačí pro neomezené sledování videa ve standardním rozlišení (SD)

30 GB

datový limit v EU


50 GB

plnou rychlostí

10 Mbit/s

rychlost po vyčerpání 50 GB, skvělé pro neomezené sledování videa ve vysokém rozlišení (HD)

35 GB

datový limit v EU


plnou rychlostí v ČR

40 GB

datový limit v EU

500 MB

navíc pro připojení v zahraničí v zóně Svět 1


Další informace o neomezených datech v tarifu najdete zde.

Chci svobodu

Co pro vás máme?

Zamilované uvítací tóny zdarma pouze dnes 14. 2. - vyberte si song podle svého srdce a potěšte všechny, kdo vám zavolají.

Jak na to?

Tóny objednáte pomocí kódu uvedeného pod uvítacím tónem. SMS pošlete na 4714.

Lewis Capaldi: Someone You Loved - brázek
Lewis Capaldi
Someone You Loved
Tvar SMS: VALENTYN1
Whitney Houston: I will always love you - brázek
Whitney Houston
I Will Always Love You
Tvar SMS: VALENTYN2
Selena Gomez: Lose You To Love Me - brázek
Selena Gomez
Lose You To Love Me
Tvar SMS: VALENTYN3
Ellie Goulding: Love me like you do - brázek
Ellie Goulding
Love Me Like You Do
Tvar SMS: VALENTYN4