Changed UI of prompt tab

Show function definition and use button under prompt demo when prompt
demo is selected
This commit is contained in:
Siteshwar Vashisht
2013-11-09 19:30:41 +05:30
parent 63233655f4
commit c4aa223698
2 changed files with 12 additions and 28 deletions

View File

@@ -391,16 +391,6 @@ img.delete_icon {
.prompt_demo {
font-size: 12pt;
padding: 25px;
margin: 5px 20px 25px 20px; /* top right bottom left */
cursor: pointer;
line-height: 1.8em;
border: solid #777 1px;
position: relative; /* so that our absolutely positioned elements work */
}
.prompt_demo_tight {
font-size: 10pt;
padding: 10px;
margin: 5px 20px 25px; /* top right bottom left */
cursor: pointer;
@@ -409,7 +399,7 @@ img.delete_icon {
position: relative; /* so that our absolutely positioned elements work */
}
.prompt_demo_tight_selected {
.prompt_demo_selected {
border: solid #00ff00 1px;
}
@@ -425,15 +415,16 @@ img.delete_icon {
cursor: pointer;
}
.prompt_save_button:hover {
.prompt_save_button {
background-color: #333;
border: solid #525252 1px;
color: #ffffff;
margin: 2px 20px 25px; /* top right bottom left */
font-size: 12pt;
}
.prompt_demo_choice_label {
margin: 5px 20px 5px;
cursor: pointer;
margin: 25px 20px 5px;
font-size: 12pt;
white-space: normal;
}
@@ -454,7 +445,7 @@ img.delete_icon {
display: block;
border: 1px solid #555;
background-color: #181818;
margin: 5px 20px 25px;
margin: 5px 20px 5px;
border-radius: 5;
}

View File

@@ -1,17 +1,10 @@
<div style="padding: 0 10px 15px;">
<div class="prompt_demo">
<div ng-bind-html-unsafe="selectedPrompt.demo"></div>
<span class="prompt_save_button" style="position: absolute; right: 2px; bottom: 2px;" ng-click="setNewPrompt(selectedPrompt)" ng-hide="selectedPrompt == samplePrompts[0]">Use</span>
</div>
<div class="prompt_function">
<div class="prompt_function_text">{{ selectedPrompt.function }}</div>
</div>
<div>
<div ng-repeat="prompt in samplePrompts" ng-click="selectPrompt(prompt)">
<div class="prompt_demo_choice_label">{{ prompt.name }}</div>
<div ng-bind-html-unsafe='prompt.demo' ng-class="{'prompt_demo_tight': true, 'prompt_demo_tight_selected': prompt == selectedPrompt}"></div>
<div ng-repeat="prompt in samplePrompts">
<div class="prompt_demo_choice_label">{{ prompt.name }}</div>
<div ng-bind-html-unsafe='prompt.demo' ng-class="{'prompt_demo': true, 'prompt_demo_selected': prompt == selectedPrompt}" ng-click="selectPrompt(prompt)"></div>
<div class="prompt_function" ng-show="selectedPrompt == prompt">
<div class="prompt_function_text">{{ prompt.function }}</div>
</div>
<span class="prompt_save_button" ng-click="setNewPrompt(selectedPrompt)" ng-show="selectedPrompt == prompt && selectedPrompt != samplePrompts[0]">Use</span>
</div>
</div>