Merged 1.9.x into dev.

src/Orchard.Web/Modules/Orchard.Layouts/Drivers/HeadingElementDriver.cs

@@ -0,0 +1,45 @@
+using System.Collections.Generic;
+using System.Linq;
+using Orchard.Layouts.Elements;
+using Orchard.Layouts.Framework.Display;
+using Orchard.Layouts.Framework.Drivers;
+using Orchard.Layouts.ViewModels;
+using Orchard.Services;
+
+namespace Orchard.Layouts.Drivers {
+    public class HeadingElementDriver : ElementDriver<Heading> {
+        private readonly IEnumerable<IHtmlFilter> _htmlFilters;
+        public HeadingElementDriver(IEnumerable<IHtmlFilter> htmlFilters) {
+            _htmlFilters = htmlFilters;
+        }
+
+        protected override EditorResult OnBuildEditor(Heading element, ElementEditorContext context) {
+            var viewModel = new HeadingEditorViewModel {
+                Text = element.Content,
+                Level = element.Level
+            };
+            var editor = context.ShapeFactory.EditorTemplate(TemplateName: "Elements.Heading", Model: viewModel);
+
+            if (context.Updater != null) {
+                context.Updater.TryUpdateModel(viewModel, context.Prefix, null, null);
+                element.Content = viewModel.Text;
+                element.Level = viewModel.Level;
+            }
+            
+            return Editor(context, editor);
+        }
+
+        protected override void OnDisplaying(Heading element, ElementDisplayContext context) {
+            var text = element.Content;
+            var flavor = "html";
+            var processedText = ApplyHtmlFilters(text, flavor);
+
+            context.ElementShape.ProcessedText = processedText;
+            context.ElementShape.Level = element.Level;
+        }
+
+        private string ApplyHtmlFilters(string content, string flavor) {
+            return _htmlFilters.Aggregate(content, (t, filter) => filter.ProcessContent(t, flavor));
+        }
+    }
+}

src/Orchard.Web/Modules/Orchard.Layouts/Drivers/ParagraphElementDriver.cs

@@ -8,11 +8,6 @@ using Orchard.Services;
 
 namespace Orchard.Layouts.Drivers {
     public class ParagraphElementDriver : ElementDriver<Paragraph> {
-        private readonly IEnumerable<IHtmlFilter> _htmlFilters;
-        public ParagraphElementDriver(IEnumerable<IHtmlFilter> htmlFilters) {
-            _htmlFilters = htmlFilters;
-        }
-
         protected override EditorResult OnBuildEditor(Paragraph element, ElementEditorContext context) {
             var viewModel = new ParagraphEditorViewModel {
                 Text = element.Content
@@ -26,17 +21,5 @@ namespace Orchard.Layouts.Drivers {
             
             return Editor(context, editor);
         }
-
-        protected override void OnDisplaying(Paragraph element, ElementDisplayingContext context) {
-            var text = element.Content;
-            var flavor = "html";
-            var processedText = ApplyHtmlFilters(text, flavor);
-
-            context.ElementShape.ProcessedText = processedText;
-        }
-
-        private string ApplyHtmlFilters(string content, string flavor) {
-            return _htmlFilters.Aggregate(content, (t, filter) => filter.ProcessContent(t, flavor));
-        }
     }
 }

src/Orchard.Web/Modules/Orchard.Layouts/Elements/Heading.cs

@@ -0,0 +1,24 @@
+using Orchard.Layouts.Helpers;
+using Orchard.Localization;
+
+namespace Orchard.Layouts.Elements {
+    public class Heading : ContentElement {
+        
+        public override string Category {
+            get { return "Content"; }
+        }
+
+        public override LocalizedString DisplayText {
+            get { return T("Heading h1-h6"); }
+        }
+
+        public override string ToolboxIcon {
+            get { return "\uf1dc"; }
+        }
+
+        public int Level {
+            get { return this.Retrieve(h => h.Level); }
+            set { this.Store(h => h.Level, value);}
+        }
+    }
+}

src/Orchard.Web/Modules/Orchard.Layouts/Orchard.Layouts.csproj

@@ -320,13 +320,15 @@
     <Compile Include="Drivers\CanvasElementDriver.cs" />
     <Compile Include="Drivers\MenuElementDriver.cs" />
     <Compile Include="Drivers\NotificationsElementDriver.cs" />
-    <Compile Include="Drivers\ShapeElementDriver.cs" />
+    <Compile Include="Drivers\HeadingElementDriver.cs" />
+   <Compile Include="Drivers\ShapeElementDriver.cs" />
     <Compile Include="Drivers\BreakElementDriver.cs" />
     <Compile Include="Elements\Breadcrumbs.cs" />
     <Compile Include="Elements\Canvas.cs" />
     <Compile Include="Elements\ContentElement.cs" />
     <Compile Include="Elements\Menu.cs" />
     <Compile Include="Elements\Notifications.cs" />
+    <Compile Include="Elements\Heading.cs" />
     <Compile Include="Elements\Shape.cs" />
     <Compile Include="Elements\Break.cs" />
     <Compile Include="Elements\UIElement.cs" />
@@ -427,6 +429,7 @@
     <Compile Include="ViewModels\LayoutEditor.cs" />
     <Compile Include="ViewModels\LayoutEditorPropertiesViewModel.cs" />
     <Compile Include="ViewModels\MenuEditorViewModel.cs" />
+    <Compile Include="ViewModels\HeadingEditorViewModel.cs" />
     <Compile Include="ViewModels\VectorImageEditorViewModel.cs" />
     <Compile Include="ViewModels\ImageEditorViewModel.cs" />
     <Compile Include="ViewModels\MarkdownEditorViewModel.cs" />
@@ -568,6 +571,12 @@
     <Content Include="Views\Elements\Notifications.cshtml" />
     <Content Include="Views\Elements\Notifications.Design.cshtml" />
   </ItemGroup>
+  <ItemGroup>
+    <Content Include="Views\Elements\Heading.cshtml" />
+  </ItemGroup>
+  <ItemGroup>
+    <Content Include="Views\EditorTemplates\Elements.Heading.cshtml" />
+  </ItemGroup>
   <PropertyGroup>
     <VisualStudioVersion Condition="'$(VisualStudioVersion)' == ''">10.0</VisualStudioVersion>
     <VSToolsPath Condition="'$(VSToolsPath)' == ''">$(MSBuildExtensionsPath32)\Microsoft\VisualStudio\v$(VisualStudioVersion)</VSToolsPath>

src/Orchard.Web/Modules/Orchard.Layouts/Scripts/LayoutEditor/Directives/Editor.js

@@ -114,34 +114,46 @@
                         };
 
                         $(document).on("cut copy paste", function (e) {
-                            // The real clipboard is supported, so disable the peudo clipboard.
+                            // If the pseudo clipboard was already invoked (which happens on the first clipboard
-                            clipboard.disable();
+                            // operation after page load even if native clipboard support exists) then sit this
-                            var focusedElement = $scope.element.focusedElement;
+                            // one operation out, but make sure whatever is on the pseudo clipboard gets migrated
-                            if (!!focusedElement) {
+                            // to the native clipboard for subsequent operations.
-                                $scope.$apply(function () {
+                            if (clipboard.wasInvoked()) {
-                                    switch (e.type) {
+                                e.originalEvent.clipboardData.setData("text/plain", clipboard.getData("text/plain"));
-                                        case "copy":
+                                e.originalEvent.clipboardData.setData("text/json", clipboard.getData("text/json"));
-                                            focusedElement.copy(e.originalEvent.clipboardData);
-                                            break;
-                                        case "cut":
-                                            focusedElement.cut(e.originalEvent.clipboardData);
-                                            break;
-                                        case "paste":
-                                            focusedElement.paste(e.originalEvent.clipboardData);
-                                            break;
-                                    }
-                                });
-
-                                // HACK: Workaround because of how Angular treats the DOM when elements are shifted around - input focus is sometimes lost.
-                                window.setTimeout(function () {
-                                    $scope.$apply(function () {
-                                        if (!!$scope.element.focusedElement)
-                                            $scope.element.focusedElement.setIsFocused();
-                                    });
-                                }, 100);
-
                                 e.preventDefault();
                             }
+                            else {
+                                var focusedElement = $scope.element.focusedElement;
+                                if (!!focusedElement) {
+                                    $scope.$apply(function () {
+                                        switch (e.type) {
+                                            case "copy":
+                                                focusedElement.copy(e.originalEvent.clipboardData);
+                                                break;
+                                            case "cut":
+                                                focusedElement.cut(e.originalEvent.clipboardData);
+                                                break;
+                                            case "paste":
+                                                focusedElement.paste(e.originalEvent.clipboardData);
+                                                break;
+                                        }
+                                    });
+
+                                    // HACK: Workaround because of how Angular treats the DOM when elements are shifted around - input focus is sometimes lost.
+                                    window.setTimeout(function () {
+                                        $scope.$apply(function () {
+                                            if (!!$scope.element.focusedElement)
+                                                $scope.element.focusedElement.setIsFocused();
+                                        });
+                                    }, 100);
+
+                                    e.preventDefault();
+                                }
+                            }
+
+                            // Native clipboard support obviously exists, so disable the peudo clipboard from now on.
+                            clipboard.disable();
                         });
                     }
                 ],

src/Orchard.Web/Modules/Orchard.Layouts/Scripts/LayoutEditor/Services/Clipboard.js

@@ -3,17 +3,29 @@
 
     var Clipboard = function () {
         var self = this;
-        this.clipboardData = {};
+        this._clipboardData = {};
-        this.setData = function(contentType, data, realClipBoard) {
+        this._isDisabled = false;
-            self.clipboardData[contentType] = data;
+        this._wasInvoked = false;
-        };
-        this.getData = function (contentType, realClipBoard) {
-            return self.clipboardData[contentType];
-        };
 
-        this.disable = function() {
+        this.setData = function(contentType, data) {
-            this.disabled = true;
+            self._clipboardData[contentType] = data;
+            self._wasInvoked = true;
         };
+        this.getData = function (contentType) {
+            return self._clipboardData[contentType];
+            self._wasInvoked = true;
+        };
+        this.disable = function() {
+            self._isDisabled = true;
+            self._wasInvoked = false;
+            self._clipboardData = {};
+        };
+        this.isDisabled = function () {
+            return self._isDisabled;
+        }
+        this.wasInvoked = function () {
+            return self._wasInvoked;
+        }
     }
 
     LayoutEditor.Clipboard = new Clipboard();
@@ -25,7 +37,9 @@
                 return {
                     setData: LayoutEditor.Clipboard.setData,
                     getData: LayoutEditor.Clipboard.getData,
-                    disable: LayoutEditor.Clipboard.disable
+                    disable: LayoutEditor.Clipboard.disable,
+                    isDisabled: LayoutEditor.Clipboard.isDisabled,
+                    wasInvoked: LayoutEditor.Clipboard.wasInvoked
                 };
             }
         ]);

src/Orchard.Web/Modules/Orchard.Layouts/Scripts/LayoutEditor/Services/ScopeConfigurator.js

@@ -15,12 +15,11 @@
                         var resetFocus = false;
                         var element = $scope.element;
                     
-
                         if (element.editor.isDragging || element.editor.inlineEditingIsActive)
                             return;
 
-                        // If the "real" clipboard works, then the pseudo-clipboard will have been disabled.
+                        // If native clipboard support exists, the pseudo-clipboard will have been disabled.
-                        if (!clipboard.disabled) {
+                        if (!clipboard.isDisabled()) {
                             var focusedElement = element.editor.focusedElement;
                             if (!!focusedElement) {
                                 // Pseudo clipboard handling for browsers not allowing real clipboard operations.

src/Orchard.Web/Modules/Orchard.Layouts/Scripts/Models/Element.js

@@ -167,7 +167,6 @@
         this.copy = function (clipboardData) {
             var text = this.getInnerText();
             clipboardData.setData("text/plain", text);
-            console.log(text);
 
             var data = this.toObject();
             var json = JSON.stringify(data, null, "\t");

src/Orchard.Web/Modules/Orchard.Layouts/Styles/LayoutEditor/Content.less

@@ -1,7 +1,8 @@
 @import "Variables.less";
+@import "Reset.less";
 
 .layout-editor {
-    .layout-content {
+    .layout-content, .layout-html {
         min-height: 1em;
 
         > .layout-element-wrapper {
@@ -12,7 +13,7 @@
                 line-height: normal;
 
                 // Reset to HTML5 W3C standard default styling within content.
-                @import "Reset.less";
+                .reset();
 
                 > *:first-child {
                     margin-top: 0 !important; // Important because site.css of the admin theme styles heading margins with a very high specificity.

src/Orchard.Web/Modules/Orchard.Layouts/Styles/LayoutEditor/Reset.less

@@ -1,340 +1,339 @@
-* {
+.reset() {
-    margin: 0;
-    padding: 0;
-    box-sizing: content-box;
-}
 
-address, blockquote, center, div, figure, figcaption, footer, form,
+    * {
-header, hr, legend, listing, p, plaintext, pre, xmp {
+        margin: 0;
-    display: block;
+        padding: 0;
-}
+        box-sizing: content-box;
-
-blockquote, figure, listing, p, plaintext, pre, xmp {
-    margin-top: 1em;
-    margin-bottom: 1em;
-}
-
-blockquote, figure {
-    margin-left: 40px;
-    margin-right: 40px;
-}
-
-address {
-    font-style: italic;
-}
-
-listing, plaintext, pre, xmp {
-    font-family: monospace;
-    white-space: pre;
-}
-
-cite, dfn, em, i, var {
-    font-style: italic;
-}
-
-b, strong {
-    font-weight: bolder;
-}
-
-code, kbd, samp, tt {
-    font-family: monospace;
-}
-
-big {
-    font-size: larger;
-}
-
-small {
-    font-size: smaller;
-}
-
-sub {
-    vertical-align: sub;
-}
-
-sup {
-    vertical-align: super;
-}
-
-sub, sup {
-    line-height: normal;
-    font-size: smaller;
-}
-
-
-ruby {
-    display: ruby;
-}
-
-rb {
-    display: ruby-base;
-    white-space: nowrap;
-}
-
-rt {
-    display: ruby-text;
-    white-space: nowrap;
-    font-size: 50%;
-    font-variant-east-asian: ruby;
-    text-emphasis: none;
-}
-
-rbc {
-    display: ruby-base-container;
-}
-
-rtc {
-    display: ruby-text-container;
-}
-
-ruby, rb, rt, rbc, rtc {
-    unicode-bidi: isolate;
-}
-
-
-:link {
-    color: #0000EE;
-}
-
-:visited {
-    color: #551A8B;
-}
-
-:link, :visited {
-    text-decoration: underline;
-}
-
-a:link[rel~=help], a:visited[rel~=help],
-area:link[rel~=help], area:visited[rel~=help] {
-    cursor: help;
-}
-
-:focus {
-    outline: auto;
-}
-
-mark {
-    background: yellow;
-    color: black;
-}
-/* this color is just a suggestion and can be changed based on implementation feedback */
-abbr[title], acronym[title] {
-    text-decoration: dotted underline;
-}
-
-ins, u {
-    text-decoration: underline;
-}
-
-del, s, strike {
-    text-decoration: line-through;
-}
-
-blink {
-    text-decoration: blink;
-}
-
-q::before {
-    content: open-quote;
-}
-
-q::after {
-    content: close-quote;
-}
-
-br {
-    content: '\A';
-    white-space: pre;
-}
-/* this also has bidi implications */
-nobr {
-    white-space: nowrap;
-}
-
-wbr {
-    content: '\200B';
-}
-/* this also has bidi implications */
-nobr wbr {
-    white-space: normal;
-}
-
-article, aside, h1, h2, h3, h4, h5, h6, hgroup, nav, section {
-    display: block;
-}
-
-h1 {
-    margin-top: 0.67em;
-    margin-bottom: 0.67em;
-    font-size: 2.00em;
-    font-weight: bold;
-}
-
-h2 {
-    margin-top: 0.83em;
-    margin-bottom: 0.83em;
-    font-size: 1.50em;
-    font-weight: bold;
-}
-
-h3 {
-    margin-top: 1.00em;
-    margin-bottom: 1.00em;
-    font-size: 1.17em;
-    font-weight: bold;
-}
-
-h4 {
-    margin-top: 1.33em;
-    margin-bottom: 1.33em;
-    font-size: 1.00em;
-    font-weight: bold;
-}
-
-h5 {
-    margin-top: 1.67em;
-    margin-bottom: 1.67em;
-    font-size: 0.83em;
-    font-weight: bold;
-}
-
-h6 {
-    margin-top: 2.33em;
-    margin-bottom: 2.33em;
-    font-size: 0.67em;
-    font-weight: bold;
-}
-
-dir, dd, dl, dt, ol, ul {
-    display: block;
-}
-
-li {
-    display: list-item;
-}
-
-dir, dl, ol, ul {
-    margin-top: 1em;
-    margin-bottom: 1em;
-}
-
-    dir dir, dir dl, dir ol, dir ul,
-    dl dir, dl dl, dl ol, dl ul,
-    ol dir, ol dl, ol ol, ol ul,
-    ul dir, ul dl, ul ol, ul ul {
-        margin-top: 0;
-        margin-bottom: 0;
     }
 
-dd {
+    address, blockquote, center, div, figure, figcaption, footer, form,
-    margin-left: 40px;
+    header, hr, legend, listing, p, plaintext, pre, xmp {
-}
+        display: block;
-
-/* LTR-specific: use 'margin-right' for rtl elements */
-dir, ol, ul {
-    padding-left: 40px;
-}
-
-/* LTR-specific: use 'padding-right' for rtl elements */
-ol {
-    list-style-type: decimal;
-}
-
-dir, ul {
-    list-style-type: disc;
-}
-
-    dir dir, dir ul,
-    ol dir, ol ul,
-    ul dir, ul ul {
-        list-style-type: circle;
     }
 
-        dir dir dir, dir dir ul,
+    blockquote, figure, listing, p, plaintext, pre, xmp {
-        dir ol dir, dir ol ul,
+        margin-top: 1em;
-        dir ul dir, dir ul ul,
+        margin-bottom: 1em;
-        ol dir dir, ol dir ul,
+    }
-        ol ol dir, ol ol ul,
+
-        ol ul dir, ol ul ul,
+    blockquote, figure {
-        ul dir dir, ul dir ul,
+        margin-left: 40px;
-        ul ol dir, ul ol ul,
+        margin-right: 40px;
-        ul ul dir, ul ul ul {
+    }
-            list-style-type: square;
+
+    address {
+        font-style: italic;
+    }
+
+    listing, plaintext, pre, xmp {
+        font-family: monospace;
+        white-space: pre;
+    }
+
+    cite, dfn, em, i, var {
+        font-style: italic;
+    }
+
+    b, strong {
+        font-weight: bolder;
+    }
+
+    code, kbd, samp, tt {
+        font-family: monospace;
+    }
+
+    big {
+        font-size: larger;
+    }
+
+    small {
+        font-size: smaller;
+    }
+
+    sub {
+        vertical-align: sub;
+    }
+
+    sup {
+        vertical-align: super;
+    }
+
+    sub, sup {
+        line-height: normal;
+        font-size: smaller;
+    }
+
+
+    ruby {
+        display: ruby;
+    }
+
+    rb {
+        display: ruby-base;
+        white-space: nowrap;
+    }
+
+    rt {
+        display: ruby-text;
+        white-space: nowrap;
+        font-size: 50%;
+        font-variant-east-asian: ruby;
+        text-emphasis: none;
+    }
+
+    rbc {
+        display: ruby-base-container;
+    }
+
+    rtc {
+        display: ruby-text-container;
+    }
+
+    ruby, rb, rt, rbc, rtc {
+        unicode-bidi: isolate;
+    }
+
+
+    :link {
+        color: #0000EE;
+    }
+
+    :visited {
+        color: #551A8B;
+    }
+
+    :link, :visited {
+        text-decoration: underline;
+    }
+
+    a:link[rel~=help], a:visited[rel~=help],
+    area:link[rel~=help], area:visited[rel~=help] {
+        cursor: help;
+    }
+
+    :focus {
+        outline: auto;
+    }
+
+    mark {
+        background: yellow;
+        color: black;
+    }
+    /* this color is just a suggestion and can be changed based on implementation feedback */
+    abbr[title], acronym[title] {
+        text-decoration: dotted underline;
+    }
+
+    ins, u {
+        text-decoration: underline;
+    }
+
+    del, s, strike {
+        text-decoration: line-through;
+    }
+
+    blink {
+        text-decoration: blink;
+    }
+
+    q::before {
+        content: open-quote;
+    }
+
+    q::after {
+        content: close-quote;
+    }
+
+    br {
+        content: '\A';
+        white-space: pre;
+    }
+    /* this also has bidi implications */
+    nobr {
+        white-space: nowrap;
+    }
+
+    wbr {
+        content: '\200B';
+    }
+    /* this also has bidi implications */
+    nobr wbr {
+        white-space: normal;
+    }
+
+    article, aside, h1, h2, h3, h4, h5, h6, hgroup, nav, section {
+        display: block;
+    }
+
+    h1 {
+        margin-top: 0.67em;
+        margin-bottom: 0.67em;
+        font-size: 2.00em;
+        font-weight: bold;
+    }
+
+    h2 {
+        margin-top: 0.83em;
+        margin-bottom: 0.83em;
+        font-size: 1.50em;
+        font-weight: bold;
+    }
+
+    h3 {
+        margin-top: 1.00em;
+        margin-bottom: 1.00em;
+        font-size: 1.17em;
+        font-weight: bold;
+    }
+
+    h4 {
+        margin-top: 1.33em;
+        margin-bottom: 1.33em;
+        font-size: 1.00em;
+        font-weight: bold;
+    }
+
+    h5 {
+        margin-top: 1.67em;
+        margin-bottom: 1.67em;
+        font-size: 0.83em;
+        font-weight: bold;
+    }
+
+    h6 {
+        margin-top: 2.33em;
+        margin-bottom: 2.33em;
+        font-size: 0.67em;
+        font-weight: bold;
+    }
+
+    dir, dd, dl, dt, ol, ul {
+        display: block;
+    }
+
+    li {
+        display: list-item;
+    }
+
+    dir, dl, ol, ul {
+        margin-top: 1em;
+        margin-bottom: 1em;
+    }
+
+        dir dir, dir dl, dir ol, dir ul,
+        dl dir, dl dl, dl ol, dl ul,
+        ol dir, ol dl, ol ol, ol ul,
+        ul dir, ul dl, ul ol, ul ul {
+            margin-top: 0;
+            margin-bottom: 0;
         }
 
-table {
+    dd {
-    display: table;
+        margin-left: 40px;
-}
+    }
-
+    /* LTR-specific: use 'margin-right' for rtl elements */
-caption {
+    dir, ol, ul {
-    display: table-caption;
+        padding-left: 40px;
-}
+    }
-
+    /* LTR-specific: use 'padding-right' for rtl elements */
-colgroup, colgroup[hidden] {
+    ol {
-    display: table-column-group;
+        list-style-type: decimal;
-}
-
-col, col[hidden] {
-    display: table-column;
-}
-
-thead, thead[hidden] {
-    display: table-header-group;
-}
-
-tbody, tbody[hidden] {
-    display: table-row-group;
-}
-
-tfoot, tfoot[hidden] {
-    display: table-footer-group;
-}
-
-tr, tr[hidden] {
-    display: table-row;
-}
-
-td, th, td[hidden], th[hidden] {
-    display: table-cell;
-}
-
-    colgroup[hidden], col[hidden], thead[hidden], tbody[hidden],
-    tfoot[hidden], tr[hidden], td[hidden], th[hidden] {
-        visibility: collapse;
     }
 
-table {
+    dir, ul {
-    box-sizing: border-box;
+        list-style-type: disc;
-    border-spacing: 2px;
+    }
-    border-collapse: separate;
-    text-indent: initial;
-}
 
-td, th {
+        dir dir, dir ul,
-    padding: 1px;
+        ol dir, ol ul,
-}
+        ul dir, ul ul {
+            list-style-type: circle;
+        }
 
-th {
+            dir dir dir, dir dir ul,
-    font-weight: bold;
+            dir ol dir, dir ol ul,
-}
+            dir ul dir, dir ul ul,
+            ol dir dir, ol dir ul,
+            ol ol dir, ol ol ul,
+            ol ul dir, ol ul ul,
+            ul dir dir, ul dir ul,
+            ul ol dir, ul ol ul,
+            ul ul dir, ul ul ul {
+                list-style-type: square;
+            }
 
-thead, tbody, tfoot, table > tr {
+    table {
-    vertical-align: middle;
+        display: table;
-}
+    }
 
-tr, td, th {
+    caption {
-    vertical-align: inherit;
+        display: table-caption;
-}
+    }
 
-table, td, th {
+    colgroup, colgroup[hidden] {
-    border-color: gray;
+        display: table-column-group;
-}
+    }
 
-thead, tbody, tfoot, tr {
+    col, col[hidden] {
-    border-color: inherit;
+        display: table-column;
-}
+    }
 
-/*table[rules=none i], table[rules=groups i], table[rules=rows i],
+    thead, thead[hidden] {
+        display: table-header-group;
+    }
+
+    tbody, tbody[hidden] {
+        display: table-row-group;
+    }
+
+    tfoot, tfoot[hidden] {
+        display: table-footer-group;
+    }
+
+    tr, tr[hidden] {
+        display: table-row;
+    }
+
+    td, th, td[hidden], th[hidden] {
+        display: table-cell;
+    }
+
+        colgroup[hidden], col[hidden], thead[hidden], tbody[hidden],
+        tfoot[hidden], tr[hidden], td[hidden], th[hidden] {
+            visibility: collapse;
+        }
+
+    table {
+        box-sizing: border-box;
+        border-spacing: 2px;
+        border-collapse: separate;
+        text-indent: initial;
+    }
+
+    td, th {
+        padding: 1px;
+    }
+
+    th {
+        font-weight: bold;
+    }
+
+    thead, tbody, tfoot, table > tr {
+        vertical-align: middle;
+    }
+
+    tr, td, th {
+        vertical-align: inherit;
+    }
+
+    table, td, th {
+        border-color: gray;
+    }
+
+    thead, tbody, tfoot, tr {
+        border-color: inherit;
+    }
+    /*table[rules=none i], table[rules=groups i], table[rules=rows i],
 table[rules=cols i], table[rules=all i], table[frame=void i],
 table[frame=above i], table[frame=below i], table[frame=hsides i],
 table[frame=lhs i], table[frame=rhs i], table[frame=vsides i],
@@ -361,39 +360,39 @@ table[rules=cols i] > tfoot > tr > td, table[rules=cols i] > tfoot > tr > th,
 table[rules=all i] > tfoot > tr > td, table[rules=all i] > tfoot > tr > th {
     border-color: black;
 }*/
+    input, select, option, optgroup, button, textarea, keygen {
+        text-indent: initial;
+    }
 
-input, select, option, optgroup, button, textarea, keygen {
+    textarea {
-    text-indent: initial;
+        white-space: pre-wrap;
-}
+    }
 
-textarea {
+    input[type="radio"], input[type="checkbox"], input[type="reset"], input[type="button"],
-    white-space: pre-wrap;
+    input[type="submit"], select, button {
-}
+        box-sizing: border-box;
+    }
 
-input[type="radio"], input[type="checkbox"], input[type="reset"], input[type="button"],
+    input[type="button"], button {
-input[type="submit"], select, button {
+        padding: 0.3em 0.5em;
-    box-sizing: border-box;
+    }
-}
 
-input[type="button"], button {
+    hr {
-    padding: 0.3em 0.5em;
+        color: gray;
-}
+        border-style: inset;
+        border-width: 1px;
+        margin: 0.5em auto;
+    }
 
-hr {
+    fieldset {
-    color: gray;
+        margin-left: 2px;
-    border-style: inset;
+        margin-right: 2px;
-    border-width: 1px;
+        border: groove 2px ThreeDFace;
-    margin: 0.5em auto;
+        padding: 0.35em 0.625em 0.75em;
-}
+    }
 
-fieldset {
+    legend {
-    margin-left: 2px;
+        padding-left: 2px;
-    margin-right: 2px;
+        padding-right: 2px;
-    border: groove 2px ThreeDFace;
+    }
-    padding: 0.35em 0.625em 0.75em;
-}
-
-legend {
-    padding-left: 2px;
-    padding-right: 2px;
 }

src/Orchard.Web/Modules/Orchard.Layouts/Styles/LayoutEditor/Toolbox.less

@@ -17,6 +17,8 @@
             &.sticky-top {
                 position: fixed;
                 top: 0;
+                max-height: 100%;
+                overflow-y: auto;
             }
 
             &.sticky-bottom {

src/Orchard.Web/Modules/Orchard.Layouts/ViewModels/HeadingEditorViewModel.cs

@@ -0,0 +1,6 @@
+namespace Orchard.Layouts.ViewModels {
+    public class HeadingEditorViewModel {
+        public string Text { get; set; }
+        public int Level { get; set; }
+    }
+}

src/Orchard.Web/Modules/Orchard.Layouts/Views/EditorTemplates/Elements.Heading.cshtml

@@ -0,0 +1,20 @@
+@model Orchard.Layouts.ViewModels.HeadingEditorViewModel
+@{
+    Script.Include("AutoFocus.js");
+}
+<fieldset>
+    <legend>@T("Level")</legend>
+    <ul>
+    @for (var i = 1; i <= 6; i++) {
+        <li>
+            @Html.RadioButtonFor(m => m.Level, i, new {id = "h" + i})
+            <label for="@("h" + i)" class="forcheckbox">@T("&lt;h{0}/&gt;", i)</label>
+        </li>
+    }
+    </ul>
+</fieldset>
+<fieldset class="autofocus">
+    @Html.LabelFor(m => m.Text, T("Text"))
+    @Html.TextBoxFor(m => m.Text, new { @class = "text large tokenized", autofocus = "autofocus" })
+    @Html.Hint(T("Note: HTML markup will be rendered unencoded."))
+</fieldset>

src/Orchard.Web/Modules/Orchard.Layouts/Views/Elements/Heading.cshtml

@@ -0,0 +1,6 @@
+@using Orchard.Layouts.Helpers
+@{
+    var tagBuilder = TagBuilderExtensions.CreateElementTagBuilder(Model, "h" + (Model.Level >= 1 && Model.Level <= 6 ? Model.Level : 1));
+    tagBuilder.InnerHtml = Model.ProcessedText;
+}
+@tagBuilder.ToHtmlString()

src/Orchard.Web/Modules/Orchard.Layouts/Views/Elements/Paragraph.Design.cshtml

@@ -1 +1 @@
-@Html.Raw((string)Model.Element.Content)
+<p>@Html.Raw((string)Model.Element.Content)</p>

src/Orchard.Web/Modules/Orchard.Layouts/Views/Elements/Paragraph.cshtml

@@ -1,6 +1 @@
-@using Orchard.Layouts.Helpers
+<p>@Html.Raw((string)Model.Element.Content)</p>
-@{
-    var tagBuilder = TagBuilderExtensions.CreateElementTagBuilder(Model, "p");
-    tagBuilder.InnerHtml = Model.ProcessedText;
-}
-@tagBuilder.ToHtmlString()