Dodanie selectów do wyboru paneli.

diff --git a/project/static/css/master.css b/project/static/css/master.css
index c7a6dde..c983589 100644 (file)
--- a/project/static/css/master.css
+++ b/project/static/css/master.css
@@ -77,14 +77,34 @@ label {
 /* ========== */
 /* = Panels = */
 /* ========== */
+.panel-wrap {
+    position: relative;
+    overflow: hidden;
+}
+
 #left-panel-wrap {
     float: left;
     width: 8px;
+}
+
+
+/* Toolbars with select box to change panel contents*/
+.panel-toolbar {
+    height: 20px;
+    padding: 0 0 2px 0;
+    border-top: 1px solid #AAA;
+    border-bottom: 1px solid #AAA;
+    font-size: 12px;
+    line-height: 20px;
+    background-color: #DDD;
+    white-space: nowrap;
     overflow: hidden;
 }
 
-#right-panel-wrap {
-    
+.panel-toolbar label {
+    display: block;
+    float: left;
+    margin: 0 10px 0 2px;
 }
 
 /* Slider between panels */

diff --git a/project/templates/explorer/file_xml.html b/project/templates/explorer/file_xml.html
index b906512..5a6a443 100644 (file)
--- a/project/templates/explorer/file_xml.html
+++ b/project/templates/explorer/file_xml.html
@@ -14,7 +14,7 @@
             // ========================
             function resizePanels() {
                 $('.panel').height($(window).height() - $('.panel').position().top);
-                $('#right-panel-wrap').width($(window).width() - $('#right-panel-wrap').position().left);
+                $('#right-panel-wrap').width($(window).width() - $('#left-panel-wrap').outerWidth());
             }
             
             $(window).resize(function() {
@@ -114,10 +114,24 @@
             <div id="left-panel-wrap" class="panel-wrap">
                 <div id="left-panel" class="panel">
                     <div id="slider" style="float: right"></div>
+                    <div id="left-panel-toolbar" class="panel-toolbar">
+                        <label for="select-left-panel">Lewy panel:</label>
+                        <select name="select-left-panel" id="select-left-panel">
+                            <option value="panel1">Panel 1</option>
+                            <option value="panel2">Panel 2</option>                            
+                        </select>
+                    </div>
                 </div>
             </div>
             <div id="right-panel-wrap" class="panel-wrap">
                 <div id="right-panel" class="panel">
+                    <div id="right-panel-toolbar" class="panel-toolbar">
+                        <label for="select-right-panel">Prawy panel:</label>
+                        <select name="select-right-panel" id="select-right-panel">
+                            <option value="panel1">Panel 1</option>
+                            <option value="panel2">Panel 2</option>                            
+                        </select>
+                    </div>
                     {# <textarea id="id_text" name="text" width="480px">{{ form.text.field.initial }}</textarea> #}
                 </div>
             </div>