On Sun, Feb 16, 2014 at 01:51:18PM -0500, me wrote:
> Are there any pro tips for how could I go about adding/altering css styling
> via a css framework like bootstrap for example?  Including the necessary
> files is no problem

Right. Let me explain, just for the records: You can pass either a
single CSS file to the 'html' function

   (html 0 "Project" "my.css" NIL

or a list of files

   (html 0 "Project" '("@lib.css" "my1.css" "my2.css") NIL

In the latter case, definitions in later CSS files override the earlier
ones, so "my.css' can, for example, redefine things in "@lib.css".

Normally, you'll set a globel in your main pogram

   (setq *Css '("@lib.css" "my1.css" "my2.css"))

and use that as in the individual pages

   (html 0 "Project" *Css NIL

> but I'm finding it difficult to specify CSS classes and
> such for gui components.  Thank you in advance for your help.

Most low-level HTML functions accept an style attribute argument, e.g.:

   (de <div> (Attr . Prg)  # In @lib/xhtml.l

You call it like

   (<div> NIL
      (<p> NIL
         "Text" ) )

This 'Attr' argument may be

1. A single atom. Then it should be a CSS class name

   (<div> "myCls1"
      (<p> "myCls2"

2. A cons pair, specifying an HTML attribute

   (<div> '(id . "myId")


   (<div> '(style . "margin: 60px;")

3. an arbitrarily nested combination of the above

   (<div> '("myClass" (style . "margin: 60px;") ..)

Finally (back to your original question ;-):

If you have a 'gui' component like

   (gui '(+E/R +Cue +TextField) '(key : home obj) "Test" 20)

then you can pass styles in a  dynamical environment via

1. the <style> function

   (<style> "myClass"
      (gui '(+E/R +Cue +TextField) '(key : home obj) "Test" 20) )


   (<style> '("myClass" (style . "margin: 60px;") ..)
      (gui '(+E/R +Cue +TextField) '(key : home obj) "Test" 20)
      ... )

2. via the +Style prefix class

      (gui '(+Style +E/R +Cue +TextField)
         '(key : home obj)
         "Test" 20 ) )

Note that using '+Style' is the most powerful way, because the argument
is evaluated whenever needed while the form is executing, so the style
can change dynamically depending on the situation and the form contents:

   (gui '(+Style +E/R +Cue +TextField)
         ((someCondition1) "myClass")
         ((someOtherCondition "someOtherClass"))
         (T "somethingElse) )

With that, the style will be adjusted upon arbitrary XMLHttpRequests
from the "@lib/form.js" functionality.

♪♫ Alex
UNSUBSCRIBE: mailto:picolisp@software-lab.de?subject=Unsubscribe

Reply via email to