{"id":76,"date":"2014-09-26T11:12:37","date_gmt":"2014-09-26T11:12:37","guid":{"rendered":"http:\/\/ordasvit.com\/wp-time\/?page_id=76"},"modified":"2021-09-14T12:42:05","modified_gmt":"2021-09-14T12:42:05","slug":"elements","status":"publish","type":"page","link":"https:\/\/ordasvit.com\/wp-time\/elements\/","title":{"rendered":"Buttons"},"content":{"rendered":"<div class=\"page\">\n<h3>Buttons<\/h3>\n<div class=\"btn-group\">\n  <button type=\"button\" class=\"btn btn-default\">Left<\/button>\n  <button type=\"button\" class=\"btn btn-default\">Middle<\/button>\n  <button type=\"button\" class=\"btn btn-default\">Right<\/button><\/div>\n&nbsp;\n<div id=\"accordion2\" class=\"accordion\">\n<div class=\"accordion-group\">\n<div class=\"accordion-heading\"><a class=\"accordion-toggle collapsed\" href=\"#collapseTwo\" data-toggle=\"collapse\" data-parent=\"#accordion2\" aria-expanded=\"false\">How to use<\/a><\/div>\n<div id=\"collapseTwo\" class=\"accordion-body collapse\" aria-expanded=\"false\" style=\"height: 0px;\">\n<div class=\"accordion-inner\">\n<div class=\"wp_syntax\">\n<table>\n<tbody>\n<tr>\n<td class=\"code\">\n<pre class=\"html\" style=\"font-family:monospace;\">&lt;div class=\"btn-group\"&gt;\n  &lt;button type=\"button\" class=\"btn btn-default\"&gt;Left&lt;\/button&gt;\n  &lt;button type=\"button\" class=\"btn btn-default\"&gt;Middle&lt;\/button&gt;\n  &lt;button type=\"button\" class=\"btn btn-default\"&gt;Right&lt;\/button&gt;\n&lt;\/div&gt;<\/pre>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<h3>Standard button<\/h3>\n<!-- Standard button -->\n<button type=\"button\" class=\"btn btn-default\">Default<\/button>\n\n<!-- Provides extra visual weight and identifies the primary action in a set of buttons -->\n<button type=\"button\" class=\"btn btn-primary\">Primary<\/button>\n\n<!-- Indicates a successful or positive action -->\n<button type=\"button\" class=\"btn btn-success\">Success<\/button>\n\n<!-- Contextual button for informational alert messages -->\n<button type=\"button\" class=\"btn btn-info\">Info<\/button>\n\n<!-- Indicates caution should be taken with this action -->\n<button type=\"button\" class=\"btn btn-warning\">Warning<\/button>\n\n<!-- Indicates a dangerous or potentially negative action -->\n<button type=\"button\" class=\"btn btn-danger\">Danger<\/button>\n<div id=\"accordion3\" class=\"accordion\">\n<div class=\"accordion-group\">\n<div class=\"accordion-heading\"><a class=\"accordion-toggle collapsed\" href=\"#collapse3\" data-toggle=\"collapse\" data-parent=\"#accordion3\" aria-expanded=\"false\">How to use<\/a><\/div>\n<div id=\"collapse3\" class=\"accordion-body collapse\" aria-expanded=\"false\" style=\"height: 0px;\">\n<div class=\"accordion-inner\">\n<div class=\"wp_syntax\">\n<table>\n<tbody>\n<tr>\n<td class=\"code\">\n<pre class=\"html\" style=\"font-family:monospace;\">&lt;!-- Standard button --&gt;\n&lt;button type=\"button\" class=\"btn btn-default\"&gt;Default&lt;\/button&gt;\n&nbsp;\n&lt;!-- Provides extra visual weight and identifies the primary action in a set of buttons --&gt;\n&lt;button type=\"button\" class=\"btn btn-primary\"&gt;Primary&lt;\/button&gt;\n&nbsp;\n&lt;!-- Indicates a successful or positive action --&gt;\n&lt;button type=\"button\" class=\"btn btn-success\"&gt;Success&lt;\/button&gt;\n&nbsp;\n&lt;!-- Contextual button for informational alert messages --&gt;\n&lt;button type=\"button\" class=\"btn btn-info\"&gt;Info&lt;\/button&gt;\n&nbsp;\n&lt;!-- Indicates caution should be taken with this action --&gt;\n&lt;button type=\"button\" class=\"btn btn-warning\"&gt;Warning&lt;\/button&gt;\n&nbsp;\n&lt;!-- Indicates a dangerous or potentially negative action --&gt;\n&lt;button type=\"button\" class=\"btn btn-danger\"&gt;Danger&lt;\/button&gt;<\/pre>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<h3>Large button<\/h3>\n<button type=\"button\" class=\"btn btn-default btn-lg\">Default button<\/button>\n  <button type=\"button\" class=\"btn btn-primary btn-lg\">Primary button<\/button>\n  <button type=\"button\" class=\"btn btn-primary btn-lg btn-success\">Success button<\/button>\n  <button type=\"button\" class=\"btn btn-primary btn-lg btn-info\">Info button<\/button>\n  <button type=\"button\" class=\"btn btn-primary btn-lg btn-warning\">Warning button<\/button>\n  <button type=\"button\" class=\"btn btn-primary btn-lg btn-danger\">Danger button<\/button>\n<div id=\"accordion4\" class=\"accordion\">\n<div class=\"accordion-group\">\n<div class=\"accordion-heading\"><a class=\"accordion-toggle\" href=\"#collapse4\" data-toggle=\"collapse\" data-parent=\"#accordion4\">How to use<\/a><\/div>\n<div id=\"collapse4\" class=\"accordion-body collapse\">\n<div class=\"accordion-inner\">\n<div class=\"wp_syntax\">\n<table>\n<tbody>\n<tr>\n<td class=\"code\">\n<pre class=\"html\" style=\"font-family:monospace;\">  &lt;button type=\"button\" class=\"btn btn-default btn-lg\"&gt;Default button&lt;\/button&gt;\n  &lt;button type=\"button\" class=\"btn btn-primary btn-lg\"&gt;Primary button&lt;\/button&gt;\n  &lt;button type=\"button\" class=\"btn btn-primary btn-lg btn-success\"&gt;Success button&lt;\/button&gt;\n  &lt;button type=\"button\" class=\"btn btn-primary btn-lg btn-info\"&gt;Info button&lt;\/button&gt;\n  &lt;button type=\"button\" class=\"btn btn-primary btn-lg btn-warning\"&gt;Warning button&lt;\/button&gt;\n  &lt;button type=\"button\" class=\"btn btn-primary btn-lg btn-danger\"&gt;Danger button&lt;\/button&gt;<\/pre>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<h3>Button<\/h3>\n<button type=\"button\" class=\"btn btn-default\">Default button<\/button>\n  <button type=\"button\" class=\"btn btn-primary\">Primary button<\/button>\n  <button type=\"button\" class=\"btn btn-primary btn-success\">Success button<\/button>\n  <button type=\"button\" class=\"btn btn-primary btn-info\">Info button<\/button>\n  <button type=\"button\" class=\"btn btn-primary btn-warning\">Warning button<\/button>\n  <button type=\"button\" class=\"btn btn-primary btn-danger\">Danger button<\/button>\n<div id=\"accordion5\" class=\"accordion\">\n<div class=\"accordion-group\">\n<div class=\"accordion-heading\"><a class=\"accordion-toggle\" href=\"#collapse5\" data-toggle=\"collapse\" data-parent=\"#accordion5\">How to use<\/a><\/div>\n<div id=\"collapse5\" class=\"accordion-body collapse\">\n<div class=\"accordion-inner\">\n<div class=\"wp_syntax\">\n<table>\n<tbody>\n<tr>\n<td class=\"code\">\n<pre class=\"html\" style=\"font-family:monospace;\">  &lt;button type=\"button\" class=\"btn btn-default\"&gt;Default button&lt;\/button&gt;\n  &lt;button type=\"button\" class=\"btn btn-primary\"&gt;Primary button&lt;\/button&gt;\n  &lt;button type=\"button\" class=\"btn btn-primary btn-success\"&gt;Success button&lt;\/button&gt;\n  &lt;button type=\"button\" class=\"btn btn-primary btn-info\"&gt;Info button&lt;\/button&gt;\n  &lt;button type=\"button\" class=\"btn btn-primary btn-warning\"&gt;Warning button&lt;\/button&gt;\n  &lt;button type=\"button\" class=\"btn btn-primary btn-danger\"&gt;Danger button&lt;\/button&gt;<\/pre>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<h3>Small button<\/h3>\n<button type=\"button\" class=\"btn btn-default btn-sm\">Default button<\/button>\n  <button type=\"button\" class=\"btn btn-primary btn-sm\">Primary button<\/button>\n  <button type=\"button\" class=\"btn btn-primary btn-sm btn-success\">Success button<\/button>\n  <button type=\"button\" class=\"btn btn-primary btn-sm btn-info\">Info button<\/button>\n  <button type=\"button\" class=\"btn btn-primary btn-sm btn-warning\">Warning button<\/button>\n  <button type=\"button\" class=\"btn btn-primary btn-sm btn-danger\">Danger button<\/button>\n<div id=\"accordion6\" class=\"accordion\">\n<div class=\"accordion-group\">\n<div class=\"accordion-heading\"><a class=\"accordion-toggle\" href=\"#collapse6\" data-toggle=\"collapse\" data-parent=\"#accordion6\">How to use<\/a><\/div>\n<div id=\"collapse6\" class=\"accordion-body collapse\">\n<div class=\"accordion-inner\">\n<div class=\"wp_syntax\">\n<table>\n<tbody>\n<tr>\n<td class=\"code\">\n<pre class=\"html\" style=\"font-family:monospace;\">  &lt;button type=\"button\" class=\"btn btn-default btn-sm\"&gt;Default button&lt;\/button&gt;\n  &lt;button type=\"button\" class=\"btn btn-primary btn-sm\"&gt;Primary button&lt;\/button&gt;\n  &lt;button type=\"button\" class=\"btn btn-primary btn-sm btn-success\"&gt;Success button&lt;\/button&gt;\n  &lt;button type=\"button\" class=\"btn btn-primary btn-sm btn-info\"&gt;Info button&lt;\/button&gt;\n  &lt;button type=\"button\" class=\"btn btn-primary btn-sm btn-warning\"&gt;Warning button&lt;\/button&gt;\n  &lt;button type=\"button\" class=\"btn btn-primary btn-sm btn-danger\"&gt;Danger button&lt;\/button&gt;<\/pre>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<h3>Mini button<\/h3>\n<button type=\"button\" class=\"btn btn-default btn-xs\">Default button<\/button>\n  <button type=\"button\" class=\"btn btn-primary btn-xs\">Primary button<\/button>\n  <button type=\"button\" class=\"btn btn-primary btn-xs btn-succes\">Success button<\/button>\n  <button type=\"button\" class=\"btn btn-primary btn-xs btn-info\">Info button<\/button>\n  <button type=\"button\" class=\"btn btn-primary btn-xs btn-warning\">Warning button<\/button>\n  <button type=\"button\" class=\"btn btn-primary btn-xs btn-danger\">Danger button<\/button>\n<div id=\"accordion1\" class=\"accordion\">\n<div class=\"accordion-group\">\n<div class=\"accordion-heading\"><a class=\"accordion-toggle\" href=\"#collapse1\" data-toggle=\"collapse\" data-parent=\"#accordion1\">How to use<\/a><\/div>\n<div id=\"collapse1\" class=\"accordion-body collapse\">\n<div class=\"accordion-inner\">\n<div class=\"wp_syntax\">\n<table>\n<tbody>\n<tr>\n<td class=\"code\">\n<pre class=\"html\" style=\"font-family:monospace;\">  &lt;button type=\"button\" class=\"btn btn-default btn-xs\"&gt;Default button&lt;\/button&gt;\n  &lt;button type=\"button\" class=\"btn btn-primary btn-xs\"&gt;Primary button&lt;\/button&gt;\n  &lt;button type=\"button\" class=\"btn btn-primary btn-xs btn-succes\"&gt;Success button&lt;\/button&gt;\n  &lt;button type=\"button\" class=\"btn btn-primary btn-xs btn-info\"&gt;Info button&lt;\/button&gt;\n  &lt;button type=\"button\" class=\"btn btn-primary btn-xs btn-warning\"&gt;Warning button&lt;\/button&gt;\n  &lt;button type=\"button\" class=\"btn btn-primary btn-xs btn-danger\"&gt;Danger button&lt;\/button&gt;<\/pre>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<h3>Nested button groups<\/h3>\n<div class=\"btn-group\">\n  <button type=\"button\" class=\"btn btn-default\">1<\/button>\n  <button type=\"button\" class=\"btn btn-default\">2<\/button>\n<div class=\"btn-group\">\n    <button type=\"button\" class=\"btn btn-default dropdown-toggle\" data-toggle=\"dropdown\">\n      Dropdown\n      <span class=\"caret\"><\/span>\n    <\/button>\n<ul class=\"dropdown-menu\">\n \t<li><a href=\"#\">Dropdown link<\/a><\/li>\n \t<li><a href=\"#\">Dropdown link<\/a><\/li>\n<\/ul>\n<\/div>\n<\/div>\n<div id=\"accordion7\" class=\"accordion\">\n<div class=\"accordion-group\">\n<div class=\"accordion-heading\"><a class=\"accordion-toggle\" href=\"#collapse7\" data-toggle=\"collapse\" data-parent=\"#accordion7\">How to use<\/a><\/div>\n<div id=\"collapse7\" class=\"accordion-body collapse\">\n<div class=\"accordion-inner\">\n<div class=\"wp_syntax\">\n<table>\n<tbody>\n<tr>\n<td class=\"code\">\n<pre class=\"html\" style=\"font-family:monospace;\">&lt;div class=\"btn-group\"&gt;\n  &lt;button type=\"button\" class=\"btn btn-default\"&gt;1&lt;\/button&gt;\n  &lt;button type=\"button\" class=\"btn btn-default\"&gt;2&lt;\/button&gt;\n&nbsp;\n  &lt;div class=\"btn-group\"&gt;\n    &lt;button type=\"button\" class=\"btn btn-default dropdown-toggle\" data-toggle=\"dropdown\"&gt;\n      Dropdown\n      &lt;span class=\"caret\"&gt;&lt;\/span&gt;\n    &lt;\/button&gt;\n    &lt;ul class=\"dropdown-menu\"&gt;\n      &lt;li&gt;&lt;a href=\"#\"&gt;Dropdown link&lt;\/a&gt;&lt;\/li&gt;\n      &lt;li&gt;&lt;a href=\"#\"&gt;Dropdown link&lt;\/a&gt;&lt;\/li&gt;\n    &lt;\/ul&gt;\n  &lt;\/div&gt;\n&lt;\/div&gt;<\/pre>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<h3>Single button dropdowns<\/h3>\n<!-- Single button -->\n<div class=\"btn-group\">\n  <button type=\"button\" class=\"btn btn-default dropdown-toggle\" data-toggle=\"dropdown\">\n    Action <span class=\"caret\"><\/span>\n  <\/button>\n<ul class=\"dropdown-menu\">\n \t<li><a href=\"#\">Action<\/a><\/li>\n \t<li><a href=\"#\">Another action<\/a><\/li>\n \t<li><a href=\"#\">Something else here<\/a><\/li>\n \t<li class=\"divider\"><\/li>\n \t<li><a href=\"#\">Separated link<\/a><\/li>\n<\/ul>\n<\/div>\n<div class=\"btn-group\">\n<button type=\"button\" class=\"btn btn-primary dropdown-toggle\" data-toggle=\"dropdown\">Action <span class=\"caret\"><\/span><\/button>\n<ul class=\"dropdown-menu\">\n \t<li><a href=\"#\">Action<\/a><\/li>\n \t<li><a href=\"#\">Another action<\/a><\/li>\n \t<li><a href=\"#\">Something else here<\/a><\/li>\n \t<li class=\"divider\"><\/li>\n \t<li><a href=\"#\">Separated link<\/a><\/li>\n<\/ul>\n<\/div>\n<div class=\"btn-group\">\n<button type=\"button\" class=\"btn btn-danger dropdown-toggle\" data-toggle=\"dropdown\">Danger <span class=\"caret\"><\/span><\/button>\n<ul class=\"dropdown-menu\">\n \t<li><a href=\"#\">Action<\/a><\/li>\n \t<li><a href=\"#\">Another action<\/a><\/li>\n \t<li><a href=\"#\">Something else here<\/a><\/li>\n \t<li class=\"divider\"><\/li>\n \t<li><a href=\"#\">Separated link<\/a><\/li>\n<\/ul>\n<\/div>\n<div class=\"btn-group\">\n<button type=\"button\" class=\"btn btn-warning dropdown-toggle\" data-toggle=\"dropdown\">Warning <span class=\"caret\"><\/span><\/button>\n<ul class=\"dropdown-menu\">\n \t<li><a href=\"#\">Action<\/a><\/li>\n \t<li><a href=\"#\">Another action<\/a><\/li>\n \t<li><a href=\"#\">Something else here<\/a><\/li>\n \t<li class=\"divider\"><\/li>\n \t<li><a href=\"#\">Separated link<\/a><\/li>\n<\/ul>\n<\/div>\n<div class=\"btn-group\">\n<button type=\"button\" class=\"btn btn-success dropdown-toggle\" data-toggle=\"dropdown\">Success <span class=\"caret\"><\/span><\/button>\n<ul class=\"dropdown-menu\">\n \t<li><a href=\"#\">Action<\/a><\/li>\n \t<li><a href=\"#\">Another action<\/a><\/li>\n \t<li><a href=\"#\">Something else here<\/a><\/li>\n \t<li class=\"divider\"><\/li>\n \t<li><a href=\"#\">Separated link<\/a><\/li>\n<\/ul>\n<\/div>\n<div id=\"accordion8\" class=\"accordion\">\n<div class=\"accordion-group\">\n<div class=\"accordion-heading\"><a class=\"accordion-toggle\" href=\"#collapse8\" data-toggle=\"collapse\" data-parent=\"#accordion8\">How to use<\/a><\/div>\n<div id=\"collapse8\" class=\"accordion-body collapse\">\n<div class=\"accordion-inner\">\n<div class=\"wp_syntax\">\n<table>\n<tbody>\n<tr>\n<td class=\"code\">\n<pre class=\"html\" style=\"font-family:monospace;\"> &lt;!-- Single button --&gt;\n &lt;div class=\"btn-group\"&gt;\n  &lt;button type=\"button\" class=\"btn btn-default dropdown-toggle\" data-toggle=\"dropdown\"&gt;\n    Action &lt;span class=\"caret\"&gt;&lt;\/span&gt;\n  &lt;\/button&gt;\n  &lt;ul class=\"dropdown-menu\"&gt;\n    &lt;li&gt;&lt;a href=\"#\"&gt;Action&lt;\/a&gt;&lt;\/li&gt;\n    &lt;li&gt;&lt;a href=\"#\"&gt;Another action&lt;\/a&gt;&lt;\/li&gt;\n    &lt;li&gt;&lt;a href=\"#\"&gt;Something else here&lt;\/a&gt;&lt;\/li&gt;\n    &lt;li class=\"divider\"&gt;&lt;\/li&gt;\n    &lt;li&gt;&lt;a href=\"#\"&gt;Separated link&lt;\/a&gt;&lt;\/li&gt;\n  &lt;\/ul&gt;\n &lt;\/div&gt;<\/pre>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<h3>Split button dropdowns<\/h3>\n<!-- Split button -->\n<div class=\"btn-group\">\n  <button type=\"button\" class=\"btn btn-default\">Action<\/button>\n  <button type=\"button\" class=\"btn btn-default dropdown-toggle\" data-toggle=\"dropdown\">\n    <span class=\"caret\"><\/span>\n  <\/button>\n<ul class=\"dropdown-menu\">\n \t<li><a href=\"#\">Action<\/a><\/li>\n \t<li><a href=\"#\">Another action<\/a><\/li>\n \t<li><a href=\"#\">Something else here<\/a><\/li>\n \t<li class=\"divider\"><\/li>\n \t<li><a href=\"#\">Separated link<\/a><\/li>\n<\/ul>\n<\/div>\n<div class=\"btn-group\">\n<button type=\"button\" class=\"btn btn-primary\">Action<\/button>\n<button type=\"button\" class=\"btn btn-primary dropdown-toggle\" data-toggle=\"dropdown\"><span class=\"caret\"><\/span><\/button>\n<ul class=\"dropdown-menu\">\n \t<li><a href=\"#\">Action<\/a><\/li>\n \t<li><a href=\"#\">Another action<\/a><\/li>\n \t<li><a href=\"#\">Something else here<\/a><\/li>\n \t<li class=\"divider\"><\/li>\n \t<li><a href=\"#\">Separated link<\/a><\/li>\n<\/ul>\n<\/div>\n<div class=\"btn-group\">\n<button type=\"button\" class=\"btn btn-danger\">Danger<\/button>\n<button type=\"button\" class=\"btn btn-danger dropdown-toggle\" data-toggle=\"dropdown\"><span class=\"caret\"><\/span><\/button>\n<ul class=\"dropdown-menu\">\n \t<li><a href=\"#\">Action<\/a><\/li>\n \t<li><a href=\"#\">Another action<\/a><\/li>\n \t<li><a href=\"#\">Something else here<\/a><\/li>\n \t<li class=\"divider\"><\/li>\n \t<li><a href=\"#\">Separated link<\/a><\/li>\n<\/ul>\n<\/div>\n<div class=\"btn-group\">\n<button type=\"button\" class=\"btn btn-warning\">Warning<\/button>\n<button type=\"button\" class=\"btn btn-warning dropdown-toggle\" data-toggle=\"dropdown\"><span class=\"caret\"><\/span><\/button>\n<ul class=\"dropdown-menu\">\n \t<li><a href=\"#\">Action<\/a><\/li>\n \t<li><a href=\"#\">Another action<\/a><\/li>\n \t<li><a href=\"#\">Something else here<\/a><\/li>\n \t<li class=\"divider\"><\/li>\n \t<li><a href=\"#\">Separated link<\/a><\/li>\n<\/ul>\n<\/div>\n<div class=\"btn-group\">\n<button type=\"button\" class=\"btn btn-success\">Success<\/button>\n<button type=\"button\" class=\"btn btn-success dropdown-toggle\" data-toggle=\"dropdown\"><span class=\"caret\"><\/span><\/button>\n<ul class=\"dropdown-menu\">\n \t<li><a href=\"#\">Action<\/a><\/li>\n \t<li><a href=\"#\">Another action<\/a><\/li>\n \t<li><a href=\"#\">Something else here<\/a><\/li>\n \t<li class=\"divider\"><\/li>\n \t<li><a href=\"#\">Separated link<\/a><\/li>\n<\/ul>\n<\/div>\n<div id=\"accordion9\" class=\"accordion\">\n<div class=\"accordion-group\">\n<div class=\"accordion-heading\"><a class=\"accordion-toggle\" href=\"#collapse9\" data-toggle=\"collapse\" data-parent=\"#accordion9\">How to use<\/a><\/div>\n<div id=\"collapse9\" class=\"accordion-body collapse\">\n<div class=\"accordion-inner\">\n<div class=\"wp_syntax\">\n<table>\n<tbody>\n<tr>\n<td class=\"code\">\n<pre class=\"html\" style=\"font-family:monospace;\">&lt;!-- Split button --&gt;\n&lt;div class=\"btn-group\"&gt;\n  &lt;button type=\"button\" class=\"btn btn-default\"&gt;Action&lt;\/button&gt;\n  &lt;button type=\"button\" class=\"btn btn-default dropdown-toggle\" data-toggle=\"dropdown\"&gt;\n    &lt;span class=\"caret\"&gt;&lt;\/span&gt;\n  &lt;\/button&gt;\n  &lt;ul class=\"dropdown-menu\"&gt;\n    &lt;li&gt;&lt;a href=\"#\"&gt;Action&lt;\/a&gt;&lt;\/li&gt;\n    &lt;li&gt;&lt;a href=\"#\"&gt;Another action&lt;\/a&gt;&lt;\/li&gt;\n    &lt;li&gt;&lt;a href=\"#\"&gt;Something else here&lt;\/a&gt;&lt;\/li&gt;\n    &lt;li class=\"divider\"&gt;&lt;\/li&gt;\n    &lt;li&gt;&lt;a href=\"#\"&gt;Separated link&lt;\/a&gt;&lt;\/li&gt;\n  &lt;\/ul&gt;\n&lt;\/div&gt;<\/pre>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<h3>Dropup buttons<\/h3>\n<div class=\"btn-group dropup\">\n<button type=\"button\" class=\"btn btn-default\">Dropup<\/button>\n<button type=\"button\" class=\"btn btn-default dropdown-toggle\" data-toggle=\"dropdown\"><span class=\"caret\"><\/span><\/button>\n<ul class=\"dropdown-menu\">\n \t<li><a href=\"#\">Action<\/a><\/li>\n \t<li><a href=\"#\">Another action<\/a><\/li>\n \t<li><a href=\"#\">Something else here<\/a><\/li>\n \t<li class=\"divider\"><\/li>\n \t<li><a href=\"#\">Separated link<\/a><\/li>\n<\/ul>\n<\/div>\n<div class=\"btn-group dropup\">\n<button type=\"button\" class=\"btn btn-primary\">Right dropup<\/button>\n<button type=\"button\" class=\"btn btn-primary dropdown-toggle\" data-toggle=\"dropdown\"><span class=\"caret\"><\/span><\/button>\n<ul class=\"dropdown-menu pull-right\">\n \t<li><a href=\"#\">Action<\/a><\/li>\n \t<li><a href=\"#\">Another action<\/a><\/li>\n \t<li><a href=\"#\">Something else here<\/a><\/li>\n \t<li class=\"divider\"><\/li>\n \t<li><a href=\"#\">Separated link<\/a><\/li>\n<\/ul>\n<\/div>\n<div id=\"accordion10\" class=\"accordion\">\n<div class=\"accordion-group\">\n<div class=\"accordion-heading\"><a class=\"accordion-toggle\" href=\"#collapse10\" data-toggle=\"collapse\" data-parent=\"#accordion10\">How to use<\/a><\/div>\n<div id=\"collapse10\" class=\"accordion-body collapse\">\n<div class=\"accordion-inner\">\n<div class=\"wp_syntax\">\n<table>\n<tbody>\n<tr>\n<td class=\"code\">\n<pre class=\"html\" style=\"font-family:monospace;\">&lt;div class=\"btn-group dropup\"&gt;\n&lt;button type=\"button\" class=\"btn btn-default\"&gt;Dropup&lt;\/button&gt;\n&lt;button type=\"button\" class=\"btn btn-default dropdown-toggle\" data-toggle=\"dropdown\"&gt;&lt;span class=\"caret\"&gt;&lt;\/span&gt;&lt;\/button&gt;\n&lt;ul class=\"dropdown-menu\"&gt;\n&lt;li&gt;&lt;a href=\"#\"&gt;Action&lt;\/a&gt;&lt;\/li&gt;\n&lt;li&gt;&lt;a href=\"#\"&gt;Another action&lt;\/a&gt;&lt;\/li&gt;\n&lt;li&gt;&lt;a href=\"#\"&gt;Something else here&lt;\/a&gt;&lt;\/li&gt;\n&lt;li class=\"divider\"&gt;&lt;\/li&gt;\n&lt;li&gt;&lt;a href=\"#\"&gt;Separated link&lt;\/a&gt;&lt;\/li&gt;\n&lt;\/ul&gt;\n&lt;\/div&gt;<\/pre>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<h3>Buttons instead of text<\/h3>\n<div class=\"row\">\n<div class=\"col-lg-6\">\n<div class=\"input-group\">\n      <span class=\"input-group-btn\">\n        <button class=\"btn btn-default\" type=\"button\"><i class=\"fa fa-search\"><\/i><\/button>\n      <\/span>\n      <input type=\"text\" class=\"form-control\"><\/div>\n<!-- \/input-group --><\/div>\n<!-- \/.col-lg-6 -->\n<div class=\"col-lg-6\">\n<div class=\"input-group\">\n      <input type=\"text\" class=\"form-control\">\n      <span class=\"input-group-btn\">\n        <button class=\"btn btn-default\" type=\"button\"><i class=\"fa fa-search\"><\/i><\/button>\n      <\/span><\/div>\n<!-- \/input-group --><\/div>\n<!-- \/.col-lg-6 --><\/div>\n<!-- \/.row -->\n<div id=\"accordion11\" class=\"accordion\">\n<div class=\"accordion-group\">\n<div class=\"accordion-heading\"><a class=\"accordion-toggle\" href=\"#collapse11\" data-toggle=\"collapse\" data-parent=\"#accordion11\">How to use<\/a><\/div>\n<div id=\"collapse11\" class=\"accordion-body collapse\">\n<div class=\"accordion-inner\">\n<div class=\"wp_syntax\">\n<table>\n<tbody>\n<tr>\n<td class=\"code\">\n<pre class=\"html\" style=\"font-family:monospace;\">&lt;div class=\"row\"&gt;\n  &lt;div class=\"col-lg-6\"&gt;\n    &lt;div class=\"input-group\"&gt;\n      &lt;span class=\"input-group-btn\"&gt;\n        &lt;button class=\"btn btn-default\" type=\"button\"&gt;&lt;i class=\"fa fa-search\"&gt;&lt;\/i&gt;&lt;\/button&gt;\n      &lt;\/span&gt;\n      &lt;input type=\"text\" class=\"form-control\"&gt;\n    &lt;\/div&gt;&lt;!-- \/input-group --&gt;\n  &lt;\/div&gt;&lt;!-- \/.col-lg-6 --&gt;\n  &lt;div class=\"col-lg-6\"&gt;\n    &lt;div class=\"input-group\"&gt;\n      &lt;input type=\"text\" class=\"form-control\"&gt;\n      &lt;span class=\"input-group-btn\"&gt;\n        &lt;button class=\"btn btn-default\" type=\"button\"&gt;&lt;i class=\"fa fa-search\"&gt;&lt;\/i&gt;&lt;\/button&gt;\n      &lt;\/span&gt;\n    &lt;\/div&gt;&lt;!-- \/input-group --&gt;\n  &lt;\/div&gt;&lt;!-- \/.col-lg-6 --&gt;\n&lt;\/div&gt;&lt;!-- \/.row --&gt;<\/pre>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<h3>Buttons with dropdowns<\/h3>\n<div class=\"row\">\n<div class=\"col-lg-6\">\n<div class=\"input-group\">\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>\n<ul class=\"dropdown-menu\">\n \t<li><a href=\"#\">Action<\/a><\/li>\n \t<li><a href=\"#\">Another action<\/a><\/li>\n \t<li><a href=\"#\">Something else here<\/a><\/li>\n \t<li class=\"divider\"><\/li>\n \t<li><a href=\"#\">Separated link<\/a><\/li>\n<\/ul>\n<\/div>\n<!-- \/btn-group -->\n      <input type=\"text\" class=\"form-control\"><\/div>\n<!-- \/input-group --><\/div>\n<!-- \/.col-lg-6 -->\n<div class=\"col-lg-6\">\n<div class=\"input-group\">\n      <input type=\"text\" class=\"form-control\">\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>\n<ul class=\"dropdown-menu pull-right\">\n \t<li><a href=\"#\">Action<\/a><\/li>\n \t<li><a href=\"#\">Another action<\/a><\/li>\n \t<li><a href=\"#\">Something else here<\/a><\/li>\n \t<li class=\"divider\"><\/li>\n \t<li><a href=\"#\">Separated link<\/a><\/li>\n<\/ul>\n<\/div>\n<!-- \/btn-group --><\/div>\n<!-- \/input-group --><\/div>\n<!-- \/.col-lg-6 --><\/div>\n<!-- \/.row -->\n<div id=\"accordion12\" class=\"accordion\">\n<div class=\"accordion-group\">\n<div class=\"accordion-heading\"><a class=\"accordion-toggle\" href=\"#collapse12\" data-toggle=\"collapse\" data-parent=\"#accordion12\">How to use<\/a><\/div>\n<div id=\"collapse12\" class=\"accordion-body collapse\">\n<div class=\"accordion-inner\">\n<div class=\"wp_syntax\">\n<table>\n<tbody>\n<tr>\n<td class=\"code\">\n<pre class=\"html\" style=\"font-family:monospace;\">&lt;div class=\"row\"&gt;\n  &lt;div class=\"col-lg-6\"&gt;\n    &lt;div class=\"input-group\"&gt;\n      &lt;div class=\"input-group-btn\"&gt;\n        &lt;button type=\"button\" class=\"btn btn-default dropdown-toggle\" data-toggle=\"dropdown\"&gt;Action &lt;span class=\"caret\"&gt;&lt;\/span&gt;&lt;\/button&gt;\n        &lt;ul class=\"dropdown-menu\"&gt;\n          &lt;li&gt;&lt;a href=\"#\"&gt;Action&lt;\/a&gt;&lt;\/li&gt;\n          &lt;li&gt;&lt;a href=\"#\"&gt;Another action&lt;\/a&gt;&lt;\/li&gt;\n          &lt;li&gt;&lt;a href=\"#\"&gt;Something else here&lt;\/a&gt;&lt;\/li&gt;\n          &lt;li class=\"divider\"&gt;&lt;\/li&gt;\n          &lt;li&gt;&lt;a href=\"#\"&gt;Separated link&lt;\/a&gt;&lt;\/li&gt;\n        &lt;\/ul&gt;\n      &lt;\/div&gt;&lt;!-- \/btn-group --&gt;\n      &lt;input type=\"text\" class=\"form-control\"&gt;\n    &lt;\/div&gt;&lt;!-- \/input-group --&gt;\n  &lt;\/div&gt;&lt;!-- \/.col-lg-6 --&gt;\n  &lt;div class=\"col-lg-6\"&gt;\n    &lt;div class=\"input-group\"&gt;\n      &lt;input type=\"text\" class=\"form-control\"&gt;\n      &lt;div class=\"input-group-btn\"&gt;\n        &lt;button type=\"button\" class=\"btn btn-default dropdown-toggle\" data-toggle=\"dropdown\"&gt;Action &lt;span class=\"caret\"&gt;&lt;\/span&gt;&lt;\/button&gt;\n        &lt;ul class=\"dropdown-menu pull-right\"&gt;\n          &lt;li&gt;&lt;a href=\"#\"&gt;Action&lt;\/a&gt;&lt;\/li&gt;\n          &lt;li&gt;&lt;a href=\"#\"&gt;Another action&lt;\/a&gt;&lt;\/li&gt;\n          &lt;li&gt;&lt;a href=\"#\"&gt;Something else here&lt;\/a&gt;&lt;\/li&gt;\n          &lt;li class=\"divider\"&gt;&lt;\/li&gt;\n          &lt;li&gt;&lt;a href=\"#\"&gt;Separated link&lt;\/a&gt;&lt;\/li&gt;\n        &lt;\/ul&gt;\n      &lt;\/div&gt;&lt;!-- \/btn-group --&gt;\n    &lt;\/div&gt;&lt;!-- \/input-group --&gt;\n  &lt;\/div&gt;&lt;!-- \/.col-lg-6 --&gt;\n&lt;\/div&gt;&lt;!-- \/.row --&gt;<\/pre>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>","protected":false},"excerpt":{"rendered":"Buttons Left Middle Right &nbsp; How to use &lt;div class=&#8221;btn-group&#8221;&gt; &lt;button type=&#8221;button&#8221; class=&#8221;btn btn-default&#8221;&gt;Left&lt;\/button&gt; &lt;button type=&#8221;button&#8221; class=&#8221;btn btn-default&#8221;&gt;Middle&lt;\/button&gt; &lt;button type=&#8221;button&#8221; class=&#8221;btn btn-default&#8221;&gt;Right&lt;\/button&gt; &lt;\/div&gt; Standard button Default Primary Success Info Warning&#8230;<a href=\"https:\/\/ordasvit.com\/wp-time\/elements\/\"> Read More<\/a>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"open","ping_status":"open","template":"","meta":[],"_links":{"self":[{"href":"https:\/\/ordasvit.com\/wp-time\/wp-json\/wp\/v2\/pages\/76"}],"collection":[{"href":"https:\/\/ordasvit.com\/wp-time\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ordasvit.com\/wp-time\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ordasvit.com\/wp-time\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ordasvit.com\/wp-time\/wp-json\/wp\/v2\/comments?post=76"}],"version-history":[{"count":62,"href":"https:\/\/ordasvit.com\/wp-time\/wp-json\/wp\/v2\/pages\/76\/revisions"}],"predecessor-version":[{"id":533,"href":"https:\/\/ordasvit.com\/wp-time\/wp-json\/wp\/v2\/pages\/76\/revisions\/533"}],"wp:attachment":[{"href":"https:\/\/ordasvit.com\/wp-time\/wp-json\/wp\/v2\/media?parent=76"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}