azures04/crafatar
1
0
Fork 0
mirror of https://github.com/azures04/crafatar.git synced 2026-03-22 07:51:17 +01:00
Code Issues Packages Projects Releases Wiki Activity

add preview placeholder

Browse Source
This commit is contained in:
jomo 2015-01-03 05:14:50 +01:00
parent a81c3c9de4
commit 756ede7d83
2 changed files with 20 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
public/stylesheets/style.css
View File

@ -108,7 +108,7 @@ h4 {
height: 220px; height: 220px;
} }
.code .example-wrapper .preview { .code .example-wrapper .preview, .code .preview-placeholder {
display: none; display: none;
width: 100%; width: 100%;
position: absolute; position: absolute;
@ -122,6 +122,19 @@ h4 {
color: #666; color: #666;
} }
.code .preview-placeholder {
display: block;
}
.code .preview-placeholder:hover {
/* fixes glitchy blinking */
display: block !important;
}
.code:hover .preview-placeholder {
display: none;
}
.code .example-wrapper .preview i { .code .example-wrapper .preview i {
color: #aaa; color: #aaa;
} }

6
views/index.jade
View File

@ -101,6 +101,8 @@ block content
.example #{domain}/avatars/jeb_?default=https://i.imgur.com/ocJVWAc.png .example #{domain}/avatars/jeb_?default=https://i.imgur.com/ocJVWAc.png
p.preview p.preview
| Jeb's avatar, or fall back to a custom image <i>(this example assumes jeb_ does not exist)</i> | Jeb's avatar, or fall back to a custom image <i>(this example assumes jeb_ does not exist)</i>
p.preview-placeholder
| Hover one the examples for a preview!
.preview-background .preview-background
@ -157,6 +159,8 @@ block content
#render-example-2.example-wrapper #render-example-2.example-wrapper
.example #{domain}/renders/head/853c80ef3c3749fdaa49938b674adae6?scale=8 .example #{domain}/renders/head/853c80ef3c3749fdaa49938b674adae6?scale=8
p.preview Jeb's head, by UUID, scale 8 p.preview Jeb's head, by UUID, scale 8
p.preview-placeholder
| Hover one the examples for a preview!
.preview-background .preview-background
@ -212,6 +216,8 @@ block content
#skin-example-2.example-wrapper #skin-example-2.example-wrapper
.example #{domain}/skins/jeb_?default=alex .example #{domain}/skins/jeb_?default=alex
p.preview Jeb's skin, or fall back to alex <i>(this example assumes jeb_ does not exist)</i> p.preview Jeb's skin, or fall back to alex <i>(this example assumes jeb_ does not exist)</i>
p.preview-placeholder
| Hover one the examples for a preview!
.preview-background .preview-background