...that is all.
Journals78
Newest
Not quite self-promotion
1 min read
Want to know how to play Minecraft? My kid made a VERY EDUCATIONAL and NOT AT ALL HILARIOUS tutorial for you.
Join the community to add your comment. Already a deviant? Log In
Escaping your troubles with bcode
1 min read
A not uncommon source of requests for help with journals/comments/etc on DeviantArt is:
The solution to your problems is the completely made up and non-standard tag:
Anything inside a
For instance:
Was literally:
Editing to add: this may get a little messed up if you're using Writer and you expect it to work across paragraphs. It'll work most-reliably if you're using the raw HTML input via ctrl-e.
How can I talk about HTML markup without all that stuff you try to do to help me with markup getting in the way? I don't want things to magically become markup, or get turned into links, or anything like that.
The solution to your problems is the completely made up and non-standard tag:
<bcode>Anything inside a
<bcode> segment will be escaped and URLs won't become links. (The only thing difficult to talk about is For instance:
<img src="https://www.google.com/notanimage.gif">Was literally:
Editing to add: this may get a little messed up if you're using Writer and you expect it to work across paragraphs. It'll work most-reliably if you're using the raw HTML input via ctrl-e.
Join the community to add your comment. Already a deviant? Log In
%hashtags
1 min read
We launched part of tags: the bit where you can edit the ones based on your former keywords.
This is sort of a hard sell. We've put out the bit which requires people to go and clean up their tags... without having launched any of the bits which actually give them any benefit for having done so. Awkward!
In conclusion:
This is sort of a hard sell. We've put out the bit which requires people to go and clean up their tags... without having launched any of the bits which actually give them any benefit for having done so. Awkward!
In conclusion:
Join the community to add your comment. Already a deviant? Log In
Join the community to add your comment. Already a deviant? Log In
Media queries and you
3 min read
First, a quick primer, which probably consists of information that most of you already know.
.text { color: blue; }@mediaonly screen and (max-width:480px) {
.text { color: red; }
}
...suddenly you have blue text at normal resolutions, and red text on a smartphone. Or on a browser which has been resized down to be really narrow.
In fact, try it out on this article! If you resize your window right now to make it narrower, it should magically invert its colors. Madness!
As an example of where this might be particularly useful, let's consider the #hq site update articles with that big ol' sidebar.
It looks like:
If we add this CSS:
@mediaonly screen and (max-width:480px) {
.sidebar { display:none; }
.text { padding-left:33px; }
.gr-box { background-image:none; }
}
It can now look like:
This is awesome, and makes writing skins targeting multiple resolutions far easier. Unfortunately, dA skins don't support it. It'd be a pain to add in support for writing arbitrary media queries, because our CSS parser just plain isn't set up to handle it at the moment.
So we're adding in a way to target mobile resolutions with a special class.
Instead of
@media only screen and (max-width:480px), you'll add a class selector like .da-media[mobile], and it'll be magically transformed onto a media query wrapping that rule.The above example becomes:
.da-media[mobile] .sidebar { display:none; }
.da-media[mobile] .text { padding-left:33px; }
.da-media[mobile] .gr-box { background-image:none; }
Right now
[mobile] is the only media type supported. We may add others in the future, which is why we decided to have it explicitly stated in the current code.A few things to keep in mind:
- It's called "mobile", but that doesn't mean it'll only trigger when you're viewing the mobile version of dA. Anyone with a narrow enough browser window will see it. You can even watch it switching back and forth by resizing your window.
- "Narrow enough" in this case means 767px. We might choose to tweak this value in the future, if it seems to make sense to do so.
- This still won't help with pages like the blog index page, where you can have a pretty wide screen and still be forced into a narrow column.
Enjoy.
Join the community to add your comment. Already a deviant? Log In