Skip to content

E
edx-platform
Commit b1451127 by Brian Talbot
Options

multi-input field markup and styling

parent f1e1f9e7
Showing with 29 additions and 8 deletions
cms/static/sass/_settings.scss
...@@ -90,10 +90,24 @@ ...@@ -90,10 +90,24 @@
} }
.delete-icon { .remove-item {
position: absolute; display: block;
right: 10px; border-top: 1px solid $lightGrey;
top: 10px; margin-top: 5px;
padding-top: 10px;
font-size: 13px;
}
}
.element-group {
width: 400px;
padding: 15px 20px;
background: tint($lightGrey, 50%);
@include border-radius(3px);
@include box-sizing(border-box);
input.long, textarea {
width: 100%;
} }
} }
...@@ -118,6 +132,11 @@ ...@@ -118,6 +132,11 @@
margin-right: 0; margin-right: 0;
} }
} }
.remove-item {
float: left;
width: 100%;
}
} }
} }
......
cms/templates/settings.html
...@@ -150,7 +150,7 @@ ...@@ -150,7 +150,7 @@
<div class="field"> <div class="field">
<ol class="input-list course-milestone-list"> <ol class="input-list course-milestone-list">
<li class="element element-multi course-milestone-list-element"> <li class="element element-multi element-group course-milestone-list-element">
<div class="course-milestone-date"> <div class="course-milestone-date">
<input type="text" class="course-milestone-date-input date"> <input type="text" class="course-milestone-date-input date">
<span class="label-micro">Milestone Date</span> <span class="label-micro">Milestone Date</span>
...@@ -161,6 +161,7 @@ ...@@ -161,6 +161,7 @@
<span class="label-micro">Milestone Name</span> <span class="label-micro">Milestone Name</span>
</div> </div>
<a href="#" class="remove-item remove-milestone-data"><span class="delete-icon"></span> Delete Milestone</a>
</li> </li>
</ol> </ol>
...@@ -232,7 +233,7 @@ ...@@ -232,7 +233,7 @@
<div class="field"> <div class="field">
<ol class="input-list course-textbook-list"> <ol class="input-list course-textbook-list">
<li class="element element-stacked course-textbook-list-element"> <li class="element element-stacked element-group course-textbook-list-element">
<div class="course-textbook-name"> <div class="course-textbook-name">
<input type="text" class="long course-textbook-name-input"> <input type="text" class="long course-textbook-name-input">
<span class="label-micro">Textbook Name</span> <span class="label-micro">Textbook Name</span>
...@@ -243,7 +244,7 @@ ...@@ -243,7 +244,7 @@
<span class="label-micro">Textbook URL</span> <span class="label-micro">Textbook URL</span>
</div> </div>
<a href="#" class="delete-icon remove-textbook-data"></a> <a href="#" class="remove-item remove-textbook-data"><span class="delete-icon"></span> Delete Textbook</a>
</li> </li>
</ol> </ol>
...@@ -265,7 +266,7 @@ ...@@ -265,7 +266,7 @@
<div class="field"> <div class="field">
<ol class="input-list course-faq-list"> <ol class="input-list course-faq-list">
<li class="element element-stacked course-faq-list-element"> <li class="element element-stacked element-group course-faq-list-element">
<div class="course-faq-question"> <div class="course-faq-question">
<input type="text" class="long course-faq-question-input"> <input type="text" class="long course-faq-question-input">
<span class="label-micro">Question</span> <span class="label-micro">Question</span>
...@@ -276,6 +277,7 @@ ...@@ -276,6 +277,7 @@
<span class="label-micro">Answer</span> <span class="label-micro">Answer</span>
</div> </div>
<a href="#" class="remove-item remove-faq-data"><span class="delete-icon"></span> Delete Question &amp; Answer</a>
</li> </li>
</ol> </ol>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment