[REBOL] CSS dialect
From: al::bri::xtra::co::nz at: 8-Aug-2002 7:44
Here's my latest dialect for Cascading Style Sheets, CSS, for dynamically
styling web page. It's best used on the server, in a CGI script. I've got a
sort-of solution for percentile values, for example: "100 %." is translated
to "100%".
Rebol [
Name: 'CSS
Title: "CSS"
File: %CSS.r
Author: "Andrew Martin"
eMail: [Al--Bri--xtra--co--nz]
Date: 7/August/2002
Web: http://valley.150m.com
Version: 1.0.0
Purpose: {
CSS generates CSS markup from Rebol
words, paths, tags, blocks and other Rebol values.
}
Category: [util 5]
]
CSS: function [
"CSS generates CSS markup from Rebol words, paths, tags, blocks and
other values."
Dialect [block!] "CSS dialect block."
] [CSS Number Declaration Property Value Value2 Selector Selector2
Selector3] [
CSS: make string! 2000
Number: [integer! | decimal!]
Declaration: [
some [
set Property set-word! (
repend CSS [
tab mold get 'Property
;In the above line "get 'Property" can be replaced with
Property
with new Rebol versions.
]
)
some [
[set Value Number %.] (
repend CSS [
#" " Value #"%"
]
)
| set Value file! (
repend CSS [
" url(" replace/all copy Value #" " " " ")"
]
)
| set Value url! (
repend CSS [
" url(" Value ")"
]
)
| [set Value Number set Value2 word!] (
repend CSS [
#" " Value Value2
]
)
| set Value [word! | issue!] (
repend CSS [
#" " mold Value
]
)
] (
append CSS ";^/"
)
]
]
parse Dialect [
any [
[
set Selector word! set Selector2 word! set Selector3 word! (
repend CSS [
mold Selector #" " mold Selector2 #" " mold
Selector3 " {^/"
]
)
| set Selector word! (
repend CSS [
mold Selector " {^/"
]
)
| set Selector block! (
foreach Item Selector [
repend CSS [Item ", "]
]
remove/part back back tail CSS 2
append CSS " {^/"
)
| set Selector path! (
foreach Item :Selector [
repend CSS [Item #" "]
]
remove back tail CSS
append CSS " {^/"
)
]
into Declaration (
append CSS rejoin [
tab "}" newline
]
)
]
end
]
CSS
]
The test code, which includes samples, is below my .sig.
Watch out for linebreaks!
Andrew Martin
100% Rebol!
ICQ: 26227169 http://valley.150m.com/
-><-
Rebol [
Name: 'Test
Title: "Test"
File: %Test.r
Author: "Andrew Martin"
eMail: [Al--Bri--xtra--co--nz]
Date: 7/August/2002
Comments: "Tests %CSS.r."
]
if not value? 'Values [
do %/C/Rebol/Values/Values.r
]
foreach [Input Output] [
[h1 [color: blue]]
{h1 {
color: blue;
}
}
[h1 [color: pink]]
{h1 {
color: pink;
}
}
[h1 [color: blue font-size: 12 pt]]
{h1 {
color: blue;
font-size: 12pt;
}
}
[h1 [color: blue background: #FF00DD font-size: 12 pt]]
{h1 {
color: blue;
background: #FF00DD;
font-size: 12pt;
}
}
[h1 [color: blue font-size: 12 pt background: #FF00DD]]
{h1 {
color: blue;
font-size: 12pt;
background: #FF00DD;
}
}
[h1 [color: blue font-size: 12 pt background: #FF00DD width: 100 %.]]
{h1 {
color: blue;
font-size: 12pt;
background: #FF00DD;
width: 100%;
}
}
[
[h1 p table] [
padding: 0 px
margin: 0 px
]
]
{h1, p, table {
padding: 0px;
margin: 0px;
}
}
[
[h1 p table] [
padding: 0 px
margin: 0 px
]
h2 [color: green]
]
{h1, p, table {
padding: 0px;
margin: 0px;
}
h2 {
color: green;
}
}
[td.Grid [width: 1.5 em]]
{td.Grid {
width: 1.5em;
}
}
[div/p [font-size: 95.5 %.]]
{div p {
font-size: 95.5%;
}
}
[body [background: %Test.jpg]]
{body {
background: url(Test.jpg);
}
}
[body [background: http://www.rebol.com/Test.jpg]]
{body {
background: url(http://www.rebol.com/Test.jpg);
}
}
[p + h1 [page-break-after: always]]
{p + h1 {
page-break-after: always;
}
}
] [
if Output != Result: CSS Input [
print rejoin [
"Test failed! for Input: " mold Input newline
"Result: " mold Result newline
"Output should be: " mold Output newline
]
halt
]
]
print "All tests OK!"
halt