504 lines
9.6 KiB
SCSS
504 lines
9.6 KiB
SCSS
|
@import "compass/css3/box-sizing";
|
||
|
@import "../old_common/vars";
|
||
|
@import "../old_common/form-elements";
|
||
|
|
||
|
.floating.edit_name_dialog.markdown {
|
||
|
height: 62px;
|
||
|
|
||
|
.input_field {
|
||
|
position: absolute;
|
||
|
top: 5px;
|
||
|
right: 65px;
|
||
|
bottom: 5px;
|
||
|
left: 5px;
|
||
|
width: 100%;
|
||
|
width: 289px;
|
||
|
margin: 0 3px 0 0;
|
||
|
padding: 8px 10px;
|
||
|
border: 1px solid #000;
|
||
|
border-radius: 4px;
|
||
|
background: #FFF;
|
||
|
color: #333;
|
||
|
font-size: 15px;
|
||
|
line-height: normal;
|
||
|
|
||
|
.hint {
|
||
|
margin: 7px 0 0;
|
||
|
padding: 4px 3px 0 0;
|
||
|
border-top: 1px solid #CCC;
|
||
|
color: #CCC;
|
||
|
font-size: 12px;
|
||
|
text-align: right;
|
||
|
|
||
|
strong {
|
||
|
margin-right: 3px;
|
||
|
}
|
||
|
|
||
|
em {
|
||
|
margin-right: 3px;
|
||
|
font-style: italic;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
input {
|
||
|
position: relative;
|
||
|
top: 0;
|
||
|
right: 0;
|
||
|
bottom: 0;
|
||
|
left: 0;
|
||
|
box-sizing: border-box;
|
||
|
width: 100%;
|
||
|
margin: 0;
|
||
|
padding: 0;
|
||
|
border: none;
|
||
|
border-radius: 0;
|
||
|
background: none;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
input,
|
||
|
textarea {
|
||
|
height: 19px;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.edit_text_dialog {
|
||
|
position: absolute !important;
|
||
|
z-index: 0 !important;
|
||
|
max-width: 500px;
|
||
|
max-height: 500px;
|
||
|
padding: 11px;
|
||
|
border: 1px solid #B7B7B7;
|
||
|
border-radius: 4px;
|
||
|
box-shadow: rgba(black, 0.17) 0 0 6px 1px;
|
||
|
|
||
|
@include background(linear-gradient(#FEFEFE, #F4F4F4));
|
||
|
|
||
|
a.button {
|
||
|
margin-top: 9px;
|
||
|
padding: 6px 15px !important;
|
||
|
letter-spacing: 0;
|
||
|
}
|
||
|
|
||
|
a.cancel {
|
||
|
margin-top: 13px;
|
||
|
font-size: 13px;
|
||
|
text-decoration: underline;
|
||
|
text-transform: lowercase;
|
||
|
}
|
||
|
|
||
|
a.cancel.right {
|
||
|
margin-top: 10px;
|
||
|
margin-bottom: 2px;
|
||
|
}
|
||
|
|
||
|
a.link {
|
||
|
margin-top: 19px;
|
||
|
margin-right: 3px;
|
||
|
font-size: 13px;
|
||
|
text-decoration: underline;
|
||
|
text-transform: lowercase;
|
||
|
}
|
||
|
|
||
|
input,
|
||
|
textarea {
|
||
|
display: block;
|
||
|
position: relative;
|
||
|
|
||
|
box-sizing: border-box;
|
||
|
width: 100%;
|
||
|
max-width: 500px - 22;
|
||
|
max-height: 500px - 60;
|
||
|
margin: 0 !important;
|
||
|
padding: 10px;
|
||
|
border: 1px solid #C0C1C2;
|
||
|
border-radius: 4px;
|
||
|
background: #FFF;
|
||
|
color: #666;
|
||
|
font-family: $text-fonts;
|
||
|
font-size: 15px;
|
||
|
|
||
|
&:focus {
|
||
|
border-color: #999;
|
||
|
outline: none;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
// Edit date dialog
|
||
|
div.field.date {
|
||
|
div.date_field {
|
||
|
display: table;
|
||
|
width: 281px;
|
||
|
letter-spacing: -4px;
|
||
|
word-spacing: -4px;
|
||
|
|
||
|
.select2-container {
|
||
|
width: 100px !important;
|
||
|
}
|
||
|
|
||
|
& > div.column {
|
||
|
display: inline-block;
|
||
|
margin-right: 4px;
|
||
|
letter-spacing: 0;
|
||
|
vertical-align: top;
|
||
|
word-spacing: 0;
|
||
|
|
||
|
label {
|
||
|
display: block;
|
||
|
margin: 0 0 3px;
|
||
|
padding: 0;
|
||
|
color: #DDD;
|
||
|
font: normal 12px $text-fonts;
|
||
|
}
|
||
|
|
||
|
div.form_spinner {
|
||
|
background: WHITE;
|
||
|
|
||
|
&.disabled {
|
||
|
border-color: #DDD !important;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
&.day_field {
|
||
|
width: 46px;
|
||
|
}
|
||
|
|
||
|
&.month_field {
|
||
|
width: 101px;
|
||
|
}
|
||
|
|
||
|
&.year_field {
|
||
|
width: 54px;
|
||
|
}
|
||
|
|
||
|
&.time_field {
|
||
|
@include default-input();
|
||
|
width: 66px;
|
||
|
|
||
|
input {
|
||
|
width: 59px;
|
||
|
padding: 2px 3px;
|
||
|
border-color: #9E9E9E;
|
||
|
font-size: 13px;
|
||
|
// Actions
|
||
|
&.error {
|
||
|
border-color: rgba(red, 0.5);
|
||
|
}
|
||
|
|
||
|
&[readonly] {
|
||
|
border-color: #DDD;
|
||
|
background: #F4F4F4;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
&:last-child {
|
||
|
margin-right: 0;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
// .select2-container {width:100px !important;}
|
||
|
|
||
|
// form > div {
|
||
|
// letter-spacing: -4px;
|
||
|
// }
|
||
|
|
||
|
// div.field {
|
||
|
// display: inline-block;
|
||
|
vertical-align: top;
|
||
|
// margin-right: 4px;
|
||
|
// letter-spacing:0;
|
||
|
|
||
|
// * {letter-spacing:0;}
|
||
|
// label {display:block; margin:0 0 5px; font:bold 10px $text-fonts; color:#999999;}
|
||
|
// div.form_spinner {
|
||
|
// background: white;
|
||
|
// &.disabled {border-color:#DDDDDD !important;}
|
||
|
// }
|
||
|
|
||
|
// &:last-child {margin-right:0;}
|
||
|
// }
|
||
|
|
||
|
// input.time {
|
||
|
// width: 54px;
|
||
|
// padding: 0 5px;
|
||
|
// height: 19px;
|
||
|
// font-size: 13px;
|
||
|
// line-height: 19px;
|
||
|
// border-color: #9E9E9E;
|
||
|
// &.error {border-color:rgba(red,0.5);}
|
||
|
// &[disabled] {border-color:#DDDDDD;}
|
||
|
// }
|
||
|
}
|
||
|
|
||
|
// Edit boolean dialog
|
||
|
div.field.boolean {
|
||
|
nav {
|
||
|
display: block;
|
||
|
min-width: 205px;
|
||
|
padding: 10px 5px 12px 20px;
|
||
|
border: 1px solid #CCC;
|
||
|
border-radius: 4px;
|
||
|
background: WHITE;
|
||
|
|
||
|
a {
|
||
|
display: inline-block;
|
||
|
width: 65px;
|
||
|
font-size: 13px;
|
||
|
font-weight: normal;
|
||
|
vertical-align: top;
|
||
|
|
||
|
span.radio {
|
||
|
margin-top: 0 !important;
|
||
|
}
|
||
|
|
||
|
&:hover {
|
||
|
text-decoration: none;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
// Edit number dialog
|
||
|
div.field.number {
|
||
|
input.error {
|
||
|
border-color: rgba(red, 0.5);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
// Edit geometry dialog
|
||
|
div.field.geometry {
|
||
|
textarea.error,
|
||
|
input.error {
|
||
|
border-color: rgba(red, 0.5);
|
||
|
}
|
||
|
|
||
|
.selector {
|
||
|
display: none;
|
||
|
width: 100%;
|
||
|
margin-bottom: 7px;
|
||
|
}
|
||
|
|
||
|
.switches label {
|
||
|
color: #AAA;
|
||
|
font-size: 13px;
|
||
|
}
|
||
|
|
||
|
div.loader {
|
||
|
display: block;
|
||
|
width: 100%;
|
||
|
height: 50px;
|
||
|
background: image-url("layout/loader_gray.gif") no-repeat center center transparent;
|
||
|
}
|
||
|
|
||
|
div.rest {
|
||
|
display: none;
|
||
|
}
|
||
|
|
||
|
div.point {
|
||
|
display: none;
|
||
|
position: relative;
|
||
|
width: auto;
|
||
|
max-width: 322px;
|
||
|
height: 30px;
|
||
|
margin: 0;
|
||
|
|
||
|
& > span,
|
||
|
& > p {
|
||
|
display: inline-block;
|
||
|
position: relative;
|
||
|
margin: 0;
|
||
|
vertical-align: top;
|
||
|
}
|
||
|
|
||
|
input {
|
||
|
display: block;
|
||
|
width: 105px;
|
||
|
height: 31px;
|
||
|
margin: 0;
|
||
|
padding: 5px 5px 5px 36px;
|
||
|
font-size: 15px;
|
||
|
line-height: 19px;
|
||
|
text-align: right;
|
||
|
|
||
|
&.error {
|
||
|
border-color: rgba(red, 0.5);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
p {
|
||
|
width: 17px;
|
||
|
font-size: 20px;
|
||
|
text-align: center;
|
||
|
}
|
||
|
|
||
|
label {
|
||
|
position: absolute;
|
||
|
z-index: 10;
|
||
|
top: 6px;
|
||
|
left: 8px;
|
||
|
color: #AAA;
|
||
|
font-size: 13px;
|
||
|
font-style: italic;
|
||
|
pointer-events: none;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.hidden {
|
||
|
display: none;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.floating.edit_name_dialog {
|
||
|
@include background(linear-gradient(rgba(black, 0.5), rgba(#212121, 0.5)));
|
||
|
min-width: 280px;
|
||
|
height: 37px;
|
||
|
padding: 5px;
|
||
|
border-radius: 4px;
|
||
|
|
||
|
box-shadow: rgba(#000, 0.12) 0 0 2px 2px;
|
||
|
|
||
|
.content {
|
||
|
display: inline-block;
|
||
|
float: left;
|
||
|
vertical-align: top;
|
||
|
}
|
||
|
|
||
|
input {
|
||
|
position: absolute;
|
||
|
top: 5px;
|
||
|
right: 65px;
|
||
|
bottom: 5px;
|
||
|
left: 5px;
|
||
|
margin: 0 3px 0 0;
|
||
|
padding: 8px 10px;
|
||
|
border: 1px solid #000;
|
||
|
border-radius: 4px;
|
||
|
color: #333;
|
||
|
font-size: 15px;
|
||
|
line-height: normal;
|
||
|
|
||
|
&:focus {
|
||
|
outline: none;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
a.ok {
|
||
|
padding: 9px 15px !important;
|
||
|
border: 1px solid #000 !important;
|
||
|
border-radius: 4px;
|
||
|
font-size: 15px !important;
|
||
|
font-weight: bold !important;
|
||
|
letter-spacing: 0;
|
||
|
|
||
|
&:active {
|
||
|
@include background(linear-gradient(#F9F9F9, #E1E1E1));
|
||
|
border-color: #ACACAC;
|
||
|
background: #D3D3D3; // IE
|
||
|
box-shadow: rgba(#FFF, 0) 0 0 1px 0, rgba(130, 126, 111, 0.6) 0 1px 3px 0 inset;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
&.tags-dialog {
|
||
|
height: auto;
|
||
|
|
||
|
ul {
|
||
|
display: inline-block;
|
||
|
position: relative;
|
||
|
min-width: 215px;
|
||
|
max-width: 400px;
|
||
|
min-height: 24px;
|
||
|
max-height: 300px !important;
|
||
|
margin: 0 3px 0 0;
|
||
|
padding: 4px 4px 1px;
|
||
|
border: 1px solid #000;
|
||
|
|
||
|
border-radius: 4px;
|
||
|
background: WHITE;
|
||
|
vertical-align: top;
|
||
|
|
||
|
li.tagit-choice {
|
||
|
margin: 0 3px 3px 0;
|
||
|
padding: 0;
|
||
|
border: 1px solid #2B5B85;
|
||
|
border-radius: 3px;
|
||
|
background: #4086C3;
|
||
|
color: #FFF;
|
||
|
font: normal 11px "Arial";
|
||
|
|
||
|
span.tagit-label {
|
||
|
display: inline-block;
|
||
|
padding: 0 5px;
|
||
|
border-right: 1px solid #2B5B85;
|
||
|
line-height: 19px;
|
||
|
vertical-align: top;
|
||
|
}
|
||
|
|
||
|
a.tagit-close {
|
||
|
display: inline-block;
|
||
|
position: relative;
|
||
|
width: auto;
|
||
|
height: 100%;
|
||
|
margin: 0;
|
||
|
line-height: 19px;
|
||
|
vertical-align: top;
|
||
|
|
||
|
&:hover {
|
||
|
text-decoration: none;
|
||
|
|
||
|
span.text-icon {
|
||
|
color: WHITE;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
span.text-icon {
|
||
|
display: block;
|
||
|
margin: 0;
|
||
|
padding: 0 5px 0 7px;
|
||
|
color: #1F4362;
|
||
|
line-height: 19px;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
li.tagit-new {
|
||
|
margin-top: 0;
|
||
|
margin-bottom: 0;
|
||
|
padding: 0;
|
||
|
|
||
|
input {
|
||
|
display: inline-block;
|
||
|
position: relative;
|
||
|
top: 0;
|
||
|
right: auto;
|
||
|
bottom: auto;
|
||
|
left: auto;
|
||
|
margin: 3px 0 3px 5px;
|
||
|
padding: 0;
|
||
|
font-size: 13px;
|
||
|
line-height: 15px;
|
||
|
vertical-align: top;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
a.ok {
|
||
|
padding: 6px 15px !important;
|
||
|
border: 1px solid #000 !important;
|
||
|
border-radius: 4px;
|
||
|
font-size: 15px !important;
|
||
|
font-weight: bold !important;
|
||
|
letter-spacing: 0;
|
||
|
|
||
|
&:active {
|
||
|
@include background(linear-gradient(#F9F9F9, #E1E1E1));
|
||
|
border-color: #ACACAC;
|
||
|
background: #D3D3D3; // IE
|
||
|
box-shadow: rgba(#FFF, 0) 0 0 1px 0, rgba(130, 126, 111, 0.6) 0 1px 3px 0 inset;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
}
|