myfaces-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From hno...@apache.org
Subject svn commit: r1797330 - in /myfaces/tobago/trunk/tobago-example/tobago-example-demo/src/main/webapp/content: 10-intro/50-migration/96-migration/migration40.xhtml 20-component/050-container/60-bar/bar.xhtml
Date Fri, 02 Jun 2017 08:48:53 GMT
Author: hnoeth
Date: Fri Jun  2 08:48:53 2017
New Revision: 1797330

URL: http://svn.apache.org/viewvc?rev=1797330&view=rev
Log:
improve demo: update 4.0-migration and description of tc:bar

Modified:
    myfaces/tobago/trunk/tobago-example/tobago-example-demo/src/main/webapp/content/10-intro/50-migration/96-migration/migration40.xhtml
    myfaces/tobago/trunk/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/050-container/60-bar/bar.xhtml

Modified: myfaces/tobago/trunk/tobago-example/tobago-example-demo/src/main/webapp/content/10-intro/50-migration/96-migration/migration40.xhtml
URL: http://svn.apache.org/viewvc/myfaces/tobago/trunk/tobago-example/tobago-example-demo/src/main/webapp/content/10-intro/50-migration/96-migration/migration40.xhtml?rev=1797330&r1=1797329&r2=1797330&view=diff
==============================================================================
--- myfaces/tobago/trunk/tobago-example/tobago-example-demo/src/main/webapp/content/10-intro/50-migration/96-migration/migration40.xhtml
(original)
+++ myfaces/tobago/trunk/tobago-example/tobago-example-demo/src/main/webapp/content/10-intro/50-migration/96-migration/migration40.xhtml
Fri Jun  2 08:48:53 2017
@@ -39,14 +39,27 @@
     <tc:section label="Tag Library">
       <tc:section label="&lt;tc:bar&gt;">
         <p>
-          The content of <code>&lt;tc:bar&gt;</code> needs to be checked.
+          The content of <code class="language-markup">&lt;tc:bar&gt;</code>
needs to be checked.
           The layout inside of the bar has been changed by CSS.
         </p>
-
-        <p>
-          Example: TODO (look the change in the Tobago demo header bar)
-          <!-- todo -->
-        </p>
+        <p>There is a new after-facet for right sided content. Old code which uses
+          <code class="language-markup">&lt;tc:flowLayout align=right></code>
probably doesn't work correctly.</p>
+        <p>Replace the following code...</p>
+        <pre><code class="language-markup">&lt;tc:bar>
+  &lt;tc:flowLayout textAlign="right">
+    // right sided content
+  &lt;/tc:flowLayout>
+&lt;/tc:bar></code></pre>
+        <p>... with this:</p>
+        <pre><code class="language-markup">&lt;tc:bar>
+  &lt;f:facet name="after">
+    &lt;tc:flexLayout columns="*;auto">
+      // right sided content
+    &lt;/tc:flexLayout>
+  &lt;/f:facet>
+&lt;/tc:bar></code></pre>
+        <p>For more information have a look at
+          <tc:link label="tc:bar" link="/faces/content/20-component/050-container/60-bar/bar.xhtml"/></p>
       </tc:section>
     </tc:section>
 

Modified: myfaces/tobago/trunk/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/050-container/60-bar/bar.xhtml
URL: http://svn.apache.org/viewvc/myfaces/tobago/trunk/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/050-container/60-bar/bar.xhtml?rev=1797330&r1=1797329&r2=1797330&view=diff
==============================================================================
--- myfaces/tobago/trunk/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/050-container/60-bar/bar.xhtml
(original)
+++ myfaces/tobago/trunk/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/050-container/60-bar/bar.xhtml
Fri Jun  2 08:48:53 2017
@@ -33,53 +33,83 @@
            link="#{demoBundle.tagDocUrl}/#{info.stableVersion}/tld/tc/bar.html"/>
 
   <tc:section label="Example">
-    <p>This example show a Bar with a 'brand' facet and several components.
-      Buttons and links don't have any functionality.</p>
+    <p>This example show a Bar with a 'brand' facet, a menu and right sided content
inside an 'after' facet.</p>
+    <pre><code class="language-markup">&lt;tc:bar>
+  &lt;f:facet name="brand">
+    &lt;tc:link label="BRAND" link="/"/>
+  &lt;/f:facet>
+  &lt;tc:links>
+    &lt;tc:link label="Link One"/>
+    &lt;tc:link label="Link Two"/>
+  &lt;/tc:links>
+  &lt;f:facet name="after">
+    &lt;tc:flexLayout columns="*; auto">
+      &lt;tc:in placeholder="Search" labelLayout="skip"/>
+      &lt;tc:button label="Go"/>
+    &lt;/tc:flexLayout>
+  &lt;/f:facet>
+&lt;/tc:bar></code></pre>
     <tc:bar>
       <f:facet name="brand">
-        <!-- label="Tobago Demo" contains a NO-BREAK SPACE character -->
-        <tc:link id="brand" label="Tobago Demo" image="#{request.contextPath}/image/feather-leaf.png"
link="/"/>
+        <tc:link label="BRAND" link="/"/>
       </f:facet>
       <tc:links>
-        <tc:link label="Home"/>
-        <tc:link label="Configuration" omit="true">
-          <tc:link label="Theme" omit="true">
-            <tc:link label="Standard Theme"/>
-            <tc:link label="Scarborough"/>
-            <tc:link label="Richmond"/>
-            <tc:link label="Charlotteville"/>
-            <tc:link label="Speyside"/>
-          </tc:link>
-          <tc:link image="fa-language" label="Language" omit="true">
-            <tc:link label="English"/>
-            <tc:link label="German"/>
-            <tc:link label="Japanese"/>
-            <tc:link label="Russian"/>
-            <tc:link label="Spanish"/>
-          </tc:link>
-          <tc:link label="Reset"/>
-        </tc:link>
-        <tc:link image="fa-info" label="Help"/>
+        <tc:link label="Link One"/>
+        <tc:link label="Link Two"/>
       </tc:links>
-      <tc:flowLayout>
-        <tc:style textAlign="right"/>
-        <tc:in placeholder="Search"/>
-        <tc:button label="Go"/>
-      </tc:flowLayout>
+      <f:facet name="after">
+        <tc:flexLayout columns="*; auto">
+          <tc:in placeholder="Search" labelLayout="skip"/>
+          <tc:button label="Go"/>
+        </tc:flexLayout>
+      </f:facet>
     </tc:bar>
+  </tc:section>
 
+  <tc:section label="Centered Menu Example">
+    <p>This example shows how to center content.</p>
+    <pre><code class="language-markup">&lt;tc:bar>
+  &lt;f:facet name="brand">
+    &lt;tc:link label="BRAND" link="/"/>
+  &lt;/f:facet>
+  &lt;div class="ml-auto">
+    // centered content
+  &lt;/div>
+  &lt;f:facet name="after">
+    // right sided content
+  &lt;/f:facet>
+&lt;/tc:bar></code></pre>
+    <tc:bar>
+      <f:facet name="brand">
+        <tc:link label="BRAND" link="/"/>
+      </f:facet>
+      <div class="ml-auto">
+        <tc:links>
+          <tc:link label="Link One"/>
+          <tc:link label="Link Two"/>
+        </tc:links>
+      </div>
+      <f:facet name="after">
+        <tc:flexLayout columns="*; auto">
+          <tc:button label="Button"/>
+        </tc:flexLayout>
+      </f:facet>
+    </tc:bar>
   </tc:section>
 
-  <tc:section label="TODO: radio: (also for tc:links)">
+  <tc:section label="Bar with dropdown">
+    <p>An example of a dropdown menu with radio entries.</p>
     <tc:bar>
+      <f:facet name="brand">
+        <tc:link label="BRAND" link="/"/>
+      </f:facet>
       <tc:link omit="true" label="Radio">
         <tc:selectOneRadio value="#{demoController.radioValue}">
           <tc:selectItems value="#{demoController.currencyItems}"
                           var="currency" itemValue="#{currency.currencyCode}" itemLabel="#{currency.displayName}"
-                          itemImage="#{request.contextPath}/data/#{currency.currencyCode}-14.png"
/>
+                          itemImage="#{request.contextPath}/data/#{currency.currencyCode}-14.png"/>
         </tc:selectOneRadio>
       </tc:link>
     </tc:bar>
   </tc:section>
-
 </ui:composition>



Mime
View raw message