Close menu

Pattern Library

<div class="py-24">
  <div class="container--medium mx-auto px-4">
    <h2 class="head-14xl xl:leading-[10.5rem] mb-4 xl:mb-8">
      {{ title }}
    </h2>
    <div class="flex flex-wrap">
      <div class="__js-root flex items-center justify-center h-full mb-4 w-full">
        <ui-full-calendar events='{{ calendar_data }}'></ui-full-calendar>
      </div>
    </div>
    <div></div>
  </div>
</div>
context:
  title: 'Kalendář'
  calendar_data: '[{"allDay": false, "start": "2024-05-05T18:00:00+02:00", "end": "2024-05-05T21:00:00+02:00", "title": "PubQuiz", "location": "Praha, \u010cesko"}, {"allDay": true, "start": "2024-05-04T00:00:00+02:00", "end": "2024-05-05T00:00:00+02:00", "title": "Pokoj\u00ed\u010dek", "location": "Litomy\u0161l, 570 01 Litomy\u0161l, \u010cesko"}, {"allDay": true, "start": "2024-05-03T00:00:00+02:00", "end": "2024-05-04T00:00:00+02:00", "title": "Pokoj\u00ed\u010dek", "location": "Liberec, \u010cesko"}, {"allDay": true, "start": "2024-05-03T00:00:00+02:00", "end": "2024-05-04T00:00:00+02:00", "title": "Pink\u00e1ra", "location": "Karlovy Vary, \u010cesko"}, {"allDay": true, "start": "2024-05-02T00:00:00+02:00", "end": "2024-05-03T00:00:00+02:00", "title": "Pink\u00e1ra", "location": "Plze\u0148, \u010cesko"}, {"allDay": false, "start": "2024-05-01T12:00:00+02:00", "end": "2024-05-01T18:00:00+02:00", "title": "United Islands festival", "location": "St\u0159eleck\u00fd ostrov, 110 00 Praha-Praha 1, \u010cesko", "description": "<a href=\"https://www.instagram.com/p/C3-QDHCM-MB/?igsh=OWE5NXlmY3pqOHZw\" rel=\"noopener noreferrer\">instagram akce</a><a href=\"/\" rel=\"noopener noreferrer\"></a>"}, {"allDay": true, "start": "2024-05-01T00:00:00+02:00", "end": "2024-05-02T00:00:00+02:00", "title": "Pokoj\u00ed\u010dek", "location": "U Kolon\u00e1dy, Pod\u011bbrady"}, {"allDay": false, "start": "2024-04-30T14:00:00+02:00", "end": "2024-04-30T22:00:00+02:00", "title": "Zah\u00e1jen\u00ed kampan\u011b!", "location": "Mystic Skatepark \u0160tvanice, ostrov \u0160tvanice 170 00, 170 00 Praha 7, \u010cesko", "description": "<a href=\"https://www.facebook.com/events/954508859381882\" rel=\"noopener noreferrer\">facebook</a>&nbsp;ud\u00e1lost"}, {"allDay": true, "start": "2024-05-06T00:00:00+02:00", "end": "2024-05-07T00:00:00+02:00", "title": "Pink\u00e1ra", "location": "T\u00e1bor, \u010cB, P\u00edsek"}, {"allDay": true, "start": "2024-05-06T00:00:00+02:00", "end": "2024-05-07T00:00:00+02:00", "title": "Posezen\u00ed s kandid\u00e1tem", "location": "Praha 7, \u010cesko"}, {"allDay": false, "start": "2024-05-06T11:00:00+02:00", "end": "2024-05-06T17:00:00+02:00", "title": "Pokoj\u00ed\u010dek", "location": "Masarykovo N\u00e1m\u011bst\u00ed, 586 01 Jihlava 1, \u010cesko"}, {"allDay": true, "start": "2024-05-07T00:00:00+02:00", "end": "2024-05-08T00:00:00+02:00", "title": "Pokoj\u00ed\u010dek", "location": "P\u0159erov, \u010cesko"}, {"allDay": false, "start": "2024-05-07T07:00:00+02:00", "end": "2024-05-07T16:00:00+02:00", "title": "Pink\u00e1ra", "location": "Havl\u00ed\u010dk\u016fv Brod, n\u00e1dra\u017e\u00ed - Jihlava"}, {"allDay": true, "start": "2024-05-08T00:00:00+02:00", "end": "2024-05-09T00:00:00+02:00", "title": "Pink\u00e1ra", "location": "Krom\u011b\u0159\u00ed\u017e, Zl\u00edn"}, {"allDay": true, "start": "2024-05-08T00:00:00+02:00", "end": "2024-05-09T00:00:00+02:00", "title": "Pokoj\u00ed\u010dek", "location": "Fr\u00fddek-M\u00edstek, \u010cesko"}, {"allDay": true, "start": "2024-05-09T00:00:00+02:00", "end": "2024-05-10T00:00:00+02:00", "title": "Den Evropy", "location": "N\u00e1m\u011bst\u00ed Republiky, Nov\u00e9 M\u011bsto, 110 00 Praha-Praha 1, \u010cesko"}, {"allDay": true, "start": "2024-05-10T00:00:00+02:00", "end": "2024-05-11T00:00:00+02:00", "title": "S Pir\u00e1ty se bav\u00ed\u0161 - sportovn\u00ed odpoledne", "location": "Ostrava, Lod\u011bnice"}, {"allDay": true, "start": "2024-05-11T00:00:00+02:00", "end": "2024-05-12T00:00:00+02:00", "title": "Pink\u00e1ra", "location": "Karvin\u00e1, Nov\u00fd Ji\u010d\u00edn, Opava"}, {"allDay": true, "start": "2024-05-11T00:00:00+02:00", "end": "2024-05-12T00:00:00+02:00", "title": "B\u011bh pro Pam\u011b\u0165 n\u00e1roda", "location": "Praha, \u010cesko"}, {"allDay": true, "start": "2024-05-11T00:00:00+02:00", "end": "2024-05-12T00:00:00+02:00", "title": "Pokoj\u00ed\u010dek", "location": "Olomouc, \u010cesko"}, {"allDay": true, "start": "2024-05-12T00:00:00+02:00", "end": "2024-05-13T00:00:00+02:00", "title": "Pink\u00e1ra", "location": "Olomouc, Prost\u011bjov"}, {"allDay": true, "start": "2024-05-12T00:00:00+02:00", "end": "2024-05-13T00:00:00+02:00", "title": "Pokoj\u00ed\u010dek", "location": "Hradec Kr\u00e1lov\u00e9, \u010cesko"}, {"allDay": false, "start": "2024-05-12T18:00:00+02:00", "end": "2024-05-12T22:00:00+02:00", "title": "PubQuiz", "location": "Hradec Kr\u00e1lov\u00e9, \u010cesko"}, {"allDay": true, "start": "2024-05-13T00:00:00+02:00", "end": "2024-05-14T00:00:00+02:00", "title": "Pink\u00e1ra", "location": "Vamberk, Rychnov, NM nad Metuj\u00ed"}, {"allDay": true, "start": "2024-05-13T00:00:00+02:00", "end": "2024-05-14T00:00:00+02:00", "title": "Pokoj\u00ed\u010dek", "location": "Automatick\u00e9 ml\u00fdny, Pardubice"}, {"allDay": true, "start": "2024-05-14T00:00:00+02:00", "end": "2024-05-15T00:00:00+02:00", "title": "Pink\u00e1ra", "location": "Jilemnice, Turnov"}, {"allDay": true, "start": "2024-05-14T00:00:00+02:00", "end": "2024-05-15T00:00:00+02:00", "title": "Pokoj\u00ed\u010dek", "location": "Kutn\u00e1 Hora "}, {"allDay": true, "start": "2024-05-15T00:00:00+02:00", "end": "2024-05-16T00:00:00+02:00", "title": "Pink\u00e1ra", "location": "Praha"}, {"allDay": false, "start": "2024-05-15T11:00:00+02:00", "end": "2024-05-15T17:00:00+02:00", "title": "Pokoj\u00ed\u010dek", "location": "Havl\u00ed\u010dkovo n\u00e1m\u011bst\u00ed, Havl\u00ed\u010dk\u016fv Brod"}, {"allDay": true, "start": "2024-05-16T00:00:00+02:00", "end": "2024-05-17T00:00:00+02:00", "title": "S pir\u00e1ty se bav\u00ed\u0161 - Kulturn\u00ed odpoledne", "location": "N\u00e1m\u011bst\u00ed Svobody, Brno"}, {"allDay": true, "start": "2024-05-17T00:00:00+02:00", "end": "2024-05-18T00:00:00+02:00", "title": "Pink\u00e1ra", "location": "NM na Morav\u011b, \u017d\u010f\u00e1r nad S\u00e1zavou... NMN Vratislavovo"}, {"allDay": true, "start": "2024-05-17T00:00:00+02:00", "end": "2024-05-18T00:00:00+02:00", "title": "Pokoj\u00ed\u010dek", "location": "Zl\u00edn"}, {"allDay": true, "start": "2024-05-18T00:00:00+02:00", "end": "2024-05-19T00:00:00+02:00", "title": "Pink\u00e1ra", "location": "Praha, \u010cesko"}, {"allDay": true, "start": "2024-05-18T00:00:00+02:00", "end": "2024-05-19T00:00:00+02:00", "title": "Pokoj\u00ed\u010dek", "location": "B\u0159eclav, \u010cesko"}, {"allDay": true, "start": "2024-05-19T00:00:00+02:00", "end": "2024-05-20T00:00:00+02:00", "title": "Pink\u00e1ra", "location": "Nymburk, \u0158\u00ed\u010dany, \u010cerno\u0161ice"}, {"allDay": true, "start": "2024-05-19T00:00:00+02:00", "end": "2024-05-20T00:00:00+02:00", "title": "Pokoj\u00ed\u010dek", "location": "Znojmo, \u010cesko"}, {"allDay": true, "start": "2024-05-20T00:00:00+02:00", "end": "2024-05-21T00:00:00+02:00", "title": "S pir\u00e1ty se bav\u00ed\u0161 - Relax z\u00f3na ", "location": "\u010cesk\u00e9 bud\u011bjovice, u po\u0161ty venku"}, {"allDay": true, "start": "2024-05-21T00:00:00+02:00", "end": "2024-05-22T00:00:00+02:00", "title": "Pokoj\u00ed\u010dek", "location": "Praha"}, {"allDay": true, "start": "2024-05-21T00:00:00+02:00", "end": "2024-05-22T00:00:00+02:00", "title": "Pink\u00e1ra", "location": "Plze\u0148, Doma\u017elice"}, {"allDay": true, "start": "2024-05-22T00:00:00+02:00", "end": "2024-05-23T00:00:00+02:00", "title": "Pink\u00e1ra", "location": "Plze\u0148, Su\u0161ice"}, {"allDay": true, "start": "2024-05-22T00:00:00+02:00", "end": "2024-05-23T00:00:00+02:00", "title": "Pokoj\u00ed\u010dek", "location": "Bene\u0161ov"}, {"allDay": true, "start": "2024-05-23T00:00:00+02:00", "end": "2024-05-24T00:00:00+02:00", "title": "Pokoj\u00ed\u010dek", "location": "Litom\u011b\u0159ice "}, {"allDay": true, "start": "2024-05-23T00:00:00+02:00", "end": "2024-05-24T00:00:00+02:00", "title": "Pink\u00e1ra", "location": "Sokolov, Cheb, ML"}, {"allDay": true, "start": "2024-05-24T00:00:00+02:00", "end": "2024-05-25T00:00:00+02:00", "title": "S Pir\u00e1ty se bav\u00ed\u0161!", "location": "Kladno"}, {"allDay": true, "start": "2024-05-25T00:00:00+02:00", "end": "2024-05-26T00:00:00+02:00", "title": "Pink\u00e1ra", "location": "Pardubice - pod Ku\u0148kou"}, {"allDay": false, "start": "2024-05-25T15:00:00+02:00", "end": "2024-05-25T16:00:00+02:00", "title": "Pride pr\u016fvod", "location": "Zeln\u00fd trh, 602 00 Brno-st\u0159ed, \u010cesko", "description": "<a href=\"https://www.facebook.com/events/7412941205462208/?acontext=%7B%22event_action_history%22:[]%7D\" rel=\"noopener noreferrer\">Odkaz </a>na ud\u00e1lost"}, {"allDay": true, "start": "2024-05-26T00:00:00+02:00", "end": "2024-05-27T00:00:00+02:00", "title": "Pokoj\u00ed\u010dek", "location": "D\u011b\u010d\u00edn, \u010cesko"}, {"allDay": true, "start": "2024-05-26T00:00:00+02:00", "end": "2024-05-27T00:00:00+02:00", "title": "Pink\u00e1ra", "location": "Chrudim, cyklostezka"}, {"allDay": true, "start": "2024-05-27T00:00:00+02:00", "end": "2024-05-28T00:00:00+02:00", "title": "Pokoj\u00ed\u010dek", "location": "\u00dast\u00ed nad Labem, \u010cesko"}, {"allDay": true, "start": "2024-05-27T00:00:00+02:00", "end": "2024-05-28T00:00:00+02:00", "title": "Pink\u00e1ra", "location": "Ho\u0159ice, Ji\u010d\u00edn, Nov\u00e1 Paka"}, {"allDay": true, "start": "2024-05-28T00:00:00+02:00", "end": "2024-05-29T00:00:00+02:00", "title": "Pink\u00e1ra", "location": "Rakovn\u00edk, Slan\u00fd"}, {"allDay": true, "start": "2024-05-28T00:00:00+02:00", "end": "2024-05-29T00:00:00+02:00", "title": "Pokoj\u00ed\u010dek", "location": "Karlovy Vary"}, {"allDay": true, "start": "2024-05-29T00:00:00+02:00", "end": "2024-05-30T00:00:00+02:00", "title": "Pink\u00e1ra", "location": "Praha"}, {"allDay": true, "start": "2024-05-29T00:00:00+02:00", "end": "2024-05-30T00:00:00+02:00", "title": "Pokoj\u00ed\u010dek", "location": "Klatovy"}, {"allDay": true, "start": "2024-05-30T00:00:00+02:00", "end": "2024-05-31T00:00:00+02:00", "title": "S pir\u00e1ty se bav\u00ed\u0161 - D\u011btsk\u00fd den", "location": "Plze\u0148"}, {"allDay": true, "start": "2024-05-31T00:00:00+02:00", "end": "2024-06-01T00:00:00+02:00", "title": "Pink\u00e1ra", "location": "Ho\u0159ovice, Dob\u0159\u00ed\u0161, Mn\u00ed\u0161ek"}, {"allDay": true, "start": "2024-05-31T00:00:00+02:00", "end": "2024-06-01T00:00:00+02:00", "title": "Pokoj\u00ed\u010dek", "location": "P\u00edsek"}, {"allDay": true, "start": "2024-06-01T00:00:00+02:00", "end": "2024-06-02T00:00:00+02:00", "title": "S pir\u00e1ty se bav\u00ed\u0161 - D\u011btsk\u00fd den", "location": "Praha"}, {"allDay": true, "start": "2024-06-02T00:00:00+02:00", "end": "2024-06-03T00:00:00+02:00", "title": "Plavba po Berounce", "location": "Beroun"}, {"allDay": false, "start": "2024-06-02T14:00:00+02:00", "end": "2024-06-02T15:00:00+02:00", "title": "Sv\u011btov\u00e1 cykloj\u00edzda", "location": "Praha - magistr\u00e1la ", "description": "<a href=\"https://www.facebook.com/events/1126480395385415/?acontext=%7B%22event_action_history%22:[%7B%22surface%22:%22external_search_engine%22%7D,%7B%22mechanism%22:%22calendar_tab_event%22,%22surface%22:%22bookmark_calendar%22%7D],%22ref_notif_type%22:null%7D\" rel=\"noopener noreferrer\">Odkaz</a> na ud\u00e1lost"}, {"allDay": true, "start": "2024-06-03T00:00:00+02:00", "end": "2024-06-04T00:00:00+02:00", "title": "Rozd\u00e1v\u00e1n\u00ed", "location": "Praha - metra "}, {"allDay": true, "start": "2024-06-06T00:00:00+02:00", "end": "2024-06-07T00:00:00+02:00", "title": "Rozd\u00e1v\u00e1n\u00ed", "location": "Praha - metra"}]'