bullframe.css 4.1.1 → 4.2.0

package/{index.html → dist/index.html}

@@ -11,18 +11,18 @@
     content="A quick look at a wide range of HTML elements, divided into several sections and rendered into unusual combinations, for testing purposes only." />
 
   <!-- https://realfavicongenerator.net/ -->
-  <link rel="apple-touch-icon" sizes="180x180" href="./docs/test/icons/apple-touch-icon.png?v=PYqzMzgx6v" />
-  <link rel="icon" type="image/png" sizes="32x32" href="./docs/test/icons/favicon-32x32.png?v=PYqzMzgx6v" />
-  <link rel="icon" type="image/png" sizes="16x16" href="./docs/test/icons/favicon-16x16.png?v=PYqzMzgx6v" />
-  <link rel="mask-icon" href="./docs/test/icons/safari-pinned-tab.svg?v=PYqzMzgx6v" color="#f95c1f" />
-  <link rel="shortcut icon" href="./docs/test/icons/favicon.ico?v=PYqzMzgx6v" />
+  <link rel="apple-touch-icon" sizes="180x180" href="./icons/apple-touch-icon.png?v=PYqzMzgx6v" />
+  <link rel="icon" type="image/png" sizes="32x32" href="./icons/favicon-32x32.png?v=PYqzMzgx6v" />
+  <link rel="icon" type="image/png" sizes="16x16" href="./icons/favicon-16x16.png?v=PYqzMzgx6v" />
+  <link rel="mask-icon" href="./icons/safari-pinned-tab.svg?v=PYqzMzgx6v" color="#f95c1f" />
+  <link rel="shortcut icon" href="./icons/favicon.ico?v=PYqzMzgx6v" />
   <meta name="msapplication-TileColor" content="#da532c" />
   <meta name="theme-color" content="#f95c1f" />
 
-  <link rel="stylesheet" href="./dist/css/bullframe-system-default.min.css?v4.1.1" />
+  <link rel="stylesheet" href="css/bullframe-system-default.min.css?v4.2.0" />
 
   <!-- this is just for a nicer demo -->
-  <link rel="stylesheet" href="./docs/test/css/style.css" />
+  <link rel="stylesheet" href="assets-demo/css/style.css" />
 </head>
 
 <body class="bf-responsive-typography bf-reduced-motion">
@@ -35,9 +35,9 @@
         role="button">Download</a>
       <a class="bf-btn" href="https://github.com/marcop135/bullframe.css" role="button">GitHub</a>
       <p class="description">
-        This an is a quick look at a wide range of HTML elements, divided into
+        This is a quick look at a wide range of HTML elements, divided into
         several sections and rendered into unusual combinations, for testing
-        purpose only.
+        purposes only.
       </p>
 
       <hr />
@@ -95,7 +95,7 @@
             The <em>em element</em> example<br />
             The <em>i element</em> example<br />
             The img element
-            <img src="../docs/test/images/placeholder-img-16x16.jpg" alt="just a placeholder" loading="lazy" />
+            <img src="../images/placeholder-img-16x16.jpg" alt="just a placeholder" loading="lazy" />
             example<br />
             The <ins>ins element</ins> example<br />
             The <kbd>kbd element</kbd> example<br />
@@ -323,7 +323,7 @@ Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
           <h3>Linked figure with an image and a caption</h3>
           <figure>
             <a href="#">
-              <img src="../docs/test/images/placeholder-img-800x40.jpg" alt="just a placeholder" loading="lazy" />
+              <img src="../images/placeholder-img-800x40.jpg" alt="just a placeholder" loading="lazy" />
             </a>
             <figcaption>The image above is 800x400 pixels</figcaption>
           </figure>
@@ -339,7 +339,7 @@ Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
         <div class="bf-col-6">
           <div class="bf-m-b-3">
             <h3>HTML5 video with controls</h3>
-            <video poster="./docs/test/images/video-poster.png" controls width="450">
+            <video poster="./images/video-poster.png" controls width="450">
               <source src="https://interactive-examples.mdn.mozilla.net/media/cc0-videos/flower.webm"
                 type="video/webm" />
               <source src="https://interactive-examples.mdn.mozilla.net/media/cc0-videos/flower.webm"
@@ -616,7 +616,7 @@ Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
           <h3>Clickable inputs</h3>
           <fieldset class="bf-m-b-3">
             <div class="input-image">
-              <input alt="Image (input)" src="../docs/test/images/placeholder-img-130x14.jpg" type="image" /><br />
+              <input alt="Image (input)" src="../images/placeholder-img-130x14.jpg" type="image" /><br />
               <code>input type="image" (130x40px)</code>
             </div>
             <div>
@@ -639,7 +639,7 @@ Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
           <fieldset disabled>
             <h3>Clickable inputs (disabled)</h3>
             <div class="input-image">
-              <input alt="Image (input)" src="../docs/test/images/placeholder-img-130x14.jpg" type="image" /><br />
+              <input alt="Image (input)" src="../images/placeholder-img-130x14.jpg" type="image" /><br />
               <code>input type="image" (130x40px)</code>
             </div>
             <div>

package/gulpfile.js

@@ -1,6 +1,4 @@
-// Gulp-starter repository
-// File processing boilerplate for HTML, Sass, JS, PNG, JPEG, GIF and SVG files with Gulp.js
-// https://github.com/marcop135/gulp-starter
+// Gulpfile for bullframe.css
 'use strict';
 
 // Initialize modules
@@ -31,7 +29,7 @@ function reload(done) {
 function serve(done) {
   server.init({
     server: {
-      baseDir: './',
+      baseDir: './dist/',
       index: './index.html',
     },
   });
@@ -40,7 +38,6 @@ function serve(done) {
 
 // File paths to watch
 const files = {
-  htmlPath: './*.html',
   scssPath: 'src/scss/**/*.scss',
 };
 
@@ -58,7 +55,7 @@ function scssTask() {
       .pipe(
         replace(
           '@charset "UTF-8";',
-          '/*! bullframe.css v4.1.1 | MIT License | https://github.com/marcop135/bullframe.css */'
+          '/*! bullframe.css v4.2.0 | MIT License | https://github.com/marcop135/bullframe.css */'
         )
       )
 
@@ -91,7 +88,7 @@ function scssTask() {
 // If any change, run scss, js and image tasks simultaneously
 // then reload via browsersync
 function watchTask() {
-  watch([files.htmlPath, files.scssPath], series(parallel(scssTask), reload));
+  watch([files.scssPath], series(parallel(scssTask), reload));
 }
 
 // Export the default Gulp task so it can be run

package/netlify.toml

@@ -0,0 +1,3 @@
+[build]
+  base = "/"
+  publish = "dist/"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bullframe.css",
-  "version": "4.1.1",
+  "version": "4.2.0",
   "description": "Solid, fluid, cross-browser Sass (SCSS) framework.",
   "jsdelivr": "dist/css/bullframe.css",
   "unpkg": "dist/css/bullframe.css",

package/src/scss/bullframe-utilities.scss

@@ -1,4 +1,4 @@
-/*! bullframe.css v4.1.1 | MIT License | https://github.com/marcop135/bullframe.css */
+/*! bullframe.css v4.2.0 | MIT License | https://github.com/marcop135/bullframe.css */
 /* custom build: bullframe-utilities */
 
 // colors, spacing and breakpoint variables

package/src/scss/forms/_forms-normalization.scss

@@ -152,7 +152,9 @@ select {
 
 // Taken from Bootstrap Reboot v5.2
 // https://unpkg.com/browse/bootstrap@5.2.0/dist/css/bootstrap-reboot.css
-[list]:not([type='date']):not([type='datetime-local']):not([type='month']):not([type='week']):not([type='time'])::-webkit-calendar-picker-indicator {
+[list]:not([type='date']):not([type='datetime-local']):not([type='month']):not(
+    [type='week']
+  ):not([type='time'])::-webkit-calendar-picker-indicator {
   display: none !important;
 }