Page 1 of 2

How can I create a text align header with more than two buttons?

Posted: Sat Jun 21, 2014 10:07 pm
by adam griffin

Image

Im trying to create a header like this. Instead of the paypal icon I would like to have some text. Can someone help?


How can I create a text align header with more than two buttons?

Posted: Sun Jun 22, 2014 7:31 am
by Alena Prykhodko

Hello,

Should be possible. What if you add Label component?


How can I create a text align header with more than two buttons?

Posted: Sun Jun 22, 2014 10:14 am
by adam griffin

How can I make the label and the buttons appear to be on the same bar?


How can I create a text align header with more than two buttons?

Posted: Sun Jun 22, 2014 6:10 pm
by adam griffin

I just tried a label component it wont work.


How can I create a text align header with more than two buttons?

Posted: Sun Jun 22, 2014 6:49 pm
by adam griffin

Image

I am trying to get rid of the bubble around the header and move the header text to the left and add two buttons to the right. I am guessing I will need html and/or css, but I can not figure how to do it. Will someone please help me???


How can I create a text align header with more than two buttons?

Posted: Sun Jun 22, 2014 7:03 pm
by obullei

Hello!

We need to clarify this question with the developers. We'll reply as soon as have more information.
This will take some time.


How can I create a text align header with more than two buttons?

Posted: Sun Jun 22, 2014 8:56 pm
by adam griffin

Please let me know when you find something out


How can I create a text align header with more than two buttons?

Posted: Mon Jun 23, 2014 3:19 pm
by Evgene Karachevtsev

Hello,

Add this css to move title left:

code.ui-title{
text-align:left !important;
margin-left:10px !important;
} /code

In header add grid 1*2 and in greed add 2 buttons, as in the screenshot. Specify the size and assign a class grid-right:
http://www.screencast.com/t/nYYXr8LOmN

Add this custom CSS class:

code.grid-right{
position:absolute;
right:.4em ;
top:0;
} /code

Should be like this:
http://www.screencast.com/t/72WG0CXROc


How can I create a text align header with more than two buttons?

Posted: Mon Jun 23, 2014 4:15 pm
by adam griffin

It looks good. I will try it when I make it to my laptop. Another question, how can I remove the padding of the buttons so all you will see is the flat icons like in the screen shot?


How can I create a text align header with more than two buttons?

Posted: Mon Jun 23, 2014 5:17 pm
by adam griffin

In addition to my question, how can I remove the padding around the header and clear the empty white space I highlighted in the image? Image