Improved UI element style.

This commit is contained in:
Sipke Schoorstra
2015-04-19 17:23:08 +02:00
parent 6727e61f6c
commit 1a889594d9
10 changed files with 30 additions and 18 deletions

View File

@@ -1,11 +1,4 @@
.layout-editor .layout-content > .layout-element-wrapper .layout-content-markup > .validation-message,
.layout-editor .layout-content > .layout-element-wrapper .layout-content-markup > .validation-summary {
border: 1px dashed #ccc;
padding: 0.2em;
background: #e8e8e8;
}
.layout-editor .layout-content > .layout-element-wrapper .layout-content-markup > .form-field-element input[type="text"],
.layout-editor .layout-content > .layout-element-wrapper .layout-content-markup > .form-field-element input[type="text"],
.layout-editor .layout-content > .layout-element-wrapper .layout-content-markup > .form-field-element input[type="password"],
.layout-editor .layout-content > .layout-element-wrapper .layout-content-markup > .form-field-element input[type="email"],
.layout-editor .layout-content > .layout-element-wrapper .layout-content-markup > .form-field-element input[type="tel"],

View File

@@ -3,7 +3,8 @@
var element = (ValidationMessage)Model.Element;
var forField = element.For;
}
<div class="validation-message">
<div class="layout-placeholder">
<span class="fa fa-file-code-o"></span>
@if (String.IsNullOrWhiteSpace(forField)) {
@T("Validation message (target not specified)")
}

View File

@@ -1 +1,4 @@
<div class="validation-summary">@T("Validation summary")</div>
<div class="layout-placeholder">
<span class="fa fa-file-code-o"></span>
@T("Validation summary")
</div>

View File

@@ -17,6 +17,11 @@
.layout-editor > .layout-canvas-wrapper > .layout-toolbar-container > .mce-panel {
width: 100% !important;
}
.layout-editor > .layout-canvas-wrapper .layout-content > .layout-element-wrapper .layout-content-markup > .layout-placeholder {
border: 1px dashed #ccc;
padding: 0.2em 0.4em;
background: #e8e8e8;
}
.layout-editor .layout-element {
position: relative;

File diff suppressed because one or more lines are too long

View File

@@ -17,3 +17,8 @@
.layout-editor > .layout-canvas-wrapper > .layout-toolbar-container > .mce-panel {
width: 100% !important;
}
.layout-editor > .layout-canvas-wrapper .layout-content > .layout-element-wrapper .layout-content-markup > .layout-placeholder {
border: 1px dashed #ccc;
padding: 0.2em 0.4em;
background: #e8e8e8;
}

View File

@@ -20,5 +20,11 @@
width: 100% !important;
}
}
.layout-content > .layout-element-wrapper .layout-content-markup > .layout-placeholder {
border: 1px dashed #ccc;
padding: 0.2em 0.4em;
background: #e8e8e8;
}
}
}

View File

@@ -1 +1 @@
.layout-editor{display:flex;margin-top:1em;font-size:14px;align-items:flex-start}.layout-editor>.layout-canvas-wrapper{flex-grow:1;background-color:#f3f4f5;border:1px solid #e4e5e6}.layout-editor>.layout-canvas-wrapper>.layout-toolbar-container{display:none;margin:12px 12px 0;min-height:71px}.layout-editor>.layout-canvas-wrapper>.layout-toolbar-container>.mce-panel{width:100% !important}
.layout-editor{display:flex;margin-top:1em;font-size:14px;align-items:flex-start}.layout-editor>.layout-canvas-wrapper{flex-grow:1;background-color:#f3f4f5;border:1px solid #e4e5e6}.layout-editor>.layout-canvas-wrapper>.layout-toolbar-container{display:none;margin:12px 12px 0;min-height:71px}.layout-editor>.layout-canvas-wrapper>.layout-toolbar-container>.mce-panel{width:100% !important}.layout-editor>.layout-canvas-wrapper .layout-content>.layout-element-wrapper .layout-content-markup>.layout-placeholder{border:1px dashed #ccc;padding:.2em .4em;background:#e8e8e8}

View File

@@ -2,7 +2,7 @@
@{
var element = (Shape) Model.Element;
}
<div class="element-snippet">
<strong>@T("Shape -")</strong>
@element.ShapeType
<div class="element-snippet layout-placeholder">
<span class="fa fa-circle"></span>
@T("{0} {1}", element.ShapeType, element.Descriptor.DisplayText)
</div>

View File

@@ -2,7 +2,6 @@
@{
var element = (Snippet) Model.Element;
}
<div class="element-snippet">
<strong>@T("Snippet -")</strong>
@element.Descriptor.DisplayText
<div class="element-snippet layout-placeholder">
<span class="fa fa-circle">@element.Descriptor.DisplayText</span>
</div>