X-Git-Url: https://git.mdrn.pl/wolnelektury.git/blobdiff_plain/14eaee7aef2e0f89f0210f087d10eeaed0bedf43..a8282aa69e00292bec986722c5230ff89f96f450:/src/wolnelektury/static/2022/styles/utils/bourbon/library/_text-inputs.scss

diff --git a/src/wolnelektury/static/2022/styles/utils/bourbon/library/_text-inputs.scss b/src/wolnelektury/static/2022/styles/utils/bourbon/library/_text-inputs.scss
new file mode 100644
index 000000000..dfebb79d5
--- /dev/null
+++ b/src/wolnelektury/static/2022/styles/utils/bourbon/library/_text-inputs.scss
@@ -0,0 +1,163 @@
+@charset "UTF-8";
+
+////
+/// @type list
+///
+/// @require {function} _assign-inputs
+///
+/// @require {variable} $_text-inputs-list
+////
+
+/// A list of all _text-based_ HTML inputs. Please note that you must
+/// interpolate the variable (`#{}`) to use it as a selector.
+///
+/// @example scss
+///   #{$all-text-inputs} {
+///     border: 1px solid #ccc;
+///   }
+///
+///   // CSS Output
+///   [type='color'],
+///   [type='date'],
+///   [type='datetime'],
+///   [type='datetime-local'],
+///   [type='email'],
+///   [type='month'],
+///   [type='number'],
+///   [type='password'],
+///   [type='search'],
+///   [type='tel'],
+///   [type='text'],
+///   [type='time'],
+///   [type='url'],
+///   [type='week'],
+///   input:not([type]),
+///   textarea {
+///     border: 1px solid #ccc;
+///   }
+
+$all-text-inputs: _assign-inputs($_text-inputs-list);
+
+/// A list of all _text-based_ HTML inputs with the `:active` pseudo-class
+/// applied. Please note that you must interpolate the variable (`#{}`) to use
+/// it as a selector.
+///
+/// @example scss
+///   #{$all-text-inputs-active} {
+///     border: 1px solid #aaa;
+///   }
+///
+///   // CSS Output
+///   [type='color']:active,
+///   [type='date']:active,
+///   [type='datetime']:active,
+///   [type='datetime-local']:active,
+///   [type='email']:active,
+///   [type='month']:active,
+///   [type='number']:active,
+///   [type='password']:active,
+///   [type='search']:active,
+///   [type='tel']:active,
+///   [type='text']:active,
+///   [type='time']:active,
+///   [type='url']:active,
+///   [type='week']:active,
+///   input:not([type]):active,
+///   textarea:active {
+///     border: 1px solid #aaa;
+///   }
+
+$all-text-inputs-active: _assign-inputs($_text-inputs-list, active);
+
+/// A list of all _text-based_ HTML inputs with the `:focus` pseudo-class
+/// applied. Please note that you must interpolate the variable (`#{}`) to use
+/// it as a selector.
+///
+/// @example scss
+///   #{$all-text-inputs-focus} {
+///     border: 1px solid #1565c0;
+///   }
+///
+///   // CSS Output
+///   [type='color']:focus,
+///   [type='date']:focus,
+///   [type='datetime']:focus,
+///   [type='datetime-local']:focus,
+///   [type='email']:focus,
+///   [type='month']:focus,
+///   [type='number']:focus,
+///   [type='password']:focus,
+///   [type='search']:focus,
+///   [type='tel']:focus,
+///   [type='text']:focus,
+///   [type='time']:focus,
+///   [type='url']:focus,
+///   [type='week']:focus,
+///   input:not([type]):focus,
+///   textarea:focus {
+///     border: 1px solid #1565c0;
+///   }
+
+$all-text-inputs-focus: _assign-inputs($_text-inputs-list, focus);
+
+/// A list of all _text-based_ HTML inputs with the `:hover` pseudo-class
+/// applied. Please note that you must interpolate the variable (`#{}`) to use
+/// it as a selector.
+///
+/// @example scss
+///   #{$all-text-inputs-hover} {
+///     border: 1px solid #aaa;
+///   }
+///
+///   // CSS Output
+///   [type='color']:hover,
+///   [type='date']:hover,
+///   [type='datetime']:hover,
+///   [type='datetime-local']:hover,
+///   [type='email']:hover,
+///   [type='month']:hover,
+///   [type='number']:hover,
+///   [type='password']:hover,
+///   [type='search']:hover,
+///   [type='tel']:hover,
+///   [type='text']:hover,
+///   [type='time']:hover,
+///   [type='url']:hover,
+///   [type='week']:hover,
+///   input:not([type]):hover,
+///   textarea:hover {
+///     border: 1px solid #aaa;
+///   }
+
+$all-text-inputs-hover: _assign-inputs($_text-inputs-list, hover);
+
+/// A list of all _text-based_ HTML inputs with the `:invalid` pseudo-class
+/// applied. Please note that you must interpolate the variable (`#{}`) to use
+/// it as a selector.
+///
+/// @example scss
+///   #{$all-text-inputs-invalid} {
+///     border: 1px solid #00f;
+///   }
+///
+///   // CSS Output
+///   [type='color']:invalid,
+///   [type='date']:invalid,
+///   [type='datetime']:invalid,
+///   [type='datetime-local']:invalid,
+///   [type='email']:invalid,
+///   [type='month']:invalid,
+///   [type='number']:invalid,
+///   [type='password']:invalid,
+///   [type='search']:invalid,
+///   [type='tel']:invalid,
+///   [type='text']:invalid,
+///   [type='time']:invalid,
+///   [type='url']:invalid,
+///   [type='week']:invalid,
+///   input:not([type]):invalid,
+///   textarea:invalid {
+///     border: 1px solid #00f;
+///   }
+
+$all-text-inputs-invalid: _assign-inputs($_text-inputs-list, invalid);