CODEWITHSUNDEEP
javascriptcssfirefox
Belaviyo
Belaviyo

Reputation: 187

Detecting Firefox Australis from CSS or JavaScript

Since Firefox Australis is now on Nightly channel, I want to make my addon compatible with this new UI. I was wondering how I can detect if user is on Firefox Australis from both CSS and JavaScript. For CSS part I am interested to optimize my toolbar icon such that it is compatible with older versions of Firefox as well.

Upvotes: 2

Views: 248

Answers (4)

sasa10
sasa10

Reputation: 1

@-moz-document url-prefix() {

    //Element to style

}

Upvotes: 0

user3011750
user3011750

Reputation: 33

Run in the Chrome context

if(document.querySelector("#PanelUI-popup")){
  //Australis code
}

Upvotes: 0

Rob M.
Rob M.

Reputation: 36521

This should accomplish what you are trying to do. If the user agent has Firefox/28 add the class 'firefox-australis' to the body. Then you can target that class in CSS.

<script>
var is_australis = false;
// if the user agent contains Firefox/28, we can assume it's australis
if(navigator.userAgent.match(/Firefox\/28/)){
    var version = parseInt(navigator.userAgent.match(/Firefox\/([0-9]*)/)[1]);
    // should be self-explanatory
    if(version < 28){ return; }
    var body = document.getElementsByTagName('body')[0]
    ,   classes = body.getAttribute('class');

    // add the class 'firefox-australis' to the body tag
    body.setAttribute('class', ' firefox-australis');
    // save for reference in JS
    is_australis = true;
}
</script>
<style>
/* Target Australis */
body.firefox-australis{
    background-color:#000;
    color:#fff;
}
</style>

Upvotes: 0

paa
paa

Reputation: 5054

From (privileged) JavaScript

if("gCustomizeMode" in window){
  //Australis code
}

Upvotes: 2

Related Questions