Commit 4e7dcc97 authored by bbaer's avatar bbaer
Browse files

added a bar around the fabric controls

parent d7ec8d2d
Pipeline #796 passed with stage
in 1 minute and 46 seconds
......@@ -20,6 +20,7 @@ $(function (n) {
this.parentElement = {};
this.rotation = 0;
this.controlElement = $('<div>', {
class: 'qfq-fabric-bar',
id: 'qfq-fabric-control'
});
this.emojiContainer = {};
......@@ -86,7 +87,7 @@ $(function (n) {
ModeSettings.prototype.setUpButtons = function() {
var $controlWrapper = this.qFabric.controlElement;
var $buttonGroup = $("<div>", {class: "btn-group"});
var $buttonGroup = $("<div>", {class: "btn-group pull-left"});
var that = this;
this.myModes.modes.forEach(function(o) {
var $button = $("<button>", {
......@@ -112,7 +113,7 @@ $(function (n) {
$controlWrapper.append($buttonGroup);
var $colorSelector = $("<div>", {class: "color-picker"});
var $colorSelector = $("<div>", {class: "color-picker pull-right"});
$controlWrapper.append($colorSelector);
if (this.myModes.colors instanceof Array) {
this.myModes.colors.forEach(function (o) {
......
......@@ -243,6 +243,23 @@ select.qfq-locked:invalid {
}
// Fabric Plugin classes
.qfq-fabric-bar {
position: -webkit-sticky;
position: sticky;
top: 0;
width: 100%;
min-height: 41px;
z-index: 100;
border: 1px solid #ccc;
background-color: #ededed;
padding: 5px;
}
.qfq-fabric-bar .btn {
padding: 3px 8px;
}
.fabric-text {
width: 100%;
height: 80px;
......@@ -262,7 +279,7 @@ select.qfq-locked:invalid {
}
.color-picker {
margin-top: 5px;
margin-top: 2px;
}
.color-picker > button {
......
......@@ -36,13 +36,13 @@
</div>
</div>
</div>
<!-- remove this
<img src="mockData/Scan2a.jpeg" class="qfq-fabric-image" id="qfq-fabric-image-1"> </img>
-->
<div class="row">
<div class="col-md-4">
<div class="fabric"
data-buttons="mockData/fabric.buttons.json"
data-emojis="mockData/qfq.emoji.json"
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment