{"id":113,"date":"2016-04-20T09:12:54","date_gmt":"2016-04-20T09:12:54","guid":{"rendered":"http:\/\/noemi.px-lab.com\/featured-posts-view\/components\/"},"modified":"2016-06-09T13:32:13","modified_gmt":"2016-06-09T13:32:13","slug":"components","status":"publish","type":"page","link":"https:\/\/noemi.px-lab.com\/modern\/components\/","title":{"rendered":"Components"},"content":{"rendered":"<h2>BUTTONS<\/h2>\n<p><a class=\"btn btn-primary\" target=\"_self\" href=\"#\">Primary<\/a> <a class=\"btn btn-secondary\" target=\"_self\" href=\"#\">Secondary<\/a> <a class=\"btn btn-success\" target=\"_self\" href=\"#\">Success<\/a> <a class=\"btn btn-info\" target=\"_self\" href=\"#\">Info<\/a> <a class=\"btn btn-warning\" target=\"_self\" href=\"#\">Warning<\/a> <a class=\"btn btn-danger\" target=\"_self\" href=\"#\">Danger<\/a> <a class=\"btn btn-link\" target=\"_self\" href=\"#\">Link<\/a><\/p>\n<h2>OUTLINE BUTTONS<\/h2>\n<p><a class=\"btn btn-primary-outline\" target=\"_self\" href=\"#\">Primary<\/a> <a class=\"btn btn-secondary-outline\" target=\"_self\" href=\"#\">Secondary<\/a> <a class=\"btn btn-success-outline\" target=\"_self\" href=\"#\">Success<\/a> <a class=\"btn btn-info-outline\" target=\"_self\" href=\"#\">Info<\/a> <a class=\"btn btn-warning-outline\" target=\"_self\" href=\"#\">Warning<\/a> <a class=\"btn btn-danger-outline\" target=\"_self\" href=\"#\">Danger<\/a><\/p>\n<h2>BUTTONS SIZES<\/h2>\n<p><a class=\"btn btn-primary btn-lg\" target=\"_self\" href=\"#\">large Button<\/a>\u00a0<a class=\"btn btn-secondary btn-lg\" target=\"_self\" href=\"#\">large Button<\/a><\/p>\n<p><a class=\"btn btn-primary btn-sm\" target=\"_self\" href=\"#\">Small Button<\/a>\u00a0<a class=\"btn btn-secondary btn-sm\" target=\"_self\" href=\"#\">Small Button<\/a><\/p>\n<h2>IMAGES<\/h2>\n<h4>ROUNDED<\/h4>\n<p><img loading=\"lazy\" class=\"img-rounded alignnone wp-image-311 size-medium\" src=\"http:\/\/noemi.px-lab.com\/modern\/wp-content\/uploads\/sites\/3\/2016\/06\/image-alignment-300x2001-300x200.jpg\" alt=\"image-alignment-300x2001\" width=\"300\" height=\"200\" \/><\/p>\n<h4>THUMBNAIL<\/h4>\n<p><img loading=\"lazy\" class=\"img-thumbnail alignnone wp-image-311 size-medium\" src=\"http:\/\/noemi.px-lab.com\/modern\/wp-content\/uploads\/sites\/3\/2016\/06\/image-alignment-300x2001-300x200.jpg\" alt=\"image-alignment-300x2001\" width=\"300\" height=\"200\" \/><\/p>\n<h4>CIRCLE<\/h4>\n<p><img loading=\"lazy\" class=\"img-circle alignnone wp-image-311 size-medium\" src=\"http:\/\/noemi.px-lab.com\/modern\/wp-content\/uploads\/sites\/3\/2016\/06\/image-alignment-300x2001-300x200.jpg\" alt=\"image-alignment-300x2001\" width=\"300\" height=\"200\" \/><\/p>\n<h4>CIRCLE FRAME<\/h4>\n<h4><img loading=\"lazy\" class=\"circle-frame alignnone wp-image-311 size-medium\" src=\"http:\/\/noemi.px-lab.com\/modern\/wp-content\/uploads\/sites\/3\/2016\/06\/image-alignment-300x2001-300x200.jpg\" alt=\"image-alignment-300x2001\" width=\"300\" height=\"200\" \/><\/h4>\n<h2>ALERTS<\/h2>\n<p>[noemi_alert]<strong>Warning!<\/strong> Best check yo self, you&#8217;re not looking too <a href=\"#\">good<\/a>.[\/noemi_alert]<\/p>\n<p>[noemi_alert type=&#8217;error&#8217;]<strong>Oh snap!<\/strong> Change a few things up and try submitting again.[\/noemi_alert]<\/p>\n<p>[noemi_alert type=&#8217;success&#8217;]<strong>Well done!<\/strong> You successfully read this important alert message.[\/noemi_alert]<\/p>\n<p>[noemi_alert type=&#8217;info&#8217;]<strong>Heads up!<\/strong> This alert needs your attention, but it&#8217;s not super important.[\/noemi_alert]<\/p>\n<h2>LINE TYPES<\/h2>\n<hr class=\"dotted\" \/>\n<hr class=\"dashed\" \/>\n<hr class=\"dotted primary-color\" \/>\n<hr class=\"dashed primary-color\" \/>\n<h2>HIGHLIGHTS<\/h2>\n<p>Lorem ipsum dolor sit amet, <span class=\"text-highlight\">highlighted text<\/span>. In fringilla libero dui, porttitor\u00a0<span class=\"text-highlight primary-color\">highlighted text<\/span>\u00a0dui tempor nec. Donec eleifend ligula non magna maximus, eget turpis . Donec purus eget dui faucibus congue. id dui ut felis mollis ornare. Phasellus maximus felis sapien, facilisis ultricies elit lacinia id.<\/p>\n<h2>DROPCUPS<\/h2>\n<p><span class=\"text-dropcup\">L<\/span>orem ipsum dolor sit amet, link example. In fringilla libero dui, porttitor condimentum dui tempor nec. Donec eleifend ligula non magna maximus, eget vehicula turpis viverra. Donec luctus purus eget dui faucibus congue. Maecenas id dui ut felis mollis ornare. Phasellus maximus felis sapien, facilisis ultricies elit lacinia id.<\/p>\n<p><span class=\"text-dropcup primary-color\">L<\/span>orem ipsum dolor sit amet, link example. In fringilla libero dui, porttitor condimentum dui tempor nec. Donec eleifend ligula non magna maximus, eget vehicula turpis viverra. Donec luctus purus eget dui faucibus congue. Maecenas id dui ut felis mollis ornare. Phasellus maximus felis sapien, facilisis ultricies elit lacinia id.<\/p>\n<h2>TOOLTIPS<\/h2>\n<p><span class=\"tooltip\" title=\"Tooltip text\">Lorem ipsum<\/span>\u00a0dolor sit amet, link example. In fringilla libero dui, porttitor condimentum dui tempor nec. Donec eleifend ligula non magna maximus, eget vehicula turpis viverra. Donec luctus purus eget dui faucibus congue. Maecenas id dui ut felis mollis ornare. Phasellus maximus felis sapien, facilisis ultricies elit lacinia id.<\/p>\n<h2>TABS<\/h2>\n<div class=\"tabs tabs-horizontal\"> <ul class=\"tabs-menu\"> <li><a href=\"#11\">Tab 1<\/a><\/li> <li><a href=\"#22\">Tab 2<\/a><\/li> <li><a href=\"#33\">Tab 3<\/a><\/li> <li><a href=\"#44\">Tab 4<\/a><\/li> <\/ul> <div class=\"tabs-content\"> <div id=\"11\" class=\"tab-content\"> Tab 1 content<br \/>\nLorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam sit amet purus urna. Proin dictum fringilla enim, sit amet suscipit dolor dictum in. Maecenas porttitor, est et malesuada congue, ligula elit fermentum massa, sit amet porta odio est at velit. Sed nec turpis neque. Fusce at mi felis, sed interdum tortor. <\/div> <div id=\"22\" class=\"tab-content\"> Tab 2 content<br \/>\nLorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam sit amet purus urna. Proin dictum fringilla enim, sit amet suscipit dolor dictum in. Maecenas porttitor, est et malesuada congue, ligula elit fermentum massa, sit amet porta odio est at velit. Sed nec turpis neque. Fusce at mi felis, sed interdum tortor. <\/div> <div id=\"33\" class=\"tab-content\"> Tab 3 content<br \/>\nLorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam sit amet purus urna. Proin dictum fringilla enim, sit amet suscipit dolor dictum in. Maecenas porttitor, est et malesuada congue, ligula elit fermentum massa, sit amet porta odio est at velit. Sed nec turpis neque. Fusce at mi felis, sed interdum tortor. <\/div> <div id=\"44\" class=\"tab-content\"> Tab 4 content<br \/>\nLorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam sit amet purus urna. Proin dictum fringilla enim, sit amet suscipit dolor dictum in. Maecenas porttitor, est et malesuada congue, ligula elit fermentum massa, sit amet porta odio est at velit. Sed nec turpis neque. Fusce at mi felis, sed interdum tortor. <\/div> <\/div> <\/div>\n<div class=\"tabs tabs-vertical\"> <ul class=\"tabs-menu\"> <li><a href=\"#51\">Tab 1<\/a><\/li> <li><a href=\"#62\">Tab 2<\/a><\/li> <li><a href=\"#73\">Tab 3<\/a><\/li> <li><a href=\"#84\">Tab 4<\/a><\/li> <\/ul> <div class=\"tabs-content\"> <div id=\"51\" class=\"tab-content\"> Tab 1 content<br \/>\nLorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam sit amet purus urna. Proin dictum fringilla enim, sit amet suscipit dolor dictum in. Maecenas porttitor, est et malesuada congue, ligula elit fermentum massa, sit amet porta odio est at velit. Sed nec turpis neque. Fusce at mi felis, sed interdum tortor. <\/div> <div id=\"62\" class=\"tab-content\"> Tab 2 content<br \/>\nLorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam sit amet purus urna. Proin dictum fringilla enim, sit amet suscipit dolor dictum in. Maecenas porttitor, est et malesuada congue, ligula elit fermentum massa, sit amet porta odio est at velit. Sed nec turpis neque. Fusce at mi felis, sed interdum tortor. <\/div> <div id=\"73\" class=\"tab-content\"> Tab 3 content<br \/>\nLorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam sit amet purus urna. Proin dictum fringilla enim, sit amet suscipit dolor dictum in. Maecenas porttitor, est et malesuada congue, ligula elit fermentum massa, sit amet porta odio est at velit. Sed nec turpis neque. Fusce at mi felis, sed interdum tortor. <\/div> <div id=\"84\" class=\"tab-content\"> Tab 4 content<br \/>\nLorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam sit amet purus urna. Proin dictum fringilla enim, sit amet suscipit dolor dictum in. Maecenas porttitor, est et malesuada congue, ligula elit fermentum massa, sit amet porta odio est at velit. Sed nec turpis neque. Fusce at mi felis, sed interdum tortor. <\/div> <\/div> <\/div>\n<h2>TOGGLE<\/h2>\n<ul class=\"togglebox\"> <li><h3 class=\"togglebox-header\">Toggle Box Title 1<\/h3><div class=\"togglebox-content\"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam sit amet purus urna. Proin dictum fringilla enim, sit amet suscipit dolor dictum in. Maecenas porttitor, est et malesuada congue, ligula elit fermentum massa, sit amet porta odio est at velit. Sed nec turpis neque. Fusce at mi felis, sed interdum tortor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam sit amet purus urna. Proin dictum fringilla enim, sit amet suscipit dolor dictum in. Maecenas porttitor, est et malesuada congue, ligula elit fermentum massa, sit amet porta odio est at velit. Sed nec turpis neque. Fusce at mi felis, sed interdum tortor. <\/div><\/li> <li><h3 class=\"togglebox-header\">Toggle Box Title 2<\/h3><div class=\"togglebox-content\"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam sit amet purus urna. Proin dictum fringilla enim, sit amet suscipit dolor dictum in. Maecenas porttitor, est et malesuada congue, ligula elit fermentum massa, sit amet porta odio est at velit. Sed nec turpis neque. Fusce at mi felis, sed interdum tortor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam sit amet purus urna. Proin dictum fringilla enim, sit amet suscipit dolor dictum in. Maecenas porttitor, est et malesuada congue, ligula elit fermentum massa, sit amet porta odio est at velit. Sed nec turpis neque. Fusce at mi felis, sed interdum tortor. <\/div><\/li> <li><h3 class=\"togglebox-header\">Toggle Box Title 3<\/h3><div class=\"togglebox-content\"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam sit amet purus urna. Proin dictum fringilla enim, sit amet suscipit dolor dictum in. Maecenas porttitor, est et malesuada congue, ligula elit fermentum massa, sit amet porta odio est at velit. Sed nec turpis neque. Fusce at mi felis, sed interdum tortor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam sit amet purus urna. Proin dictum fringilla enim, sit amet suscipit dolor dictum in. Maecenas porttitor, est et malesuada congue, ligula elit fermentum massa, sit amet porta odio est at velit. Sed nec turpis neque. Fusce at mi felis, sed interdum tortor. <\/div><\/li> <\/ul>\n","protected":false},"excerpt":{"rendered":"<p>BUTTONS OUTLINE BUTTONS BUTTONS SIZES \u00a0 \u00a0 IMAGES ROUNDED THUMBNAIL CIRCLE CIRCLE FRAME ALERTS [noemi_alert]Warning! Best check yo self, you&#8217;re not looking too good.[\/noemi_alert] [noemi_alert type=&#8217;error&#8217;]Oh snap! Change a few<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"page-right_sidebar.php","meta":{"_mi_skip_tracking":false},"_links":{"self":[{"href":"https:\/\/noemi.px-lab.com\/modern\/wp-json\/wp\/v2\/pages\/113"}],"collection":[{"href":"https:\/\/noemi.px-lab.com\/modern\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/noemi.px-lab.com\/modern\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/noemi.px-lab.com\/modern\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/noemi.px-lab.com\/modern\/wp-json\/wp\/v2\/comments?post=113"}],"version-history":[{"count":3,"href":"https:\/\/noemi.px-lab.com\/modern\/wp-json\/wp\/v2\/pages\/113\/revisions"}],"predecessor-version":[{"id":312,"href":"https:\/\/noemi.px-lab.com\/modern\/wp-json\/wp\/v2\/pages\/113\/revisions\/312"}],"wp:attachment":[{"href":"https:\/\/noemi.px-lab.com\/modern\/wp-json\/wp\/v2\/media?parent=113"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}