addon/styles/addon.scss
@import 'mixins';
@import 'buttons';
.borderBottom {
border-bottom: dashed 1px #0088cc;
bottom: 7px;
height: 2px;
left: 0;
position: relative;
}
.shouldNotDisplay {
display: none;
}
.editable-buttons {
display: inline-block;
margin-left: 7px;
vertical-align: top;
zoom: 1;
}
.editable-container {
.editable-inline {
display: inline-block;
vertical-align: middle;
width: auto;
zoom: 1;
}
}
.textContainer,
.textareaContainer {
display: inline-block;
.ember-x-editable-text,
.ember-x-editable-textarea {
font-size: 12.5px;
&::-ms-clear {
display: none;
height: 0;
width: 0;
}
&.is-editing {
background: white;
padding: 4px 5px;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
width: 100%;
&.error {
border: 1px solid red;
}
}
&.is-not-editing {
background: transparent;
border: none;
border-color: transparent;
cursor: pointer;
font-weight: 700;
-webkit-box-shadow: none;
box-shadow: none;
padding: 4px 1px;
}
&.is-empty {
font-style: italic;
}
}
}
.textareaContainer {
overflow: scroll;
width: 100%;
.ember-x-editable-textarea {
overflow: scroll;
width: 100%;
&.is-editing {
resize: both;
}
&.is-not-editing {
resize: none;
white-space: nowrap;
}
}
}
.selectContainer {
display: inline-block;
overflow: hidden;
position: relative;
width: auto;
.ember-x-editable-select {
font-size: 12.5px;
&.is-editing {
background: white;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
padding: 0 10px;
width: 100%;
}
&.is-not-editing {
appearance: none;
-moz-appearance: none;
-webkit-appearance: none;
-webkit-box-shadow: none;
background: transparent;
background-color: transparent;
border: none;
box-shadow: none;
cursor: pointer;
font-weight: 700;
overflow: hidden;
padding: 2px 1px;
width: 120%;
}
}
}