file settings layout

app/scripts/models/file-model.js

@@ -10,6 +10,7 @@ var FileModel = Backbone.Model.extend({
     defaults: {
         name: '',
         keyFileName: '',
+        passwordLength: 0,
         path: '',
         modified: false,
         open: false,
@@ -48,7 +49,7 @@ var FileModel = Backbone.Model.extend({
             return;
         }
         this.readModel(this.get('name'));
-        this.set({ open: true, opening: false, error: false });
+        this.set({ open: true, opening: false, error: false, passwordLength: len });
     },
 
     create: function(name) {

app/styles/areas/_details.scss

@@ -158,6 +158,7 @@
         padding: 0 $base-padding-h;
         line-height: $details-field-line-height;
         height: $details-field-line-height;
+        width: 100%;
         @include th { color: text-color(); }
       }
     }
@@ -197,6 +198,7 @@
         margin: 0;
         padding: 0 $base-padding-h;
         line-height: $details-field-line-height;
+        width: 100%;
         height: 20px;
       }
       >textarea {

app/styles/areas/_list.scss

@@ -39,6 +39,7 @@
       position: relative;
     }
     &-field {
+      width: 100%;
     }
     &-icon-search {
       @include th { color: muted-color(); }

app/styles/areas/_settings.scss

@@ -43,7 +43,7 @@
     }
   }
 
-  &__select {
+  &__select, &__input {
     width: 60%;
     height: 2em;
     @media (max-width: 800px) {

app/styles/base/_forms.scss

@@ -28,7 +28,7 @@ label {
   }
 }
 
-#{$all-text-inputs} {
+input[type=text], input[type=password], textarea, input:not([type]) {
   border-radius: $base-border-radius;
   box-sizing: border-box;
   font-family: $base-font-family;
@@ -36,7 +36,6 @@ label {
   margin-bottom: $small-spacing;
   padding: $base-spacing / 3;
   transition: border-color $base-duration $base-timing;
-  width: 100%;
 
   &::-ms-clear { display: none; }
 

app/templates/settings/settings-file.html

@@ -1,8 +1,34 @@
 <h1><i class="fa fa-lock"></i> <%- file.get('name') %></h1>
 <p>This database is opened as local file. To enable auto-save and saving with shortcut <%= cmd %>S,
 please, save it to Dropbox.</p>
-<div class="settings__file-buttons">
-    <button class="settings__file-button-save-file btn-silent">Save to file</button>
-    <button class="settings__file-button-export-xml btn-silent">Export to XML</button>
-    <button class="settings__file-button-save-dropbox btn-silent">Save to Dropbox</button>
-</div>
+<form>
+    <div class="settings__file-buttons">
+        <button class="settings__file-button-save-file btn-silent">Save to file</button>
+        <button class="settings__file-button-export-xml btn-silent">Export to XML</button>
+        <button class="settings__file-button-save-dropbox btn-silent">Save to Dropbox</button>
+    </div>
+
+    <h2>Settings</h2>
+    <label for="settings__file-master-key">Master key:</label>
+    <input type="password" class="settings__input" id="settings__file-master-key" value="<%- file.get('passwordLength') %>" />
+    <input type="checkbox" class="settings__input" id="settings__file-key-file" <%- file.keyFileName ? 'checked' : '' %> />
+    <label for="settings__file-key-file">Use key file</label>
+
+    <h2>Names</h2>
+    <label for="settings__file-name">Name:</label>
+    <input type="text" class="settings__input" id="settings__file-name" value="<%- file.get('name') %>" />
+    <label for="settings__file-def-user">Default username:</label>
+    <input type="text" class="settings__input" id="settings__file-def-user" value="<%- file.db.meta.defaultUser %>" />
+
+    <h2>History</h2>
+    <input type="checkbox" class="settings__input" id="settings__file-trash" <%- file.db.meta.recycleBinEnabled ? 'checked' : '' %> />
+    <label for="settings__file-trash">Enable trash</label>
+    <label for="settings__file-hist-len">History length, keep last records per entry:</label>
+    <input type="text" class="settings__input" id="settings__file-hist-len" value="<%- file.db.meta.historyMaxItems %>" />
+    <label for="settings__file-hist-size">History size, total MB per file:</label>
+    <input type="text" class="settings__input" id="settings__file-hist-size" value="<%- file.db.meta.historyMaxSize/1024/1024 %>" />
+
+    <h2>Advanced</h2>
+    <label for="settings__file-key-rounds">Key encryption rounds:</label>
+    <input type="text" class="settings__input" id="settings__file-key-rounds" value="<%- file.db.header.keyEncryptionRounds %>" />
+</form>