terra: myth » telemachus and eucharis, classic goodbyes (few sons are the equal of their fathers)
[personal profile] terra2021-12-23 05:14 pm

[sticky entry] Sticky: Per singulos dies benedicimus te;

Vigils is the icon/coding/&c. workshop of [personal profile] terra. I focus on versatile, modular designs, negative space, and icons from comics nobody reads. Community membership is closed, but all are welcome to follow me here or on plurk.
terra: fandom » ffvi, sassy girls with goggles (fuddy duddy patrol)
[personal profile] terra2027-02-01 09:48 pm

[sticky entry] Sticky: Layout Commissions

DW Layouts

Profiles/CR charts

Plurk Customizations

Misc. Layouts

I am currently taking coding commissions. I am a skilled HTML/CSS codemonkey and an irl poor graduate student looking to help fund my caffeine habit. Stuff I am offering: cr charts, navigation pages, profiles, journal layouts, plurk customizations.


details and commission info )
terra: fandom » marvel, i'm just shocked (is that all?)
[personal profile] terra2019-01-03 01:30 pm

tutorial: custom dw navigation links

The default Dreamwidth navigation module has a lot of stuff in it that might not be relevant to how you use the site and your journal. While it is pretty easy to remove individual items using CSS, you can also customize your navigation menu using the S2 system, which allows you to add new links or change the order of the existing ones.

code and breakdown behind the cut )

This code is borrowed from [personal profile] ninetydegrees, and the original can be found here.

terra: fandom » ffvi, pimp king of figaro (the coin had two faces)
[personal profile] terra2018-06-12 08:58 pm
Entry tags:

icons: 8house, “arclight”

124 arclight icons )

From 8house: Arclight #1-4, by Marian Churchland and Brandon Graham.

terra: fandom » ffvi, elegant amano terra (Default)
[personal profile] terra2018-06-09 07:37 pm

icons: conan, “queen of the black coast”

146 Conan the Barbarian icons )

From Conan the Barbarian, by Brian Wood and Becky Cloonan.

terra: fandom » ffvi, so fearless he mixes primaries (for relics of the past)
[personal profile] terra2018-05-23 08:10 pm
Entry tags:

Plurk Snippet, hiding ads

What it says on the tin, CSS to hide plurk ads on free accounts. Copy and paste this into your plurk stylesheet. Only works when your custom stylesheet is active, so not on the app, and usually not on mobile. Plurk jailbreak will probably help.

.ynative, .resp_banner_ads, .cbox_ads, div.adsense, section.adsense, section.adsense h3, div.cbox_adsx, #resp_banner_ads { display : none !important; height: 0 !important; width: 0 !important; overflow: hidden;_overflow: none; position: fixed; top: -9000px; filter: alpha(opacity=0) !important; opacity: 0 !important; }

I will try to keep this updated, as plurk changes its code periodically.

Edit: Also available as a stylish script, if you can't use the chrome extension.

terra: fandom » ffvi, elegant amano terra (Default)
[personal profile] terra2018-05-23 05:48 pm
Entry tags:

Plurk Layout: “Galaxias”

Many years ago there were several stylesheets available for customizing plurk layouts. That all changed when plurk upgraded and broke everything. Galaxias is a layout that will work with plurk that is, instead of plurk that was.

code and variations below the cut )
terra: fandom » ffvi, pimp king of figaro (the coin had two faces)
[personal profile] terra2018-05-11 08:12 pm

Permissions Post: “Licentia”

This is a pretty simple permissions code using the details tag. It's styled as a permissions post, but could pretty easily be used as a muselist or character profile.

OOC Permissions

Backtagging /   Y/N.

Fourthwalling /   Y/N.

General /   Lorem ipsum dolor sit amet, consectetur adipiscing elit.

IC Permissions

Physical Affection /   Nam cursus ligula in arcu gravida, vitae scelerisque magna vulputate.

Violence /   Praesent sollicitudin odio in leo gravida ultrices. Nam sed dui pretium, elementum ipsum nec, elementum ex.

Psychics /   Quisque eget dolor luctus, imperdiet lectus eu, laoreet massa. Donec iaculis lacus quis felis ultricies venenatis.

Ship Preferences

Shipping (Y) |   Sed porta neque vel tellus pulvinar laoreet sit amet ac odio.

Shipping (N) /   Nam eleifend mi a massa hendrerit aliquet.

Other Stuff /   Nulla semper metus sit amet ipsum cursus, eget suscipit velit pharetra. Pellentesque nec ex a justo accumsan ullamcorper.

Code and Variations behind the cut )
terra: fandom » ffvi, locke cole and the adventures in zebraprint (i prefer the term treasure hunter)
[personal profile] terra2018-04-24 06:21 pm
Entry tags:

Plurk Snippet, username labels

This is something I did at the request of [personal profile] jeeps, an update to the CSS tweak that lets you add a label to a plurk username that appears when you hover over a link. Useful for keeping track of your plurk friends who change their username frequently!

instructions and elaborations below the cut )
terra: fandom » ffvi, elegant amano terra (Default)
[personal profile] terra2017-06-01 01:00 pm

Profile sheet: “Cato”

Code under the cut )

Feel free to modify this however you like, and follow me at [plurk.com profile] vigils for more coding.

terra: fandom » ffvi, locke cole and the adventures in zebraprint (i prefer the term treasure hunter)
[personal profile] terra2017-05-22 06:46 pm

Snippet: Really Simple Muselist

This is just a really simple snippet you can use for a muselist or whatever else. You can see another version of this code here at my personal musebox.

Calliope

Canon Title / Info / Open Post / HMD / Visual /

Clio

Canon Title / Info / Open Post / HMD / Visual /

Erato

Canon Title / Info / Open Post / HMD / Visual /

Code Below the Cut )
terra: (pic#2180719)
[personal profile] terra2017-05-17 02:24 am

Responsive Web Design for Dreamwidth, Pt. II

This is part two of a series on responsive layouts for dreamwidth. Be sure to read part one first, because the stuff I am going to be talking about here won't work very well by default. This is also going to be a little different than my other tutorals, because there's no magic code you can copy and paste to make your layout work better on mobile. Instead, this post is aimed at explaining the basic CSS tools that you need in order to customize your layout.

Once you've configured your viewport, mobile devices will display full-sized layouts instead of zooming out in order to shrink them into a smaller screen. This is good, because it can make text more legible. But it's also bad, because screens are so small, and if you have any large images or absolute positioning, things will break. Luckily, images have a pretty simple fix:

img {max-width: 100%; }

Just copy and paste that into your CSS and all of your images will scale automatically.

divs are more complicated )
terra: fandom » ffvi, not an endorsement of dissidia (imperial witch)
[personal profile] terra2017-04-25 08:54 pm

Responsive Web Design for Dreamwidth, Pt. I

More and more people are using their phones and other mobile devices to access their journals, but dreamwidth doesn't support the most common method of making websites responsive: CSS media queries.

By default dreamwidth doesn't configure the viewport. This means that on most mobile devices, instead of displaying a full-size layout, what you see is a a shrunk down version of what you'd see on a desktop, which is often too tiny to navigate, even if your layout was designed to work well on mobile browsers. To change this behavior, you have to add a meta tag to the <head> section of the code:

<meta name="viewport" content="width=device-width, initial-scale=1">

Simple, right? The trouble is that to add this line of code to the <head> section, we're gonna have to venture into the somewhat arcane S2 system.

Further instructions )
terra: fandom » ffvi, elegant amano terra (Default)
[personal profile] terra2016-09-30 03:00 pm

update: fixing broken images

So, I decided to let one of my old domains lapse in order to save money. The problem: this domain happened to host a lot of the images for my old DW layouts. As a result, a bunch of the images broke, since the URLS now redirect to nothing. The good news is this is a simple thing to fix.

I've updated all the entries on this journal, so you can just copy & paste the "new" versions of your layout.

Or you can fix the images manually by updating the URLs like so, by finding the spoonybard.org domain:

http://spoonybard.org/dwidth/blah/blah.gif

And replacing it with spoony.valiantknife.org, like so:

http://spoony.valiantknife.org/dwidth/blah/blah.gif

Sorry for the inconvenience!

terra: fandom » ffvi, elegant amano terra (Default)
[personal profile] terra2015-01-07 02:33 pm

icons: angela, “nothing for nothing”

32 Angela: Asgard's Assassin icons )

From Angela: Asgard's Assassin, by Marguerite Bennet, Kieron Gillen, and Stéphanie Hans.

terra: fandom » ffvi, elegant amano terra (Default)
[personal profile] terra2014-09-21 12:47 am

icons: ms. marvel, “healing factor”

50 Ms. Marvel icons )

From Ms. Marvel #6-7 by G. Willow Wilson and Jake Wyatt.

terra: fandom » ffvi, elegant amano terra (Default)
[personal profile] terra2014-09-11 11:50 am
Entry tags:

layout: plurk, “gothic”

CSS under the cut )

Feel free to modify this however you like, and follow me at [plurk.com profile] vigils for more coding. This layout uses icons by FamFamFam.

terra: fandom » ffvi, elegant amano terra (Default)
[personal profile] terra2014-08-02 09:59 pm

layout: Blanket, “modernized”

This layout is basically a tweak on a Blacklettered which is itself based off Central. It is very simple and minimal and sans-serif.

CSS under the cut )

Please credit to [personal profile] terra or [community profile] vigils. Feel free to modify/redistribute however you like! You an see some tweaks I've made to the CSS shell (and a header image without the text) here. This layout uses a few icons by Paul Armstrong.

terra: (pic#2180719)
[personal profile] terra2014-07-28 12:11 pm

snippet: visualosities in two floating columns

This is just a quick bit of code because I've been asked a lot how I make my visualosities in two columns, like so. I use two divs and inline css to achieve the column effect with way less code & complication that it would take with a table.

Code behind the cut )
terra: fandom » ffvi, not an endorsement of dissidia (imperial witch)
[personal profile] terra2012-09-05 05:17 pm

layout: Blanket, “blackletter”

This layout is basically a tweak on a previously released layout: Central. But I was using it a lot so I figured I might as well release it! Blackletter is an extremely basic one-column layout that features a fairly flexible header scheme.

CSS under the cut )

Please credit to [personal profile] terra or [community profile] vigils. Feel free to modify/redistribute however you like! You an see some tweaks I've made to the CSS shell (and a header image without the text) here. This layout uses icons by Paul Armstrong, and patterns from Subtle Patterns, both licensed under a Creative Commons Attribution-Share Alike 3.0 United States License.