You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@isis.apache.org by bu...@apache.org on 2014/11/14 18:11:54 UTC

svn commit: r929216 - in /websites/staging/isis/trunk: cgi-bin/ content/ content/components/viewers/wicket/ content/components/viewers/wicket/images/theme-chooser/

Author: buildbot
Date: Fri Nov 14 17:11:53 2014
New Revision: 929216

Log:
Staging update by buildbot for isis

Added:
    websites/staging/isis/trunk/content/components/viewers/wicket/images/theme-chooser/
    websites/staging/isis/trunk/content/components/viewers/wicket/images/theme-chooser/example-1.png   (with props)
    websites/staging/isis/trunk/content/components/viewers/wicket/images/theme-chooser/example-2.png   (with props)
    websites/staging/isis/trunk/content/components/viewers/wicket/writing-a-custom-theme.html
Modified:
    websites/staging/isis/trunk/cgi-bin/   (props changed)
    websites/staging/isis/trunk/content/   (props changed)
    websites/staging/isis/trunk/content/components/viewers/wicket/showing-a-theme-chooser.html
    websites/staging/isis/trunk/content/documentation.html

Propchange: websites/staging/isis/trunk/cgi-bin/
------------------------------------------------------------------------------
--- cms:source-revision (original)
+++ cms:source-revision Fri Nov 14 17:11:53 2014
@@ -1 +1 @@
-1639666
+1639703

Propchange: websites/staging/isis/trunk/content/
------------------------------------------------------------------------------
--- cms:source-revision (original)
+++ cms:source-revision Fri Nov 14 17:11:53 2014
@@ -1 +1 @@
-1639666
+1639703

Added: websites/staging/isis/trunk/content/components/viewers/wicket/images/theme-chooser/example-1.png
==============================================================================
Binary file - no diff available.

Propchange: websites/staging/isis/trunk/content/components/viewers/wicket/images/theme-chooser/example-1.png
------------------------------------------------------------------------------
    svn:mime-type = image/png

Added: websites/staging/isis/trunk/content/components/viewers/wicket/images/theme-chooser/example-2.png
==============================================================================
Binary file - no diff available.

Propchange: websites/staging/isis/trunk/content/components/viewers/wicket/images/theme-chooser/example-2.png
------------------------------------------------------------------------------
    svn:mime-type = image/png

Modified: websites/staging/isis/trunk/content/components/viewers/wicket/showing-a-theme-chooser.html
==============================================================================
--- websites/staging/isis/trunk/content/components/viewers/wicket/showing-a-theme-chooser.html (original)
+++ websites/staging/isis/trunk/content/components/viewers/wicket/showing-a-theme-chooser.html Fri Nov 14 17:11:53 2014
@@ -429,7 +429,15 @@ provided by <a href="http://bootswatch.c
 <pre><code>isis.viewer.wicket.themes.showChooser=true
 </code></pre>
 
-<p>It is also possible to limit the number themes, to some subset of those in bootswatch.  This is done using a further
+<p>Example 1:</p>
+
+<p><a href="images/theme-chooser/example-1.png"><img src="images/theme-chooser/example-1.png"/></a></p>
+
+<p>Example 2:</p>
+
+<p><a href="images/theme-chooser/example-2.png"><img src="images/theme-chooser/example-2.png"/></a></p>
+
+<p>It is also possible to restrict the themes shown to some subset of those in bootswatch.  This is done using a further
 property:</p>
 
 <pre><code>isis.viewer.wicket.themes.enabled=bootstrap-theme,Cosmo,Flatly,Darkly,Sandstone,United
@@ -437,6 +445,9 @@ property:</p>
 
 <p>where the value is the list of themes (from <a href="http://bootswatch.com">bootswatch.com</a>) to be made available.</p>
 
+<p>You can also write and install a custom themes (eg to fit your company's look-n-feel/interface guidelines); see
+<a href="writing-a-custom-theme.html">here</a> for further details.</p>
+
 
 
       </div>

Added: websites/staging/isis/trunk/content/components/viewers/wicket/writing-a-custom-theme.html
==============================================================================
--- websites/staging/isis/trunk/content/components/viewers/wicket/writing-a-custom-theme.html (added)
+++ websites/staging/isis/trunk/content/components/viewers/wicket/writing-a-custom-theme.html Fri Nov 14 17:11:53 2014
@@ -0,0 +1,493 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+
+    <meta charset="utf-8">
+      <title>Writing a Custom Theme (1.8.0-SNAPSHOT)</title>
+    <meta name="description" content="">
+    <meta name="author" content="">
+
+    <!-- Le HTML5 shim, for IE6-8 support of HTML elements -->
+    <!--[if lt IE 9]>
+      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
+    <![endif]-->
+
+    
+    <!-- Le styles -->
+    <link href="./../../../bootstrap-3.0.0/css/bootstrap.css" rel="stylesheet">
+    <link href="./../../../prettify.css" rel="stylesheet">
+
+    <style type="text/css">
+        body {
+          padding-top: 60px;
+        }
+        .sprite {
+            display: inline-block;
+            height: 20px;
+            margin: 0 auto 4px;
+            outline: medium none;
+            text-indent: -999em;
+            width: 24px;
+            background-image: url('./../../../images/sprites.png');
+            background-repeat: no-repeat;
+            overflow: hidden;
+            cursor: pointer;
+        }
+        .edit-page {
+            display: inline-block;
+            height: 20px;
+            margin: 0 auto 4px;
+            outline: medium none;
+            text-indent: -999em;
+            width: 24px;
+            background-image: url('./../../../images/edit.png');
+            background-repeat: no-repeat;
+            overflow: hidden;
+            cursor: pointer;
+        }
+        .fb-share {
+            background-position: 0px -40px;
+        }
+        .gp-share {
+            background-position: 0px 0px;
+        }
+        .tw-share {
+            background-position: 0px -80px;
+        }
+        .markdown-content {
+            min-height: 500px;
+        }
+        .book-image img {
+          border: 1px;
+          border-style: solid;
+        }
+        .release-matrix .heading {
+            background-color: #eeeeee;
+        }
+        .release-matrix .new {
+            color: #dd0000;
+            font-weight: bolder;
+        }
+        .stub,.note {
+            position: relative;
+            padding: 7px 15px;
+            margin-bottom: 18px;
+            color: #404040;
+            background-color: #eedc94;
+            background-repeat: repeat-x;
+            background-image: -khtml-gradient(linear, left top, left bottom, from(#fceec1), to(#eedc94));
+            background-image: -moz-linear-gradient(top, #fceec1, #eedc94);
+            background-image: -ms-linear-gradient(top, #fceec1, #eedc94);
+            background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fceec1), color-stop(100%, #eedc94));
+            background-image: -webkit-linear-gradient(top, #fceec1, #eedc94);
+            background-image: -o-linear-gradient(top, #fceec1, #eedc94);
+            background-image: linear-gradient(top, #fceec1, #eedc94);
+            filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fceec1', endColorstr='#eedc94', GradientType=0);
+            text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
+            border-color: #eedc94 #eedc94 #e4c652;
+            border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
+            text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
+            border-width: 1px;
+            border-style: solid;
+            -webkit-border-radius: 4px;
+            -moz-border-radius: 4px;
+            border-radius: 4px;
+            -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
+            -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
+            box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
+        }
+        
+        div.XXXisis-tweak form {
+            margin-top: 6px;
+            margin-bottom: -2px;
+        }
+        
+        div.row div.col-md-12 {
+          border-top: 1px solid #eeeeee;
+       }
+        
+        
+        /* Isis specific stuff */
+
+        div.row div.col-md-12 {
+          margin-top: 20px;
+        }
+
+        .container {
+          width: 940px;
+        }
+
+        .markdown-content .documentation .span-one-third p {
+          margin-bottom: 0px;
+        }
+
+        .container .markdown-content .group,
+        .markdown-content .documentation .group {
+          margin-top: 9px;
+        }
+
+        .container .group h2,
+        .documentation .group h2 {
+          border-bottom: 1px solid #DDD
+        }
+
+        .container h2 a[name],
+        .documentation h2 a[name] {
+            padding-top: 50px;
+            margin-top: -50px;
+        }
+        
+        .container h2 a[name],
+        .container h3 a[name],
+        .container h4 a[name],
+        .documentation h2 a[name],
+        .documentation h3 a[name],
+        .documentation h4 a[name] {
+            color: black;
+            display: inline-block; 
+        }
+        .container h2 a[name]:hover,
+        .container h3 a[name]:hover,
+        .container h4 a[name]:hover,
+        .documentation h2 a[name]:hover,
+        .documentation h3 a[name]:hover,
+        .documentation h4 a[name]:hover {
+            text-decoration: none;
+        }
+
+        .documentation h2 a:not([name]),
+        .documentation h3 a:not([name]),
+        .documentation h4 a:not([name]) {
+          /* same as code style */
+          padding: 0 3px 2px;
+          font-family: Monaco, Andale Mono, Courier New, monospace;
+          font-size: 12px;
+          -webkit-border-radius: 3px;
+          -moz-border-radius: 3px;
+          border-radius: 3px;
+          padding: 1px 3px;
+        }
+        
+        .carousel-indicators li {
+          border: 1px solid rgb(192,70,1);
+        }
+
+        .carousel-indicators li.active {
+          background-color: rgb(192,70,1);
+        }
+        
+        .carousel-control .icon-prev,
+        .carousel-control .icon-next {
+          color: rgb(192,70,1);
+          font-size: 60px;
+        }
+        
+        .page-header {
+          margin-top: 0px;
+        }
+
+        .container blockquote p {
+            font-size: small;
+        }
+
+        .container blockquote p:not([author]) {
+            font-style: italic;
+        }
+
+        .container blockquote p {
+            font-size: small;
+            font-style: italic;
+            font-weight: bold;
+        }
+        
+        footer hr {
+            margin-top: 100px;
+        }
+
+        .markdown-content img {
+            margin-top: 10px;
+            margin-bottom: 20px;
+        }
+
+        .markdown-content a img {
+            margin-top: 0px;
+            margin-bottom: 0px;
+        }
+
+        
+        #forkongithub a{
+            display: none;
+            background:#090;
+            color:#fff;
+            text-decoration:none;
+            font-family:arial, sans-serif;
+            text-align:center;
+            font-weight:bold;
+            padding:5px 40px;
+            font-size:1rem;
+            line-height:2rem;
+            position:relative;
+            transition:0.5s;
+        }
+        #forkongithub a:hover{
+            background:#0D0;
+            color:#fff;
+        }
+        #forkongithub a::before,
+        #forkongithub a::after{
+            content:"";width:100%;
+            display:block;
+            position:fixed;
+            top:1px;
+            left:0;
+            height:1px;
+            background:#fff;
+            z-index: 9999;
+        }
+        #forkongithub a::after{
+            bottom:1px;
+            top:auto;
+        }
+        @media screen and (min-width:768px){
+            #forkongithub{
+                position:fixed;
+                display:block;
+                top:0;
+                right:0;
+                width:250px;
+                overflow:hidden;
+                height:250px;
+                z-index: 9999;
+            }
+            #forkongithub a{
+                display:inherit;
+                width:250px;
+                position:fixed;
+                font-size:small;
+                top:40px;
+                right:-60px;
+                transform:rotate(45deg);
+                -webkit-transform:rotate(45deg);
+                -ms-transform:rotate(45deg);
+                box-shadow:4px 4px 10px rgba(0,0,0,0.8);
+            }
+        }        
+    </style>
+
+    <!-- courtesy of http://codepo8.github.io/css-fork-on-github-ribbon/ -->
+    <span id="forkongithub">
+        <a href="https://github.com/apache/isis">Fork me on GitHub</a>
+    </span>
+
+    <script type="text/javascript">
+      function fbshare () {
+          window.open(
+                  "http://www.facebook.com/sharer/sharer.php?u="+document.URL,
+                  'Share on Facebook',
+                  'width=640,height=426');
+      };
+      function gpshare () {
+          window.open(
+                  "https://plus.google.com/share?url="+document.URL,
+                  'Share on Google+',
+                  'width=584,height=385');
+      };
+      function twshare () {
+          window.open(
+                  "https://twitter.com/intent/tweet?url="+document.URL+"&text=Writing a Custom Theme (1.8.0-SNAPSHOT)",
+                  'Share on Twitter',
+                  'width=800,height=526');
+      };
+    </script>
+
+    <!-- Le fav and touch icons -->
+    <link rel="shortcut icon" href="./../../../images/favicon.ico">
+
+    <script src="./../../../javascript/prettify.js" type="text/javascript"></script>
+    
+    <script src="//code.jquery.com/jquery.js"></script>
+    <script src="./../../../javascript/prettyprint.js"></script>
+    <script src="./../../../bootstrap-3.0.0/js/bootstrap.js"></script>
+
+
+    <script src="http://platform.twitter.com/widgets.js" type="text/javascript"></script>
+    <!--
+    <DISABLEDscript src="./../../../javascript/common.js"></DISABLEDscript>
+    -->
+
+    
+    
+    
+
+    <script>
+    $(function () { prettyPrint() })
+    $().dropdown()
+    </script>
+
+    
+  </head>
+
+  <body>
+
+    <nav class="navbar navbar-fixed-top navbar-inverse" role="navigation">
+      <div class="container">
+        <a class="navbar-brand" href="./../../../index.html">Apache Isis&trade;</a>
+        <ul class="nav navbar-nav">
+
+          <li class="dropdown">
+            <a href="#" class="dropdown-toggle" data-toggle="dropdown">Demos<b class="caret"></b></a>
+            <ul class="dropdown-menu">
+              <li><a href="./../../../intro/elevator-pitch/isis-in-pictures.html">Screenshots</a></li>
+              <li><a href="./../../../intro/tutorials/screencasts.html">Screencasts<img src="./../../../images/tv_show-25.png"></a></li>
+              <li><a href="./../../../intro/powered-by/powered-by.html">Powered by</a></li>
+              <li><a href="http://isisdemo.mmyco.co.uk/" target="_blank">Online Demo</a></li>
+            </ul>
+          </li>
+
+          <li><a href="./../../../documentation.html">Docs</a></li>
+          <li><a href="http://www.isisaddons.org" target="_blank">Add-ons</a></li>
+
+          <li class="dropdown">
+            <a href="#" class="dropdown-toggle" data-toggle="dropdown">Downloads<b class="caret"></b></a>
+            <ul class="dropdown-menu">
+              <li><a href="./../../../intro/getting-started/simpleapp-archetype.html">Isis (Maven archetype)</a></li>
+              <li><a href="./../../../download.html">Isis (downloads)</a></li>
+              <li><a href="http://www.isisaddons.org" target="_blank">Isis Add-ons</a></li>
+            </ul>
+          </li>
+
+          <li class="dropdown">
+            <a href="#" class="dropdown-toggle" data-toggle="dropdown">Help<b class="caret"></b></a>
+            <ul class="dropdown-menu">
+              <li><a href="./../../../support.html">Mailing Lists</a></li>
+              <li><a href="http://isis.markmail.org/search/?q=" target="_blank">ML Archives</a></li>
+              <li><a href="https://issues.apache.org/jira/browse/ISIS" target="_blank">JIRA</a></li>
+              <li><a href="http://stackoverflow.com/questions/tagged/isis" target="_blank">Stack Overflow</a></li>
+              <li><a href="http://github.com/apache/isis" target="_blank">Github mirror</a></li>
+            </ul>
+          </li>
+
+          <li class="dropdown navbar-right">
+            <a href="#" class="dropdown-toggle" data-toggle="dropdown">@ASF<b class="caret"></b></a>
+            <ul class="dropdown-menu">
+              <li>
+                <a href="http://www.apache.org/" target="_blank">Apache Homepage <i class="icon-share-alt"></i></a>
+              </li>
+              <li>
+                <a href="http://www.apache.org/licenses/" target="_blank">Licenses <i class="icon-share-alt"></i></a>
+              </li>
+              <li>
+                <a href="http://www.apache.org/security/" target="_blank">Security <i class="icon-share-alt"></i></a>
+              </li>
+              <li>
+                <a href="http://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship <i class="icon-share-alt"></i></a>
+              </li>
+              <li>
+                <a href="http://www.apache.org/foundation/thanks.html">Thanks <i class="icon-share-alt"></i></a>
+              </li>
+              <li>
+                <a href="./../../../more-thanks.html">More thanks <i class="icon-share-alt"></i></a>
+              </li>
+            </ul>
+          </li>
+      </ul>
+
+        <FORM class="navbar-form navbar-right" id="searchbox_012614087480249044419:dn-q5gtwxya" action="http://www.google.com/cse">
+        <div class="form-group">
+          <input type="hidden" name="cx" value="012614087480249044419:dn-q5gtwxya">
+          <INPUT type="hidden" name="cof" value="FORID:0">
+          <INPUT class="form-control" name="q" type="text" placeholder="Search">
+        </div>
+      </FORM>
+
+
+      </div>
+
+
+  </nav>
+
+    <div class="container">
+      <div class="markdown-content">
+      
+
+<div class="page-header">
+<p><a href="./../../../documentation.html">Docs</a>&nbsp;&raquo&nbsp;<a href="./../../../components/about.html">Components</a>&nbsp;&raquo&nbsp;<a href="./../../../components/viewers/about.html">Viewers</a>&nbsp;&raquo&nbsp;<a href="./../../../components/viewers/wicket/about.html">Wicket</a></p>
+<h1>Writing a Custom Theme (1.8.0-SNAPSHOT)
+
+</h1>
+</div>
+
+<p>The Isis Wicket viewer uses <a href="http://getbootstrap.com/">Bootstrap</a> styles and components (courtesy of the 
+<a href="https://github.com/l0rdn1kk0n/wicket-bootstrap">Wicket Bootstrap</a> integration).</p>
+
+<p>By default the viewer uses the default bootstrap theme.  As described <a href="showing-a-theme-chooser.html">here</a>, it is 
+possible to allow the user to select other themes provided by <a href="http://bootswatch.com">bootswatch.com</a>, and if required
+one of these can be <a href="specifying-a-default-theme.html">set as the default</a>.</p>
+
+<p>However, you may instead want to write your own custom theme, for example to fit your company's look-n-feel/interface
+guidelines.  This is done by implementing <a href="https://github.com/l0rdn1kk0n/wicket-bootstrap">Wicket Bootstrap</a>’s 
+<code>de.agilecoders.wicket.core.settings.ITheme</code> class.  This defines: </p>
+
+<ul>
+<li>the name of the theme</li>
+<li>the resources it needs (the CSS and optional JS and/or fonts), and</li>
+<li>optional urls to load them from a Content Delivery Network (CDN).</li>
+</ul>
+
+<p>To make use of the custom <code>ITheme</code> the application should register it by adding the following snippet in 
+(your application's subclass of) <code>IsisWicketApplication</code>:</p>
+
+<pre><code>public void init() {
+
+    ...
+    IBootstrapSettings settings = new BootstrapSettings();
+    ThemeProvider themeProvider = new SingleThemeProvider(new MyTheme());
+    settings.setThemeProvider(themeProvider);
+
+    Bootstrap.install(getClass(), settings);
+}
+</code></pre>
+
+
+
+      </div>
+
+        <div id="edit" class="modal hide fade in" style="xxxdisplay: none; ">
+            <div class="modal-header">
+                <a class="close" data-dismiss="modal">x</a>
+
+                <h3>Thank you for contributing to the documention!</h3>
+            </div>
+            <div class="modal-body">
+                <h4>Any help with the documentation is greatly appreciated.</h4>
+                <p>All edits are reviewed before going live, so feel free to do much more than fix typos or links.  If you see a page that could benefit from an entire rewrite, we'd be thrilled to review it.  Don't be surprised if we like it so much we ask you for help with other pages :)</p>
+                <small>NOTICE: unless indicated otherwise on the pages in question, all editable content available from apache.org is presumed to be licensed under the Apache License (AL) version 2.0 and hence all submissions to apache.org treated as formal Contributions under the license terms.</small>
+                <!--[if gt IE 6]>
+                <h4>Internet Explorer Users</h4>
+                <p>If you are not an Apache committer, click the Yes link and enter a <i>anonymous</i> for the username and leave the password empty</p>
+                <![endif]-->
+
+            </div>
+            <div class="modal-footer">
+                Do you have an Apache ID?
+                <a href="javascript:void(location.href='https://cms.apache.org/redirect?uri='+escape(location.href))" class="btn">Yes</a>
+                <a href="javascript:void(location.href='https://anonymous:@cms.apache.org/redirect?uri='+escape(location.href))" class="btn">No</a>
+            </div>
+        </div>
+        <!--
+        <script src="./../../../javascript/bootstrap-modal.js"></script>
+        -->
+
+      <footer>
+        <hr/>
+        <p>
+        Copyright &copy; 2010~2014 The Apache Software Foundation, Licensed under the Apache License, Version 2.0.
+        <br/>
+        Apache Isis, Isis, Apache, the Apache feather logo, and the Apache Isis project logo are trademarks of The Apache Software Foundation.
+        </p>
+      </footer>
+
+    </div> <!-- /container -->
+
+  </body>
+</html>

Modified: websites/staging/isis/trunk/content/documentation.html
==============================================================================
--- websites/staging/isis/trunk/content/documentation.html (original)
+++ websites/staging/isis/trunk/content/documentation.html Fri Nov 14 17:11:53 2014
@@ -885,7 +885,7 @@
 <li><a href="components/viewers/wicket/bookmarks.html">Number of bookmarked pages</a></li>
 <li><a href="components/viewers/wicket/stripped-wicket-tags.html">Stripped Wicket tags</a></li>
 <li><a href="components/viewers/wicket/disabling-modal-dialogs.html">Disabling modal dialogs</a></li>
-<li><a href="components/viewers/wicket/showing-a-theme-chooser.html">Showing a Theme Chooser</a> (1.8.0-SNAPSHOT)
+<li><a href="components/viewers/wicket/showing-a-theme-chooser.html">Showing a theme chooser</a> (1.8.0-SNAPSHOT)
 </div>
 <div class="col-md-4"></li>
 </ul>
@@ -911,6 +911,7 @@
 <h4><a name="wicket-viewer-extensions">Extending the viewer</a></h4>
 
 <ul>
+<li><a href="components/viewers/wicket/writing-a-custom-theme.html">Writing a custom theme</a> (1.8.0-SNAPSHOT)</li>
 <li><a href="components/viewers/wicket/customizing-the-viewer.html">Replacing page elements</a></li>
 <li><a href="components/viewers/wicket/custom-pages.html">Custom pages</a></li>
 </ul>