Redesign website

This commit is contained in:
Chris Ireland 2015-01-02 23:48:45 +00:00
parent 8c31b0ed43
commit f20633d980
3 changed files with 212 additions and 214 deletions

View File

@ -89,44 +89,10 @@ h4 {
box-shadow: 0 0 1px inset; box-shadow: 0 0 1px inset;
} }
.sideface {
width: 160px;
height: 160px;
display: inline-block;
}
.sideface.Jake0oo0 {
background:url("/avatars/2d5aa9cdaeb049189930461fc9b91cc5?size=160");
}
.sideface.Jake0oo0:hover {
background:url("/avatars/2d5aa9cdaeb049189930461fc9b91cc5?size=160&helm=true");
}
.sideface.redstone_sheep {
background:url("/avatars/ae795aa86327408e92ab25c8a59f3ba1?size=160");
}
.sideface.redstone_sheep:hover {
background:url("/avatars/ae795aa86327408e92ab25c8a59f3ba1?size=160&helm=true");
}
.sideface.Notch {
background:url("/avatars/069a79f444e94726a5befca90e38aaf5?size=160");
}
/* Notch please fid your skin -_-
.sideface.Notch:hover {
background:url("/avatars/069a79f444e94726a5befca90e38aaf5?size=160&helm=true");
}*/
.sideface.sk89q {
background:url("/avatars/0ea8eca3dbf647cc9d1ac64551ca975c?size=160");
}
.sideface.sk89q:hover {
background:url("/avatars/0ea8eca3dbf647cc9d1ac64551ca975c?size=160&helm=true");
}
.sideface.md_5 {
background:url("/avatars/af74a02d19cb445bb07f6866a861f783?size=160");
}
.sideface.md_5:hover {
background:url("/avatars/af74a02d19cb445bb07f6866a861f783?size=160&helm=true");
}
.errmsg { .errmsg {
margin-top: 50px; margin-top: 50px;
} }
.jumbotron img {
margin: 5px;
}

View File

@ -1,192 +1,224 @@
extends layout extends layout
block content block content
.container(style= "margin-top: 70px;") .jumbotron
.row .container
.col-md-10 h1 Crafatar
a(id="crafatar", class="anchor") p A blazing fast API for Minecraft faces!
a(href="#crafatar") img(alt="Jake0oo0's Avatar", height="64", width="64", src="#{domain}/avatars/2d5aa9cdaeb049189930461fc9b91cc5?size=64&helm")
h1 Crafatar img(alt="redstone_sheep's Avatar", height="64", width="64", src="#{domain}/avatars/ae795aa86327408e92ab25c8a59f3ba1?size=64&helm")
hr img(alt="sk89q's Avatar", height="64", width="64", src="#{domain}/avatars/0ea8eca3dbf647cc9d1ac64551ca975c?size=64&helm")
p Welcome to Crafatar, an API for Minecraft's faces! img(alt="md_5's Avatar", height="64", width="64", src="#{domain}/avatars/af74a02d19cb445bb07f6866a861f783?size=64&helm")
img(alt="Jeb's Avatar", height="64", width="64", src="#{domain}/avatars/853c80ef3c3749fdaa49938b674adae6?size=64&helm")
hr img(alt="Notch's Avatar", height="64", width="64", src="#{domain}/avatars/069a79f444e94726a5befca90e38aaf5?size=64")
a(id="documentation", class="anchor") .container
a(href="#documentation") section(id="documentation")
h2 Documentation h2 Documentation
.row
a(id="avatars", class="anchor") section(id="avatars", class="anchor")
a(href="#avatars") a(href="#avatars")
h3 Avatars h3 Avatars
p | Replace
| Replace mark.green id
mark.green id
| with a Mojang <b>UUID</b> or <b>username</b> to get the related head. All images are PNGs. | with a Mojang <b>UUID</b> or <b>username</b> to get the related head. All images are PNGs.
.code .code
| #{domain}/avatars/ | #{domain}/avatars/
mark.green id mark.green id
|
a(id="avatar-parameters", class="anchor") section(id="avatars-parameters" class="anchor")
a(href="#avatar-parameters") a(href="#avatars-parameters")
h3 Avatar Parameters h4 Avatar Parameters
h4 size table(class="table table-bordered table-striped")
p thead
| The size of the image in pixels, #{config.min_size} - #{config.max_size}.<br> tr
| Default is #{config.default_size}. td parameter
h4 default td type
p td default
| The image to be served when the id has no skin (404).<br> td description
| Valid options are tbody
a(href="/avatars/00000000000000000000000000000000?default=steve") steve tr
| , td size
a(href="/avatars/00000000000000000000000000000000?default=alex") alex td integer
| , or a custom URL.<br> td #{config.default_size}
| The standard value is calculated based on the UUID (even = alex, odd = steve). Usernames always default to steve. td The size of the image in pixels, #{config.min_size} - #{config.max_size}.
h4 helm tr
p td default
| Apply the "second" (hat) layer to the avatar.<br> td string
| The content of this parameter is ignored.<br> td The standard value is calculated based on the UUID (even = alex, odd = steve). Usernames always default to steve.
| If you want to get the face only, remove the parameter. td
| The image to be served when the id has no skin (404).<br>
| Valid options are
a(href="/avatars/00000000000000000000000000000000?default=steve") steve
| ,
a(href="/avatars/00000000000000000000000000000000?default=alex") alex
| , or a custom URL.
tr
td helm
td mixed
td null
td Apply the "second" (hat) layer to the avatar.
a(id="skins", class="anchor") section(id="avatars-examples", class="anchor")
a(href="#skins") a(href="#avatars-examples")
h3 Skins h4 Avatars Examples
p p Jeb's avatar by username, default size
| You can also get the full skin file of a player.<br> .code #{domain}/avatars/jeb_
| Replace p Jeb's avatar by UUID, default size
mark.green id .code #{domain}/avatars/853c80ef3c3749fdaa49938b674adae6
| with a Mojang <b>UUID</b> or <b>username</b> to get the related skin.<br> p Jeb's avatar, 64 × 64
| The user's skin is returned, or the default image is served.<br> .code #{domain}/avatars/853c80ef3c3749fdaa49938b674adae6?size=64
| You can use the default parameter here as well. p Jeb's avatar, 64 × 64, with helmet
.code .code #{domain}/avatars/853c80ef3c3749fdaa49938b674adae6?size=64&amp;helm
| #{domain}/skins/ p Jeb's avatar, or fall back to steve
mark.green id .code #{domain}/avatars/853c80ef3c3749fdaa49938b674adae6?default=steve
p
| Jeb's avatar, or fall back to
a(href="https://i.imgur.com/ozszMZV.png") a custom image
.code #{domain}/avatars/853c80ef3c3749fdaa49938b674adae6?default=https%3A%2F%2Fi.imgur.com%2FozszMZV.png
a(id="skin-parameters", class="anchor") section(id="skins" class="anchor")
a(href="#skin-parameters") a(href="#skins")
h3 Skin Parameters h3 Skins
h4 default p
p | You can also get the full skin file of a player.<br>
| Same as the default for avatars. | Replace
mark.green id
| with a Mojang <b>UUID</b> or <b>username</b> to get the related skin.<br>
| The user's skin is returned, or the default image is served.<br>
| You can use the default parameter here as well.
.code
| #{domain}/skins/
mark.green id
a(id="renders", class="anchor") section(id="skins-parameters" class="anchor")
a(href="#renders") a(href="#skins-parameters")
h3 3D Renders h4 Skin Parameters
p table(class="table table-bordered table-striped")
| Crafatar also provides support for 3D renders of Minecraft skins.<br> thead
| Please note that <b>this feature is currently beta</b>!<br> tr
| Replace td parameter
mark.green id td type
| with a Mojang <b>UUID</b> or <b>username</b> to get a render of the skin. td default
| The <b>head</b> render type returns a render of the skin's head. td description
.code tbody
| #{domain}/renders/head/ tr
mark.green id td default
| The <b>body</b> render returns a render of the entire skin. td string
.code td The standard value is calculated based on the UUID (even = alex, odd = steve). Usernames always default to steve.
| #{domain}/renders/body/ td
mark.green id | The image to be served when the id has no skin (404).<br>
| Valid options are
a(href="/skins/00000000000000000000000000000000?default=steve") steve
| ,
a(href="/skins/00000000000000000000000000000000?default=alex") alex
| , or a custom URL.
a(id="render-parameters", class="anchor") section(id="skins-examples", class="anchor")
a(href="#render-parameters") a(href="#skins-examples")
h3 Render Parameters h4 Skins Examples
h4 scale p Jeb's skin
p .code #{domain}/skins/853c80ef3c3749fdaa49938b674adae6
| The scale factor of the image #{config.min_scale} - #{config.max_scale}.<br> p Jeb's skin by username
| Default is #{config.default_scale}. The actual size differs between the type of render. .code #{domain}/skins/jeb_
h4 helm p Render of Jeb's Head
p
| Same as the helm for avatars, but it does not stand out (as it does ingame).
h4 default
p
| Same as the default for avatars.
a(id="http-headers", class="anchor") section(id="renders" class="anchor")
a(href="#http-headers") a(href="#renders")
h3 HTTP headers h3 3D Renders
p p
| Responses come with these HTTP headers, useful for debugging.<br> | Crafatar also provides support for 3D renders of Minecraft skins.<br>
| Please note that these headers are cached by CloudFlare <small>(CF-Cache-Status: HIT)</small>. | Please note that <b>this feature is currently beta</b>!<br>
| Replace
mark.green id
| with a Mojang <b>UUID</b> or <b>username</b> to get a render of the skin.
| The <b>head</b> render type returns a render of the skin's head.
.code
| #{domain}/renders/head/
mark.green id
| The <b>body</b> render returns a render of the entire skin.
.code
| #{domain}/renders/body/
mark.green id
a(id="response-time", class="anchor") section(id="renders-parameters" class="anchor")
a(href="#response-time") a(href="#renders-parameters")
h4 Response-Time h4 Render Parameters
p The time, in milliseconds, it took Crafatar to process the request. table(class="table table-bordered table-striped")
a(id="x-storage-type", class="anchor") thead
a(href="#x-storage-type") tr
h4 X-Storage-Type td parameter
ul td type
li <b>none</b>: No external requests. Cached: User has no skin. td default
li <b>cached</b>: No external requests. Skin cached and stored locally. td description
li tbody
| <b>checked</b>: 1 external request. Skin cached, checked for updates, no skin downloaded.<br> tr
| This happens either when the user removed their skin or when it didn't change. td scale
li <b>downloaded</b>: 2 external requests. Skin changed or unknown, downloaded. td integer
li td #{config.default_scale}. The actual size differs between the type of render.
| <b>error</b>: This can happen, for example, when Mojang's servers are down.<br> td The scale factor of the image #{config.min_scale} - #{config.max_scale}.
| If possible, an outdated image is served instead. tr
td helm
td mixed
td null
td Apply the "second" (hat) layer to the avatar.
a(id="about-usernames", class="anchor") section(id="renders-examples", class="anchor")
a(href="#about-usernames") a(href="#renders-examples")
h3 About usernames h4 Render Examples
p .code #{domain}/renders/head/853c80ef3c3749fdaa49938b674adae6
| We strongly advise you to use UUIDs instead of usernames in production.<br> p Render of Jeb's Body, with helmet, by username
| Usernames are deprecated by Mojang and you should only use usernames for testing.<br> .code #{domain}/renders/body/jeb_?helm
| Malformed usernames are rejected.
a(id="about-uuids", class="anchor") section(id="meta" class="anchor")
a(href="#about-uuids") section(id="meta-http-headers" class="anchor")
h3 About UUIDs a(href="#meta-http-headers")
p h3 HTTP Headers
| UUIDs may use the blank or dashed format.<br> p
| Malformed UUIDs are rejected. | Responses come with these HTTP headers, useful for debugging.<br>
| Please note that these headers are cached by CloudFlare <small>(CF-Cache-Status: HIT)</small>.
a(id="about-caching", class="anchor") section(id="meta-response-time" class="anchor")
a(href="#about-caching") a(href="#meta-response-time")
h3 About caching h4 Response-Time
p p The time, in milliseconds, it took Crafatar to process the request.
| Crafatar caches skins for #{config.local_cache_time/60} minutes before checking for skin changes.<br>
| Images are cached in your browser for #{config.browser_cache_time/60} minutes until a new request to Crafatar is made.<br>
| When you changed your skin you can try clearing your browser cache to see the change faster.
section(id="meta-x-storage-type" class="anchor")
a(href="#meta-x-storage-type")
h4 X-Storage-Type
ul
li <b>none</b>: No external requests. Cached: User has no skin.
li <b>cached</b>: No external requests. Skin cached and stored locally.
li
| <b>checked</b>: 1 external request. Skin cached, checked for updates, no skin downloaded.<br>
| This happens either when the user removed their skin or when it didn't change.
li <b>downloaded</b>: 2 external requests. Skin changed or unknown, downloaded.
li
| <b>error</b>: This can happen, for example, when Mojang's servers are down.<br>
| If possible, an outdated image is served instead.
a(id="examples", class="anchor") section(id="meta-about-usernames" class="anchor")
a(href="#examples") a(href="#meta-about-usernames")
h3 Examples h3 About Usernames
p
| We strongly advise you to use UUIDs instead of usernames in production.<br>
| Usernames are deprecated by Mojang and you should only use usernames for testing.<br>
| Malformed usernames are rejected.
h4 Avatars section(id="meta-about-uuids" class="anchor")
p Jeb's avatar by username, default size a(href="#meta-about-uuids")
.code #{domain}/avatars/jeb_ h3 About UUIDs
p Jeb's avatar by UUID, default size p
.code #{domain}/avatars/853c80ef3c3749fdaa49938b674adae6 | UUIDs may use the blank or dashed format.<br>
p Jeb's avatar, 64 × 64 | Malformed UUIDs are rejected.
.code #{domain}/avatars/853c80ef3c3749fdaa49938b674adae6?size=64
p Jeb's avatar, 64 × 64, with helmet
.code #{domain}/avatars/853c80ef3c3749fdaa49938b674adae6?size=64&amp;helm
p Jeb's avatar, or fall back to steve
.code #{domain}/avatars/853c80ef3c3749fdaa49938b674adae6?default=steve
p
| Jeb's avatar, or fall back to
a(href="https://i.imgur.com/ozszMZV.png") a custom image
.code #{domain}/avatars/853c80ef3c3749fdaa49938b674adae6?default=https%3A%2F%2Fi.imgur.com%2FozszMZV.png
h4 Skins section(id="meta-about-caching" class="anchor")
p Jeb's skin a(href="#meta-about-caching")
.code #{domain}/skins/853c80ef3c3749fdaa49938b674adae6 h3 About Caching
p Jeb's skin by username p
.code #{domain}/skins/jeb_ | Crafatar caches skins for #{config.local_cache_time/60} minutes before checking for skin changes.<br>
p Render of Jeb's Head | Images are cached in your browser for #{config.browser_cache_time/60} minutes until a new request to Crafatar is made.<br>
| When you changed your skin you can try clearing your browser cache to see the change faster.
h4 Renders footer
.code #{domain}/renders/head/853c80ef3c3749fdaa49938b674adae6 hr
p Render of Jeb's Body, with helmet, by username p(class="pull-right") Copyright Craftatar 2014
.code #{domain}/renders/body/jeb_?helm
.col-md-2.center
.sideface.redstone_sheep(title="redstone_sheep")
.sideface.Jake0oo0(title="Jake0oo0")
.sideface.Notch(title="Notch")
.sideface.sk89q(title="sk89q")
.sideface.md_5(title="md_5")

View File

@ -3,7 +3,7 @@ html
head head
title= title title= title
link(rel="icon", sizes="16x16", type="image/png", href="/favicon.png") link(rel="icon", sizes="16x16", type="image/png", href="/favicon.png")
link(href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.0/css/bootstrap.min.css", rel="stylesheet") link(href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.1/css/bootstrap.min.css", rel="stylesheet")
link(rel="stylesheet", href="/stylesheets/style.css") link(rel="stylesheet", href="/stylesheets/style.css")
meta(name="description", content="Crafatar is a Minecraft avatar service with support for avatars, skins, and even renders!") meta(name="description", content="Crafatar is a Minecraft avatar service with support for avatars, skins, and even renders!")
meta(name="keywords", content="minecraft, avatar, renders, skins, uuid, username") meta(name="keywords", content="minecraft, avatar, renders, skins, uuid, username")
@ -16,4 +16,4 @@ html
a.navbar-brand(href="/") Crafatar a.navbar-brand(href="/") Crafatar
.navbar-header .navbar-header
a.navbar-brand.twitter(href="https://twitter.com/Crafatar", target="_blank") crafatar a.navbar-brand.twitter(href="https://twitter.com/Crafatar", target="_blank") crafatar
block content block content