Fixed Style guide Demo templates.

UniversityofHelsinki · Nov 30, 2016 · 69a3e97 · 69a3e97
1 parent 967edaa
commit 69a3e97
Show file tree

Hide file tree

Showing 23 changed files with 138 additions and 138 deletions.
diff --git a/css/styles.css b/css/styles.css
@@ -3665,9 +3665,9 @@ a:hover
 }
 
 /*
- section: 16.2
+ section: 15.2
  title: Footer
- template: 16_2_footer
+ template: 15_2_footer
  description: The footer.
 */
 .l-footer {
@@ -3831,9 +3831,9 @@ a:hover
 }
 
 /*
- section: 16.1
+ section: 15.1
  title: Top bar
- template: 16_1_top-bar
+ template: 15_1_top-bar
  description: The top bar.
 */
 @media (min-width: 48em) {
@@ -4324,14 +4324,14 @@ dl, ol, ul {
 }
 
 /*
- section: 13.1
+ section: 12.1
  title: Avatar image
  description:
 */
 /*
- section: 13.1.1
+ section: 12.1.1
  title: Avatar image
- template: 13_1_1_avatar-image
+ template: 12_1_1_avatar-image
  description:
 */
 .avatar-image {
@@ -5520,9 +5520,9 @@ td.jobs-listing__date {
 }
 
 /*
- section: 14.1
+ section: 13.1
  title: Label row
- template: 14_1_1-label-row
+ template: 13_1_1-label-row
 */
 .label-row {
   margin-bottom: 0.5em;
@@ -5575,9 +5575,9 @@ td.jobs-listing__date {
 }
 
 /*
- section: 16.1.1
+ section: 15.1.1
  title: Links
- template: 16_1_1_links
+ template: 15_1_1_links
  description: Links compontent is used in the top bar.
 */
 .links {
@@ -7235,9 +7235,9 @@ a:hover .feed-listing__more-link a:after, .box-card__fieldset a:hover .feed-list
 }
 
 /*
- section: 15.1
+ section: 14.1
  title: Post
- template: 15_1_post
+ template: 14_1_post
  description: Social media post
 */
 .post {
@@ -7404,20 +7404,20 @@ a:hover .feed-listing__more-link a:after, .box-card__fieldset a:hover .feed-list
 }
 
 /*
- section: 12.1
+ section: 4.1
  title: Search form
  description:
 */
 /*
- section: 12.1.1
+ section: 4.1.1
  title: Search form
- template: 12_1_1_search-form
+ template: 4_1_1_search-form
  description:
 */
 /*
- section: 12.1.2
+ section: 4.1.2
  title: Search form dark
- template: 12_1_2_search-form-dark
+ template: 4_1_2_search-form-dark
  description:
 */
 .search-form {

diff --git a/sass/components/_avatar.scss b/sass/components/_avatar.scss
@@ -1,13 +1,13 @@
 /*
- section: 13.1
+ section: 12.1
  title: Avatar image
  description:
 */
 
 /*
- section: 13.1.1
+ section: 12.1.1
  title: Avatar image
- template: 13_1_1_avatar-image
+ template: 12_1_1_avatar-image
  description:
 */
 

diff --git a/sass/components/_label-row.scss b/sass/components/_label-row.scss
@@ -1,7 +1,7 @@
 /*
- section: 14.1
+ section: 13.1
  title: Label row
- template: 14_1_1-label-row
+ template: 13_1_1-label-row
 */
 
 .label-row {

diff --git a/sass/components/_links.scss b/sass/components/_links.scss
@@ -1,7 +1,7 @@
 /*
- section: 16.1.1
+ section: 15.1.1
  title: Links
- template: 16_1_1_links
+ template: 15_1_1_links
  description: Links compontent is used in the top bar.
 */
 

diff --git a/sass/components/_post.scss b/sass/components/_post.scss
@@ -1,7 +1,7 @@
 /*
- section: 15.1
+ section: 14.1
  title: Post
- template: 15_1_post
+ template: 14_1_post
  description: Social media post
 */
 .post {

diff --git a/sass/components/_search-form.scss b/sass/components/_search-form.scss
@@ -1,20 +1,20 @@
 /*
- section: 12.1
+ section: 4.1
  title: Search form
  description:
 */
 
 /*
- section: 12.1.1
+ section: 4.1.1
  title: Search form
- template: 12_1_1_search-form
+ template: 4_1_1_search-form
  description:
 */
 
 /*
- section: 12.1.2
+ section: 4.1.2
  title: Search form dark
- template: 12_1_2_search-form-dark
+ template: 4_1_2_search-form-dark
  description:
 */
 .search-form {

diff --git a/sass/layouts/common/_l-footer.scss b/sass/layouts/common/_l-footer.scss
@@ -1,7 +1,7 @@
 /*
- section: 16.2
+ section: 15.2
  title: Footer
- template: 16_2_footer
+ template: 15_2_footer
  description: The footer.
 */
 

diff --git a/sass/layouts/common/_l-top-bar.scss b/sass/layouts/common/_l-top-bar.scss
@@ -1,7 +1,7 @@
 /*
- section: 16.1
+ section: 15.1
  title: Top bar
- template: 16_1_top-bar
+ template: 15_1_top-bar
  description: The top bar.
 */
 

diff --git a/templates/13_1_1_avatar-image.html → templates/12_1_1_avatar-image.html b/templates/13_1_1_avatar-image.html → templates/12_1_1_avatar-image.html
diff --git a/templates/12_1_1_search-form.html b/templates/12_1_1_search-form.html
diff --git a/templates/12_1_2_search-form-dark.html b/templates/12_1_2_search-form-dark.html
diff --git a/templates/13_1_1-label-row.html b/templates/13_1_1-label-row.html
@@ -0,0 +1,8 @@
+<div class="label-row">
+    <div class="label-row__item theme-yliopisto-lehti">
+        Uutinen
+    </div>
+    <div class="label-row__item theme-secondary theme-yliopisto-lehti">
+        Yliopisto-lehti
+    </div>
+</div>
diff --git a/templates/14_1_1-label-row.html b/templates/14_1_1-label-row.html
diff --git a/templates/14_1_post.html b/templates/14_1_post.html
@@ -0,0 +1,15 @@
+<ul>
+    <li class="post">
+        <div class="post__date">27.6 - 15:20</div>
+        <div class="post__content">Lukivaikeus eli lukihäiriö on yleinen oppimisvaikeus, jonka tiedetään olevan hyvin perinnöllinen. Juha Keren johtama tutkimusryhmä on paljastanut ensimmäisenä maailmassa lukivaikeuden taakse kätkeytyviä geenejä.
+            Videoidussa haastattelussa Kere kertoo, miten geenit vaikuttavat lukemistaitoihin ja miten lukivaikeuden perinnöllisyyttä tutkitaan.
+        </div>
+    </li>
+    <li class="post">
+        <div class="post__date">27.6 - 11:30</div>
+        <div class="post__content">Tutkija Henry Pihlström on kahden apulaisensa kanssa käärinyt hihat ja ryhtynyt käymään läpi Luonnontieteellisen museon kellareissa säilytettävää luukokoelmaa.
+            Anatomian professori Evert Julius Bonsdorffin kokoelmassa oli laajimmillaan noin 2000 luustoa ja nahkaa. Kokoelman nykyistä laajuutta tai sitä, kuinka moni kokoelmayksilö lopulta päätyi 1960-luvulla eläinmuseolle, ei ole tähän asti tiedetty.
+            – Kokoelmissa on paljon yksilöitä, joita ei yksinkertaisesti ole sata vuotta sitten pystytty määrittämään tai ne on määritetty nykykäsityksen mukaan virheellisesti, Pihlström kertoo.
+        </div>
+    </li>
+</ul>
diff --git a/templates/15_1_1_links.html b/templates/15_1_1_links.html
@@ -0,0 +1,9 @@
+<div class="links">
+    <a class="links__link" href="https://flamma.helsinki.fi/portal/home/login" target="_blank">Flamma</a>
+    <a class="links__link" href="http://www.hel.fi/www/helsinki/fi" target="_blank">Helsingin kaupunki</a>
+</div>
+<div class="links">
+    <a class="links__link theme-language" href="/en" lang="en"><abbr title="English">en</abbr></a>
+    <a class="links__link theme-language active" href="/fi" lang="fi"><abbr title="Suomi">fi</abbr></a>
+    <a class="links__link theme-language" href="/sv" lang="sv"><abbr title="Svenska">sv</abbr></a>
+</div>
diff --git a/templates/15_1_post.html b/templates/15_1_post.html
diff --git a/templates/15_1_top-bar.html b/templates/15_1_top-bar.html
@@ -0,0 +1,24 @@
+<div class="l-top-bar">
+    <div class="l-top-bar__subregion">
+        <div class="l-top-bar__main">
+            <a class="logo" href="/fi">
+                <h1 class="logo__sitename">Helsingin yliopisto</h1>
+            </a>
+        </div>
+        <div class="l-top-bar__sub">
+            <div class="l-top-bar__subleft">
+                <div class="links">
+                    <a class="links__link" href="https://flamma.helsinki.fi/portal/home/login" target="_blank">Flamma</a>
+                    <a class="links__link" href="http://www.hel.fi/www/helsinki/fi" target="_blank">Helsingin kaupunki</a>
+                </div>
+            </div>
+            <div class="l-top-bar__subright">
+                <div class="links">
+                    <a class="links__link theme-language" href="/en" lang="en"><abbr title="English">en</abbr></a>
+                    <a class="links__link theme-language active" href="/fi" lang="fi"><abbr title="Suomi">fi</abbr></a>
+                    <a class="links__link theme-language" href="/sv" lang="sv"><abbr title="Svenska">sv</abbr></a>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
diff --git a/templates/15_2_footer.html b/templates/15_2_footer.html
@@ -0,0 +1,38 @@
+<div class="l-footer">
+    <div class="l-footer__subregion">
+        <div class="l-footer__column theme-sub">
+            <div class="logo-block">
+                <div class="logo-block__logo">
+                    <a class="logo theme-big" href="/fi"></a>
+                </div>
+                <div class="logo-block__content">
+                    <h4>Helsingin yliopisto</h4>
+                    <p>PL 3 (Fabianinkatu 33)<br>
+                        00014 Helsingin yliopisto</p>
+                    <p>Puhelinvaihde: <a class="is-tel" href="tel:+3582941911">02941 911</a></p>
+                </div>
+            </div>
+        </div>
+        <div class="l-footer__column">
+            <div class="list-of-links--condensed theme-footer">
+                <a class="list-of-links__link button--action icon--arrow-right theme-transparent" href="https://www.helsinki.fi/fi/yhteystiedot">Yhteystiedot</a>
+                <a class="list-of-links__link button--action icon--arrow-right theme-transparent" href="/anna-palautetta">Anna palautetta</a>
+                <a class="list-of-links__link button--action icon--arrow-right theme-transparent" href="https://www.helsinki.fi/fi/tietoa-sivustosta">Tietoa sivustosta</a>
+                <a class="list-of-links__link button--action icon--arrow-right theme-transparent" href="http://www.helsinki.fi/kirjasto/fi/etusivu/">Kirjasto</a>
+                <a class="list-of-links__link button--action icon--arrow-right theme-transparent" href="https://flamma.helsinki.fi/portal/home/login">Flamma</a>
+            </div>
+        </div>
+        <div class="l-footer__column theme-center">
+            <div class="button-group">
+                <a class="button--icon icon--facebook" href="https://www.facebook.com/helsinginyliopisto" target="_new"></a>
+                <a class="button--icon icon--twitter" href="https://www.twitter.com/helsinkiuni" target="_new"></a>
+                <a class="button--icon icon--youtube" href="https://www.youtube.com/universityofhelsinki" target="_new"></a>
+                <a class="button--icon icon--linkedin" href="https://www.linkedin.com/company/university-of-helsinki" target="_new"></a>
+                <a class="button--icon icon--instagram" href="https://www.instagram.com/universityofhelsinki" target="_new"></a>
+            </div>
+        </div>
+    </div>
+    <div class="l-footer__copyright">
+        <p>© Helsingin yliopisto 2016</p>
+    </div>
+</div>
diff --git a/templates/16_1_1_links.html b/templates/16_1_1_links.html
diff --git a/templates/16_1_top-bar.html b/templates/16_1_top-bar.html