Restructure static files into a single directory
This commit is contained in:
Andrew Miner
@@ -0,0 +1,14 @@
|
||||
/*
|
||||
Crafting Guide - addthis.scss
|
||||
|
||||
Copyright (C) 2015 by Redwood Labs
|
||||
All rights reserved.
|
||||
*/
|
||||
|
||||
.addthis_sharing_toolbox {
|
||||
position: absolute; top: 0.65em; right: 0.65em;
|
||||
|
||||
div {
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,93 @@
|
||||
/*
|
||||
Crafting Guide - classes.scss
|
||||
|
||||
Copyright (C) 2015 by Redwood Labs
|
||||
All rights reserved.
|
||||
*/
|
||||
|
||||
.adsbygoogle {
|
||||
margin-top: 3em;
|
||||
}
|
||||
|
||||
.centered {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.content {
|
||||
background: $color-content;
|
||||
box-shadow: 10px 10px 20px #666;
|
||||
margin: 2em auto;
|
||||
max-width: 96em;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.error { background: $color-error !important; }
|
||||
|
||||
.error-new { background: $color-error-new !important; }
|
||||
|
||||
.sidebar {
|
||||
position: relative; width: 18.75%;
|
||||
|
||||
display: inline-block;
|
||||
padding: 1em;
|
||||
vertical-align: top;
|
||||
|
||||
.titleImage {
|
||||
margin-bottom: 2em;
|
||||
|
||||
a {
|
||||
img {
|
||||
position: relative; width: 16em; min-height: 16em;
|
||||
@include pixel-image;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.externalLink {
|
||||
position: relative; width: 80%;
|
||||
margin: 0.5em 10%;
|
||||
display: none;
|
||||
|
||||
p {
|
||||
font-family: $font-family-normal;
|
||||
font-size: $font-size-normal;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mainBody {
|
||||
position: relative; width: 81.25%;
|
||||
|
||||
display: inline-block;
|
||||
padding: 1em;
|
||||
padding-top: 2em;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.section {
|
||||
margin-top: 3em;
|
||||
|
||||
h2 {
|
||||
font-family: $font-family-header;
|
||||
font-size: $font-size-large;
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-family: $font-family-header;
|
||||
font-size: $font-size-normal;
|
||||
margin: 2em 0 0 0.5em;
|
||||
}
|
||||
|
||||
.entry {
|
||||
position: relative; width: 100%;
|
||||
padding: 0 2em;
|
||||
}
|
||||
|
||||
.panel {
|
||||
background: white;
|
||||
padding: 1em;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,93 @@
|
||||
/*
|
||||
Crafting Guide - main.scss
|
||||
|
||||
Copyright (c) 2014-2015 by Redwood Labs
|
||||
All rights reserved.
|
||||
*/
|
||||
|
||||
@import 'mixins';
|
||||
@import 'reset';
|
||||
|
||||
// Fonts ///////////////////////////////////////////////////////////////////////////////////////////////////////////////
|
||||
|
||||
@font-face {
|
||||
font-family: 'PressStart';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url('/fonts/press_start.ttf') format('truetype');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Silkscreen';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url('/fonts/silkscreen.ttf') format('truetype');
|
||||
}
|
||||
|
||||
// Constants ///////////////////////////////////////////////////////////////////////////////////////////////////////////
|
||||
|
||||
// Animation Speeds ////////////////////////////////////////////////////////////////////////////////
|
||||
|
||||
$animate-fast: 0.1s;
|
||||
$animate-normal: 0.25s;
|
||||
$animate-slow: 0.6s;
|
||||
|
||||
// Font Faces //////////////////////////////////////////////////////////////////////////////////////
|
||||
|
||||
$font-family-header: 'Silkscreen';
|
||||
$font-family-normal: sans-serif;
|
||||
$font-family-input: monospace;
|
||||
|
||||
// Font Sizes //////////////////////////////////////////////////////////////////////////////////////
|
||||
|
||||
$font-size-small: 1.0em;
|
||||
$font-size-normal: 1.5em;
|
||||
$font-size-large: 2.0em;
|
||||
$font-size-x-large: 3.0em;
|
||||
$font-size-xx-large: 4.0em;
|
||||
|
||||
// Gray Palette ////////////////////////////////////////////////////////////////////////////////////
|
||||
|
||||
$color-gray-faint: #F2F2F2;
|
||||
$color-gray-light: #CCCCCC;
|
||||
$color-gray-medium: #A6A6A6;
|
||||
$color-gray-dark: #8B8B8B;
|
||||
$color-gray-shadow: #444444;
|
||||
|
||||
// Object Background Colors ////////////////////////////////////////////////////////////////////////
|
||||
|
||||
$color-bedrock: #0A0A0A;
|
||||
$color-brick-dark: #7A7A7A;
|
||||
$color-brick-light: #D9D9D9;
|
||||
$color-dirt: #906647;
|
||||
$color-ice: #8AA7E6;
|
||||
|
||||
// Style Colors ////////////////////////////////////////////////////////////////////////////////////
|
||||
|
||||
$color-active: #5C8AE6;
|
||||
$color-active-hover: #2E6BE6;
|
||||
$color-background: #AAC9FF;
|
||||
$color-background-panel: #FFFFFF;
|
||||
$color-background-toolbar: rgba(255, 255, 255, 0.75);
|
||||
$color-content: rgba(230, 230, 230, 0.90);
|
||||
$color-error: #F3C2C2;
|
||||
$color-error-new: #CD0000;
|
||||
$color-footer: #3D1D09;
|
||||
$color-footer-text: #FFFFFF;
|
||||
$color-link: #0000FF;
|
||||
$color-text: #000000;
|
||||
|
||||
// Z-Index Layers //////////////////////////////////////////////////////////////////////////////////
|
||||
|
||||
$layer-normal: 100;
|
||||
$layer-screen: 500;
|
||||
$layer-dialog: 1000;
|
||||
|
||||
// Child Stylesheets ///////////////////////////////////////////////////////////////////////////////////////////////////
|
||||
|
||||
@import 'classes';
|
||||
@import 'tags';
|
||||
@import 'views';
|
||||
|
||||
@import 'templates/index';
|
||||
@import 'addthis';
|
||||
@@ -0,0 +1,34 @@
|
||||
/*
|
||||
Crafting Guide - mixins.scss
|
||||
|
||||
Copyright (c) 2014-2015 by Redwood Labs
|
||||
All rights reserved.
|
||||
*/
|
||||
|
||||
@mixin box-sizing($value) {
|
||||
-moz-box-sizing: $value;
|
||||
-webkit-box-sizing: $value;
|
||||
box-sizing: $value;
|
||||
}
|
||||
|
||||
@mixin center-vertical {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
@include transform(translateY(-50%));
|
||||
}
|
||||
|
||||
@mixin transform($transforms) {
|
||||
-moz-transform: $transforms;
|
||||
-o-transform: $transforms;
|
||||
-ms-transform: $transforms;
|
||||
-webkit-transform: $transforms;
|
||||
transform: $transforms;
|
||||
}
|
||||
|
||||
@mixin pixel-image {
|
||||
image-rendering: -moz-crisp-edges; /* Firefox */
|
||||
image-rendering: -o-crisp-edges; /* Opera */
|
||||
image-rendering: -webkit-optimize-contrast; /* Webkit (non-standard naming) */
|
||||
image-rendering: crisp-edges;
|
||||
-ms-interpolation-mode: nearest-neighbor; /* IE (non-standard property) */
|
||||
}
|
||||
@@ -0,0 +1,76 @@
|
||||
a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,dialog,div,dl,dt,em,embed,fieldset,figcaption,figure,font,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,hr,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,meter,nav,object,ol,output,p,pre,progress,q,rp,rt,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,textarea,tfoot,th,thead,time,td,tr,tt,u,ul,var,video,xmp {
|
||||
border: 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-size: 100%;
|
||||
@include box-sizing(border-box);
|
||||
}
|
||||
|
||||
html,body {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
|
||||
display: block;
|
||||
}
|
||||
|
||||
b,strong {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
img {
|
||||
color: transparent;
|
||||
vertical-align: middle;
|
||||
-ms-interpolation-mode: bicubic;
|
||||
}
|
||||
|
||||
ol,ul {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
li {
|
||||
display: list-item;
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
}
|
||||
|
||||
th,td,caption {
|
||||
font-weight: normal;
|
||||
vertical-align: top;
|
||||
text-align: left;
|
||||
@include box-sizing(border-box);
|
||||
}
|
||||
|
||||
q {
|
||||
quotes: none;
|
||||
}
|
||||
|
||||
q:before,q:after {
|
||||
content: '';
|
||||
content: none;
|
||||
}
|
||||
|
||||
sub,sup,small {
|
||||
font-size: 75%;
|
||||
}
|
||||
|
||||
sub,sup {
|
||||
line-height: 0;
|
||||
position: relative;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
sub {
|
||||
bottom: -0.25em;
|
||||
}
|
||||
|
||||
sup {
|
||||
top: -0.5em;
|
||||
}
|
||||
|
||||
svg {
|
||||
overflow: hidden;
|
||||
}
|
||||
@@ -0,0 +1,89 @@
|
||||
/*
|
||||
Crafting Guide - tags.scss
|
||||
|
||||
Copyright (C) 2015 by Redwood Labs
|
||||
All rights reserved.
|
||||
*/
|
||||
|
||||
body {
|
||||
background: $color-background url('/images/ice.png');
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
button {
|
||||
background: $color-gray-faint;
|
||||
border: 0.1em solid $color-gray-medium;
|
||||
border-radius: 1em;
|
||||
color: $color-active;
|
||||
cursor: pointer;
|
||||
font-size: $font-size-normal;
|
||||
font-weight: bold;
|
||||
padding: 0.1em 1em;
|
||||
|
||||
&:hover {
|
||||
background: white;
|
||||
color: $color-active-hover;
|
||||
}
|
||||
}
|
||||
|
||||
h1 {
|
||||
margin-bottom: 1em;
|
||||
|
||||
& > * {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
img {
|
||||
height: 6.4em; width: 6.4em;
|
||||
margin-right: 1em;
|
||||
}
|
||||
|
||||
p {
|
||||
font-family: $font-family-header;
|
||||
font-size: $font-size-xx-large;
|
||||
}
|
||||
}
|
||||
|
||||
h2 {
|
||||
margin-bottom: 0.5em;
|
||||
|
||||
& > * {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
img {
|
||||
height: 3.2em; width: 3.2em;
|
||||
margin-right: 1em;
|
||||
}
|
||||
|
||||
p {
|
||||
font-family: $font-family-header;
|
||||
font-size: $font-size-x-large;
|
||||
}
|
||||
}
|
||||
|
||||
h3 {
|
||||
margin-bottom: 0.5em;
|
||||
|
||||
p {
|
||||
font-family: $font-family-header;
|
||||
font-size: $font-size-normal;
|
||||
}
|
||||
}
|
||||
|
||||
p {
|
||||
font-family: $font-family-normal;
|
||||
font-size: $font-size-normal;
|
||||
}
|
||||
|
||||
input {
|
||||
font-family: $font-family-input;
|
||||
font-size: $font-size-normal;
|
||||
}
|
||||
|
||||
label {
|
||||
font-family: $font-family-normal;
|
||||
font-size: $font-size-normal;
|
||||
}
|
||||
@@ -0,0 +1,14 @@
|
||||
/*
|
||||
Crafting Guide - browse_page.scss
|
||||
|
||||
Copyright (C) 2015 by Redwood Labs
|
||||
All rights reserved.
|
||||
*/
|
||||
|
||||
.view__browse_page {
|
||||
|
||||
.view__mod {
|
||||
margin: 0 1em 1em 0;
|
||||
width: 37em;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,26 @@
|
||||
/*
|
||||
Crafting Guide - craft_page.scss
|
||||
|
||||
Copyright (c) 2014-2015 by Redwood Labs
|
||||
All rights reserved.
|
||||
*/
|
||||
|
||||
.view__craft_page {
|
||||
|
||||
& > div {
|
||||
display: inline-block;
|
||||
margin-top: 2em;
|
||||
padding: 0 2em;
|
||||
position: relative;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.view__inventory { width: 50%; height: 30em; }
|
||||
|
||||
.view__crafting_table { width: 50%; height: 30em; }
|
||||
|
||||
.want label {
|
||||
position: absolute; top: 50%; left: 0.5em;
|
||||
@include transform(translateY(-50%));
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,21 @@
|
||||
/*
|
||||
Crafting Table - crafting_grid.scss
|
||||
|
||||
Copyright (c) 2014-2015 by Redwood Labs
|
||||
All rights reserved.
|
||||
*/
|
||||
|
||||
.view__crafting_grid {
|
||||
border: 0.2em solid $color-gray-medium;
|
||||
|
||||
img {
|
||||
position: relative; height:4.8em; width: 4.8em;
|
||||
}
|
||||
|
||||
td {
|
||||
height: 4.8em; width: 4.8em;
|
||||
background: $color-gray-faint;
|
||||
border: 0.1em solid $color-gray-light;
|
||||
padding: 0.1em;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,62 @@
|
||||
/*
|
||||
Crafting Table - crafting_table.scss
|
||||
|
||||
Copyright (c) 2014-2015 by Redwood Labs
|
||||
All rights reserved.
|
||||
*/
|
||||
|
||||
.view__crafting_table {
|
||||
min-height: 14em;
|
||||
width: 100%;
|
||||
|
||||
.panel {
|
||||
position: absolute; top: 3.6em; right: 2em; bottom: 0; left: 2em;
|
||||
background: $color-background-panel;
|
||||
|
||||
.next {
|
||||
background: url('/images/arrow-right-disabled.png');
|
||||
position: absolute; top: 50%; right: 1em; height: 8em; width: 4em;
|
||||
@include transform(translateY(-50%));
|
||||
|
||||
&.enabled {
|
||||
background: url('/images/arrow-right.png');
|
||||
cursor: pointer;
|
||||
|
||||
&:hover { background: url('/images/arrow-right-hover.png'); }
|
||||
}
|
||||
}
|
||||
|
||||
.view__minimal_recipe {
|
||||
position: absolute; top: 50%; left: 50%;
|
||||
@include transform(translate(-50%, -50%));
|
||||
}
|
||||
|
||||
.prev {
|
||||
background: url('/images/arrow-left-disabled.png');
|
||||
position: absolute; top: 50%; left: 1em; height: 8em; width: 4em;
|
||||
@include transform(translateY(-50%));
|
||||
|
||||
&.enabled {
|
||||
background: url('/images/arrow-left.png');
|
||||
cursor: pointer;
|
||||
|
||||
&:hover { background: url('/images/arrow-left-hover.png'); }
|
||||
}
|
||||
}
|
||||
|
||||
.problem {
|
||||
position: absolute; bottom: 1em; right: 1em;
|
||||
|
||||
a {
|
||||
color: $color-gray-light;
|
||||
cursor: pointer;
|
||||
font-size: $font-size-normal;
|
||||
text-decoration: underline;
|
||||
|
||||
&:hover {
|
||||
color: $color-gray-medium;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,84 @@
|
||||
/*
|
||||
Crafting Guide - feedback.scss
|
||||
|
||||
Copyright (c) 2014 by Redwood Labs
|
||||
All rights reserved.
|
||||
*/
|
||||
|
||||
.view__feedback {
|
||||
position: fixed; top: 50%; left: -30em; width: 25em;
|
||||
@include transform(translateY(-50%));
|
||||
|
||||
background: white;
|
||||
border: 0.2em solid $color-gray-dark;
|
||||
border-left: 0;
|
||||
border-right: 0.1em solid $color-gray-faint;
|
||||
box-size: border-box;
|
||||
box-shadow: 0.3em 0.3em 0.6em 0 $color-gray-shadow;
|
||||
padding: 2em;
|
||||
z-index: $layer-dialog;
|
||||
|
||||
.error {
|
||||
background: white;
|
||||
clear: both;
|
||||
display: none;
|
||||
margin-top: 4em;
|
||||
text-align: center;
|
||||
|
||||
p {
|
||||
color: $color-error-new;
|
||||
font-family: $font-family-normal;
|
||||
font-size: $font-size-small;
|
||||
}
|
||||
}
|
||||
|
||||
.label {
|
||||
position: absolute; top: -0.2em; right: -4.5em; bottom:-0.2em; width: 4.5em;
|
||||
|
||||
background: $color-gray-faint;
|
||||
border: 0.2em solid $color-gray-dark;
|
||||
border-bottom-right-radius: 1.0em;
|
||||
border-left: 0;
|
||||
border-top-right-radius: 1.0em;
|
||||
box-shadow: 0.3em 0.3em 0.6em 0 $color-gray-shadow;
|
||||
cursor: pointer;
|
||||
text-align: center;
|
||||
z-index: $layer-dialog - 1;
|
||||
|
||||
img {
|
||||
position: absolute; top: 0.5em; left: 50%; height: 3.6em; width: 3.6em;
|
||||
@include transform(translateX(-50%));
|
||||
}
|
||||
|
||||
p {
|
||||
position: absolute; top: 50%; left: 50%;
|
||||
@include transform(translateX(-50%) rotate(-90deg));
|
||||
|
||||
font-family: $font-family-header;
|
||||
font-size: $font-size-x-large;
|
||||
}
|
||||
}
|
||||
|
||||
button[name="send"] {
|
||||
float: right;
|
||||
margin-top: 0.5em;
|
||||
}
|
||||
|
||||
input {
|
||||
position: relative; width: 100%;
|
||||
|
||||
border: 1px solid $color-gray-light;
|
||||
box-sizing: border-box;
|
||||
margin-bottom: 1em;
|
||||
padding: 0.2em;
|
||||
}
|
||||
|
||||
textarea {
|
||||
border: 1px solid $color-gray-light;
|
||||
position: relative; height: 11.5em; width: 100%;
|
||||
|
||||
font-family: $font-family-input;
|
||||
font-size: $font-size-normal;
|
||||
resize: vertical;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,57 @@
|
||||
/*
|
||||
Crafting Table - full_recipe.scss
|
||||
|
||||
Copyright (c) 2014-2015 by Redwood Labs
|
||||
All rights reserved.
|
||||
*/
|
||||
|
||||
.view__full_recipe {
|
||||
display: block;
|
||||
|
||||
& > div {
|
||||
position: relative; width: 33%;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.pattern {
|
||||
.view__crafting_grid {
|
||||
position: relative; left: 50%;
|
||||
@include transform(translateX(-50%));
|
||||
}
|
||||
|
||||
.tool {
|
||||
margin-top: 0.5em;
|
||||
text-align: center;
|
||||
|
||||
p {
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.input {
|
||||
.view__inventory {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.tool {
|
||||
a {
|
||||
color: $color-text;
|
||||
font-family: $font-family-normal;
|
||||
font-size: $font-size-normal;
|
||||
font-weight: bold;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover {
|
||||
color: $color-link;
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
h3 {
|
||||
margin-top: 0; margin-left: 0;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,56 @@
|
||||
/*
|
||||
Crafting Guide - home_page.scss
|
||||
|
||||
Copyright (C) 2015 by Redwood Labs
|
||||
All rights reserved.
|
||||
*/
|
||||
|
||||
.view__home_page {
|
||||
h2 {
|
||||
font-size: $font-size-x-large;
|
||||
}
|
||||
|
||||
p {
|
||||
font-family: $font-family-normal;
|
||||
font-size: $font-size-normal;
|
||||
line-height: 1.25em;
|
||||
margin: 1em 0;
|
||||
|
||||
&:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
li {
|
||||
font-family: $font-family-normal;
|
||||
font-size: $font-size-normal;
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
ol {
|
||||
list-style-type: decimal;
|
||||
margin: 0.5em 4em 2em 4em;
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style: disc outside;
|
||||
margin: 0.5em 4em 2em 4em;
|
||||
}
|
||||
|
||||
.intro {
|
||||
font-size: $font-size-large;
|
||||
}
|
||||
|
||||
.section:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.section-link {
|
||||
color: $color-active;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,24 @@
|
||||
/*
|
||||
Crafting Guide - templates/index.scss
|
||||
|
||||
Copyright (c) 2014-2015 by Redwood Labs
|
||||
All rights reserved.
|
||||
*/
|
||||
|
||||
@import 'browse_page';
|
||||
@import 'crafting_grid';
|
||||
@import 'craft_page';
|
||||
@import 'crafting_table';
|
||||
@import 'feedback';
|
||||
@import 'full_recipe';
|
||||
@import 'home_page';
|
||||
@import 'inventory';
|
||||
@import 'inventory_table';
|
||||
@import 'item';
|
||||
@import 'item_page';
|
||||
@import 'minimal_recipe';
|
||||
@import 'mod';
|
||||
@import 'mod_pack';
|
||||
@import 'mod_page';
|
||||
@import 'mod_selector';
|
||||
@import 'stack';
|
||||
@@ -0,0 +1,85 @@
|
||||
/*
|
||||
Crafting Guide - inventory.scss
|
||||
|
||||
Copyright (c) 2014-2015 by Redwood Labs
|
||||
All rights reserved.
|
||||
*/
|
||||
|
||||
.view__inventory {
|
||||
min-height: 14em;
|
||||
width: 100%;
|
||||
|
||||
.edit td {
|
||||
padding-top: 1em;
|
||||
}
|
||||
|
||||
.panel {
|
||||
position: absolute; top: 3.6em; right: 2em; bottom: 0; left: 2em;
|
||||
background: $color-background-panel;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.scrollbox {
|
||||
position: absolute; top: 0em; right: 0em; bottom: 3em; left: 0em;
|
||||
padding: 0.5em 1em;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.toolbar {
|
||||
position: absolute; right: 0; bottom: 0; left: 0; height: 3.5em;
|
||||
background: $color-background-toolbar;
|
||||
border-top: 1px solid $color-gray-light;
|
||||
}
|
||||
|
||||
button[name="clear"] {
|
||||
position: absolute; bottom: 0.5em; right: 0.5em;
|
||||
}
|
||||
|
||||
input {
|
||||
border: 1px solid $color-gray-light;
|
||||
}
|
||||
|
||||
button:disabled {
|
||||
background: white;
|
||||
color: $color-gray-light;
|
||||
}
|
||||
|
||||
table {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
td {
|
||||
height: 2.4em;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
td.icon {
|
||||
width: 4.8em;
|
||||
padding: 0 1em;
|
||||
|
||||
img {
|
||||
width: 100%; height: auto;
|
||||
max-height: 4.8em;
|
||||
}
|
||||
}
|
||||
|
||||
td.name {
|
||||
text-align: left;
|
||||
padding-right: 1em;
|
||||
|
||||
input {
|
||||
width: 100%;
|
||||
border: 0;
|
||||
border-bottom: 1px dashed $color-gray-light;
|
||||
outline: 0;
|
||||
|
||||
&:focus {
|
||||
border: 1px solid $color-gray-light;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
td.action {
|
||||
width: 4em;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,74 @@
|
||||
/*
|
||||
Crafting Guide - inventory_table.scss
|
||||
|
||||
Copyright (c) 2014-2015 by Redwood Labs
|
||||
All rights reserved.
|
||||
*/
|
||||
|
||||
.view__inventory_table {
|
||||
table {
|
||||
width: 100%;
|
||||
|
||||
td {
|
||||
height: 2.4em;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
td.quantity {
|
||||
position: relative;
|
||||
width: 2.4em;
|
||||
|
||||
input {
|
||||
position: absolute; top: 50%; height: $font-size-small; width: 100%;
|
||||
@include transform(translateY(-50%));
|
||||
border-radius: 0.75em;
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
max-width: 2.8em;
|
||||
}
|
||||
}
|
||||
|
||||
td.name {
|
||||
text-align: left;
|
||||
padding-right: 1em;
|
||||
|
||||
input {
|
||||
width: 100%;
|
||||
border: 0;
|
||||
border-bottom: 1px dashed $color-gray-light;
|
||||
outline: 0;
|
||||
|
||||
&:focus {
|
||||
border: 1px solid $color-gray-light;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
td.action {
|
||||
width: 4em;
|
||||
}
|
||||
|
||||
.edit td {
|
||||
padding-top: 1em;
|
||||
}
|
||||
}
|
||||
|
||||
.toolbar {
|
||||
position: relative; width: 100%;
|
||||
background: $color-background-toolbar;
|
||||
border-top: 1px solid $color-gray-light;
|
||||
}
|
||||
|
||||
button:disabled {
|
||||
background: white;
|
||||
color: $color-gray-light;
|
||||
}
|
||||
|
||||
button[name="clear"] {
|
||||
position: absolute; bottom: 0.5em; right: 0.5em;
|
||||
}
|
||||
|
||||
input {
|
||||
border: 1px solid $color-gray-light;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,49 @@
|
||||
/*
|
||||
Crafting Guide - item.scss
|
||||
|
||||
Copyright (c) 2015 by Redwood Labs
|
||||
All rights reserved.
|
||||
*/
|
||||
|
||||
.view__item {
|
||||
display: inline-block;
|
||||
padding: 0.5em;
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
width: 100%;
|
||||
|
||||
&:hover {
|
||||
.itemName {
|
||||
color: $color-link;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
table {
|
||||
background: $color-gray-faint;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
table {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
td.itemName {
|
||||
color: $color-text;
|
||||
font-family: $font-family-normal;
|
||||
font-size: $font-size-normal;
|
||||
font-weight: bold;
|
||||
padding-left: 1em;
|
||||
text-align: left;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
td.itemIcon {
|
||||
width: 3.6em;
|
||||
|
||||
img {
|
||||
height: 3.6em; width: 3.6em;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,68 @@
|
||||
/*
|
||||
Crafting Guide - item_page.scss
|
||||
|
||||
Copyright (c) 2014 by Redwood Labs
|
||||
All rights reserved.
|
||||
*/
|
||||
|
||||
.view__item_page {
|
||||
display: none;
|
||||
|
||||
& > div {
|
||||
vertical-align: top;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.mainBody {
|
||||
h1.name {
|
||||
font-family: $font-family-header;
|
||||
font-size: $font-size-x-large;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.byline {
|
||||
display: none;
|
||||
margin: 0.25em 0 2em 0;
|
||||
|
||||
p {
|
||||
font-family: $font-family-normal;
|
||||
font-size: $font-size-normal;
|
||||
font-style: italic;
|
||||
}
|
||||
}
|
||||
|
||||
.description {
|
||||
margin-bottom: 4em;
|
||||
|
||||
p {
|
||||
font-family: $font-family-normal;
|
||||
font-size: $font-size-large;
|
||||
}
|
||||
}
|
||||
|
||||
.recipes {
|
||||
display: none;
|
||||
|
||||
.view__full_recipe {
|
||||
width: 100%;
|
||||
margin-top: 3em;
|
||||
|
||||
&:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.similar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.usedToMake {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.view__item {
|
||||
position: relative; width: 33%;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,62 @@
|
||||
/*
|
||||
Crafting Table - minimal_recipe.scss
|
||||
|
||||
Copyright (c) 2014-2015 by Redwood Labs
|
||||
All rights reserved.
|
||||
*/
|
||||
|
||||
.view__minimal_recipe {
|
||||
position: relative; height: 20em; width: 26em;
|
||||
|
||||
.input {
|
||||
position: absolute; top: 50%; left: 0;
|
||||
@include transform(translateY(-50%));
|
||||
|
||||
.tool {
|
||||
position: absolute; right: 0; bottom: -2em; left: 0; height: 1.5em;
|
||||
text-align: center;
|
||||
|
||||
a {
|
||||
color: $color-text;
|
||||
font-family: $font-family-normal;
|
||||
font-size: $font-size-normal;
|
||||
font-weight: bold;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover {
|
||||
color: $color-link;
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.output {
|
||||
position: absolute; top: 50%; right: 0; height: 5.3em; width: 5.3em;
|
||||
@include transform(translateY(-50%));
|
||||
|
||||
background: $color-gray-faint;
|
||||
border: 0.2em solid $color-gray-medium;
|
||||
padding: 0.1em;
|
||||
|
||||
a {
|
||||
position: absolute; top: 50%; left: 50%; height: 4.8em; width: 4.8em;
|
||||
@include transform(translate(-50%, -50%));
|
||||
}
|
||||
|
||||
.multiplier {
|
||||
position: absolute; bottom: -2.0em; left: 0; right: 0; height: 1.5em;
|
||||
font-family: $font-family-header;
|
||||
font-size: $font-size-large;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.quantity {
|
||||
position: absolute; right: 0.1em; bottom: 0;
|
||||
color: white;
|
||||
font-family: $font-family-header;
|
||||
font-size: $font-size-large;
|
||||
text-shadow: -2px -2px 0 #000, 2px -2px 0 #000, -2px 2px 0 #000, 2px 2px 0 #000;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,58 @@
|
||||
/*
|
||||
Crafting Guide - mod.scss
|
||||
|
||||
Copyright (C) 2015 by Redwood Labs
|
||||
All rights reserved.
|
||||
*/
|
||||
|
||||
.view__mod {
|
||||
position: relative; height: 18em;
|
||||
|
||||
background: $color-background-panel;
|
||||
display: inline-block;
|
||||
padding: 0.2em;
|
||||
text-decoration: none;
|
||||
vertical-align: top;
|
||||
|
||||
transition:
|
||||
height $animate-normal,
|
||||
opacity $animate-normal;
|
||||
|
||||
&:hover {
|
||||
border: 0.2em solid $color-link;
|
||||
padding: 0;
|
||||
|
||||
.name {
|
||||
color: $color-link;
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
&.empty {
|
||||
height: 0;
|
||||
}
|
||||
|
||||
&.removing {
|
||||
height: 0;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.description {
|
||||
margin: 1em;
|
||||
}
|
||||
|
||||
a {
|
||||
color: $color-text;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: $font-size-normal;
|
||||
margin-top: 1em;
|
||||
}
|
||||
|
||||
img {
|
||||
float: left;
|
||||
margin: 1em;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,33 @@
|
||||
/*
|
||||
Crafting Guide - mod_versions.scss
|
||||
|
||||
Copyright (c) 2014-2015 by Redwood Labs
|
||||
All rights reserved.
|
||||
*/
|
||||
|
||||
.view__mod_pack {
|
||||
|
||||
input {
|
||||
border: 0; font-size: 1.5em; width: 90%;
|
||||
}
|
||||
|
||||
.mods {
|
||||
position: relative; width: 100%;
|
||||
padding: 1em;
|
||||
}
|
||||
|
||||
.panel {
|
||||
background: white;
|
||||
}
|
||||
|
||||
.toolbar {
|
||||
position: relative; width: 100%;
|
||||
margin-top: 1em;
|
||||
padding: 1em 1em;
|
||||
text-align: left;
|
||||
|
||||
button {
|
||||
position: relative; width: 20em;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,55 @@
|
||||
/*
|
||||
Crafting Guide - mod_page.scss
|
||||
|
||||
Copyright (c) 2014 by Redwood Labs
|
||||
All rights reserved.
|
||||
*/
|
||||
|
||||
.view__mod_page {
|
||||
display: none;
|
||||
|
||||
& > div {
|
||||
vertical-align: top;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.sidebar {
|
||||
.version {
|
||||
position: relative; width: 80%;
|
||||
margin: 0 10%;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
}
|
||||
|
||||
.mainBody {
|
||||
|
||||
.name {
|
||||
font-family: $font-family-header;
|
||||
font-size: $font-size-x-large;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.byline {
|
||||
margin: 0.25em 0 2em 0;
|
||||
|
||||
p {
|
||||
font-family: $font-family-normal;
|
||||
font-size: $font-size-normal;
|
||||
font-style: italic;
|
||||
}
|
||||
}
|
||||
|
||||
.description {
|
||||
margin-bottom: 4em;
|
||||
|
||||
p {
|
||||
font-family: $font-family-normal;
|
||||
font-size: $font-size-large;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.view__item {
|
||||
position: relative; width: 33%;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,36 @@
|
||||
/*
|
||||
Crafting Table - mod.scss
|
||||
|
||||
Copyright (c) 2014-2015 by Redwood Labs
|
||||
All rights reserved.
|
||||
*/
|
||||
|
||||
.view__mod_selector {
|
||||
position: relative; width: 100%;
|
||||
display: table-row;
|
||||
|
||||
div, p {
|
||||
display: table-cell;
|
||||
padding: 0.4em;
|
||||
}
|
||||
|
||||
.version {
|
||||
width: 12em;
|
||||
|
||||
select {
|
||||
position: relative; width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.name {
|
||||
width: 18em;
|
||||
|
||||
p {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
&.disabled {
|
||||
p { color: $color-gray-light; }
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,94 @@
|
||||
/*
|
||||
Crafting Guide - stack.scss
|
||||
|
||||
Copyright (c) 2014-2015 by Redwood Labs
|
||||
All rights reserved.
|
||||
*/
|
||||
|
||||
.view__stack {
|
||||
font-family: $font-family-normal;
|
||||
|
||||
td {
|
||||
padding: 0.2em 0;
|
||||
}
|
||||
|
||||
td.quantity {
|
||||
position: relative;
|
||||
width: 4em;
|
||||
|
||||
input {
|
||||
position: absolute; top: 50%; height: $font-size-small; width: 100%;
|
||||
@include transform(translateY(-50%));
|
||||
|
||||
border-radius: 0.75em;
|
||||
background: $color-ice;
|
||||
color: $color-background-panel;
|
||||
font-family: $font-family-normal;
|
||||
font-size: $font-size-normal;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
|
||||
&.editable {
|
||||
&:focus {
|
||||
background: $color-background-panel;
|
||||
color: $color-text;
|
||||
font-family: $font-family-input;
|
||||
font-weight: normal;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: $color-background-panel;
|
||||
color: $color-text;
|
||||
font-family: $font-family-input;
|
||||
font-weight: normal;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
td.icon {
|
||||
width: 4.6em;
|
||||
padding: 0.2em 0.5em;
|
||||
|
||||
img {
|
||||
width: 100%; height: auto;
|
||||
max-height: 4.8em;
|
||||
@include pixel-image;
|
||||
}
|
||||
}
|
||||
|
||||
td.name a {
|
||||
color: $color-text;
|
||||
display: inline;
|
||||
font-size: $font-size-normal;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover {
|
||||
color: $color-active-hover;
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
td.action {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
button.remove {
|
||||
opacity: 0;
|
||||
position: relative; width: 1.8em; height: 1.8em;
|
||||
background: url('/images/remove.png') no-repeat center;
|
||||
border: 0;
|
||||
outline: none;
|
||||
|
||||
&:hover {
|
||||
background: url('/images/remove-hover.png') no-repeat center;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
button.remove {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,121 @@
|
||||
/*
|
||||
Crafting Guide - views.scss
|
||||
|
||||
Copyright (c) 2015 by Redwood Labs
|
||||
All rights reserved.
|
||||
*/
|
||||
|
||||
.view__footer {
|
||||
background: $color-footer;
|
||||
color: $color-footer-text;
|
||||
margin-top: 2em;
|
||||
|
||||
a {
|
||||
color: $color-footer-text;
|
||||
}
|
||||
|
||||
.divider {
|
||||
position: relative; height: 3.2em; width: 100%;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.divider.top {
|
||||
background: $color-dirt url('/images/grass_side.png');
|
||||
}
|
||||
|
||||
.left, .center, .right {
|
||||
position: relative; width: 33%; height: 23em;
|
||||
float: left;
|
||||
padding: 2em;
|
||||
|
||||
.action {
|
||||
position: absolute; bottom: 3em; left: 50%;
|
||||
@include transform(translateX(-50%));
|
||||
}
|
||||
}
|
||||
|
||||
.divider.bottom {
|
||||
background: $color-bedrock url('/images/bedrock.png');
|
||||
}
|
||||
}
|
||||
|
||||
.view__header {
|
||||
background: $color-gray-light;
|
||||
position: relative; height: 13em;
|
||||
margin-top: 3.2em;
|
||||
|
||||
h1 {
|
||||
position: relative; top: -1.6em; left: -1.6em;
|
||||
|
||||
p {
|
||||
position: relative; top: 0.2em;
|
||||
}
|
||||
}
|
||||
|
||||
.divider {
|
||||
background: $color-brick-dark url('/images/stone_brick.png');
|
||||
position: absolute; bottom: 5em; height: 3.2em; width: 100%;
|
||||
}
|
||||
|
||||
.navBar {
|
||||
position: absolute; right: 2em; bottom: 1em; left: 2em; height: 3em;
|
||||
|
||||
a {
|
||||
position: relative; height: 3em; width: 15em;
|
||||
background: $color-gray-faint;
|
||||
border: 0.1em solid $color-gray-medium;
|
||||
border-radius: 0 1.5em 1.5em 0;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
margin-left: -1.5em;
|
||||
|
||||
transition: background $animate-normal;
|
||||
|
||||
&:first-child {
|
||||
border-radius: 1.5em;
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: $color-background-panel;
|
||||
}
|
||||
|
||||
&.selected {
|
||||
background: $color-active;
|
||||
|
||||
p {
|
||||
color: $color-background-panel;
|
||||
}
|
||||
}
|
||||
|
||||
.dot {
|
||||
position: absolute; top: 50%; right: 1em; height: 1.5em; width: 1.5em;
|
||||
@include transform(translateY(-50%));
|
||||
|
||||
background: $color-active;
|
||||
border-radius: 0.75em;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
p {
|
||||
position: absolute; top: 50%; left: 50%; width: 100%;
|
||||
@include transform(translateX(-50%) translateY(-50%));
|
||||
|
||||
color: $color-active;
|
||||
font-family: $font-family-normal;
|
||||
font-size: $font-size-normal;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
|
||||
transition: color $animate-normal;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.view__screen {
|
||||
position: fixed; top: 0; right: 0; bottom: 0; left: 0;
|
||||
display: none;
|
||||
z-index: $layer-screen;
|
||||
}
|
||||
Reference in New Issue
Block a user