diff --git a/content/pages/general/fonts/v1.3/index.html b/content/pages/general/fonts/v1.3/index.html index 8a6247b94ff7925bf8eed2bcc3e554e0ed66750b..8506dad0b332b616d1ee8a31a680bcf532606596 100644 --- a/content/pages/general/fonts/v1.3/index.html +++ b/content/pages/general/fonts/v1.3/index.html @@ -10,6 +10,21 @@ framework-version: 1.3 icon-version: 1.3 --- +<script> +document.addEventListener('DOMContentLoaded', function(){ $( document ).ready(function() { + $('#iconDevelopmentNotice').foundation('open'); +}); }, false); +</script> + +<div class="reveal" id="iconDevelopmentNotice" aria-labelledby="iconDevelopmentNoticeHeader" data-reveal> + <h3 id="iconDevelopmentNoticeHeader"><i class="icon icon-generic icon-alert"></i> v1.3 icons still under development</h3> + <p class="lead">If you're looking for icons to use in production, we recommend sticking with v1.2 for now; <a class="readmore" href="../v1.2">see them here</a></p> + <button class="close-button" data-close aria-label="Close modal" type="button"> + <span aria-hidden="true">×</span> + </button> +</div> + + <section id="intro" class="row" data-magellan-target="intro"> <div class="medium-8 columns"> @@ -20,11 +35,9 @@ icon-version: 1.3 This version brings the most user-facing changes in several years as we've added in far more "common" icons and simplified the font stack. The new EBI-Common font: -- Is a set of generic utility icons -- Merges the former EBI-Social, EBI-Generic, EBI-Functional -- Key mapping for the old EBI-Social and EBI-Generic have changed (see mappings below) -- EBI-Functional key mappings have not changed -- Adds non-redundant icons from Font Awesome +- Is a set of generic utility icons; +- Has many of the best icons from EBI-Social, EBI-Generic, EBI-Functional; and +- Has icons from Font Awesome (key codes are the [same as those on Font Awesome's gallery](https://fontawesome.com/icons?d=gallery&m=free)). For more background on the new EBI-Common font, <a href="https://github.com/ebiwd/EBI-Icon-fonts/issues/22" class="">see the notes</a>. There have also been a number of "under the hood" changes in v1.3. If you're a developer you can [read about those changes here](https://github.com/ebiwd/EBI-Icon-fonts/issues/21). {{/markdown}} @@ -51,12 +64,12 @@ For more background on the new EBI-Common font, <a href="https://github.com/ebiw <h4><a name="desktop"></a><i class="icon icon-generic" data-icon="S"></i> On a computer</h4> <p>If your computer does not already have these fonts installed, use the links to download TTF files. <a href="https://www.google.co.uk/search?q=how+do+i+install+ttf+fonts">Need help installing?</a></p> <ul> - <li><a href="https://ebi.emblstatic.net/web_guidelines/EBI-Icon-fonts/v1.3/EBI-Common/fonts/EBI-Common.ttf">Common</a>: icons for things like "info", "New", "link", "location", "compare", "align", "approve", "download", social media and so on. This is the old EBI-Social, EBI-Generic, EBI-Functional and Font Awesome icons</li> + <li><a href="https://ebi.emblstatic.net/web_guidelines/EBI-Icon-fonts/v1.3/EBI-Common/fonts/EBI-Common.ttf">Common</a>: icons for things like "info", "New", "link", "location", "compare", "align", "approve", "download", social media and so on. <strong>Note:</strong> You should be gin using EBI-Common over the old EBI-Social, EBI-Generic, EBI-Functional icons.</li> <li><a href="https://ebi.emblstatic.net/web_guidelines/EBI-Icon-fonts/v1.3/EBI-Conceptual/fonts/EBI-Conceptual.ttf">Conceptual</a>: icons for things like "DNA", "Chemical biology' and "Ontologies"</li> <li><a href="https://ebi.emblstatic.net/web_guidelines/EBI-Icon-fonts/v1.3/EBI-Species/fonts/EBI-Species.ttf">Species</a>: where you can find an icon for yeast.</li> <li><a href="https://ebi.emblstatic.net/web_guidelines/EBI-Icon-fonts/v1.3/EBI-Chemistry/fonts/EBI-Chemistry.ttf">Chemistry</a>: you guessed it.</li> - <li><span class="tag">Legacy</span> <a href="https://ebi.emblstatic.net/web_guidelines/EBI-Icon-fonts/v1.3/EBI-Functional/fonts/EBI-Functional.ttf">Functional</a>: icons for "compare", "align", "approve", "download" and so forth.</li> - <li><span class="tag">Legacy</span> <a href="https://ebi.emblstatic.net/web_guidelines/EBI-Icon-fonts/v1.3/EBI-Generic/fonts/EBI-Generic.ttf">Generic</a>: icons for things like "info", "New", "link" and "location".</li> + <li><a href="https://ebi.emblstatic.net/web_guidelines/EBI-Icon-fonts/v1.3/EBI-Functional/fonts/EBI-Functional.ttf">Functional</a>: icons for "compare", "align", "approve", "download" and so forth.</li> + <li><a href="https://ebi.emblstatic.net/web_guidelines/EBI-Icon-fonts/v1.3/EBI-Generic/fonts/EBI-Generic.ttf">Generic</a>: icons for things like "info", "New", "link" and "location".</li> <li><span class="tag">Legacy</span> <a href="https://ebi.emblstatic.net/web_guidelines/EBI-Icon-fonts/v1.3/EBI-SocialMedia/fonts/EBI-SocialMedia.ttf">Social Media</a>: handily enough, the Social Media font has icons for... social media!</li> </ul> </div>