[Rt-commit] rt branch, 4.6/add-collapse-to-topactions-buttons, repushed
Blaine Motsinger
blaine at bestpractical.com
Thu Dec 26 15:41:26 EST 2019
The branch 4.6/add-collapse-to-topactions-buttons was deleted and repushed:
was ef39e2c37bc6f387ac7292d8d3047a1506c6e781
now 723b2a477899b26ee8807f8d0b6200317a5e8f0e
1: ef39e2c37b ! 1: 200b3966c4 Add collapse to topactions inputs
@@ -1,15 +1,14 @@
Author: Blaine Motsinger <blaine at bestpractical.com>
- Add collapse to topactions buttons
+ Add collapse to topactions inputs
- This commit makes the topactions buttons collapse for smaller
+ This commit makes the topactions inputs collapse for smaller
window sizes.
- The search and create buttons previously collapsed in a similar
- way before removing the queue selection dropdown from topactions.
- This update has slightly different styling and removes the easing
- animation on window sizes smaller than 1300px to save colliding
- with the main-navigation.
+ The search and create inputs previously collapsed before the
+ queue selection dropdown was removed from topactions. This update
+ has slightly different styling but emulates the general idea
+ previously implemented in the collapse.
diff --git a/share/html/Elements/CreateTicket b/share/html/Elements/CreateTicket
--- a/share/html/Elements/CreateTicket
@@ -47,58 +46,38 @@
-webkit-appearance: textfield;
}
--#topactions input[type="search"]:focus {
-- width: 16em;
-- -webkit-transition: width 0.25s ease-in-out;
-- -moz-transition: width 0.25s ease-in-out;
-- -ms-transition: width 0.25s ease-in-out;
-- transition: width 0.25s ease-in-out;
-+/* topactions search box sizes and easing definitions
-+
-+for browser sizes
-+- 1300px or greater, when in focus grow to 16em with easing then shrink back to 10em with easing.
-+- smaller than 1300px, don't grow and disable easing, but size remains 10em.
-+- 900px or smaller, change size to 4.7em.
-+
-+*/
-+#topactions input,
-+#topactions button {
++#topactions input {
+ width: 10em;
+}
+
-+ at media (min-width: 1300px) {
-+ #topactions input {
-+ -webkit-transition: width 0.25s ease-in-out;
-+ -moz-transition: width 0.25s ease-in-out;
-+ -ms-transition: width 0.25s ease-in-out;
-+ transition: width 0.25s ease-in-out;
-+ }
-+
-+ #topactions input[type="search"]:focus {
-+ width: 16em;
-+ }
-+}
-+
+ #topactions input[type="search"]:focus {
+ width: 16em;
+ -webkit-transition: width 0.25s ease-in-out;
+@@
+ transition: width 0.25s ease-in-out;
+ }
+
+ at media (max-width: 900px) {
+ #topactions input {
+ width: 4.7em;
+ }
- }
-
++
++ #topactions input[type="search"]:focus {
++ width: 10em;
++ }
++}
++
#topactions input[type="search"]::-webkit-search-cancel-button {
+ /* hide webkit x button for searches */
+ -webkit-appearance: none;
@@
- padding-left: 0.5em;
padding-right: 0.5em;
vertical-align: middle;
--
+
- width: 10em;
-- -webkit-transition: width 0.25s ease-in-out;
-- -moz-transition: width 0.25s ease-in-out;
-- -ms-transition: width 0.25s ease-in-out;
-- transition: width 0.25s ease-in-out;
- }
-
- @-moz-document url-prefix() {
+ -webkit-transition: width 0.25s ease-in-out;
+ -moz-transition: width 0.25s ease-in-out;
+ -ms-transition: width 0.25s ease-in-out;
@@
#topactions .create-medium { display: block; }
#topactions .create-narrow { display: none; }
@@ -112,3 +91,4 @@
}
div#header h1 {
+
-: ------- > 2: 723b2a4778 Fix topactions input animation overlap
More information about the rt-commit
mailing list