Merge pull request #362 from nvisionative/develop

Merge `develop` into `main` for `3.1.0` release

docs/Commands.md

@@ -26,7 +26,7 @@ This sets your node instance to watch all changes of images, JS and SCSS in the
 
 **Note:** _This command will take over your node instance (in Command Prompt, PowerShell, Git Bash, VS Code Terminal, etc.).  Therefore, you may want to start a new instance if you need to run other commands at the same time._
 
-### gulp package
+### gulp packageTheme
 This command builds and packages your custom theme into a DNN theme installation package (ZIP file). It will place the ZIP file in the `./build/` folder using the following naming convention: `[project]_[version]_install.zip`
 
 
@@ -72,4 +72,4 @@ ZIPs contents of `./menus/` folder, `./partials/` folder, and all ASCX, XML, HTM
 ZIPs all subset ZIP files and other pertinent project files into theme package installation file using the following naming convention: `[project]_[version]_install.zip`
 
 ### gulp cleantemp
-Deletes all temporary ZIP and project files from `./temp/` folder used in package tasks.
+Deletes all temporary ZIP and project files from `./temp/` folder used in package tasks.

gulpfile.js

@@ -32,11 +32,18 @@ const paths = {
     dest: './dist/fonts/'
   },
   faFonts: {
-    src: './node_modules/@fortawesome/fontawesome-free/webfonts/*',
+    src: [
+      './node_modules/@fortawesome/fontawesome-free/webfonts/fa-brands-400.*',
+      './node_modules/@fortawesome/fontawesome-free/webfonts/fa-solid-900.*'
+    ],
     dest: './dist/webfonts/'
   },
   faCss: {
-    src: './node_modules/@fortawesome/fontawesome-free/css/all.min.css',
+    src: [
+      './node_modules/@fortawesome/fontawesome-free/css/brands.min.css',
+      './node_modules/@fortawesome/fontawesome-free/css/solid.min.css',
+      './node_modules/@fortawesome/fontawesome-free/css/fontawesome.min.css',
+    ],
     dest: './dist/css/'
   },
   normalize: {
@@ -394,7 +401,15 @@ function cleantemp() {
 //gulp serve
 function serve() {
   bs.init({
-      proxy: "nvQuickTheme.loc"
+      proxy: "nvQuickTheme.loc",
+      rewriteRules: [
+        {
+            match: /w\[".*"].*/g,
+            fn: (req, _res, match) => {
+                return match.replace(/(http:\/\/|https:\/\/)[a-zA-Z0-9.-]+\//g, `//${req.headers.host}/`);
+            }
+        },
+    ],
   });
   gulp.watch(paths.images.src, images).on('change', bs.reload);
   gulp.watch(paths.styles.src, styles).on('change', bs.reload);

manifest.dnn

@@ -80,16 +80,10 @@
                     </staticContent>
                   </node>
                   <node path="/configuration/system.webServer/staticContent" action="update" key="fileExtension" collision="ignore">
-                    <remove fileExtension=".eot" />
-                    <mimeMap fileExtension=".eot" mimeType="application/vnd.ms-fontobject" />
-                    <remove fileExtension=".otf" />
-                    <mimeMap fileExtension=".otf" mimeType="font/otf" />
                     <remove fileExtension=".svg" />
                     <mimeMap fileExtension=".svg" mimeType="image/svg+xml" />
-                    <remove fileExtension=".woff" />
-                    <mimeMap fileExtension=".woff" mimeType="font/x-woff" />
                     <remove fileExtension=".woff2" />
-                    <mimeMap fileExtension=".woff2" mimeType="application/font-woff2" />
+                    <mimeMap fileExtension=".woff2" mimeType="font/woff2" />
                   </node>
                 </nodes>
               </configuration>

package.json

@@ -7,12 +7,12 @@
   "license": "GPL-3.0",
   "private": true,
   "dependencies": {
-    "@fortawesome/fontawesome-free": "^6.2.0",
+    "@fortawesome/fontawesome-free": "^6.5.1",
     "bootstrap": "^5.2.2",
     "normalize.css": "^8.0.1"
   },
   "devDependencies": {
-    "browser-sync": "^2.27.10",
+    "browser-sync": "^2.29.3",
     "fancy-log": "^2.0.0",
     "gulp": "^4.0.2",
     "gulp-autoprefixer": "^8.0.0",

partials/_includes.ascx

@@ -1,8 +1,10 @@
 <dnn:META ID="mobileScale" runat="server" Name="viewport" Content="width=device-width, initial-scale=1.0" />
 <dnn:DnnCssExclude runat="server" Name="dnndefault" /> 
 
-<dnn:DnnCssInclude runat="server" FilePath="dist/css/all.min.css" Priority="100" PathNameAlias="SkinPath" />
-<dnn:DnnCssInclude runat="server" FilePath="dist/css/style.min.css" Priority="110" PathNameAlias="SkinPath" />
+<dnn:DnnCssInclude runat="server" FilePath="dist/css/fontawesome.min.css" Priority="100" PathNameAlias="SkinPath" />
+<dnn:DnnCssInclude runat="server" FilePath="dist/css/brands.min.css" Priority="110" PathNameAlias="SkinPath" />
+<dnn:DnnCssInclude runat="server" FilePath="dist/css/solid.min.css" Priority="120" PathNameAlias="SkinPath" />
+<dnn:DnnCssInclude runat="server" FilePath="dist/css/style.min.css" Priority="130" PathNameAlias="SkinPath" />
 
 <dnn:DnnJsInclude runat="server" FilePath="dist/js/bootstrap.bundle.min.js" ForceProvider="DnnFormBottomProvider" Priority="100" PathNameAlias="SkinPath" />
 <dnn:DnnJsInclude runat="server" FilePath="dist/js/custom.min.js" ForceProvider="DnnFormBottomProvider" Priority="110" PathNameAlias="SkinPath" />
@@ -15,7 +17,6 @@
         var fonts = new string[]
         {
             "dist/webfonts/fa-brands-400",
-            "dist/webfonts/fa-regular-400",
             "dist/webfonts/fa-solid-900",
             "dist/fonts/OpenSans-Bold",
             "dist/fonts/OpenSans-BoldItalic",
@@ -31,7 +32,6 @@
 
         var types = new Dictionary<string, string>();
         types.Add("woff2", "font/woff2");
-        types.Add("woff", "font/woff");
 
         var defaultPage = (CDefault)this.Page;
 

src/scss/components/_dnn.scss

@@ -323,10 +323,10 @@ legend.error {
 }
 
 /*
-	 * 1. Display hand cursor for clickable form elements
-	 * 2. Allow styling of clickable form elements in iOS
-	 * 3. Correct inner spacing displayed oddly in IE7 (doesn't effect IE6)
-	 */
+* 1. Display hand cursor for clickable form elements
+* 2. Allow styling of clickable form elements in iOS
+* 3. Correct inner spacing displayed oddly in IE7 (doesn't effect IE6)
+*/
 
 .dnnFormItem button,
 .dnnFormItem input[type="button"],
@@ -337,68 +337,23 @@ legend.error {
 .dnnTertiaryAction,
 ul.dnnAdminTabNav li a,
 .dnnLogin .LoginTabGroup span {
-    display: inline-block;
-    padding: 9px 9px;
-    margin-bottom: 9px;
-    cursor: pointer;
-    min-width: 75px;
-    *overflow: visible;
-    border: 1px solid #c2c2c2;
-    background: #eaeaea;
-    border-radius: 0.25px;
-    color: #333;
-    font-weight: bold;
-    text-decoration: none;
-    text-align: center;
-}
-
-.dnnFormItem button,
-.dnnFormItem input[type="button"],
-.dnnFormItem input[type="reset"],
-.dnnFormItem input[type="submit"],
-.dnnPrimaryAction,
-.dnnSecondaryAction,
-.dnnTertiaryAction {
-    padding: 6px 6px;
+    @extend .btn;
+    margin-top: 0.5rem;
+    margin-bottom: 0.5rem;
 }
 
 /* Primary Action */
 
 .dnnPrimaryAction,
 .dnnFormItem input[type="submit"],
 a.dnnPrimaryAction {
-    border-color: color('dnnPrimaryAction');
-    background: color('dnnPrimaryAction');
-    color: #efefef;
-    text-shadow: 0px -1px 0px #185B93;
-    cursor: pointer;
-}
-
-.dnnPrimaryAction:hover,
-.dnnFormItem input[type="submit"]:hover,
-a.dnnPrimaryAction:hover {
-    border-color: #6cb6f3;
-    background: #6cb6f3;
-    /* Old browsers */
-    color: #fff;
-}
-
-.dnnPrimaryAction:active,
-.dnnFormItem input[type="submit"]:active,
-a.dnnPrimaryAction:active {
-    border-color: color('dnnPrimaryAction');
-    background: color('dnnPrimaryAction');
-    color: #fff;
+    @extend .btn-main-shade;
 }
 
 .dnnPrimaryAction[disabled],
 .dnnPrimaryAction[disabled]:hover,
 .dnnPrimaryAction[disabled]:active {
-    background: #ccc !important;
-    border: none !important;
-    box-shadow: none !important;
-    color: #aaa !important;
-    text-shadow: none;
+    @extend .btn-disabled !optional;
 }
 
 /* Secondary Action */
@@ -409,24 +364,7 @@ a.dnnPrimaryAction:active {
 a.dnnSecondaryAction,
 ul.dnnAdminTabNav li a,
 .dnnLogin .LoginTabGroup span {
-    background: color('dnnSecondaryAction');
-    /* Old browsers */
-    border-color: color('dnnSecondaryAction');
-    text-shadow: 0px 1px 0px #ffffff;
-    color: #333;
-    cursor: pointer;
-}
-
-.dnnFormItem button:hover,
-.dnnFormItem input[type="button"]:hover,
-.dnnFormItem input[type="reset"]:hover,
-.dnnSecondaryAction:hover,
-a.dnnSecondaryAction:hover,
-ul.dnnAdminTabNav li a:hover,
-.dnnLogin .LoginTabGroup span:hover {
-    background: whitesmoke;
-    /* Old browsers */
-    color: #555;
+    @extend .btn-main-highlight;
 }
 
 .dnnFormItem button:active,
@@ -435,8 +373,8 @@ ul.dnnAdminTabNav li a:hover,
 .dnnSecondaryAction:active,
 a.dnnSecondaryAction:active,
 ul.dnnAdminTabNav li a:active {
-    border-color: color('dnnSecondaryAction');
-    background: color('dnnSecondaryAction');
+    border-color: color('main-accent');
+    background: color('main-accent'); 
 }
 
 /* Fix some old forge modules use .dnnPrimaryAction and .dnnSecondaryAction in wrong way */
@@ -456,34 +394,19 @@ span.dnnSecondaryAction>a.dnnSecondaryAction {
 /* Tertiary Action */
 .dnnTertiaryAction,
 a.dnnTertiaryAction {
-    padding: 10px 10px;
-    border: none;
-    background: color('dnnTertiaryAction');
-    color: #333;
-}
-
-.dnnTertiaryAction:hover,
-a.dnnTertiaryAction:hover {
-    background: #f2f2f2;
-}
-
-.dnnTertiaryAction:active,
-a.dnnTertiaryAction:active {
-    background: color('dnnTertiaryAction');
+    @extend .btn-main-accent;
 }
 
 /* Action Button behind input */
 .dnnFormItem input[type="text"]+a.dnnPrimaryAction,
 .dnnFormItem input[type="text"]+a.dnnSecondaryAction,
 .dnnFormItem input[type="text"]+a.dnnTerriaryAction {
-    display: inline-block;
-    width: auto;
-    margin: 6px 5px 6px 5px;
+    margin-left: 0.325rem;
 }
 
-.dnnFormItem input[type="checkbox"]+span,
-.dnnFormItem input[type="radio"]+span {
-    margin: 5px;
+.dnnFormItem input[type="checkbox"] + span,
+.dnnFormItem input[type="radio"] + span {
+    margin: 0.325rem;
 }
 
 /* text style for buttons and link buttons used in the portal admin pages */
@@ -497,8 +420,7 @@ a.dnnTertiaryAction:active {
 /* Re-set default cursor for disabled elements */
 .dnnFormItem button[disabled],
 .dnnFormItem input[disabled] {
-    cursor: default;
-    opacity: 0.5;
+    @extend .btn-disabled !optional;
 }