How can I cange the cstyle of the a (anchor) tag globally?

16 views
Skip to first unread message

Andi Pfaff

unread,
Apr 23, 2013, 1:31:20 AM4/23/13
to maqett...@googlegroups.com
It seems that the style of the a tag is not predefined, it shows blue and underlined which does not really match the given design. Problem is that if I define it as black on white in my own CSS it will not be visible on Android and vice versa. How can I define it like black on white fpr Blackberry/iPhone and white on black on android globally?
 
Best regards
Andi

Bill Reed

unread,
Apr 23, 2013, 9:22:45 AM4/23/13
to maqett...@googlegroups.com
app.css is included by both mobile and desktop html files. Put your anchor rule in app.css save the file and close and reopen the files that use the anchor tags

app.css

a {
color: red;
}
  


--
You received this message because you are subscribed to the Google Groups "Maqetta Users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to maqetta-user...@googlegroups.com.
To post to this group, send email to maqett...@googlegroups.com.
Visit this group at http://groups.google.com/group/maqetta-users?hl=en-US.
For more options, visit https://groups.google.com/groups/opt_out.
 
 

Andi Pfaff

unread,
Apr 23, 2013, 2:29:18 PM4/23/13
to maqett...@googlegroups.com
Thanks, but red is not a good color. Black is better but ist not usable as Android uses a black background.

Jon Ferraiolo

unread,
Apr 23, 2013, 2:59:23 PM4/23/13
to maqett...@googlegroups.com

Andi,
I'll get you figured this out, but if you want black instead of red, of course you just say:

a {
color: black;
}

If you want a different color when the mouse hovers, you can say (e.g., using yellow):

a:hover {
    color:yellow;
}

If you want different styling on different devices, then that's more complicated. For that, you need to change app.js to include a reference to dojo's uacss (user agent css) module, which is described partially at http://dojotoolkit.org/reference-guide/1.8/dojo/uacss.html. For example:

app.js:
--------

require(["dojo/ready", "dojox/mobile/uacss"], function(ready, uacss){
     ready(function(){
         // logic that requires that Dojo is fully initialized should go here
     });
});

Then in app.css:
--------------------

/* for most devices */
a {
    color: red;
}

/* for android */
.dj_android a {
    color:purple;
}

I haven't actually tested this - just looked at the docs.

Jon Ferraiolo
Maqetta team
Reply all
Reply to author
Forward
0 new messages