[KSS-checkins] r44632 - kukit/euro-python-2007
jvloothuis at codespeak.net
jvloothuis at codespeak.net
Fri Jun 29 22:54:07 CEST 2007
Author: jvloothuis
Date: Fri Jun 29 22:54:07 2007
New Revision: 44632
Modified:
kukit/euro-python-2007/static-demo.html
Log:
Added a new stylesheet
Modified: kukit/euro-python-2007/static-demo.html
==============================================================================
--- kukit/euro-python-2007/static-demo.html (original)
+++ kukit/euro-python-2007/static-demo.html Fri Jun 29 22:54:07 2007
@@ -26,43 +26,40 @@
<script type="text/javascript" src="./kukit/kukit/kssparser.js"></script>
<link rel="kinetic-stylesheet" type="text/kss" href="./demo.kss" />
+ <link rel="cascading-stylesheet" type="text/css" href="./presentation.css" />
<style type="text/css">
- .hidden { display: none; } body { background-color: darkblue;
- padding: 0; margin: 0} .content { width: 700px; background-color: white; margin: auto; padding: 2em}
- #photo img { border: 1px solid black; }
- .button { color: grey; }
- .button:hover { color: black; }
- .nf { color:#06287E; }
- .nd { color:#555555; font-weight:bold; }
- pre { font-size: 140%; }
+ @import url(kss-presentation.css);
</style>
</head>
<body>
- <div class="content">
- <h1>KSS Demo</h1>
- <p>This demo will demonstrate a tiny bit of KSS.</p>
- <div id="show-photo" class="button">Press me to show a picture!</div>
- <div id="photo" class="hidden">
- <img src="./photo.jpg" alt="scenery"/>
- </div>
- <div id="show-kss" class="button">Look at the KSS</div>
- <div id="kss-source" class="hidden">
- <pre><span class="nf">#show-photo</span><span class="nd">:click</span><span class="p">{</span>
- <span class="n">action</span><span class="o">-</span><span class="n">client</span><span class="o">:</span> <span class="n">toggleClass</span><span class="p">;</span>
- <span class="n">toggleClass</span><span class="o">-</span><span class="n">kssSelector</span><span class="o">:</span> <span class="n">htmlid</span><span class="p">(</span><span class="n">photo</span><span class="p">);</span>
- <span class="n">toggleClass</span><span class="o">-</span><span class="n">classname</span><span class="o">:</span> <span class="k">hidden</span><span class="p">;</span>
+
+ <div class="wrapper">
+ <div class="content">
+ <h1>KSS Demo</h1>
+ <p>This demo will demonstrate a tiny bit of KSS.</p>
+ <div id="show-photo" class="button">Press me to show a picture!</div>
+ <div id="photo" class="hidden">
+ <img src="./photo.jpg" alt="scenery"/>
+ </div>
+ <div id="show-kss" class="button">Look at the KSS</div>
+ <div id="kss-source" class="hidden">
+ <pre><span class="nf">#show-photo</span><span class="nd">:click</span><span class="p">{</span>
+ <span class="n">action</span><span class="o">-</span><span class="n">client</span><span class="o">:</span> <span class="n">toggleClass</span><span class="p">;</span>
+ <span class="n">toggleClass</span><span class="o">-</span><span class="n">kssSelector</span><span class="o">:</span> <span class="n">htmlid</span><span class="p">(</span><span class="n">photo</span><span class="p">);</span>
+ <span class="n">toggleClass</span><span class="o">-</span><span class="n">classname</span><span class="o">:</span> <span class="k">hidden</span><span class="p">;</span>
<span class="p">}</span>
<span class="nf">#show-kss</span><span class="nd">:click</span><span class="p">{</span>
- <span class="n">action</span><span class="o">-</span><span class="n">client</span><span class="o">:</span> <span class="n">toggleClass</span><span class="p">;</span>
- <span class="n">toggleClass</span><span class="o">-</span><span class="n">kssSelector</span><span class="o">:</span> <span class="n">htmlid</span><span class="p">(</span><span class="n">kss</span><span class="o">-</span><span class="n">source</span><span class="p">);</span>
- <span class="n">toggleClass</span><span class="o">-</span><span class="n">classname</span><span class="o">:</span> <span class="k">hidden</span><span class="p">;</span>
+ <span class="n">action</span><span class="o">-</span><span class="n">client</span><span class="o">:</span> <span class="n">toggleClass</span><span class="p">;</span>
+ <span class="n">toggleClass</span><span class="o">-</span><span class="n">kssSelector</span><span class="o">:</span> <span class="n">htmlid</span><span class="p">(</span><span class="n">kss</span><span class="o">-</span><span class="n">source</span><span class="p">);</span>
+ <span class="n">toggleClass</span><span class="o">-</span><span class="n">classname</span><span class="o">:</span> <span class="k">hidden</span><span class="p">;</span>
<span class="p">}</span>
</pre>
- </div>
- <a href="example-plugin.html">Plugin example</a>
+ </div>
+ <a href="example-plugin.html">Plugin example</a>
+ </div>
</div>
</body>
</html>
More information about the Kukit-checkins
mailing list