Hide command line instructions when merge form is visible

[CirnoT]

Hides element introduced by #13840 when merge form is visible.

Before:

After:

[CirnoT]

This is done to avoid anchor link right below the button which looks bad and can cause mis-click/tap. There is no easy way to make the element flow inline when form is visible because the neighboring element must also be inline, which form is not (and can not be).

[CirnoT]

This is a draft because .dib applies !important which screws with dynamic hiding of element.

@silverwind any proposed solutions? I imagine this will crop up more and more as these helpers are being used.

[codecov-io]

Codecov Report

Merging #13956 (c646d1d) into master (3285bab) will increase coverage by 0.02%.
The diff coverage is n/a.

@@            Coverage Diff             @@
##           master   #13956      +/-   ##
==========================================
+ Coverage   42.21%   42.23%   +0.02%     
==========================================
  Files         710      710              
  Lines       77226    77233       +7     
==========================================
+ Hits        32600    32621      +21     
+ Misses      39249    39245       -4     
+ Partials     5377     5367      -10     

Impacted Files	Coverage Δ
services/mailer/mail.go	60.21% <0.00%> (-1.08%)	⬇️
services/webhook/webhook.go	52.42% <0.00%> (-1.04%)	⬇️
services/wiki/wiki.go	57.94% <0.00%> (-0.61%)	⬇️
modules/migrations/gitea_uploader.go	6.71% <0.00%> (-0.02%)	⬇️
models/action.go	50.71% <0.00%> (ø)
modules/structs/issue.go	0.00% <0.00%> (ø)
routers/api/v1/utils/hook.go	0.00% <0.00%> (ø)
modules/notification/mail/mail.go	39.08% <0.00%> (ø)
routers/repo/issue.go	38.10% <0.00%> (+0.03%)	⬆️
modules/convert/issue.go	87.40% <0.00%> (+0.09%)	⬆️
... and 6 more

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 3285bab...c646d1d. Read the comment docs.

[zeripath]

This is a draft because .dib applies !important which screws with dynamic hiding of element.

How so? Is this on Firefox? - as it appears to work fine on Chrome.

Would it work better if the element was wrapped in a div that was hidden instead ?

[CirnoT]

Chromium, the .hide() applies style="display: none;" to element but display: inline-block !important; overrides it hence it will always be shown.

Would it work better if the element was wrapped in a div that was hidden instead ?

Won't that screw up with inline styling, which is the whole point of adding dib?

[silverwind]

Chromium, the .hide() applies style="display: none;" to element but display: inline-block !important; overrides it hence it will always be shown.

Would remove the dib class from the element in this case and apply a regular non-important display: inline-block one in Less instead. I think helpers need to stay !important generally, but this is clearly an exception where it's hindering.

[lunny]

ci failed is unrelated and I have restarted it.