modify: adjust space on note-detail component

browser/main/Detail/DetailVars.styl

@@ -0,0 +1,7 @@
+/**
+ * Varibales for note detail space.
+ */
+
+// Margin on the left side and the right side for NoteDetail component.
+$note-detail-left-margin = 25px
+$note-detail-right-margin = 25px

browser/main/Detail/MarkdownNoteDetail.styl

@@ -1,14 +1,18 @@
 @import('NoteDetailInfo')
+@import('DetailVars')
 
 .root
   absolute top right bottom
   border-width 0 0 1px
   border-style solid
   border-color $ui-borderColor
+  background-color $ui-noteDetail-backgroundColor
 
 .body
   absolute left right
-  top $info-height
+  left $note-detail-left-margin
+  right $note-detail-right-margin
+  top $info-height + $info-margin-under-border
   bottom $statusBar-height
 
 .body-noteEditor
@@ -17,3 +21,4 @@
 body[data-theme="dark"]
   .root
     border-color $ui-dark-borderColor
+    background-color $ui-dark-noteDetail-backgroundColor

browser/main/Detail/NoteDetailInfo.styl

@@ -1,7 +1,12 @@
+@import('DetailVars')
+
 $info-height = 60px
+$info-margin-under-border = 27px
 
 .info
   absolute top left right
+  left $note-detail-left-margin
+  right $note-detail-right-margin
   height $info-height
   border-bottom $ui-border
   background-color $ui-noteDetail-backgroundColor

browser/main/Detail/SnippetNoteDetail.styl

@@ -1,14 +1,18 @@
 @import('NoteDetailInfo')
+@import('DetailVars')
 
 .root
   absolute top bottom right
   border-width 0 0 1px
   border-style solid
   border-color $ui-borderColor
+  background-color $ui-noteDetail-backgroundColor
 
 .body
   absolute left right
-  top $info-height
+  left $note-detail-left-margin
+  right $note-detail-right-margin
+  top $info-height + $info-margin-under-border
   bottom $statusBar-height
   background-color $ui-noteDetail-backgroundColor
 
@@ -65,6 +69,7 @@
 body[data-theme="dark"]
   .root
     border-color $ui-dark-borderColor
+    background-color $ui-dark-noteDetail-backgroundColor
 
   .body
     background-color $ui-dark-noteDetail-backgroundColor

browser/main/Detail/TagSelect.styl

@@ -3,7 +3,7 @@
   position relative
   user-select none
   vertical-align middle
-  width 400px
+  width 300px
   overflow-x scroll
   white-space nowrap