]> git.ipfire.org Git - thirdparty/foundation/foundation-sites.git/commitdiff
updates copy for in canvas
authorRafiBomb <rafi@zurb.com>
Fri, 14 Jul 2017 22:05:50 +0000 (15:05 -0700)
committerRafiBomb <rafi@zurb.com>
Fri, 14 Jul 2017 22:05:50 +0000 (15:05 -0700)
docs/layout/default.html
docs/pages/off-canvas.md
docs/pages/prototyping-utilities.md

index b51741eb5f77c05e264af0cf4e6502f05647b4b4..1f3f8aa52f71c2d758a8576ae3407fa02f7416e6 100644 (file)
@@ -37,7 +37,7 @@
         <!-- Info Banner For Announcements or Links -->
         <a href="http://zurb.com/university/advanced-foundation-training" class="docs-banner course-banner">
           <div class="info">
-            <h5 class=""><strong>Get advanced Foundation tips and master the new XY Grid in our July 18th webinar Class &rsaquo;</strong></h5>
+            <h5 class=""><strong>Get advanced Foundation tips and master the new XY Grid in our July 18th webinar class &rsaquo;</strong></h5>
           </div>
         </a>
 
index b45e93837705fc856793224f572388846f67b463..c0765ca41a722a3c349b128c9eb7f3e2be5dda40 100644 (file)
@@ -344,9 +344,9 @@ For an example of off-canvas on small screens and Top Bar Menu with Dropdowns, c
 
 ---
 
-## In-Canvas
+## In-Canvas to Off-Canvas
 
-If you want an element to be off-canvas only for specific sceen sizes and then move in-canvas you can use the new class <code>.in-canvas-for-[BREAKPOINT]</code> for this. Compared to the <a href="#reveal-on-larger-screens">Reveal on Larger Screens</a> feature it doesn't actually open the off-canvas for specific screen sizes but overrides the off-canvas styles so it behaves as an usual page element. This way you can place an element anywhere on the page and move it into off-canvas for e.g. small screens.
+With this feature you can have a standard page element move off-canvas at a particular breakpoint. Use the new class <code>.in-canvas-for-[BREAKPOINT]</code> for this. This differs from the <a href="#reveal-on-larger-screens">Reveal on Larger Screens</a> feature it doesn't actually open the off-canvas for specific screen sizes but overrides the off-canvas styles so it behaves as a regular page element. This way you can place an element anywhere on the page and move it into off-canvas for e.g. small screens.
 
 ```html_example
 <button type="button" class="button hide-for-large" data-toggle="inCanvasExample">
index 38990d759d05255c80dfd7299044d881c2c6ed7d..724236a25d826884f9148b07d06299182b38fa37 100644 (file)
@@ -7,9 +7,9 @@ sass:
 
 <h4><strong>Prototype to Production</strong></h4>
 
-Prototyping allows us to see problems more clearly—and often earlier—in the development process. Designs in sketches or wireframes only get us so far in understanding the behavior, feasibility, and cost (time or resources) of implimentation. Prototyping processes foster collaboration where designers and developers work closely together find better solutions.
+Prototyping allows us to see problems more clearly—and often earlier—in the development process. Designs in sketches or wireframes only get us so far in understanding the behavior, feasibility, and cost (time or resources) of implementation. Prototyping processes foster collaboration where designers and developers work closely together find better solutions.
 
-Sometimes prototype code is meant the be thrown away, and that's ok. While in early stage development it's extremely valuable to get ideas and interactions up and shared with stakeholders for scruitiny. This is how ideas get fleshed out and improved. It's not code we're delivering, it's a solution to a problem. Get the idea out, get feedback, iterate, repeat. Then when all parties are satisfied the right approach is being taken, go back to clean it up and refactor.
+Sometimes prototype code is meant the be thrown away, and that's ok. While in early stage development it's extremely valuable to get ideas and interactions up and shared with stakeholders for scrutiny. This is how ideas get fleshed out and improved. It's not code we're delivering, it's a solution to a problem. Get the idea out, get feedback, iterate, repeat. Then when all parties are satisfied the right approach is being taken, go back to clean it up and refactor.
 
 Foundation's Prototyping Utilities help you build coded prototypes from scratch ultra-fast. This allows you to get to right answer faster through feedback and experimentation. From positioning to visual styles, there are a range of utilities to choose from. Every Utility has a mixin, so you can use your own custom classes or swap classes for mixins in production for cleaner markup.
 
@@ -95,11 +95,11 @@ You can easily enable these classes by setting `$global-prototype-breakpoints` t
 ```
 
 You can also customise things by choosing to add responsive breakpoints only for specific prototype helpers that you would need as responsive classes. <br>
-For example, text transformation classes have a breakpoint variable `$prototype-transformation-breakpoints` which is set to `$global-prototype-breakpoints` which is set to `false` by default. For enabling responsive breakpoints for text transformation classes, simply set: 
+For example, text transformation classes have a breakpoint variable `$prototype-transformation-breakpoints` which is set to `$global-prototype-breakpoints` which is set to `false` by default. For enabling responsive breakpoints for text transformation classes, simply set:
 
 ```scss
 $prototype-transformation-breakpoints: true;
-``` 
+```
 
 ---