diff --git a/example1/example.rkt b/example1/example.rkt index 142a1bb..5f646e7 100644 --- a/example1/example.rkt +++ b/example1/example.rkt @@ -93,7 +93,11 @@ (counter-thread #f) ) (send this set-menu! test-menu) - (send this connect-menu! 'm-quit (λ () (send this close))) + (send this connect-menu! 'm-quit + (λ () + (set! go-on-counter #f) + (send this close)) + ) (let ((make-menu-executor (λ (item elem string count) (send this connect-menu! item (λ () @@ -113,13 +117,24 @@ (when go-on-counter (set! c-counter (+ c-counter 1)) (send div-counter set-inner-html (format "Count = ~a" c-counter)) + (when (and (> c-counter 0) (<= c-counter 1)) + (send div-counter set-style! (css-style '((background white))))) + (when (and (> c-counter 100) (<= c-counter 101)) + (send div-counter set-style! (css-style '((background green) (color white))))) + (when (and (> c-counter 200) (<= c-counter 201)) + (send div-counter set-style! (string->css-style "background: yellow; font-size: 120%;"))) + (when (and (> c-counter 300) (<= c-counter 301)) + (send div-counter set-style! (string->css-style "color: white; background: orange; font-size: 130%;"))) + (when (and (> c-counter 400) (<= c-counter 401)) + (send div-counter set-style! (string->css-style "color: white; background: red; font-size: 150%; font-weight: bold;"))) (sleep 0.01) (f))))) (set! go-on-counter #t) (f))))))) (send this connect-menu! 'm-stop (λ () - (set! go-on-counter #f))) + (set! go-on-counter #f) + (set! c-counter 0))) ) ) diff --git a/example1/styles.css b/example1/styles.css new file mode 100644 index 0000000..ac40a3e --- /dev/null +++ b/example1/styles.css @@ -0,0 +1,54 @@ +body { + font-family: Arial; + font-size: 11pt; +} + +h1 { + color: #303030; +} + +h1:hover { + color: #606060; +} + +a { + text-decoration: none; +} + +button.btn-1 { + background: #1adb4e; + border: 1px solid black; + padding: 1em; +} + +button.btn-2 { + color: white; + background: #3e5c46; + border: 1px solid green; + padding: 1em; + margin-left: 1em; +} + +button.btn-2 a { + color: white; +} + +table { + margin: 1em; + border: 1px solid black; + border-collapse: collapse; +} + +table td { + border: 1px solid #909090; + padding: 0.5em; + width: 70%; +} + +table th { + border-collapse: collapse; + border: 1px solid #909090; + padding: 0.5em; + width: 30%; +} + diff --git a/private/css.rkt b/private/css.rkt index b30caf0..1c2d8ae 100644 --- a/private/css.rkt +++ b/private/css.rkt @@ -31,7 +31,7 @@ ( [style #:auto #:mutable] ) - #:auto-value (make-hash) + #:auto-value #f #:transparent) (define-struct css-stylesheet @@ -42,6 +42,7 @@ #:transparent) (define st-style style-style) + (define st-style! set-style-style!) (define make-st make-style) (define st? style?) (define stylesheet? css-stylesheet?) @@ -53,14 +54,15 @@ (if (symbol? style_or_styles) (let ((css (if (null? args) "" (car args))) (st (make-st))) + (st-style! st (make-hash)) (hash-set! (st-style st) style_or_styles css) st) (let* ((st (make-st)) - (h (st-style st))) + (h (begin (st-style! st (make-hash)) (st-style st)))) (for-each (lambda (st) (let ((entry (car st)) (css (cadr st))) - (hash-set! h entry css))) + (hash-set! h entry (format "~a" css)))) style_or_styles) st)))