diff --git a/Seenginx/Components/FilesWithEditor.razor b/Seenginx/Components/FilesWithEditor.razor index 7190e85..8f03b99 100644 --- a/Seenginx/Components/FilesWithEditor.razor +++ b/Seenginx/Components/FilesWithEditor.razor @@ -58,25 +58,18 @@
@foreach (var file in Files) { -
-

@file.Folder

-

@file.Name

-
+
+

@file.Folder

+

@file.Name

+
}
- @if (IsAnyFileSelected) - { -
- -
- } - else - { - - } +
+ +
diff --git a/Seenginx/Components/FilesWithEditor.razor.cs b/Seenginx/Components/FilesWithEditor.razor.cs index e18a1c0..256f98c 100644 --- a/Seenginx/Components/FilesWithEditor.razor.cs +++ b/Seenginx/Components/FilesWithEditor.razor.cs @@ -1,5 +1,6 @@ using Microsoft.AspNetCore.Components; using Microsoft.AspNetCore.Components.Web; +using Microsoft.JSInterop; using Seenginx.Models; using System; using System.Collections.Generic; @@ -12,6 +13,9 @@ namespace Seenginx.Components public partial class FilesWithEditor : ComponentBase where CFile : ConfigFile { + [Inject] + public IJSRuntime JsRuntime { get; set; } + [Parameter] public List Files { get; set; } = new List(); @@ -69,6 +73,7 @@ namespace Seenginx.Components protected async Task OnDeselectClick() { + await JsRuntime.InvokeVoidAsync("DeleteEditor"); SelectedFile = null; await SelectedFileChanged.InvokeAsync(SelectedFile); } @@ -140,6 +145,7 @@ namespace Seenginx.Components { Files.ForEach(f => f.Deselect()); file.Select(); + await JsRuntime.InvokeVoidAsync("InitEditor", file.OriginalBody); await SelectedFileChanged.InvokeAsync(file); } diff --git a/Seenginx/Pages/_Host.cshtml b/Seenginx/Pages/_Host.cshtml index 03a7da0..17747d0 100644 --- a/Seenginx/Pages/_Host.cshtml +++ b/Seenginx/Pages/_Host.cshtml @@ -13,7 +13,7 @@ Seenginx - @**@ + @@ -43,5 +43,8 @@ + + + diff --git a/Seenginx/SCSS/override-framework.scss b/Seenginx/SCSS/override-framework.scss index 0390437..6ea953d 100644 --- a/Seenginx/SCSS/override-framework.scss +++ b/Seenginx/SCSS/override-framework.scss @@ -25,7 +25,32 @@ html { font-family: Ubuntu-Mono,'Noto Mono' } -.menu-list a.active { - background-color: #3273dc; - color: #fff; +.editor { + border-radius: 6px; + box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2); + font-family: 'Source Code Pro', monospace; + font-size: 14px; + font-weight: 400; + height: 100%; + min-height:10%; + max-height:100%; + letter-spacing: normal; + line-height: 20px; + padding: 10px; + tab-size: 4; +} + +.token.number { + align-items: initial; + background-color: initial; + border-radius: initial; + display: initial; + font-size: initial; + height: initial; + justify-content: initial; + margin-right: initial; + min-width: initial; + padding: initial; + text-align: initial; + vertical-align: initial; } \ No newline at end of file diff --git a/Seenginx/SCSS/template.scss b/Seenginx/SCSS/template.scss index 80f51b8..d56145a 100644 --- a/Seenginx/SCSS/template.scss +++ b/Seenginx/SCSS/template.scss @@ -43,17 +43,36 @@ grid-area: files; display: block; min-height: 10%; + padding: 4% 0; & .confFile { padding: 4% 6%; margin-bottom: 3%; } + + &List { + display: flex; + flex-direction: column; + align-items: stretch; + height: 100%; + min-height: 10%; + width: 100%; + padding: 4% 8%; + overflow-y: auto; + } } & .codeEditor { grid-area: codeEditor; + min-height: 0; + height: 100%; - & .textarea { + & .editor { + height: 100%; + margin: 0 + } + + & .CodeMirror.cm-s-default { height: 100%; } } @@ -67,16 +86,6 @@ } } -.files { - - &List { - display: flex; - flex-direction: column; - align-items: stretch; - height: 100%; - min-height: 10%; - width: 100%; - padding: 8%; - overflow-y: auto; - } +.menu-list > li > .neoFile { + margin-bottom: 4% } diff --git a/Seenginx/SCSS/utility.scss b/Seenginx/SCSS/utility.scss index ab2c935..4d14860 100644 --- a/Seenginx/SCSS/utility.scss +++ b/Seenginx/SCSS/utility.scss @@ -78,18 +78,23 @@ } &File { - box-shadow: 0px 0px 0px rgba($light-shadow, .5), 0px 0px 0px rgba($dark-shadow, .5); + box-shadow: 0px 0px 0px rgba($light-shadow, .5), 0px 0px 0px rgba($dark-shadow, .5) !important; transition: all .2s linear; - -webkit-backface-visibility: hidden; - backface-visibility: hidden; - background: $background; + -webkit-backface-visibility: hidden !important; + backface-visibility: hidden !important; + background: $background !important; &:hover { - box-shadow: -3px -3px 6px rgba($light-shadow, .5), 3px 3px 6px rgba($dark-shadow, .5); + box-shadow: -3px -3px 6px rgba($light-shadow, .5), 3px 3px 6px rgba($dark-shadow, .5) !important; } &.isSelected { - box-shadow: inset 3px 3px 6px rgba($dark-shadow, .5),inset -3px -3px 6px rgba($light-shadow, .5); + box-shadow: inset 3px 3px 6px rgba($dark-shadow, .5),inset -3px -3px 6px rgba($light-shadow, .5) !important; + } + + &.is-active, &.active { + box-shadow: inset 3px 3px 6px rgba($dark-shadow, .5),inset -3px -3px 6px rgba($light-shadow, .5) !important; + color: $color-black !important; } } } @@ -102,7 +107,7 @@ border-radius: $border-radius; &Small { - border-radius: $border-radius-s; + border-radius: $border-radius-s !important; } &Big { diff --git a/Seenginx/SCSS/variables.scss b/Seenginx/SCSS/variables.scss index 91b884d..a7df5f9 100644 --- a/Seenginx/SCSS/variables.scss +++ b/Seenginx/SCSS/variables.scss @@ -5,4 +5,5 @@ $background: rgba(246,210,135,1); $background-light: rgba(247, 215, 148,1); $background-dark: rgba(245, 205, 121,1); $light-shadow: hsl(41, 86%, 90%); -$dark-shadow: hsl(41, 86%, 60%); \ No newline at end of file +$dark-shadow: hsl(41, 86%, 60%); +$color-black: rgb(24,21,21) \ No newline at end of file diff --git a/Seenginx/Seenginx.csproj b/Seenginx/Seenginx.csproj index d4d010a..21f0d22 100644 --- a/Seenginx/Seenginx.csproj +++ b/Seenginx/Seenginx.csproj @@ -10,7 +10,6 @@ - diff --git a/Seenginx/Shared/NavMenu.razor b/Seenginx/Shared/NavMenu.razor index a31c4b7..be554db 100644 --- a/Seenginx/Shared/NavMenu.razor +++ b/Seenginx/Shared/NavMenu.razor @@ -13,7 +13,7 @@