diff --git a/Assets/Styles/abstracts/_mixins.scss b/Assets/Styles/abstracts/_mixins.scss index e6afbec..348ebc0 100644 --- a/Assets/Styles/abstracts/_mixins.scss +++ b/Assets/Styles/abstracts/_mixins.scss @@ -231,16 +231,16 @@ @include padding-side-gutter("left"); } -@mixin margin-side-gutter($direction) { - @include media-breakpoint-only(xs) { margin-#{$direction}: var(--gutter-x-small); } +@mixin margin-side-gutter($direction, $multiplier: 1) { + @include media-breakpoint-only(xs) { margin-#{$direction}: calc(#{$multiplier} * var(--gutter-x-small)); } - @include media-breakpoint-only(sm) { margin-#{$direction}: var(--gutter-small); } + @include media-breakpoint-only(sm) { margin-#{$direction}: calc(#{$multiplier} * var(--gutter-small)); } - @include media-breakpoint-only(md) { margin-#{$direction}: var(--gutter-medium); } + @include media-breakpoint-only(md) { margin-#{$direction}: calc(#{$multiplier} * var(--gutter-medium)); } - @include media-breakpoint-only(lg) { margin-#{$direction}: var(--gutter-large); } + @include media-breakpoint-only(lg) { margin-#{$direction}: calc(#{$multiplier} * var(--gutter-large)); } - @include media-breakpoint-up(xl) { margin-#{$direction}: var(--gutter-x-large); } + @include media-breakpoint-up(xl) { margin-#{$direction}: calc(#{$multiplier} * var(--gutter-x-large)); } } @mixin margin-top-gutter() { diff --git a/Lombiq.BaseTheme.csproj b/Lombiq.BaseTheme.csproj index f769447..c2b31d4 100644 --- a/Lombiq.BaseTheme.csproj +++ b/Lombiq.BaseTheme.csproj @@ -21,6 +21,9 @@ + + + diff --git a/Manifest.cs b/Manifest.cs index ccdcb5d..6c6b303 100644 --- a/Manifest.cs +++ b/Manifest.cs @@ -1,7 +1,7 @@ using OrchardCore.DisplayManagement.Manifest; [assembly: Theme( - Name = "Lombiq Orchard Core Base Theme", + Name = "Lombiq Base Theme", Author = "Lombiq Technologies", Version = "1.0", Website = "https://github.com/Lombiq/Orchard-Base-Theme", diff --git a/Readme.md b/Readme.md index 11a7e94..647815e 100644 --- a/Readme.md +++ b/Readme.md @@ -1,4 +1,4 @@ -# Lombiq Orchard Core Base Theme +# Lombiq Base Theme for Orchard Core @@ -17,6 +17,12 @@ You may have noticed, that we mentioned Bootstrap 5.1, even though your version Besides the style and layout, the theme also automatically includes a minimalist helper script that eases transition away from jQuery. You don't really need full jQuery now that Internet Explorer is effectively dead (Internet Explorer 11 is going end of life on June 15, 2022 so you should not support it in any new project at this time). The script gives you the `window.helper` object. You can use `helper.ready(($) => {})` in your scripts, where `$(querySelector, baseElement)` returns a JavaScript `Array` of `Element`s. +## Recipes + +- Lombiq Orchard Core Base Theme - Layers and Zones: Call this if you plan on using widgets. It sets up all the supported zones and some common layers. +- Lombiq Orchard Core Base Theme - Styling Demo: Creates a Demo Page that can be helpful to see how your theme's stylesheet behaves on various HTML elements. + + ## Contributing and support Bug reports, feature requests, comments, questions, code contributions, and love letters are warmly welcome, please do so via GitHub issues and pull requests. Please adhere to our [open-source guidelines](https://lombiq.com/open-source-guidelines) while doing so. diff --git a/Recipes/Lombiq.BaseTheme.LayersAndZones.recipe.json b/Recipes/Lombiq.BaseTheme.LayersAndZones.recipe.json new file mode 100644 index 0000000..af1d6f1 --- /dev/null +++ b/Recipes/Lombiq.BaseTheme.LayersAndZones.recipe.json @@ -0,0 +1,103 @@ +{ + "name": "Lombiq.BaseTheme.LayersAndZones", + "displayName": "Lombiq Orchard Core Base Theme - Layers and Zones", + "description": "Adds the zones rendered by the base theme to the Layers feature's Widgets menu. Also adds common layers.", + "author": "Lombiq Technologies", + "website": "https://github.com/Lombiq/Orchard-Base-Theme", + "version": "1.0", + "categories": [ "settings", "layers", "zones" ], + "tags": [], + + "steps": [ + { + "name": "Layers", + "Layers": [ + { + "Name": "Anonymous", + "Rule": null, + "Description": "The widgets in this layer are displayed for anonymous users.", + "LayerRule": { + "Conditions": [ + { + "$type": "OrchardCore.Rules.Models.IsAnonymousCondition, OrchardCore.Rules", + "Name": "IsAnonymousCondition", + "ConditionId": "4bnbwg5g0t90qs2t2ktnaenkmh" + } + ], + "Name": null, + "ConditionId": "483njpvbtakje0ht041trsgmwm" + } + }, + { + "Name": "Authenticated", + "Rule": null, + "Description": "The widgets in this layer are displayed for authenticated users.", + "LayerRule": { + "Conditions": [ + { + "$type": "OrchardCore.Rules.Models.IsAuthenticatedCondition, OrchardCore.Rules", + "Name": "IsAuthenticatedCondition", + "ConditionId": "4ca3yeypsr57hxsq4swj4xj95e" + } + ], + "Name": null, + "ConditionId": "4ec27g5as3fp61861vaw8t5kmq" + } + }, + { + "Name": "Always", + "Rule": null, + "Description": "The widgets in this layer are displayed on any page of this site.", + "LayerRule": { + "Conditions": [ + { + "$type": "OrchardCore.Rules.Models.BooleanCondition, OrchardCore.Rules", + "Value": true, + "Name": "BooleanCondition", + "ConditionId": "4w4vmrmz9mf0hv3a7v9qpm72xg" + } + ], + "Name": null, + "ConditionId": "4jrrhmb4a1pmv4whx5rvyh14na" + } + }, + { + "Name": "Homepage", + "Rule": null, + "Description": "The widgets in this layer are only displayed on the homepage.", + "LayerRule": { + "Conditions": [ + { + "$type": "OrchardCore.Rules.Models.HomepageCondition, OrchardCore.Rules", + "Value": true, + "Name": "HomepageCondition", + "ConditionId": "4fs2pce845jm867cvzf0cpw856" + } + ], + "Name": null, + "ConditionId": "4rdf2ykd6qx8s3ey03gg8hmv4h" + } + } + ] + }, + { + "name": "Settings", + "LayerSettings": { + "Zones": [ + "Header", + "Navigation", + "BeforeMain", + "Featured", + "AsideFirst", + "Messages", + "BeforeContent", + "Content", + "AfterContent", + "AsideSecond", + "AfterMain", + "Footer" + ] + } + } + ] +} diff --git a/Recipes/Lombiq.BaseTheme.StylingDemo.recipe.json b/Recipes/Lombiq.BaseTheme.StylingDemo.recipe.json index 5ac9296..e9e0312 100644 --- a/Recipes/Lombiq.BaseTheme.StylingDemo.recipe.json +++ b/Recipes/Lombiq.BaseTheme.StylingDemo.recipe.json @@ -1,7 +1,7 @@ { "name": "Lombiq.BaseTheme.StylingDemo", "displayName": "Lombiq Orchard Core Base Theme - Styling Demo", - "description": "", + "description": "Adds a sample Page that contains HTML Widgets with content that features various Bootstrap utility classes.", "author": "Lombiq Technologies", "website": "https://github.com/Lombiq/Orchard-Base-Theme", "version": "1.0",