85 lines
2.1 KiB
SCSS
85 lines
2.1 KiB
SCSS
/*
|
|
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;
|
|
}
|
|
}
|