How do I hide Comala Workflows' banner button that pops up on page request

[Stan Ry]

Howdy,

I'd like to hide the annoying Comala's icon that pops out every time you refresh the page, runs all the way right-to the left and then hides itself.

I looks so irritating that my users are going to assesinate me if only I leave this intact. :)

The button looks as:

data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB2aWV3Qm94PSIwIDAgOTkuODkgMTQyLjMzIj4KCTx0aXRsZT5Xb3JrZmxvdzwvdGl0bGU+Cgk8cGF0aCBkPSJNNzEuMTcsNDkuOTRhMjEuNzcsMjEuNzcsMCwwLDAtNC42Ny41M0w0OS40MSwzMy4zOGEyMSwyMSwwLDAsMCwuNTMtNC42NkEyMS4yOCwyMS4yOCwwLDEsMCwzMy4zOCw0OS40MWwxNy4wOSwxNy4xYTIwLjc1LDIwLjc1LDAsMCwwLDAsOS4zMkwzMy4zOCw5Mi45MmEyMS4yOCwyMS4yOCwwLDEsMCwxNiwxNkw2Ni41LDkxLjg2YTIxLjIyLDIxLjIyLDAsMSwwLDQuNjctNDEuOTJaIiBzdHlsZT0iZmlsbDojZmZmO3N0cm9rZTojZmZmO3N0cm9rZS1taXRlcmxpbWl0OjEwO3N0cm9rZS13aWR0aDoxNXB4Ii8+Cgk8cGF0aCBkPSJNNzEuMTYsNTBBMjEuMjMsMjEuMjMsMCwwLDAsNDkuOTQsNzEuMjZhMjEuNywyMS43LDAsMCwwLC41Miw0LjY3TDM4LjEzLDg4LjI2QTI3LjU5LDI3LjU5LDAsMCwxLDU0LjQ1LDEwNGwxMi0xMmEyMS42NywyMS42NywwLDAsMCw0LjY2LjUxLDIxLjIyLDIxLjIyLDAsMSwwLDAtNDIuNDRabTUuNzYsMzEuNTFoMGwtLjQ0LjIzTDc2LDgybC0uNDMuMTljLS4yNi4xMS0uNTMuMi0uOC4yOWwtLjM2LjExLS43My4xOS0uMjQsMGMtLjMyLjA3LS42NS4xMi0xLC4xNmwtLjI3LDBjLS4zNiwwLS43MS4wNi0xLjA3LjA2YTExLjgxLDExLjgxLDAsMCwxLTExLjc5LTExLjhjMC0uMzUsMC0uNzEuMDYtMS4wNmwwLS4yN2E4LDgsMCwwLDEsLjE1LTFjMC0uMDgsMC0uMTcsMC0uMjUuMDYtLjI0LjEyLS40OC4xOS0uNzFzLjA3LS4yNi4xMS0uMzguMTgtLjUzLjI5LS43OS4xMy0uMjkuMi0uNDQuMTMtLjI4LjItLjQybC4yMy0uNDVoMGExMS43OSwxMS43OSwwLDEsMSwxNiwxNloiIHN0eWxlPSJmaWxsOiM3MTcwNzAiLz4KCTxwYXRoIGQ9Ik02MC43OSw5Ny42OEEzNi4wNywzNi4wNywwLDAsMCw0NC41NSw4MS44NGwtNi40Miw2LjQyQTI3LjU5LDI3LjU5LDAsMCwxLDU0LjQ1LDEwNFoiIHN0eWxlPSJmaWxsOiM3MTcwNzAiLz4KCTxwYXRoIGQ9Ik0yOC43Miw5Mi40OGEyMS4yMywyMS4yMywwLDEsMCwyMS4yMiwyMS4yM0EyMS4yMywyMS4yMywwLDAsMCwyOC43Miw5Mi40OFptMCwzM2ExMS43OSwxMS43OSwwLDEsMSwxMS43OS0xMS43OUExMS44LDExLjgsMCwwLDEsMjguNzIsMTI1LjVaIiBzdHlsZT0iZmlsbDojNzE3MDcwIi8+Cgk8cGF0aCBkPSJNNDkuNDIsMzMuNDlhMjEuMjIsMjEuMjIsMCwxLDAtMTYsMTZsMTIsMTIuMDZhMjcuNTQsMjcuNTQsMCwwLDEsMTYtMTZaTTE2LjkzLDI4LjgyQTExLjc5LDExLjc5LDAsMCwxLDM5LDIzLjA3aDBjLjA3LjE0LjE0LjI5LjIyLjQzbC4yMi40NS4xOC40MmMuMTEuMjYuMjEuNTMuMy44LDAsLjEyLjA3LjI1LjExLjM3cy4xMy40OC4xOC43MmExLjgzLDEuODMsMCwwLDEsLjA2LjI1Yy4wNy4zMi4xMS42NS4xNSwxbDAsLjI3YzAsLjM1LDAsLjcsMCwxLjA2QTExLjgsMTEuOCwwLDAsMSwyOC43Miw0MC42MWMtLjM2LDAtLjcxLDAtMS4wNiwwbC0uMjcsMGMtLjMzLDAtLjY2LS4wOC0xLS4xNWwtLjI0LS4wNS0uNzMtLjE5TDI1LjA3LDQwYy0uMjctLjA5LS41NC0uMTktLjgtLjNsLS40MS0uMTgtLjQ2LS4yMkwyMywzOS4xMUExMS43OSwxMS43OSwwLDAsMSwxNi45MywyOC44MloiIHN0eWxlPSJmaWxsOiM3MTcwNzAiLz4KCTxwYXRoIGQ9Ik02MS40Nyw0NS41NGwtNi4zOC02LjM4YTM2LDM2LDAsMCwwLTE2LDE2bDYuMzgsNi4zN0EyNy41NSwyNy41NSwwLDAsMSw2MS40Nyw0NS41NFoiIHN0eWxlPSJmaWxsOiM3MTcwNzAiLz4KCjwvc3ZnPg==

 And here it is before it gets hidden:

And it hides away because it is an instance of the 'hidden' class:

<a href="/wiki" title="Workflow Information" id="adhocWorkflowsInfoBanner" class="hidden"><span>Workflow</span></a>

The CSS they use looks as

#adhocWorkflowsInfoBanner {

padding-left: 18px;

background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiI…41NSwwLDAsMSw2MS40Nyw0NS41NFoiIHN0eWxlPSJmaWxsOiM3MTcwNzAiLz4KCjwvc3ZnPg==)!important;

background-repeat: no-repeat!important;

background-position: 3px center!important;

background-size: 16px 16px!important;

(oh, why do they use the !important flag by the way, I've heard it isn't a good coding practice.)

I was going to use this script on the page:

<script type="text/javascript">
(function($) {
  $('#adhocWorkflowsInfoBanner').remove();
 })(AJS.$); 
</script>

But it didn't work out because it seems like the function is invoked after the button hides away.

Is there any way I could hide this button from appearing when the users refresh the page?

I am in no way a developer and that's pretty much one of the first scripts I am have ever written...

Thank you. 

[Steven F Behnke]

Perhaps this would work? CSS doesn't wait to execute like Javascript does.

<style>
  #adhocWorkflowsInfoBanner {
    display:none;
  }
</style>