Merge pull request #110 from mmz-srf/SRFCMS-6772-fef-navigation-renam…

…ing-task Srfcms 6772 fef renaming task
mmz-srf · Jun 1, 2017 · ea37ba1 · ea37ba1
2 parents cbbc484 + 23c24c9
commit ea37ba1
Show file tree

Hide file tree

Showing 178 changed files with 263 additions and 216 deletions.
diff --git a/source/_data/data.json b/source/_data/data.json
@@ -15,7 +15,7 @@
   },
   "articleText": {
     "title": "Vorbild für den «Chaos Computer Club»",
-    "text": "Es ist erstaunlich, wie viele Themen Barlow bereits vor 20 Jahren angesprochen hat. Noch heute bezieht sich der Hackerverein <a target='blank' href='http://www.google.ch'>«Chaos Computer Club»</a> auf einige Stellen seines Manifestes. Denn auch der Chaos Computer Club kämpft für freien Zugang zu Information sowie sichere Datenübermittlung im Netz und wehrt sich gegen staatliche Überwachung und Internetzensur. Hernani Marques, Aktivist und Pressesprecher vom Schweizer Ableger des Chaos Computer Club, erwähnt aber auch Punkte in Barlows Manifest, die 2016 nicht mehr so aussehen: Die Unterscheidung von realem Leben und Cyberspace liesse sich heute nicht mehr so deutlich machen – man denke nur an die Smartphones, mit denen das Internet heute allgegenwärtig sei. Barlow habe auch nicht vorausgesehen, wie stark das Internet automatisiert werden sollte."
+    "text": "Es ist erstaunlich, wie viele Themen Barlow bereits vor 20 Jahren angesprochen hat. Noch heute bezieht sich der Hackerverein «Chaos Computer Club» auf einige Stellen seines Manifestes. Denn auch der Chaos Computer Club kämpft für freien Zugang zu Information sowie sichere Datenübermittlung im Netz und wehrt sich gegen staatliche Überwachung und Internetzensur. Hernani Marques, Aktivist und Pressesprecher vom Schweizer Ableger des Chaos Computer Club, erwähnt aber auch Punkte in Barlows Manifest, die 2016 nicht mehr so aussehen: Die Unterscheidung von realem Leben und Cyberspace liesse sich heute nicht mehr so deutlich machen – man denke nur an die Smartphones, mit denen das Internet heute allgegenwärtig sei. Barlow habe auch nicht vorausgesehen, wie stark das Internet automatisiert werden sollte."
   },
   "blockquote": {
     "text": "Ich habe nicht ein Verbrechen gegen meine Verantwortung begangen.",

diff --git a/source/_patterns/00-introduction/intro.twig b/source/_patterns/00-introduction/intro.twig
@@ -26,8 +26,8 @@
         <ul class="text-list text-list--unordered">
             <li>The main idea behind our <a href="#BEM">BEM blocks</a> is that they could be used independently and anywhere. A vision is that - when we are ready to use http/2 - each block will have a separate generated CSS file so that just the styles for blocks used on a web page need to be included. Therefore: Avoid global styles and code a block in a way that all its styling is in one Sass file.</li>
             <li>Maintainability should be the primary goal when writing CSS/Sass-Code for the framework even if it results in more code.</li>
-            <li>Top and bottom spaces between elements/components should be ruled by
-                <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Box_Model/Mastering_margin_collapsing" target="_blank">collapsing margins</a>. The element with the larger margin wins.
+            <li>Top and bottom spaces between components should be ruled by
+                <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Box_Model/Mastering_margin_collapsing" target="_blank">collapsing margins</a>. The component with the larger margin wins.
                 Therefore only use margins not padding for top and bottom spaces. Sometimes it is necessary to add a wrapper <code>&lt;div&gt;</code> to make margins work as desired.</li>
             <li>You are allowed to use flexbox  - so use it ;-)</li>
         </ul>

diff --git a/source/_patterns/05-elements/article/_article-text.twig b/source/_patterns/05-elements/article/_article-text.twig
diff --git a/source/_patterns/10-atoms/article/_article-text.twig b/source/_patterns/10-atoms/article/_article-text.twig
@@ -0,0 +1,3 @@
+<p>{{ articleText.text }} Dann kam <a href="http://www.srf.ch">das Internet</a>. John Perry Barlow benützte es bereits.</p>
+<p>John Perry Barlow ist heute 68 Jahre alt. Er hat volles Haar, einen verschmitzten Blick und trägt ein goldenes Amulett um den Hals.</p>
+<p>Früher schrieb er Songtexte für <strong>The Grateful Dead</strong>, nahm LSD und züchtete Rinder in Wyoming.</p>
diff --git a/...ements/article/article-author--short.twig → ...-atoms/article/article-author--short.twig b/...ements/article/article-author--short.twig → ...-atoms/article/article-author--short.twig
diff --git a/...s/05-elements/article/article-author.scss → ...erns/10-atoms/article/article-author.scss b/...s/05-elements/article/article-author.scss → ...erns/10-atoms/article/article-author.scss
diff --git a/...s/05-elements/article/article-author.twig → ...erns/10-atoms/article/article-author.twig b/...s/05-elements/article/article-author.twig → ...erns/10-atoms/article/article-author.twig
diff --git a/...rns/05-elements/article/article-lead.scss → ...tterns/10-atoms/article/article-lead.scss b/...rns/05-elements/article/article-lead.scss → ...tterns/10-atoms/article/article-lead.scss
diff --git a/...rns/05-elements/article/article-lead.twig → ...tterns/10-atoms/article/article-lead.twig b/...rns/05-elements/article/article-lead.twig → ...tterns/10-atoms/article/article-lead.twig
diff --git a/...s/05-elements/article/article-overline.md → ...erns/10-atoms/article/article-overline.md b/...s/05-elements/article/article-overline.md → ...erns/10-atoms/article/article-overline.md
diff --git a/...05-elements/article/article-overline.scss → ...ns/10-atoms/article/article-overline.scss b/...05-elements/article/article-overline.scss → ...ns/10-atoms/article/article-overline.scss
diff --git a/...05-elements/article/article-overline.twig → ...ns/10-atoms/article/article-overline.twig b/...05-elements/article/article-overline.twig → ...ns/10-atoms/article/article-overline.twig
diff --git a/...ns/05-elements/article/article-title.scss → ...terns/10-atoms/article/article-title.scss b/...ns/05-elements/article/article-title.scss → ...terns/10-atoms/article/article-title.scss
diff --git a/...ns/05-elements/article/article-title.twig → ...terns/10-atoms/article/article-title.twig b/...ns/05-elements/article/article-title.twig → ...terns/10-atoms/article/article-title.twig
diff --git a/...terns/05-elements/content/_chmap.svg.twig → ...patterns/10-atoms/content/_chmap.svg.twig b/...terns/05-elements/content/_chmap.svg.twig → ...patterns/10-atoms/content/_chmap.svg.twig
diff --git a/...ements/content/block-link/block-link.scss → ...-atoms/content/block-link/block-link.scss b/...ements/content/block-link/block-link.scss → ...-atoms/content/block-link/block-link.scss
diff --git a/...ements/content/block-link/block-link.twig → ...-atoms/content/block-link/block-link.twig b/...ements/content/block-link/block-link.twig → ...-atoms/content/block-link/block-link.twig
diff --git a/...ntent/block-link/block-link~document.json → ...ntent/block-link/block-link~document.json b/...ntent/block-link/block-link~document.json → ...ntent/block-link/block-link~document.json
diff --git a/...s/content/block-link/block-link~docx.json → ...s/content/block-link/block-link~docx.json b/...s/content/block-link/block-link~docx.json → ...s/content/block-link/block-link~docx.json
diff --git a/...ntent/block-link/block-link~external.json → ...ntent/block-link/block-link~external.json b/...ntent/block-link/block-link~external.json → ...ntent/block-link/block-link~external.json
diff --git a/...ts/content/block-link/block-link~pdf.json → ...ms/content/block-link/block-link~pdf.json b/...ts/content/block-link/block-link~pdf.json → ...ms/content/block-link/block-link~pdf.json
diff --git a/...05-elements/content/carousel-counter.scss → ...ns/10-atoms/content/carousel-counter.scss b/...05-elements/content/carousel-counter.scss → ...ns/10-atoms/content/carousel-counter.scss
diff --git a/...05-elements/content/carousel-counter.twig → ...ns/10-atoms/content/carousel-counter.twig b/...05-elements/content/carousel-counter.twig → ...ns/10-atoms/content/carousel-counter.twig
diff --git a/...s/05-elements/content/content-header.scss → ...erns/10-atoms/content/content-header.scss b/...s/05-elements/content/content-header.scss → ...erns/10-atoms/content/content-header.scss
diff --git a/...s/05-elements/content/content-header.twig → ...erns/10-atoms/content/content-header.twig b/...s/05-elements/content/content-header.twig → ...erns/10-atoms/content/content-header.twig
diff --git a/.../_patterns/05-elements/content/image.twig → source/_patterns/10-atoms/content/image.twig b/.../_patterns/05-elements/content/image.twig → source/_patterns/10-atoms/content/image.twig
@@ -12,7 +12,7 @@
          src="{{ src }}">
     {% block image_carousel_counter %}
         {% if currentIndex and totalCount %}
-            {% include 'elements-carousel-counter' with { 'currentIndex': currentIndex, 'totalCount': totalCount, 'accessibilityInfo' : 'Bild' } %}
+            {% include 'atoms-carousel-counter' with { 'currentIndex': currentIndex, 'totalCount': totalCount, 'accessibilityInfo' : 'Bild' } %}
         {% endif %}
     {% endblock %}
 </div>
diff --git a/..._patterns/05-elements/content/legend.scss → ...ce/_patterns/10-atoms/content/legend.scss b/..._patterns/05-elements/content/legend.scss → ...ce/_patterns/10-atoms/content/legend.scss
diff --git a/..._patterns/05-elements/content/legend.twig → ...ce/_patterns/10-atoms/content/legend.twig b/..._patterns/05-elements/content/legend.twig → ...ce/_patterns/10-atoms/content/legend.twig
diff --git a/...tterns/05-elements/content/load-more.scss → ..._patterns/10-atoms/content/load-more.scss b/...tterns/05-elements/content/load-more.scss → ..._patterns/10-atoms/content/load-more.scss
diff --git a/...tterns/05-elements/content/load-more.twig → ..._patterns/10-atoms/content/load-more.twig b/...tterns/05-elements/content/load-more.twig → ..._patterns/10-atoms/content/load-more.twig
diff --git a/...nts/content/media-caption-with-image.twig → ...oms/content/media-caption-with-image.twig b/...nts/content/media-caption-with-image.twig → ...oms/content/media-caption-with-image.twig
diff --git a/...ts/content/media-caption-with-legend.twig → ...ms/content/media-caption-with-legend.twig b/...ts/content/media-caption-with-legend.twig → ...ms/content/media-caption-with-legend.twig
@@ -16,5 +16,5 @@
             {% endif %}
         </span>
     </div>
-    {% include 'elements-legend' %}
+    {% include 'atoms-legend' %}
 </figcaption>
diff --git a/...erns/05-elements/content/media-caption.md → ...atterns/10-atoms/content/media-caption.md b/...erns/05-elements/content/media-caption.md → ...atterns/10-atoms/content/media-caption.md
diff --git a/...ns/05-elements/content/media-caption.scss → ...terns/10-atoms/content/media-caption.scss b/...ns/05-elements/content/media-caption.scss → ...terns/10-atoms/content/media-caption.scss
diff --git a/...ns/05-elements/content/media-caption.twig → ...terns/10-atoms/content/media-caption.twig b/...ns/05-elements/content/media-caption.twig → ...terns/10-atoms/content/media-caption.twig
diff --git a/...elements/content/media-caption~no-bg.json → ...10-atoms/content/media-caption~no-bg.json b/...elements/content/media-caption~no-bg.json → ...10-atoms/content/media-caption~no-bg.json
diff --git a/...tterns/05-elements/content/play-icon.twig → ..._patterns/10-atoms/content/play-icon.twig b/...tterns/05-elements/content/play-icon.twig → ..._patterns/10-atoms/content/play-icon.twig
diff --git a/...patterns/05-elements/content/spinner.scss → ...e/_patterns/10-atoms/content/spinner.scss b/...patterns/05-elements/content/spinner.scss → ...e/_patterns/10-atoms/content/spinner.scss
diff --git a/...patterns/05-elements/content/spinner.twig → ...e/_patterns/10-atoms/content/spinner.twig b/...patterns/05-elements/content/spinner.twig → ...e/_patterns/10-atoms/content/spinner.twig
diff --git a/...content/text-list/text-list--ordered.twig → ...content/text-list/text-list--ordered.twig b/...content/text-list/text-list--ordered.twig → ...content/text-list/text-list--ordered.twig
diff --git a/...ntent/text-list/text-list--unordered.twig → ...ntent/text-list/text-list--unordered.twig b/...ntent/text-list/text-list--unordered.twig → ...ntent/text-list/text-list--unordered.twig
diff --git a/...elements/content/text-list/text-list.scss → ...10-atoms/content/text-list/text-list.scss b/...elements/content/text-list/text-list.scss → ...10-atoms/content/text-list/text-list.scss
diff --git a/.../_patterns/05-elements/content/tooltip.md → source/_patterns/10-atoms/content/tooltip.md b/.../_patterns/05-elements/content/tooltip.md → source/_patterns/10-atoms/content/tooltip.md
diff --git a/...patterns/05-elements/content/tooltip.scss → ...e/_patterns/10-atoms/content/tooltip.scss b/...patterns/05-elements/content/tooltip.scss → ...e/_patterns/10-atoms/content/tooltip.scss
diff --git a/...patterns/05-elements/content/tooltip.twig → ...e/_patterns/10-atoms/content/tooltip.twig b/...patterns/05-elements/content/tooltip.twig → ...e/_patterns/10-atoms/content/tooltip.twig
diff --git a/...ce/_patterns/05-elements/form/button.scss → source/_patterns/10-atoms/form/button.scss b/...ce/_patterns/05-elements/form/button.scss → source/_patterns/10-atoms/form/button.scss
diff --git a/...ce/_patterns/05-elements/form/button.twig → source/_patterns/10-atoms/form/button.twig b/...ce/_patterns/05-elements/form/button.twig → source/_patterns/10-atoms/form/button.twig
diff --git a/...terns/05-elements/form/button~altert.json → ...patterns/10-atoms/form/button~altert.json b/...terns/05-elements/form/button~altert.json → ...patterns/10-atoms/form/button~altert.json
diff --git a/...rns/05-elements/form/button~facebook.json → ...tterns/10-atoms/form/button~facebook.json b/...rns/05-elements/form/button~facebook.json → ...tterns/10-atoms/form/button~facebook.json
diff --git a/...rns/05-elements/form/button~inactive.json → ...tterns/10-atoms/form/button~inactive.json b/...rns/05-elements/form/button~inactive.json → ...tterns/10-atoms/form/button~inactive.json
diff --git a/...rns/05-elements/form/button~on-error.json → ...tterns/10-atoms/form/button~on-error.json b/...rns/05-elements/form/button~on-error.json → ...tterns/10-atoms/form/button~on-error.json
diff --git a/...ns/05-elements/form/button~secondary.json → ...terns/10-atoms/form/button~secondary.json b/...ns/05-elements/form/button~secondary.json → ...terns/10-atoms/form/button~secondary.json
diff --git a/...erns/05-elements/form/button~success.json → ...atterns/10-atoms/form/button~success.json b/...erns/05-elements/form/button~success.json → ...atterns/10-atoms/form/button~success.json
diff --git a/...erns/05-elements/form/button~twitter.json → ...atterns/10-atoms/form/button~twitter.json b/...erns/05-elements/form/button~twitter.json → ...atterns/10-atoms/form/button~twitter.json
diff --git a/.../_patterns/05-elements/form/checkbox.scss → source/_patterns/10-atoms/form/checkbox.scss b/.../_patterns/05-elements/form/checkbox.scss → source/_patterns/10-atoms/form/checkbox.scss
diff --git a/.../_patterns/05-elements/form/checkbox.twig → source/_patterns/10-atoms/form/checkbox.twig b/.../_patterns/05-elements/form/checkbox.twig → source/_patterns/10-atoms/form/checkbox.twig
diff --git a/...s/05-elements/form/checkbox~inactive.json → ...erns/10-atoms/form/checkbox~inactive.json b/...s/05-elements/form/checkbox~inactive.json → ...erns/10-atoms/form/checkbox~inactive.json
diff --git a/...s/05-elements/form/checkbox~on-error.json → ...erns/10-atoms/form/checkbox~on-error.json b/...s/05-elements/form/checkbox~on-error.json → ...erns/10-atoms/form/checkbox~on-error.json
diff --git a/...atterns/05-elements/form/input-field.scss → .../_patterns/10-atoms/form/input-field.scss b/...atterns/05-elements/form/input-field.scss → .../_patterns/10-atoms/form/input-field.scss
diff --git a/...atterns/05-elements/form/input-field.twig → .../_patterns/10-atoms/form/input-field.twig b/...atterns/05-elements/form/input-field.twig → .../_patterns/10-atoms/form/input-field.twig
diff --git a/...5-elements/form/input-field~inactive.json → ...s/10-atoms/form/input-field~inactive.json b/...5-elements/form/input-field~inactive.json → ...s/10-atoms/form/input-field~inactive.json
diff --git a/...5-elements/form/input-field~on-error.json → ...s/10-atoms/form/input-field~on-error.json b/...5-elements/form/input-field~on-error.json → ...s/10-atoms/form/input-field~on-error.json
diff --git a/...05-elements/form/input-field~success.json → ...ns/10-atoms/form/input-field~success.json b/...05-elements/form/input-field~success.json → ...ns/10-atoms/form/input-field~success.json
diff --git a/...tterns/05-elements/form/radio-button.scss → ..._patterns/10-atoms/form/radio-button.scss b/...tterns/05-elements/form/radio-button.scss → ..._patterns/10-atoms/form/radio-button.scss
diff --git a/...tterns/05-elements/form/radio-button.twig → ..._patterns/10-atoms/form/radio-button.twig b/...tterns/05-elements/form/radio-button.twig → ..._patterns/10-atoms/form/radio-button.twig
diff --git a/...-elements/form/radio-button~inactive.json → .../10-atoms/form/radio-button~inactive.json b/...-elements/form/radio-button~inactive.json → .../10-atoms/form/radio-button~inactive.json
diff --git a/...ce/_patterns/05-elements/form/select.scss → source/_patterns/10-atoms/form/select.scss b/...ce/_patterns/05-elements/form/select.scss → source/_patterns/10-atoms/form/select.scss
diff --git a/...ce/_patterns/05-elements/form/select.twig → source/_patterns/10-atoms/form/select.twig b/...ce/_patterns/05-elements/form/select.twig → source/_patterns/10-atoms/form/select.twig
diff --git a/...ents/separators/horizontal-separator.scss → ...toms/separators/horizontal-separator.scss b/...ents/separators/horizontal-separator.scss → ...toms/separators/horizontal-separator.scss
diff --git a/...ents/separators/horizontal-separator.twig → ...toms/separators/horizontal-separator.twig b/...ents/separators/horizontal-separator.twig → ...toms/separators/horizontal-separator.twig
diff --git a/...rizontal-separator~content-max-width.json → ...rizontal-separator~content-max-width.json b/...rizontal-separator~content-max-width.json → ...rizontal-separator~content-max-width.json
diff --git a/...ements/separators/vertical-separator.scss → ...-atoms/separators/vertical-separator.scss b/...ements/separators/vertical-separator.scss → ...-atoms/separators/vertical-separator.scss
diff --git a/...ements/separators/vertical-separator.twig → ...-atoms/separators/vertical-separator.twig b/...ements/separators/vertical-separator.twig → ...-atoms/separators/vertical-separator.twig
diff --git a/source/_patterns/10-components/article-header/article-header.twig b/source/_patterns/10-components/article-header/article-header.twig
diff --git a/source/_patterns/10-components/ch-map/ch-map.twig b/source/_patterns/10-components/ch-map/ch-map.twig
diff --git a/source/_patterns/10-components/image-figure/image-figure.twig b/source/_patterns/10-components/image-figure/image-figure.twig
diff --git a/source/_patterns/10-components/linkbox/linkbox.twig b/source/_patterns/10-components/linkbox/linkbox.twig
diff --git a/source/_patterns/10-components/related-episodes/related-episodes.twig b/source/_patterns/10-components/related-episodes/related-episodes.twig
diff --git a/source/_patterns/15-templates/article.twig b/source/_patterns/15-templates/article.twig
diff --git a/...onents/article-content/article-content.md → ...ecules/article-content/article-content.md b/...onents/article-content/article-content.md → ...ecules/article-content/article-content.md
diff --git a/...ents/article-content/article-content.scss → ...ules/article-content/article-content.scss b/...ents/article-content/article-content.scss → ...ules/article-content/article-content.scss
diff --git a/...ents/article-content/article-content.twig → ...ules/article-content/article-content.twig b/...ents/article-content/article-content.twig → ...ules/article-content/article-content.twig
diff --git a/...onents/article-header/article-header.scss → ...ecules/article-header/article-header.scss b/...onents/article-header/article-header.scss → ...ecules/article-header/article-header.scss
diff --git a/source/_patterns/20-molecules/article-header/article-header.twig b/source/_patterns/20-molecules/article-header/article-header.twig
@@ -0,0 +1,7 @@
+<header class="article-header">
+    {% include 'atoms-article-overline' %}
+    {% include 'atoms-article-title' %}
+    {% include 'atoms-article-lead' %}
+    {% include 'atoms-article-author' %}
+    {% include 'atoms-horizontal-separator' with {'styleModifier': 'horizontal-separator--content-max-width'} %}
+</header>
diff --git a/...onents/article-teaser/article-teaser.scss → ...ecules/article-teaser/article-teaser.scss b/...onents/article-teaser/article-teaser.scss → ...ecules/article-teaser/article-teaser.scss
diff --git a/...onents/article-teaser/article-teaser.twig → ...ecules/article-teaser/article-teaser.twig b/...onents/article-teaser/article-teaser.twig → ...ecules/article-teaser/article-teaser.twig
diff --git a/...mponents/audio-gallery/audio-gallery.scss → ...olecules/audio-gallery/audio-gallery.scss b/...mponents/audio-gallery/audio-gallery.scss → ...olecules/audio-gallery/audio-gallery.scss
diff --git a/...mponents/audio-gallery/audio-gallery.twig → ...olecules/audio-gallery/audio-gallery.twig b/...mponents/audio-gallery/audio-gallery.twig → ...olecules/audio-gallery/audio-gallery.twig
@@ -2,12 +2,12 @@
     <ol class="audio-gallery">
         {% for audio in audios %}
             <li class="audio-gallery__item">
-                {% include 'components-audio' with {
+                {% include 'molecules-audio' with {
                   "audios": [audio]
                 } %}
             </li>
             <li class="audio-gallery__item">
-                {% include 'components-audio' with {
+                {% include 'molecules-audio' with {
                   "audios": [audio]
                 } %}
             </li>

diff --git a/.../_patterns/10-components/audio/audio.scss → ...e/_patterns/20-molecules/audio/audio.scss b/.../_patterns/10-components/audio/audio.scss → ...e/_patterns/20-molecules/audio/audio.scss
diff --git a/.../_patterns/10-components/audio/audio.twig → ...e/_patterns/20-molecules/audio/audio.twig b/.../_patterns/10-components/audio/audio.twig → ...e/_patterns/20-molecules/audio/audio.twig
@@ -19,10 +19,10 @@
                 {% endblock %}
 
                 {% block play_icon %}
-                    {% include 'elements-play-icon' with {'media': 'audio'} %}
+                    {% include 'atoms-play-icon' with {'media': 'audio'} %}
                 {% endblock %}
                 {% block loading_spinner %}
-                    {% include 'elements-spinner' with { 'styleModifier' : 'spinner__circle--dash-white' } %}
+                    {% include 'atoms-spinner' with { 'styleModifier' : 'spinner__circle--dash-white' } %}
                 {% endblock %}
             </div>
             {% block audio_caption %}

diff --git a/...ns/10-components/audio/audio~loading.json → ...rns/20-molecules/audio/audio~loading.json b/...ns/10-components/audio/audio~loading.json → ...rns/20-molecules/audio/audio~loading.json
diff --git a/...ns/10-components/audio/audio~playing.json → ...rns/20-molecules/audio/audio~playing.json b/...ns/10-components/audio/audio~playing.json → ...rns/20-molecules/audio/audio~playing.json
diff --git a/.../10-components/blockquote/blockquote.scss → ...s/20-molecules/blockquote/blockquote.scss b/.../10-components/blockquote/blockquote.scss → ...s/20-molecules/blockquote/blockquote.scss
diff --git a/.../10-components/blockquote/blockquote.twig → ...s/20-molecules/blockquote/blockquote.twig b/.../10-components/blockquote/blockquote.twig → ...s/20-molecules/blockquote/blockquote.twig
diff --git a/...quote/blockquote~article-indentation.json → ...quote/blockquote~article-indentation.json b/...quote/blockquote~article-indentation.json → ...quote/blockquote~article-indentation.json
diff --git a/...patterns/10-components/ch-map/ch-map.scss → ..._patterns/20-molecules/ch-map/ch-map.scss b/...patterns/10-components/ch-map/ch-map.scss → ..._patterns/20-molecules/ch-map/ch-map.scss
diff --git a/source/_patterns/20-molecules/ch-map/ch-map.twig b/source/_patterns/20-molecules/ch-map/ch-map.twig
@@ -0,0 +1,11 @@
+<figure id="map-{{ chmap.id }}" class="chmap-wrapper" data-src="../../assets/demo/chmap-data.json" aria-hidden="true">
+    <div id="loader"></div>
+    {% include 'atoms-chmap.svg' with { 'idReference' : chmap.id } %}
+
+    {% include 'atoms-media-caption-with-legend' with { 'styleModifier': 'media-caption--chmap', 'styleModifierContent': 'media-caption__content--chmap' } %}
+
+    <div class="menu-wrapper">
+        {% include 'atoms-select' %}
+    </div>
+    <div id="infowindow-{{ chmap.id }}" class="chmap-infowindow"></div>
+</figure>
diff --git a/...patterns/10-components/charts/charts.scss → ..._patterns/20-molecules/charts/charts.scss b/...patterns/10-components/charts/charts.scss → ..._patterns/20-molecules/charts/charts.scss
diff --git a/...patterns/10-components/charts/charts.twig → ..._patterns/20-molecules/charts/charts.twig b/...patterns/10-components/charts/charts.twig → ..._patterns/20-molecules/charts/charts.twig
@@ -5,15 +5,15 @@
 
 <figure class="chart__container">
     <div id="chartdiv__id--column" class="chart" data-src="../../assets/demo/chart-data-column.json"></div>
-    {% include 'elements-media-caption-with-image' %}
+    {% include 'atoms-media-caption-with-image' %}
 </figure>
 
 <figure class="chart__container">
     <div id="chartdiv__id--pie" class="chart" data-src="../../assets/demo/chart-data-pie.json"></div>
-    {% include 'elements-media-caption' %}
+    {% include 'atoms-media-caption' %}
 </figure>
 
 <figure class="chart__container">
     <div id="chartdiv__id--line" class="chart" data-src="../../assets/demo/chart-data-line.json"></div>
-    {% include 'elements-media-caption-with-image' %}
+    {% include 'atoms-media-caption-with-image' %}
 </figure>
diff --git a/...0-components/comments/_comment-reply.twig → ...20-molecules/comments/_comment-reply.twig b/...0-components/comments/_comment-reply.twig → ...20-molecules/comments/_comment-reply.twig
@@ -16,5 +16,5 @@
         <input type="hidden" name="reply_to" class="js-comment_reply_to" value="0">{# replytocomment #}
         <input type="hidden" name="user_token" class="js-comment_user_token" value="0">{# replytocomment #}
     </fieldset>
-    {% include 'elements-button' with { 'styleModifier' : 'button--inactive', 'buttonText' : 'Kommentieren' } %}
+    {% include 'atoms-button' with { 'styleModifier' : 'button--inactive', 'buttonText' : 'Kommentieren' } %}
 </form>
diff --git a/...erns/10-components/comments/_comment.twig → ...terns/20-molecules/comments/_comment.twig b/...erns/10-components/comments/_comment.twig → ...terns/20-molecules/comments/_comment.twig
diff --git a/...erns/10-components/comments/comments.scss → ...terns/20-molecules/comments/comments.scss b/...erns/10-components/comments/comments.scss → ...terns/20-molecules/comments/comments.scss
diff --git a/...erns/10-components/comments/comments.twig → ...terns/20-molecules/comments/comments.twig b/...erns/10-components/comments/comments.twig → ...terns/20-molecules/comments/comments.twig
@@ -66,14 +66,14 @@
             <div id="sectionAll" role="tabpanel">
                 <ul class="comments comments--shrink comments--main">
                     {% block comments %}
-                        {% include 'components-comment' with { 'comments': comments.comments, 'allowsComments': true } %}
+                        {% include 'molecules-comment' with { 'comments': comments.comments, 'allowsComments': true } %}
                     {% endblock %}
                 </ul>
                 {% block more_button %}
-                    {% include 'elements-load-more' %}
+                    {% include 'atoms-load-more' %}
                 {% endblock %}
                 {% block more_button_spinner %}
-                    {% include 'elements-spinner' %}
+                    {% include 'atoms-spinner' %}
                 {% endblock %}
             </div>
             {% if popularComments is not empty %}

diff --git a/...-components/comments/comments~closed.json → ...0-molecules/comments/comments~closed.json b/...-components/comments/comments~closed.json → ...0-molecules/comments/comments~closed.json
diff --git a/...ents/comments/comments~none-loggedIn.json → ...ules/comments/comments~none-loggedIn.json b/...ents/comments/comments~none-loggedIn.json → ...ules/comments/comments~none-loggedIn.json
diff --git a/.../comments/comments~none-not-loggedIn.json → .../comments/comments~none-not-loggedIn.json b/.../comments/comments~none-not-loggedIn.json → .../comments/comments~none-not-loggedIn.json
diff --git a/...nents/comments/comments~not-loggedin.json → ...cules/comments/comments~not-loggedin.json b/...nents/comments/comments~not-loggedin.json → ...cules/comments/comments~not-loggedin.json
diff --git a/.../_patterns/10-components/embed/embed.scss → ...e/_patterns/20-molecules/embed/embed.scss b/.../_patterns/10-components/embed/embed.scss → ...e/_patterns/20-molecules/embed/embed.scss
diff --git a/.../_patterns/10-components/embed/embed.twig → ...e/_patterns/20-molecules/embed/embed.twig b/.../_patterns/10-components/embed/embed.twig → ...e/_patterns/20-molecules/embed/embed.twig
diff --git a/...ce/_patterns/10-components/form/form.scss → source/_patterns/20-molecules/form/form.scss b/...ce/_patterns/10-components/form/form.scss → source/_patterns/20-molecules/form/form.scss
diff --git a/...ce/_patterns/10-components/form/form.twig → source/_patterns/20-molecules/form/form.twig b/...ce/_patterns/10-components/form/form.twig → source/_patterns/20-molecules/form/form.twig
@@ -4,27 +4,27 @@
     <fieldset class="form-fieldset">
         <legend class="form-fieldset__legend">{{ form.legend }}</legend>
         {% set hintFieldID = 'checkbox-fieldset-ID' %}
-        {% include 'elements-checkbox' with { 'fieldID': 'checkbox-ID1', 'required': true, 'hintFieldlID': hintFieldID } %}
-        {% include 'elements-checkbox' with { 'fieldID': 'checkbox-ID2', 'required': false, 'hintFieldlID': hintFieldID } %}
+        {% include 'atoms-checkbox' with { 'fieldID': 'checkbox-ID1', 'required': true, 'hintFieldlID': hintFieldID } %}
+        {% include 'atoms-checkbox' with { 'fieldID': 'checkbox-ID2', 'required': false, 'hintFieldlID': hintFieldID } %}
         <span class="form-fieldset__hint {{ styleModifier }}"
               id="{{ hintFieldID }}-hint">{{ hintText|default("Hint") }}</span>
     </fieldset>
     <fieldset class="form-fieldset">
         <legend class="form-fieldset__legend">{{ form.legend }}</legend>
         {% set hintFieldID = 'radio-button-fieldset-ID' %}
-        {% include 'elements-radio-button' with { 'fieldID': 'radio-button-ID1', 'hintFieldlID': hintFieldID } %}
-        {% include 'elements-radio-button' with { 'fieldID': 'radio-button-ID2', 'hintFieldlID': hintFieldID } %}
+        {% include 'atoms-radio-button' with { 'fieldID': 'radio-button-ID1', 'hintFieldlID': hintFieldID } %}
+        {% include 'atoms-radio-button' with { 'fieldID': 'radio-button-ID2', 'hintFieldlID': hintFieldID } %}
         <span class="form-fieldset__hint {{ styleModifier }}"
               id="{{ hintFieldID }}-hint">{{ hintText|default("Hint") }}</span>
     </fieldset>
     <fieldset class="form-fieldset">
         {% if legendTitle is defined %}
             <legend class="form-fieldset__legend">{{ legendTitle|default('') }}</legend>{% endif %}
-        {% include 'elements-input-field' with { 'labelText': 'Name, Vorname', 'hintText': '', 'fieldID': 'input-ID1', 'inputType': 'text', 'required': true } %}
-        {% include 'elements-input-field' with { 'labelText': 'Geburtstag', 'hintText': 'Format: dd.mm.YYY', 'fieldID': 'input-ID2', 'inputType': 'date', 'required': true } %}
-        {% include 'elements-select' with { 'fieldID': 'menu-ID', 'labelText': 'Bitte wählen', 'required': false } %}
-        {% include 'elements-button' with { 'styleModifier' : 'button--secondary', 'buttonText' : form.button.upload } %}
+        {% include 'atoms-input-field' with { 'labelText': 'Name, Vorname', 'hintText': '', 'fieldID': 'input-ID1', 'inputType': 'text', 'required': true } %}
+        {% include 'atoms-input-field' with { 'labelText': 'Geburtstag', 'hintText': 'Format: dd.mm.YYY', 'fieldID': 'input-ID2', 'inputType': 'date', 'required': true } %}
+        {% include 'atoms-select' with { 'fieldID': 'menu-ID', 'labelText': 'Bitte wählen', 'required': false } %}
+        {% include 'atoms-button' with { 'styleModifier' : 'button--secondary', 'buttonText' : form.button.upload } %}
     </fieldset>
     <p class="form__hint">{{ form.hint }}</p>
-    {% include 'elements-button' %}
+    {% include 'atoms-button' %}
 </form>
diff --git a/...onents/image-carousel/image-carousel.scss → ...ecules/image-carousel/image-carousel.scss b/...onents/image-carousel/image-carousel.scss → ...ecules/image-carousel/image-carousel.scss
diff --git a/...onents/image-carousel/image-carousel.twig → ...ecules/image-carousel/image-carousel.twig b/...onents/image-carousel/image-carousel.twig → ...ecules/image-carousel/image-carousel.twig
@@ -2,7 +2,7 @@
     <div class="carousel carousel__js" id="{{ image_carousel.ID }}">
         {% for image in images %}
             <div class="carousel__item">
-                {% include 'components-image-figure' with {
+                {% include 'molecules-image-figure' with {
                     'styleModifier': imageCaptionStyle,
                     'images': [image],
                     'currentIndex': loop.index,

diff --git a/...ts/image-figure/_image-figure~in-box.json → ...es/image-figure/_image-figure~in-box.json b/...ts/image-figure/_image-figure~in-box.json → ...es/image-figure/_image-figure~in-box.json
diff --git a/...components/image-figure/image-figure.scss → ...-molecules/image-figure/image-figure.scss b/...components/image-figure/image-figure.scss → ...-molecules/image-figure/image-figure.scss
diff --git a/source/_patterns/20-molecules/image-figure/image-figure.twig b/source/_patterns/20-molecules/image-figure/image-figure.twig
@@ -0,0 +1,9 @@
+<figure class="image-figure {{ styleModifier }}">
+    {% block image_wrapper %}
+        {% include 'atoms-image' with {'styleModifier': imageCaptionStyle } %}
+    {% endblock %}
+
+    {% block image_caption %}
+        {% include 'atoms-media-caption' with {'styleModifier': imageCaptionStyle } %}
+    {% endblock %}
+</figure>
diff --git a/...mage-figure/image-figure~cropped-img.json → ...mage-figure/image-figure~cropped-img.json b/...mage-figure/image-figure~cropped-img.json → ...mage-figure/image-figure~cropped-img.json
diff --git a/...ure/image-figure~media-caption-no-bg.json → ...ure/image-figure~media-caption-no-bg.json b/...ure/image-figure~media-caption-no-bg.json → ...ure/image-figure~media-caption-no-bg.json
diff --git a/...components/image-slider/image-slider.scss → ...-molecules/image-slider/image-slider.scss b/...components/image-slider/image-slider.scss → ...-molecules/image-slider/image-slider.scss
diff --git a/...components/image-slider/image-slider.twig → ...-molecules/image-slider/image-slider.twig b/...components/image-slider/image-slider.twig → ...-molecules/image-slider/image-slider.twig
diff --git a/...tterns/10-components/linkbox/linkbox.scss → ...atterns/20-molecules/linkbox/linkbox.scss b/...tterns/10-components/linkbox/linkbox.scss → ...atterns/20-molecules/linkbox/linkbox.scss
diff --git a/source/_patterns/20-molecules/linkbox/linkbox.twig b/source/_patterns/20-molecules/linkbox/linkbox.twig
@@ -0,0 +1,20 @@
+<div class="linkbox {{ styleModifier }}">
+    <h4 class="linkbox__title">{{ title }}</h4>
+    <ul class="linkbox__list">
+        <li>
+            {% include 'atoms-block-link' with {'styleModifier': 'block-link--internal'} %}
+        </li>
+        <li>
+            {% include 'atoms-block-link' with {'styleModifier': 'block-link--external'} %}
+        </li>
+        <li>
+            {% include 'atoms-block-link' with {'styleModifier': 'block-link--document'} %}
+        </li>
+        <li>
+            {% include 'atoms-block-link' with {'styleModifier': 'block-link--docx'} %}
+        </li>
+        <li>
+            {% include 'atoms-block-link' with {'styleModifier': 'block-link--pdf'} %}
+        </li>
+    </ul>
+</div>
diff --git a/...erns/10-components/listicle/listicle.scss → ...terns/20-molecules/listicle/listicle.scss b/...erns/10-components/listicle/listicle.scss → ...terns/20-molecules/listicle/listicle.scss