You are here

Home » API reference » Open Social 8.2

button.css in Open Social 8.2

Same filename in this branch
  1. 8.2 themes/socialblue/assets/css/button.css
  2. 8.2 themes/socialbase/assets/css/button.css
Same filename and directory in other branches
  1. 8.9 themes/socialbase/assets/css/button.css
  2. 8 themes/socialbase/assets/css/button.css
  3. 8.3 themes/socialbase/assets/css/button.css
  4. 8.4 themes/socialbase/assets/css/button.css
  5. 8.5 themes/socialbase/assets/css/button.css
  6. 8.6 themes/socialbase/assets/css/button.css
  7. 8.7 themes/socialbase/assets/css/button.css
  8. 8.8 themes/socialbase/assets/css/button.css
[role="button"] {
  cursor: pointer;
}

.btn {
  display: inline-block;
  margin-bottom: 0;
  font-weight: normal;
  text-align: center;
  vertical-align: middle;
  -ms-touch-action: manipulation;
      touch-action: manipulation;
  cursor: pointer;
  background-image: none;
  border: 1px solid transparent;
  padding: 6px 12px;
  font-size: 0.875rem;
  line-height: 1.5;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  text-transform: uppercase;
  -webkit-transition: .3s ease-out;
  transition: .3s ease-out;
  outline: 0;
}

.btn + .btn {
  margin-left: 5px;
}

.btn + .btn-block {
  margin-left: 0;
}

.btn .caret {
  margin-left: 3px;
}

.btn:hover, .btn:focus, .btn.focus {
  text-decoration: none;
  outline: 0;
}

.btn:active, .btn.active {
  background-image: none;
}

.btn.disabled, .btn[disabled],
fieldset[disabled] .btn {
  cursor: not-allowed;
  opacity: .65;
  -webkit-box-shadow: none;
          box-shadow: none;
}

.btn a {
  font-weight: normal;
}

.btn.btn-full {
  display: block;
}

.btn-non-clickable.disabled,
fieldset[disabled] .btn-non-clickable,
a.btn.disabled,
fieldset[disabled]
a.btn {
  pointer-events: none;
}

.btn-link {
  font-weight: normal;
}

.btn-link, .btn-link:active, .btn-link.active, .btn-link[disabled], .btn-link:hover, .btn-link:focus,
fieldset[disabled] .btn-link {
  background-color: transparent;
  border-color: transparent;
  -webkit-box-shadow: none;
          box-shadow: none;
}

.btn-link[disabled]:hover, .btn-link[disabled]:focus,
fieldset[disabled] .btn-link:hover,
fieldset[disabled] .btn-link:focus {
  text-decoration: none;
}

.btn--with-bgicon {
  padding-left: 32px;
  background-size: 16px 16px;
  background-position: 10px 8px;
  background-repeat: no-repeat;
}

.btn--facebook {
  background-image: url("../images/icons/icon-facebook.svg");
}

.btn--linkedin {
  background-image: url("../images/icons/icon-linkedin.svg");
}

.btn--google {
  background-image: url("../images/icons/icon-google.svg");
}

.btn--twitter {
  background-image: url("../images/icons/icon-twitter.svg");
}

.fieldset-wrapper > .btn {
  margin: 5px 5px 5px 0;
}

.btn-lg, .btn-group-lg > .btn {
  padding: 10px 16px;
  font-size: 1rem;
  line-height: 1.33333;
}

.btn-sm, .btn-group-sm > .btn {
  padding: 5px 10px;
  font-size: 0.75rem;
  line-height: 1.5;
}

.btn-sm .glyphicon:before, .btn-group-sm > .btn .glyphicon:before {
  width: 13px;
  height: 13px;
}

.btn-xs, .btn-group-xs > .btn {
  padding: 1px 5px;
  font-size: 0.75rem;
  line-height: 1.5;
}

.btn-block {
  display: block;
  width: 100%;
}

.btn-block + .btn-block {
  margin-top: 5px;
}

input[type="submit"].btn-block,
input[type="reset"].btn-block,
input[type="button"].btn-block {
  width: 100%;
}

.btn.pull-right + .btn {
  margin-left: 0;
}

.btn-raised {
  -webkit-box-shadow: 0 0 2px rgba(0, 0, 0, 0.12), 0 2px 4px rgba(0, 0, 0, 0.24);
          box-shadow: 0 0 2px rgba(0, 0, 0, 0.12), 0 2px 4px rgba(0, 0, 0, 0.24);
  -webkit-transition: .15s ease-out, -webkit-box-shadow;
  transition: .15s ease-out, -webkit-box-shadow;
  transition: box-shadow, .15s ease-out;
  transition: box-shadow, .15s ease-out, -webkit-box-shadow;
}

.btn-raised:active, .btn-raised.active, .btn-raised:hover {
  -webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.16), 0 6px 12px rgba(0, 0, 0, 0.32);
          box-shadow: 0 0 6px rgba(0, 0, 0, 0.16), 0 6px 12px rgba(0, 0, 0, 0.32);
}

.btn-raised.disabled, .btn-raised[disabled] {
  -webkit-box-shadow: 0 -1px 0 #e0e0e0, 0 0 2px rgba(0, 0, 0, 0.12), 0 2px 4px rgba(0, 0, 0, 0.24);
          box-shadow: 0 -1px 0 #e0e0e0, 0 0 2px rgba(0, 0, 0, 0.12), 0 2px 4px rgba(0, 0, 0, 0.24);
}

.btn-icon-toggle {
  background-color: transparent;
  border-radius: 50% !important;
  padding: 4px;
}

.btn-icon-toggle:hover, .btn-icon-toggle:focus {
  background-color: rgba(0, 0, 0, 0.07);
  border-color: transparent;
}

.btn-icon-toggle:active, .btn-icon-toggle.active {
  background-color: rgba(12, 12, 12, 0.25);
  border-color: transparent;
}

.btn-icon {
  font-size: 1.00012rem;
  line-height: 21px;
  height: 21px;
  width: 21px;
  vertical-align: bottom;
}

.btn-iconized {
  line-height: 12px;
}

.btn-iconized .icon-inline {
  fill: inherit;
  width: 24px;
  height: 24px;
  line-height: 24px;
}

.btn-floating {
  width: 38px;
  height: 38px;
  padding: 7px;
  border-radius: 50%;
  border: 0;
  -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.14), 0 4px 8px rgba(0, 0, 0, 0.28);
          box-shadow: 0 0 4px rgba(0, 0, 0, 0.14), 0 4px 8px rgba(0, 0, 0, 0.28);
}

.btn-floating:active, .btn-floating.active, .btn-floating:hover {
  -webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.16), 0 6px 12px rgba(0, 0, 0, 0.32);
          box-shadow: 0 0 6px rgba(0, 0, 0, 0.16), 0 6px 12px rgba(0, 0, 0, 0.32);
}

.btn-floating.btn-lg, .btn-group-lg > .btn-floating.btn {
  width: 52px;
  height: 52px;
}

.btn-floating.disabled, .btn-floating[disabled] {
  -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.14), 0 4px 8px rgba(0, 0, 0, 0.28);
          box-shadow: 0 0 4px rgba(0, 0, 0, 0.14), 0 4px 8px rgba(0, 0, 0, 0.28);
}

.btn-group,
.btn-group-vertical {
  position: relative;
  display: inline-block;
  vertical-align: middle;
}

.btn-group > .btn,
.btn-group-vertical > .btn {
  position: relative;
  float: left;
}

.btn-group > .btn:hover, .btn-group > .btn:focus, .btn-group > .btn:active, .btn-group > .btn.active,
.btn-group-vertical > .btn:hover,
.btn-group-vertical > .btn:focus,
.btn-group-vertical > .btn:active,
.btn-group-vertical > .btn.active {
  z-index: 2;
}

.btn-group .btn + .btn,
.btn-group .btn + .btn-group,
.btn-group .btn-group + .btn,
.btn-group .btn-group + .btn-group {
  margin-left: -1px;
}

.btn-toolbar {
  margin-left: -5px;
}

.btn-toolbar:before, .btn-toolbar:after {
  content: " ";
  display: table;
}

.btn-toolbar:after {
  clear: both;
}

.btn-toolbar .btn,
.btn-toolbar .btn-group,
.btn-toolbar .input-group {
  float: left;
}

.btn-toolbar > .btn,
.btn-toolbar > .btn-group,
.btn-toolbar > .input-group {
  margin-left: 5px;
}

.btn-group > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle) {
  border-radius: 0;
}

.btn-group > .btn:first-child {
  margin-left: 0;
}

.btn-group > .btn:first-child:not(:last-of-type):not(.dropdown-toggle) {
  border-bottom-right-radius: 0;
  border-top-right-radius: 0;
}

.btn-group > .btn:last-child:not(:first-child),
.btn-group > .dropdown-toggle:not(:first-child) {
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
}

.btn-group > .btn-group {
  float: left;
}

.btn-group > .btn-group:not(:first-child):not(:last-child) > .btn {
  border-radius: 0;
}

.btn-group > .btn-group:first-child:not(:last-child) > .btn:last-child,
.btn-group > .btn-group:first-child:not(:last-child) > .dropdown-toggle {
  border-bottom-right-radius: 0;
  border-top-right-radius: 0;
}

.btn-group > .btn-group:last-child:not(:first-child) > .btn:first-child {
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
}

.btn-group .dropdown-toggle:active,
.btn-group.open .dropdown-toggle {
  outline: 0;
}

.btn-group > .btn + .dropdown-toggle {
  padding-left: 8px;
  padding-right: 8px;
}

.btn-group > .btn-lg + .dropdown-toggle, .btn-group-lg.btn-group > .btn + .dropdown-toggle {
  padding-left: 12px;
  padding-right: 12px;
}

.btn-group > .btn-sm + .dropdown-toggle, .btn-group-sm.btn-group > .btn + .dropdown-toggle {
  padding-left: 6px;
  padding-right: 6px;
}

.btn-group > .btn-xs + .dropdown-toggle, .btn-group-xs.btn-group > .btn + .dropdown-toggle {
  padding-left: 4px;
  padding-right: 4px;
}

.btn-group.open .dropdown-toggle.btn-link {
  -webkit-box-shadow: none;
          box-shadow: none;
}

.btn-lg .caret, .btn-group-lg > .btn .caret {
  border-width: 5px 5px 0;
}

.dropup .btn-lg .caret, .dropup .btn-group-lg > .btn .caret {
  border-width: 0 5px 5px;
}

.btn-group-vertical > .btn,
.btn-group-vertical > .btn-group,
.btn-group-vertical > .btn-group > .btn {
  display: block;
  float: none;
  width: 100%;
  max-width: 100%;
}

.btn-group-vertical > .btn-group:before, .btn-group-vertical > .btn-group:after {
  content: " ";
  display: table;
}

.btn-group-vertical > .btn-group:after {
  clear: both;
}

.btn-group-vertical > .btn-group > .btn {
  float: none;
}

.btn-group-vertical > .btn + .btn,
.btn-group-vertical > .btn + .btn-group,
.btn-group-vertical > .btn-group + .btn,
.btn-group-vertical > .btn-group + .btn-group {
  margin-top: -1px;
  margin-left: 0;
}

.btn-group--operations {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.block-group-add-event-block,
.block-group-add-topic-block,
.block-event-add-block,
.block-topic-add-block,
.block-group-add-block {
  display: inline-block;
}

@media (min-width: 900px) {
  .block-group-add-event-block,
  .block-group-add-topic-block,
  .block-event-add-block,
  .block-topic-add-block,
  .block-group-add-block {
    display: block;
  }
  .block-group-add-event-block .btn,
  .block-group-add-topic-block .btn,
  .block-event-add-block .btn,
  .block-topic-add-block .btn,
  .block-group-add-block .btn {
    width: 100%;
    margin-bottom: 0.75rem;
  }
}

@media (max-width: 899px) {
  .block-group-add-event-block,
  .block-group-add-topic-block,
  .block-event-add-block,
  .block-topic-add-block,
  .block-group-add-block {
    margin-top: 1rem;
  }
}

File

themes/socialbase/assets/css/button.css
View source 
  1. [role="button"] {

  2.   cursor: pointer;

  3. }

  4. 

  5. .btn {

  6.   display: inline-block;

  7.   margin-bottom: 0;

  8.   font-weight: normal;

  9.   text-align: center;

  10.   vertical-align: middle;

  11.   -ms-touch-action: manipulation;

  12.       touch-action: manipulation;

  13.   cursor: pointer;

  14.   background-image: none;

  15.   border: 1px solid transparent;

  16.   padding: 6px 12px;

  17.   font-size: 0.875rem;

  18.   line-height: 1.5;

  19.   -webkit-user-select: none;

  20.      -moz-user-select: none;

  21.       -ms-user-select: none;

  22.           user-select: none;

  23.   text-transform: uppercase;

  24.   -webkit-transition: .3s ease-out;

  25.   transition: .3s ease-out;

  26.   outline: 0;

  27. }

  28. 

  29. .btn + .btn {

  30.   margin-left: 5px;

  31. }

  32. 

  33. .btn + .btn-block {

  34.   margin-left: 0;

  35. }

  36. 

  37. .btn .caret {

  38.   margin-left: 3px;

  39. }

  40. 

  41. .btn:hover, .btn:focus, .btn.focus {

  42.   text-decoration: none;

  43.   outline: 0;

  44. }

  45. 

  46. .btn:active, .btn.active {

  47.   background-image: none;

  48. }

  49. 

  50. .btn.disabled, .btn[disabled],

  51. fieldset[disabled] .btn {

  52.   cursor: not-allowed;

  53.   opacity: .65;

  54.   -webkit-box-shadow: none;

  55.           box-shadow: none;

  56. }

  57. 

  58. .btn a {

  59.   font-weight: normal;

  60. }

  61. 

  62. .btn.btn-full {

  63.   display: block;

  64. }

  65. 

  66. .btn-non-clickable.disabled,

  67. fieldset[disabled] .btn-non-clickable,

  68. a.btn.disabled,

  69. fieldset[disabled]

  70. a.btn {

  71.   pointer-events: none;

  72. }

  73. 

  74. .btn-link {

  75.   font-weight: normal;

  76. }

  77. 

  78. .btn-link, .btn-link:active, .btn-link.active, .btn-link[disabled], .btn-link:hover, .btn-link:focus,

  79. fieldset[disabled] .btn-link {

  80.   background-color: transparent;

  81.   border-color: transparent;

  82.   -webkit-box-shadow: none;

  83.           box-shadow: none;

  84. }

  85. 

  86. .btn-link[disabled]:hover, .btn-link[disabled]:focus,

  87. fieldset[disabled] .btn-link:hover,

  88. fieldset[disabled] .btn-link:focus {

  89.   text-decoration: none;

  90. }

  91. 

  92. .btn--with-bgicon {

  93.   padding-left: 32px;

  94.   background-size: 16px 16px;

  95.   background-position: 10px 8px;

  96.   background-repeat: no-repeat;

  97. }

  98. 

  99. .btn--facebook {

  100.   background-image: url("../images/icons/icon-facebook.svg");

  101. }

  102. 

  103. .btn--linkedin {

  104.   background-image: url("../images/icons/icon-linkedin.svg");

  105. }

  106. 

  107. .btn--google {

  108.   background-image: url("../images/icons/icon-google.svg");

  109. }

  110. 

  111. .btn--twitter {

  112.   background-image: url("../images/icons/icon-twitter.svg");

  113. }

  114. 

  115. .fieldset-wrapper > .btn {

  116.   margin: 5px 5px 5px 0;

  117. }

  118. 

  119. .btn-lg, .btn-group-lg > .btn {

  120.   padding: 10px 16px;

  121.   font-size: 1rem;

  122.   line-height: 1.33333;

  123. }

  124. 

  125. .btn-sm, .btn-group-sm > .btn {

  126.   padding: 5px 10px;

  127.   font-size: 0.75rem;

  128.   line-height: 1.5;

  129. }

  130. 

  131. .btn-sm .glyphicon:before, .btn-group-sm > .btn .glyphicon:before {

  132.   width: 13px;

  133.   height: 13px;

  134. }

  135. 

  136. .btn-xs, .btn-group-xs > .btn {

  137.   padding: 1px 5px;

  138.   font-size: 0.75rem;

  139.   line-height: 1.5;

  140. }

  141. 

  142. .btn-block {

  143.   display: block;

  144.   width: 100%;

  145. }

  146. 

  147. .btn-block + .btn-block {

  148.   margin-top: 5px;

  149. }

  150. 

  151. input[type="submit"].btn-block,

  152. input[type="reset"].btn-block,

  153. input[type="button"].btn-block {

  154.   width: 100%;

  155. }

  156. 

  157. .btn.pull-right + .btn {

  158.   margin-left: 0;

  159. }

  160. 

  161. .btn-raised {

  162.   -webkit-box-shadow: 0 0 2px rgba(0, 0, 0, 0.12), 0 2px 4px rgba(0, 0, 0, 0.24);

  163.           box-shadow: 0 0 2px rgba(0, 0, 0, 0.12), 0 2px 4px rgba(0, 0, 0, 0.24);

  164.   -webkit-transition: .15s ease-out, -webkit-box-shadow;

  165.   transition: .15s ease-out, -webkit-box-shadow;

  166.   transition: box-shadow, .15s ease-out;

  167.   transition: box-shadow, .15s ease-out, -webkit-box-shadow;

  168. }

  169. 

  170. .btn-raised:active, .btn-raised.active, .btn-raised:hover {

  171.   -webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.16), 0 6px 12px rgba(0, 0, 0, 0.32);

  172.           box-shadow: 0 0 6px rgba(0, 0, 0, 0.16), 0 6px 12px rgba(0, 0, 0, 0.32);

  173. }

  174. 

  175. .btn-raised.disabled, .btn-raised[disabled] {

  176.   -webkit-box-shadow: 0 -1px 0 #e0e0e0, 0 0 2px rgba(0, 0, 0, 0.12), 0 2px 4px rgba(0, 0, 0, 0.24);

  177.           box-shadow: 0 -1px 0 #e0e0e0, 0 0 2px rgba(0, 0, 0, 0.12), 0 2px 4px rgba(0, 0, 0, 0.24);

  178. }

  179. 

  180. .btn-icon-toggle {

  181.   background-color: transparent;

  182.   border-radius: 50% !important;

  183.   padding: 4px;

  184. }

  185. 

  186. .btn-icon-toggle:hover, .btn-icon-toggle:focus {

  187.   background-color: rgba(0, 0, 0, 0.07);

  188.   border-color: transparent;

  189. }

  190. 

  191. .btn-icon-toggle:active, .btn-icon-toggle.active {

  192.   background-color: rgba(12, 12, 12, 0.25);

  193.   border-color: transparent;

  194. }

  195. 

  196. .btn-icon {

  197.   font-size: 1.00012rem;

  198.   line-height: 21px;

  199.   height: 21px;

  200.   width: 21px;

  201.   vertical-align: bottom;

  202. }

  203. 

  204. .btn-iconized {

  205.   line-height: 12px;

  206. }

  207. 

  208. .btn-iconized .icon-inline {

  209.   fill: inherit;

  210.   width: 24px;

  211.   height: 24px;

  212.   line-height: 24px;

  213. }

  214. 

  215. .btn-floating {

  216.   width: 38px;

  217.   height: 38px;

  218.   padding: 7px;

  219.   border-radius: 50%;

  220.   border: 0;

  221.   -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.14), 0 4px 8px rgba(0, 0, 0, 0.28);

  222.           box-shadow: 0 0 4px rgba(0, 0, 0, 0.14), 0 4px 8px rgba(0, 0, 0, 0.28);

  223. }

  224. 

  225. .btn-floating:active, .btn-floating.active, .btn-floating:hover {

  226.   -webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.16), 0 6px 12px rgba(0, 0, 0, 0.32);

  227.           box-shadow: 0 0 6px rgba(0, 0, 0, 0.16), 0 6px 12px rgba(0, 0, 0, 0.32);

  228. }

  229. 

  230. .btn-floating.btn-lg, .btn-group-lg > .btn-floating.btn {

  231.   width: 52px;

  232.   height: 52px;

  233. }

  234. 

  235. .btn-floating.disabled, .btn-floating[disabled] {

  236.   -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.14), 0 4px 8px rgba(0, 0, 0, 0.28);

  237.           box-shadow: 0 0 4px rgba(0, 0, 0, 0.14), 0 4px 8px rgba(0, 0, 0, 0.28);

  238. }

  239. 

  240. .btn-group,

  241. .btn-group-vertical {

  242.   position: relative;

  243.   display: inline-block;

  244.   vertical-align: middle;

  245. }

  246. 

  247. .btn-group > .btn,

  248. .btn-group-vertical > .btn {

  249.   position: relative;

  250.   float: left;

  251. }

  252. 

  253. .btn-group > .btn:hover, .btn-group > .btn:focus, .btn-group > .btn:active, .btn-group > .btn.active,

  254. .btn-group-vertical > .btn:hover,

  255. .btn-group-vertical > .btn:focus,

  256. .btn-group-vertical > .btn:active,

  257. .btn-group-vertical > .btn.active {

  258.   z-index: 2;

  259. }

  260. 

  261. .btn-group .btn + .btn,

  262. .btn-group .btn + .btn-group,

  263. .btn-group .btn-group + .btn,

  264. .btn-group .btn-group + .btn-group {

  265.   margin-left: -1px;

  266. }

  267. 

  268. .btn-toolbar {

  269.   margin-left: -5px;

  270. }

  271. 

  272. .btn-toolbar:before, .btn-toolbar:after {

  273.   content: " ";

  274.   display: table;

  275. }

  276. 

  277. .btn-toolbar:after {

  278.   clear: both;

  279. }

  280. 

  281. .btn-toolbar .btn,

  282. .btn-toolbar .btn-group,

  283. .btn-toolbar .input-group {

  284.   float: left;

  285. }

  286. 

  287. .btn-toolbar > .btn,

  288. .btn-toolbar > .btn-group,

  289. .btn-toolbar > .input-group {

  290.   margin-left: 5px;

  291. }

  292. 

  293. .btn-group > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle) {

  294.   border-radius: 0;

  295. }

  296. 

  297. .btn-group > .btn:first-child {

  298.   margin-left: 0;

  299. }

  300. 

  301. .btn-group > .btn:first-child:not(:last-of-type):not(.dropdown-toggle) {

  302.   border-bottom-right-radius: 0;

  303.   border-top-right-radius: 0;

  304. }

  305. 

  306. .btn-group > .btn:last-child:not(:first-child),

  307. .btn-group > .dropdown-toggle:not(:first-child) {

  308.   border-bottom-left-radius: 0;

  309.   border-top-left-radius: 0;

  310. }

  311. 

  312. .btn-group > .btn-group {

  313.   float: left;

  314. }

  315. 

  316. .btn-group > .btn-group:not(:first-child):not(:last-child) > .btn {

  317.   border-radius: 0;

  318. }

  319. 

  320. .btn-group > .btn-group:first-child:not(:last-child) > .btn:last-child,

  321. .btn-group > .btn-group:first-child:not(:last-child) > .dropdown-toggle {

  322.   border-bottom-right-radius: 0;

  323.   border-top-right-radius: 0;

  324. }

  325. 

  326. .btn-group > .btn-group:last-child:not(:first-child) > .btn:first-child {

  327.   border-bottom-left-radius: 0;

  328.   border-top-left-radius: 0;

  329. }

  330. 

  331. .btn-group .dropdown-toggle:active,

  332. .btn-group.open .dropdown-toggle {

  333.   outline: 0;

  334. }

  335. 

  336. .btn-group > .btn + .dropdown-toggle {

  337.   padding-left: 8px;

  338.   padding-right: 8px;

  339. }

  340. 

  341. .btn-group > .btn-lg + .dropdown-toggle, .btn-group-lg.btn-group > .btn + .dropdown-toggle {

  342.   padding-left: 12px;

  343.   padding-right: 12px;

  344. }

  345. 

  346. .btn-group > .btn-sm + .dropdown-toggle, .btn-group-sm.btn-group > .btn + .dropdown-toggle {

  347.   padding-left: 6px;

  348.   padding-right: 6px;

  349. }

  350. 

  351. .btn-group > .btn-xs + .dropdown-toggle, .btn-group-xs.btn-group > .btn + .dropdown-toggle {

  352.   padding-left: 4px;

  353.   padding-right: 4px;

  354. }

  355. 

  356. .btn-group.open .dropdown-toggle.btn-link {

  357.   -webkit-box-shadow: none;

  358.           box-shadow: none;

  359. }

  360. 

  361. .btn-lg .caret, .btn-group-lg > .btn .caret {

  362.   border-width: 5px 5px 0;

  363. }

  364. 

  365. .dropup .btn-lg .caret, .dropup .btn-group-lg > .btn .caret {

  366.   border-width: 0 5px 5px;

  367. }

  368. 

  369. .btn-group-vertical > .btn,

  370. .btn-group-vertical > .btn-group,

  371. .btn-group-vertical > .btn-group > .btn {

  372.   display: block;

  373.   float: none;

  374.   width: 100%;

  375.   max-width: 100%;

  376. }

  377. 

  378. .btn-group-vertical > .btn-group:before, .btn-group-vertical > .btn-group:after {

  379.   content: " ";

  380.   display: table;

  381. }

  382. 

  383. .btn-group-vertical > .btn-group:after {

  384.   clear: both;

  385. }

  386. 

  387. .btn-group-vertical > .btn-group > .btn {

  388.   float: none;

  389. }

  390. 

  391. .btn-group-vertical > .btn + .btn,

  392. .btn-group-vertical > .btn + .btn-group,

  393. .btn-group-vertical > .btn-group + .btn,

  394. .btn-group-vertical > .btn-group + .btn-group {

  395.   margin-top: -1px;

  396.   margin-left: 0;

  397. }

  398. 

  399. .btn-group--operations {

  400.   width: 100%;

  401.   display: -webkit-box;

  402.   display: -ms-flexbox;

  403.   display: flex;

  404.   -webkit-box-pack: center;

  405.       -ms-flex-pack: center;

  406.           justify-content: center;

  407. }

  408. 

  409. .block-group-add-event-block,

  410. .block-group-add-topic-block,

  411. .block-event-add-block,

  412. .block-topic-add-block,

  413. .block-group-add-block {

  414.   display: inline-block;

  415. }

  416. 

  417. @media (min-width: 900px) {

  418.   .block-group-add-event-block,

  419.   .block-group-add-topic-block,

  420.   .block-event-add-block,

  421.   .block-topic-add-block,

  422.   .block-group-add-block {

  423.     display: block;

  424.   }

  425.   .block-group-add-event-block .btn,

  426.   .block-group-add-topic-block .btn,

  427.   .block-event-add-block .btn,

  428.   .block-topic-add-block .btn,

  429.   .block-group-add-block .btn {

  430.     width: 100%;

  431.     margin-bottom: 0.75rem;

  432.   }

  433. }

  434. 

  435. @media (max-width: 899px) {

  436.   .block-group-add-event-block,

  437.   .block-group-add-topic-block,

  438.   .block-event-add-block,

  439.   .block-topic-add-block,

  440.   .block-group-add-block {

  441.     margin-top: 1rem;

  442.   }

  443. }