{"id":497,"date":"2015-06-20T06:37:24","date_gmt":"2015-06-20T06:37:24","guid":{"rendered":"http:\/\/crazy-themes.com\/demo\/assan\/?page_id=497"},"modified":"2015-10-08T06:08:15","modified_gmt":"2015-10-08T06:08:15","slug":"elements","status":"publish","type":"page","link":"http:\/\/crazy-themes.com\/demo\/assan\/elements\/","title":{"rendered":"Elements"},"content":{"rendered":"<h3 class=\"heading\">Bootstrap Grids<\/h3>\n<div class=\"alert alert-info fade in margin-bottom-40\">\n<button type=\"button\" class=\"close\" data-dismiss=\"alert\" aria-hidden=\"true\">&times;<\/button>Lorem Ipsum is simply dummy text of the printing and typesetting industry.lorem Ipsum is simply dummy text of the printing and typesetting industry.<br \/>\nLorem Ipsum has been the industry&#8217;s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.Lorem Ipsum has been the industry&#8217;s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.<\/div>\n<div class=\"row margin30\">\n<div class=\"col-md-12 bootstap-grid\">\n<div class=\"col-md-1\">.col-md-1<\/div>\n<div class=\"col-md-1\">.col-md-1<\/div>\n<div class=\"col-md-1\">.col-md-1<\/div>\n<div class=\"col-md-1\">.col-md-1<\/div>\n<div class=\"col-md-1\">.col-md-1<\/div>\n<div class=\"col-md-1\">.col-md-1<\/div>\n<div class=\"col-md-1\">.col-md-1<\/div>\n<div class=\"col-md-1\">.col-md-1<\/div>\n<div class=\"col-md-1\">.col-md-1<\/div>\n<div class=\"col-md-1\">.col-md-1<\/div>\n<div class=\"col-md-1\">.col-md-1<\/div>\n<div class=\"col-md-1\">.col-md-1<\/div>\n<\/div>\n<\/div>\n<div class=\"row margin30\">\n<div class=\"col-md-12 bootstap-grid\">\n<div class=\"col-md-8\">.col-md-8<\/div>\n<div class=\"col-md-4\">.col-md-4<\/div>\n<\/div>\n<\/div>\n<div class=\"row margin30\">\n<div class=\"col-md-12 bootstap-grid\">\n<div class=\"col-md-4\">.col-md-4<\/div>\n<div class=\"col-md-4\">.col-md-4<\/div>\n<div class=\"col-md-4\">.col-md-4<\/div>\n<\/div>\n<\/div>\n<div class=\"row margin30\">\n<div class=\"col-md-12 bootstap-grid\">\n<div class=\"col-md-6\">.col-md-6<\/div>\n<div class=\"col-md-6\">.col-md-6<\/div>\n<\/div>\n<\/div>\n<div class=\"divide60\"><\/div>\n<div class=\"row margin30\">\n<div class=\"col-md-6  \">\n<h3 class=\"heading\">Buttons<\/h3>\n<div class=\"element-buttons margin50\">\n<button type=\"button\" class=\"btn btn-default\">Default<\/button> <button type=\"button\" class=\"btn btn-primary\">Primary<\/button> <button type=\"button\" class=\"btn btn-success\">Success<\/button> <button type=\"button\" class=\"btn btn-info\">Info<\/button> <button type=\"button\" class=\"btn btn-warning\">Warning<\/button> <button type=\"button\" class=\"btn btn-danger\">Danger<\/button> <button type=\"button\" class=\"btn btn-link\">Link<\/button>\n<\/div>\n<div class=\"divide30\"><\/div>\n<h3 class=\"heading\">Tooltips &#038; popovers<\/h3>\n<div class=\"tooltip-wrap margin20\">\n<button type=\"button\" class=\"btn btn-default\" data-toggle=\"tooltip\" data-placement=\"top\" title=\"Tooltip on top\">Tooltip on top<\/button> <button type=\"button\" class=\"btn btn-default\" data-toggle=\"tooltip\" data-placement=\"left\" title=\"Tooltip on left\">Tooltip on left<\/button> <button type=\"button\" class=\"btn btn-default\" data-toggle=\"tooltip\" data-placement=\"bottom\" title=\"Tooltip on bottom\">Tooltip on bottom<\/button> <button type=\"button\" class=\"btn btn-default\" data-toggle=\"tooltip\" data-placement=\"right\" title=\"Tooltip on right\">Tooltip on right<\/button><\/div>\n<div class=\"divide30\"><\/div>\n<div class=\"popover-wrap\">\n<button type=\"button\" class=\"btn\" data-toggle=\"popover\" data-placement=\"top\" data-content=\"Lorem Ipsum is simply dummy text.\">Popover on top <\/button> <button type=\"button\" class=\"btn\" data-toggle=\"popover\" data-placement=\"left\" data-content=\"Dummy text.\" data-container=\"body\">Popover on left<\/button> <button type=\"button\" class=\"btn\" data-toggle=\"popover\" data-placement=\"bottom\" data-content=\"Lorem Ipsum is simply dummy text of the printing\">Popover on bottom<\/button> <button type=\"button\" class=\"btn\" data-toggle=\"popover\" data-placement=\"right\" data-content=\"Dummy text.\" data-container=\"body\">Popover on right<\/button><\/div>\n<\/div>\n<div class=\"col-md-6  \">\n<h3 class=\"heading\">Responsive video<\/h3>\n<div class = \"embed-responsive embed-responsive-16by9\"><iframe src = \"http:\/\/player.vimeo.com\/video\/57175742\" height = \"420\" width = \"520\"><\/iframe><\/div>\n<\/div>\n<\/div>\n<div class=\"divide60\"><\/div>\n<div class=\"row margin30\">\n<div class=\"col-md-6  \">\n<h3 class=\"heading\">Accordion<\/h3>\n<div id=\"accordion\" class=\"panel-group\">\n<div class=\"panel panel-default\"><div class=\"panel-heading\"><h4 class=\"panel-title\">\r\n        <a href=\"#3477\" data-parent=\"#accordion\" data-toggle=\"collapse\" aria-expanded=\"true\" class=\"\">\r\n        <i class=\"fa fa-desktop\"><\/i>100% Responsive Design<\/a><\/h4><\/div><div class=\"panel-collapse collapse in\" id=\"3477\" aria-expanded=\"true\" role=\"tabpanel\">\r\n        <div class=\"panel-body\"><p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry&#8217;s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.<br \/>\n<\/p><\/div><\/div><\/div>\n<div class=\"panel panel-default\"><div class=\"panel-heading\"><h4 class=\"panel-title\">\r\n        <a href=\"#1367\" data-parent=\"#accordion\" data-toggle=\"collapse\" aria-expanded=\"true\" class=\"collapsed\">\r\n        <i class=\"fa fa-crop\"><\/i>Pixel Perfect Design<\/a><\/h4><\/div><div class=\"panel-collapse collapse \" id=\"1367\" aria-expanded=\"true\" role=\"tabpanel\">\r\n        <div class=\"panel-body\"><p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry&#8217;s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.<br \/>\n<\/p><\/div><\/div><\/div>\n<div class=\"panel panel-default\"><div class=\"panel-heading\"><h4 class=\"panel-title\">\r\n        <a href=\"#7225\" data-parent=\"#accordion\" data-toggle=\"collapse\" aria-expanded=\"true\" class=\"collapsed\">\r\n        <i class=\"fa fa-cogs\"><\/i>Full Support<\/a><\/h4><\/div><div class=\"panel-collapse collapse \" id=\"7225\" aria-expanded=\"true\" role=\"tabpanel\">\r\n        <div class=\"panel-body\"><p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry&#8217;s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.<br \/>\n<\/p><\/div><\/div><\/div>\n<\/div>\n<\/div>\n<div class=\"col-md-6  \">\n<h3 class=\"heading\">Tabs<\/h3>\n<div class=\"tabs\"><ul class=\"nav nav-tabs nav-justified\"><li class = \"active\"><a href = \"#tab1\" data-toggle = \"tab\">Service 1<\/a><\/li>\n<li class = \"\"><a href = \"#tab2\" data-toggle = \"tab\">Service 2<\/a><\/li>\n<li class = \"\"><a href = \"#tab3\" data-toggle = \"tab\">Service 3<\/a><\/li>\n<li class = \"\"><a href = \"#tab4\" data-toggle = \"tab\">Service 4<\/a><\/li>\n<li class = \"\"><a href = \"#tab5\" data-toggle = \"tab\">Service 5<\/a><\/li><\/ul>\r\n    <div class = \"tab-content\"><div class = \"tab-pane active\" id = \"tab1\"><p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry&#8217;s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.<\/p><\/div>\n<div class = \"tab-pane \" id = \"tab2\"><p>when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s.<\/p><\/div>\n<div class = \"tab-pane \" id = \"tab3\"><p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry&#8217;s standard dummy text ever since the 1500.<\/p><\/div>\n<div class = \"tab-pane \" id = \"tab4\"><p>when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s.<\/p><\/div>\n<div class = \"tab-pane \" id = \"tab5\"><p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters.<\/p><\/div><\/div><\/div>\n<\/div>\n<\/div>\n<div class=\"divide60\"><\/div>\n<div class=\"row  \">\n<div class=\"col-md-6  \">\n<h3 class=\"heading\">Tables<\/h3>\n<div class=\"table-responsive\">\n<table class=\"table table-striped table-bordered\">\n<thead>\n<tr>\n<th>#<\/th>\n<th>Column heading<\/th>\n<th>Column heading<\/th>\n<th>Column heading<\/th>\n<\/tr>\n<\/thead>\n<tbody>\n<tr class=\"active\">\n<th scope=\"row\">1<\/th>\n<td>Column content<\/td>\n<td>Column content<\/td>\n<td>Column content<\/td>\n<\/tr>\n<tr>\n<th scope=\"row\">2<\/th>\n<td>Column content<\/td>\n<td>Column content<\/td>\n<td>Column content<\/td>\n<\/tr>\n<tr class=\"success\">\n<th scope=\"row\">3<\/th>\n<td>Column content<\/td>\n<td>Column content<\/td>\n<td>Column content<\/td>\n<\/tr>\n<tr>\n<th scope=\"row\">4<\/th>\n<td>Column content<\/td>\n<td>Column content<\/td>\n<td>Column content<\/td>\n<\/tr>\n<tr class=\"info\">\n<th scope=\"row\">5<\/th>\n<td>Column content<\/td>\n<td>Column content<\/td>\n<td>Column content<\/td>\n<\/tr>\n<tr>\n<th scope=\"row\">6<\/th>\n<td>Column content<\/td>\n<td>Column content<\/td>\n<td>Column content<\/td>\n<\/tr>\n<tr class=\"warning\">\n<th scope=\"row\">7<\/th>\n<td>Column content<\/td>\n<td>Column content<\/td>\n<td>Column content<\/td>\n<\/tr>\n<tr>\n<th scope=\"row\">8<\/th>\n<td>Column content<\/td>\n<td>Column content<\/td>\n<td>Column content<\/td>\n<\/tr>\n<tr class=\"danger\">\n<th scope=\"row\">9<\/th>\n<td>Column content<\/td>\n<td>Column content<\/td>\n<td>Column content<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<div class=\"col-md-6  \">\n<h3 class=\"heading\">Pagination<\/h3>\n<ul class=\"pagination pagination-lg\">\n<li><a href=\"#\" aria-label=\"Previous\"><span aria-hidden=\"true\">&laquo;<\/span><\/a><\/li>\n<li class=\"active\"><a href=\"#\">1<\/a><\/li>\n<li><a href=\"#\">2<\/a><\/li>\n<li><a href=\"#\">3<\/a><\/li>\n<li><a href=\"#\">4<\/a><\/li>\n<li><a href=\"#\" aria-label=\"Next\"><span aria-hidden=\"true\">&raquo;<\/span><\/a><\/li>\n<\/ul>\n<ul class=\"pagination\">\n<li><a href=\"#\" aria-label=\"Previous\"><span aria-hidden=\"true\">&laquo;<\/span><\/a><\/li>\n<li><a href=\"#\">1<\/a><\/li>\n<li class=\"active\"><a href=\"#\">2<\/a><\/li>\n<li><a href=\"#\">3<\/a><\/li>\n<li><a href=\"#\">4<\/a><\/li>\n<li><a href=\"#\" aria-label=\"Next\"><span aria-hidden=\"true\">&raquo;<\/span><\/a><\/li>\n<\/ul>\n<ul class=\"pagination  pagination-sm\">\n<li><a href=\"#\" aria-label=\"Previous\"><span aria-hidden=\"true\">&laquo;<\/span><\/a><\/li>\n<li><a href=\"#\">1<\/a><\/li>\n<li><a href=\"#\">2<\/a><\/li>\n<li class=\"active\"><a href=\"#\">3<\/a><\/li>\n<li><a href=\"#\">4<\/a><\/li>\n<li><a href=\"#\">5<\/a><\/li>\n<li><a href=\"#\" aria-label=\"Next\"><span aria-hidden=\"true\">&raquo;<\/span><\/a><\/li>\n<\/ul>\n<div class=\"divide30\"><\/div>\n<h3 class=\"heading\">Progressbar<\/h3>\n<div class=\"progress-wrap wow bounceIn\">\n<h3 class=\"heading-progress\">Web Design <span class=\"pull-right\">90%<\/span><\/h3><div class=\"progress\"><div class=\"progress-bar\" style=\"width: 90%\" aria-valuemax=\"100\" aria-valuemin=\"0\" aria-valuenow=\"90\" role=\"progressbar\"><\/div><\/div>\n<h3 class=\"heading-progress\">HTML\/CSS <span class=\"pull-right\">85%<\/span><\/h3><div class=\"progress\"><div class=\"progress-bar\" style=\"width: 85%\" aria-valuemax=\"100\" aria-valuemin=\"0\" aria-valuenow=\"85\" role=\"progressbar\"><\/div><\/div>\n<h3 class=\"heading-progress\">Wordpress Design <span class=\"pull-right\">95%<\/span><\/h3><div class=\"progress\"><div class=\"progress-bar\" style=\"width: 95%\" aria-valuemax=\"100\" aria-valuemin=\"0\" aria-valuenow=\"95\" role=\"progressbar\"><\/div><\/div>\n<\/div>\n<\/div>\n<\/div>\n<div class=\"divide60\"><\/div>\n<div class=\"row margin30\">\n<div class=\"col-md-12  \">\n<h3 class=\"heading\">Form elements<\/h3>\n<\/div>\n<div class=\"col-md-6 col-lg-6 col-xs-12 col-sm-6 form-element\">\n<input type=\"text\" class=\"form-control\" placeholder=\"Text input\"><br \/>\n<textarea class=\"form-control\" rows=\"4\"><\/textarea><br \/>\n<\/p>\n<div class=\"input-group\">\n<input type=\"text\" class=\"form-control\"><br \/>\n<span class=\"input-group-btn\"><button class=\"btn btn-default \" type=\"button\">Go!<\/button><\/span><\/div>\n<p><\/p>\n<div class=\"input-group\">\n<input type=\"text\" class=\"form-control\"><\/p>\n<div class=\"input-group-btn\">\n<button type=\"button\" class=\"btn btn-default dropdown-toggle\" data-toggle=\"dropdown\">Action<span class=\"caret\"><\/span><\/button><\/p>\n<ul class=\"dropdown-menu pull-right\">\n<li><a href=\"#\">Action<\/a><\/li>\n<li><a href=\"#\">Another action<\/a><\/li>\n<li><a href=\"#\">Something else here<\/a><\/li>\n<li class=\"divider\"><\/li>\n<li><a href=\"#\">Separated link<\/a><\/li>\n<\/ul>\n<\/div>\n<\/div>\n<p><\/p>\n<div class=\"input-group\">\n<input type=\"text\" value=\"Search...\" placeholder=\"Search...\" class=\"form-control\"><br \/>\n<span class=\"input-group-btn\"><button type=\"submit\" class=\"subscribe-btn btn\">Go!<\/button><\/span>\n<\/div>\n<\/div>\n<div class=\"col-md-6 col-lg-6 col-xs-12 col-sm-6 form-element\">\n<div class=\"form-group\">\n<p>\n<select class=\"form-control\"><option>1<\/option><option>2<\/option><option>3<\/option><option>4<\/option><option>5<\/option><\/select>\n<\/p>\n<div class=\"input-group\">\n<span class=\"input-group-addon\">@<\/span><input type=\"text\" class=\"form-control\" placeholder=\"Username\">\n<\/div>\n<p><\/p>\n<div class=\"input-group\">\n<input type=\"text\" class=\"form-control\"><br \/>\n<span class=\"input-group-addon\">.00<\/span>\n<\/div>\n<p><\/p>\n<p><input class=\"form-control\" id=\"disabledInput\" type=\"text\" placeholder=\"Disabled input here...\" disabled=\"\"><\/p>\n<div class=\"checkbox\"><label><input type=\"checkbox\" value=\"\">Responsive and modren theme<\/label><\/div>\n<div class=\"radio\"><label><input type=\"radio\" name=\"optionsRadios\" id=\"optionsRadios1\" value=\"option1\" checked=\"\">Are you ready to go with Assan theme.<\/label><\/div>\n<\/div>\n<\/div>\n<\/div>\n<div class=\"divide60\"><\/div>\n<div class=\"row  \">\n<div class=\"col-md-6  \">\n<h3 class=\"heading\">Alert Boxes<\/h3>\n<div class=\"wow bounceIn\">\n<div class=\"alert alert-warning\">\n<button type=\"button\" class=\"close\" data-dismiss=\"alert\">\u00d7<\/button>Warning! Better check yourself, you&#8217;re not looking too good. <\/div>\n<div class=\"alert-danger alert\">\n<button type=\"button\" class=\"close\" data-dismiss=\"alert\">\u00d7<\/button>Oh snap! Change a few things up and try submitting again.<\/div>\n<div class=\" alert-info alert\"><button type=\"button\" class=\"close\" data-dismiss=\"alert\">\u00d7<\/button>Heads up! This alert needs your attention, but it&#8217;s not super important.<\/div>\n<div class=\" alert-success alert\">\n<button type=\"button\" class=\"close\" data-dismiss=\"alert\">\u00d7<\/button>Well done! You successfully read this important alert message. <\/div>\n<\/div>\n<\/div>\n<div class=\"col-md-6  \">\n<h3 class=\"heading\">Massages<\/h3>\n<div data-example-id=\"simple-alerts\" class=\"bs-example wow bounceIn\">\n<div role=\"alert\" class=\"alert alert-success\"><strong>Well done!<\/strong> You successfully read this important alert message.<\/div>\n<div role=\"alert\" class=\"alert alert-info\"><strong>Heads up!<\/strong> This alert needs your attention, but it&#8217;s not super important.<\/div>\n<div role=\"alert\" class=\"alert alert-warning\"><strong>Warning!<\/strong> Better check yourself, you&#8217;re not looking too good.<\/div>\n<div role=\"alert\" class=\"alert alert-danger\"><strong>Oh snap!<\/strong> Change a few things up and try submitting again.<\/div>\n<\/div>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>&times;Lorem Ipsum is simply dummy text of the printing and typesetting industry.lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry&#8217;s standard dummy text ever since the 1500s, when an unknown printer took a galley of type<\/p>\n<p><a href=\"http:\/\/crazy-themes.com\/demo\/assan\/elements\/\" class=\"btn btn-theme-dark read-more-link\">Read more&#8230;<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-497","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"http:\/\/crazy-themes.com\/demo\/assan\/wp-json\/wp\/v2\/pages\/497","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/crazy-themes.com\/demo\/assan\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"http:\/\/crazy-themes.com\/demo\/assan\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"http:\/\/crazy-themes.com\/demo\/assan\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/crazy-themes.com\/demo\/assan\/wp-json\/wp\/v2\/comments?post=497"}],"version-history":[{"count":0,"href":"http:\/\/crazy-themes.com\/demo\/assan\/wp-json\/wp\/v2\/pages\/497\/revisions"}],"wp:attachment":[{"href":"http:\/\/crazy-themes.com\/demo\/assan\/wp-json\/wp\/v2\/media?parent=497"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}