[Answers] CSS and theme-2

Select a theme from the Form Tools bar and you will see the UI change dynamically.
Themes reside in \lianja\themes and unsurprisingly have a .theme file extension.
You can read the sample themes that are provided and see the format of these files which is quite straightforward laud out as key/value pairs.
Themes can be used to globally assign attributes throughout a complete application.
You can create a new theme and put it in the themes directory then open an app and assign the theme.

---

Also bear in mind that "themes" can be chosen from the "Form Tools Bar" at the bottom of the page builder. When you select a theme it is applied to all the UI elements based on the theme keys as described above.
This provides the ability to create App templates and apply all the attributes to a complete App at any time.

---

Q:
We are using a theme in our app - Theme2.
We want to change the colour of read-only fields [probably change the forecolor to grey RGB(192,192,192)] so the users know where data entry is required.
We can change the data colour attributes but they make no difference to the display either in dev or runtime, even when app is refreshed. The page is being put in to edit mode.
We can change the textbox label successfully.
A:
try setting this as the cssstyle on the section.

Code:

---

lianja_ui_textbox[readOnly="true"] { background-color: beige; }

---

This works. Just set it on your pages or in your theme:

Code:

---

app.css = lianja_ui_textbox[readOnly="true"]{background:lightgray;}

---

That will change all readonly text boxes to lightgray.

Q:
We applied "app.css = lianja_ui_textbox[readOnly="true"]{background:lightgray;}" to the css style property of a page and it changed all the captions but made no difference to the text box itself, either in Dev or Runtime.
We then tried to change the theme (though we don't know where to put it) by adding as follows :

Code:

---

################################################## ##############
# App attributes
#
app.pagesectionheadertype=flat
app.pagesectionheadericonset=white
app.pagesectionheaderbackcolor=#6B6B6B
app.pagesectionheaderforecolor=white
app.pagesectionheaderheight=34
app.pagesectionheaderfontsize=12
app.pagesectionheadercss=
app.css=theme:/Modern.css
app.css = lianja_ui_textbox[readOnly="true"]{background:lightgray;}

---

That made no difference at all. This certainly needs to be at the theme level so that Edit() doesn't change everything.
A:
Try this in the theme file:

Code:

---

formitem.cssstyle=lianja_ui_textbox[readOnly="true"]{background:lightgray;}

---

The theme files can reference:
app.attribute=
page.attribute=
section.attribute=
formitem.attribute=
Also bear in mind that "themes" can be chosen from the "Form Tools Bar" at the bottom of the page builder. When you select a theme it is applied to all the UI elements based on the theme keys as described above.
This provides the ability to create App templates and apply all the attributes to a complete App at any time.

---

What is a QR code?
http://www.whatisaqrcode.co.uk/
How can I generate a QR code in Lianja?
http://larsjung.de/jquery-qrcode/
Then write a small .rsp page and generate it into a WebView section.
Where can I get the code from?
https://github.com/lrsjng/jquery-qrcode

---

---

All topics in [Answers] alphabetically: http://www.lianja.com/community/show...ll=1#post12352
This same topic is extended to another thread: http://www.lianja.com/community/show...SS-and-theme-1