Wt

Hi Emeric,

the source code for Wt has the layout of these widgets in this location

https://github.com/kdeforche/wt/tree/master/src/xml

if you copy this entry from the bootstrap_theme

<message id="Wt.Auth.template.login">

and put it into one of your resource files, you will be able to edit it to alter the styling of the bootstrap 3 theme.

I've attached a template that at least changes the username and password to be styled the same way as an example.

if you fix up all the styling, please post it back here I'm sure others could benefit from it.

Alex.

hi, may I ask where to put the xml you provided ?

You put it in an xml file and load it as a WMessageResourceBundle

thanks wim, I figured it out, but it's kind of hard doing this, this way.

don't you think that Wt in a whole needs a visual UI designer ?

I have the same problem. But if i use the xml file alex provided, nothing changes here. How can i call a WMessageResourceBundle and where do i have to call it?

Please note the initial problem has been corrected : http://redmine.webtoolkit.eu/issues/3582

I'm running in to this issue right now. I'd like the form to be centered on the page.

When I look at the generated html/css in Safari (via Inspector), it looks like the "span8 offset2" is over-riding anything I do. That's bootstrap v2.

I set the theme to bootstrap v3 in the initialization. And I can set the master WContainerWidget using various v3 styles.

However, I tried the following for AuthWidget, and it still wants to stay over to the left of the screen per the span8 offset2 instruction.

authWidget->setStyleClass(".col-xs-6 .col-xs-offset-3");
authWidget->setStyleClass(".form-control width:75%");

I see in \wt\build\src\BootstrapTheme_xml.C the following around line 58: (Version 4.5.0)
"\r\n"
" \r\n"
" \r\n"
" ${tr:Wt.Auth.login-form-title}\r\n"
" ${tr:Wt.Auth.login-form-info}\r\n"
"\r\n"

I fixed it by over-riding it in my companion css file with the following:

.Wt-auth-login {
position: relative;
min-height: 1px;
padding-right: 15px;
padding-left: 15px;
float: left;
margin-left: 25%;
width: 75%;
}