Yet another morphing material design button. Just a test...
A Pen by Elton Mesquita on CodePen.
text |
<iati-organisations generated-datetime="2014-09-10T07:15:37Z" version="2.03"> | |
<iati-organisation default-currency="EUR" last-updated-datetime="2014-09-10T07:15:37Z" xml:lang="en"> | |
<organisation-identifier>AA-AAA-123456789</organisation-identifier> | |
<name> | |
<narrative>Organisation name</narrative> | |
<narrative xml:lang="fr">Nom de l'organisme</narrative> | |
</name> | |
<reporting-org ref="AA-AAA-123456789" type="40" secondary-reporter="0"> | |
<narrative>Organisation name</narrative> | |
<narrative xml:lang="fr">Nom de l'organisme</narrative> |
<iati-activities generated-datetime="2014-09-10T07:15:37Z" version="2.03" linked-data-default="http://data.example.org/"> | |
<iati-activity xml:lang="en" default-currency="USD" last-updated-datetime="2014-09-10T07:15:37Z" humanitarian="1" linked-data-uri="http://data.example.org/123456789" hierarchy="1" budget-not-provided="1"> | |
<iati-identifier>AA-AAA-123456789-ABC123</iati-identifier> | |
<reporting-org ref="AA-AAA-123456789" type="40" secondary-reporter="0"> | |
<narrative>Organisation name</narrative> | |
<narrative xml:lang="fr">Nom de l'organisme</narrative> | |
</reporting-org> | |
<title> | |
<narrative>Activity title</narrative> | |
<narrative xml:lang="fr">Titre de l'activité</narrative> |
CREATE (a:Org {value:'null'}) | |
CREATE (a)-[:Activities]->(b:Activities {version:'null', generated_datetime:'null', linked_data_default:'null'}) | |
CREATE (b)-[:Activity]->(c:Activity {last_updated_datetime:'null', lang:'null', default_currency:'null', humanitarian_flag:'null'}) | |
CREATE (c)-[:Iati_identifier]->(:Iati_identifier {iati_identifier:'null'}) | |
CREATE (c)-[:Reporting_org]->(:Reporting_org {ref:'null', type:'null', secondary_reporter:'null', narrative:'null', lang:'null', lang_narrative:'null'}) | |
CREATE (c)-[:Title]->(:Title {narrative:'null', lang:'null', lang_narrative:'null'}) | |
CREATE (c)-[:Description]->(:Description {type:'null', narrative:'null', lang:'null', lang_narrative:'null'}) | |
CREATE (c)-[:Participating_org]->(:Participating_org {ref:'null', type:'null', role:'null', activity_id:'null', narrative:'null', lang:'null', lang_narrative:'null'}) | |
CREATE (c)-[:Other_identifier]->(:Other_identifier {ref:'null', type:'null', owner_org:'null', owner_org_ref:'null', narrative:'null', lang:'null', lang_narrat |
(#) HXL Hashtag | (+) HXL Attributes | IATI Headings | IATI Codelist | IATI XPath | |
---|---|---|---|---|---|
null | iati-activities | ||||
version | iati | version | Version | iati-activities/@version | |
generated-datetime | iati-activities/@generated-datetime | ||||
linked-data-default | iati-activities/@linked-data-default | ||||
null | iati-activities/iati-activity | ||||
last-updated-datetime | Last-updated-datetime | iati-activities/iati-activity/@last-updated-datetime | |||
lang | Language | iati-activities/iati-activity/@xml:lang | |||
default-currency | Currency | iati-activities/iati-activity/@default-currency | |||
humanitarian | iati-activities/iati-activity/@humanitarian |
Yet another morphing material design button. Just a test...
A Pen by Elton Mesquita on CodePen.
A Pen by Sandeep S Kumar on CodePen.
[CSS] Make it responsive
ClientD wants their website to look good and be comfortable to use on any device. Using the following markup, make the contents of the #main element have a 2-column layout for wider devices, but 1-column for narrower devices.
A Pen by Patrick Ejelle-Ndille on CodePen.
<!-- material design navigation--> | |
<nav class="header-nav"> | |
<div class="logo clickable"><a href="#">Logo</a></div> | |
<ul> | |
<li><a href="#" class="clickable">Home</a></li> | |
<li><a href="#" class="clickable">About</a></li> | |
<li><a href="#" class="clickable">Blog</a></li> | |
<li><a href="#" class="clickable">Portfolio</a></li> | |
<li><a href="#" class="clickable">Contact</a></li> | |
</ul> |