notification-widgets: add result header and fix responsive

pull/3/head
alex 2015-12-15 17:43:04 +03:00
parent c2c6ff3920
commit aadf696db5
2 changed files with 17 additions and 9 deletions

View File

@ -8,8 +8,10 @@
} }
} }
.toastr-radio-setup{ @media (max-width: 991px) {
margin-left: 22px; .toastr-radio-setup {
margin-left: 22px;
}
} }
.radio-header{ .radio-header{
@ -19,7 +21,12 @@
} }
} }
.button-row{
line-height: 37px;
button{
width: 125px;
}
}
.result-toastr{ .result-toastr{
margin-top: 15px;
border-radius: 0; border-radius: 0;
} }

View File

@ -1,6 +1,6 @@
<blur-panel class-container="with-scroll"> <blur-panel class-container="with-scroll">
<div class="row"> <div class="row">
<div class="col-md-3"> <div class="col-md-3 col-sm-4">
<div class="control"> <div class="control">
<label for="title">Title</label> <label for="title">Title</label>
<input ng-model="options.title" type="text" class="form-control" id="title" placeholder="Enter a title ..."> <input ng-model="options.title" type="text" class="form-control" id="title" placeholder="Enter a title ...">
@ -55,7 +55,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="col-md-2 toastr-radio-setup"> <div class="col-md-2 col-sm-3 toastr-radio-setup">
<div id="toastTypeGroup"> <div id="toastTypeGroup">
<div class="controls"> <div class="controls">
<label class="radio-header">Toast Type</label> <label class="radio-header">Toast Type</label>
@ -111,7 +111,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="col-md-2"> <div class="col-md-2 col-sm-3">
<div class="control"> <div class="control">
<label for="timeOut">Time out</label> <label for="timeOut">Time out</label>
<input type="text" class="form-control" id="timeOut" ng-model="options.timeout" placeholder="ms"> <input type="text" class="form-control" id="timeOut" ng-model="options.timeout" placeholder="ms">
@ -134,15 +134,16 @@
</label> </label>
</div> </div>
</div> </div>
<div class="col-md-4"> <div class="col-md-5 col-sm-12">
<label>Result:</label>
<pre class="result-toastr" id='toastrOptions'>{{optionsStr}}</pre> <pre class="result-toastr" id='toastrOptions'>{{optionsStr}}</pre>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-12 button-row">
<button ng-click="openToast()" class="btn btn-primary">Open Toast</button> <button ng-click="openToast()" class="btn btn-primary">Open Toast</button>
<button ng-click="openRandomToast()" class="btn btn-primary">Open Random Toast</button> <button ng-click="openRandomToast()" class="btn btn-primary">Random Toast</button>
<button ng-click="clearToasts()" class="btn btn-danger">Clear Toasts</button> <button ng-click="clearToasts()" class="btn btn-danger">Clear Toasts</button>
<button ng-click="clearLastToast()" class="btn btn-danger">Clear Last Toast</button> <button ng-click="clearLastToast()" class="btn btn-danger">Clear Last Toast</button>
</div> </div>