fixing block buttons to use width 100%.

11 years ago · 58dbcc116e
7 changed files with 23 additions and 15 deletions
--- a/dist/ratchet.css
+++ b/dist/ratchet.css
@ -367,6 +367,7 @@ p {
  color: #333;
  text-align: center;
  vertical-align: top;
+  white-space: nowrap;
  cursor: pointer;
  background-color: white;
  border: 1px solid #ccc;
@ -443,6 +444,7 @@ p {

 .btn-block {
  display: block;
+  width: 100%;
  padding: 15px 0;
  margin-bottom: 10px;
  font-size: 18px;
--- a/dist/ratchet.min.css
+++ b/dist/ratchet.min.css
--- a/docs/assets/css/docs.css
+++ b/docs/assets/css/docs.css
@ -838,7 +838,8 @@ code {
 }

 #blockButtonsInDevice .btn-block {
-  margin: 10px;
+  width: 300px;
+  margin: 10px auto;
 }

 #segmentedControlsInDevice .segmented-control {
--- a/docs/dist/ratchet.css
+++ b/docs/dist/ratchet.css
@ -367,6 +367,7 @@ p {
  color: #333;
  text-align: center;
  vertical-align: top;
+  white-space: nowrap;
  cursor: pointer;
  background-color: white;
  border: 1px solid #ccc;
@ -443,6 +444,7 @@ p {

 .btn-block {
  display: block;
+  width: 100%;
  padding: 15px 0;
  margin-bottom: 10px;
  font-size: 18px;
--- a/docs/dist/ratchet.min.css
+++ b/docs/dist/ratchet.min.css
--- a/sass/buttons.scss
+++ b/sass/buttons.scss
@ -13,6 +13,7 @@
  color: #333;
  text-align: center;
  vertical-align: top;
+  white-space: nowrap;
  cursor: pointer;
  background-color: $chrome-color;
  border: 1px solid #ccc;
@ -117,6 +118,7 @@
 // Block level buttons (full width buttons)
 .btn-block {
  display: block;
+  width: 100%;
  padding: 15px 0;
  margin-bottom: 10px;
  font-size: 18px;
--- a/sass/docs.scss
+++ b/sass/docs.scss
@ -859,7 +859,8 @@ code {
  }
 }
 #blockButtonsInDevice .btn-block {
-  margin: 10px;
+  width: 300px;
+  margin: 10px auto;
 }

 //Segmented Control