Skip to content

Commit

Permalink
redesign continued
Browse files Browse the repository at this point in the history
  • Loading branch information
@Piefayth
Piefayth committed Apr 3, 2024
1 parent ad37cc7 commit 32d1c01
Show file tree
Hide file tree
Showing 15 changed files with 393 additions and 257 deletions.
114 changes: 100 additions & 14 deletions src/App.css
View file
Original file line number Diff line number Diff line change
@@ -1,3 +1,18 @@
:root {
--main-background-color: #34517d;
--main-background-dark: #273d5e;
--main-background-darker: #1e2e46;
--main-background-darkest:rgb(20, 31, 47);
--main-background-blackened:rgb(12, 18, 28);
--button-primary: #12784d;
--button-primary-hover: #1ba96e;
--button-primary-active: #06995c;
--button-danger: rgb(155, 48, 48);
--button-danger-hover: rgb(184, 58, 58);
--button-danger-active: rgb(185, 41, 41);
--scrollbar-color: rgba(205, 210, 234, 0.509);
}

#root {
margin: 0 auto;
text-align: center;
Expand All @@ -10,8 +25,27 @@ body {
overflow-y: hidden;
padding: 0;
margin: 0;
background-color: #5a173c;
background-image: linear-gradient(225deg, #5a173c 0%, #331e43 45%, #154160 100%);
background-color: var(--main-background-color);
/*background-image: linear-gradient(270deg, #5a173c -50%, #543e77 -25%, #145787 100%);*/
/* background-image: linear-gradient(225deg, #5a173c 0%, #331e43 45%, #154160 100%); */
}

.flex-row {
display: flex;
justify-content: start;
align-items: center;
}

.flex-column {
display: flex;
flex-direction: column;
justify-content: center;
align-items: start;
}

.lr {
justify-content: start;
align-items: center;
}

.main-layout-container {
Expand All @@ -28,10 +62,10 @@ body {
max-width: 100%;
max-height: 100%;
height: 100%;
margin-top: 6px;
}

.editor-container {
/*background-color: rgb(83, 76, 165);*/
display: flex;
flex-direction: column;
width: 100%;
Expand All @@ -57,6 +91,7 @@ body {
}

.management-panel-container {
/*background-color: rgb(101, 101, 101);*/
display: flex;
flex-direction: column;
max-width: 40vw;
Expand Down Expand Up @@ -114,46 +149,97 @@ body {
}

.disabled {
opacity: 0.5;

opacity: 0.2;
cursor: not-allowed !important;
}

button.disabled {
background-color: rgb(0, 0, 0);
}

button.disabled:hover {
background-color: rgb(0, 0, 0);
}

.disabled:hover {
background-color: #00000000;
background-color: #00000099;
cursor: default;
}

.copy-widget {
margin-left: 10px;
}

.select {
border-radius: 0px;
border: none;

border-bottom: solid 1px #ffffff55;
min-width: 100px;
background-color: var(--main-background-darkest);
padding: 5px;
}

input {
border-radius: 0px;
border: solid 1px #ffffff77;
}
input:hover {
border: 1px solid rgb(158, 172, 181);
outline: none;
}
input:focus {
border: 1px solid rgb(158, 172, 181);
outline: none;
}

.text-input {
border: 1px solid white;
font-size: 15px;
background-color: #00000000;
height: 17px;
}


.input-label {
font-size: 12px;
font-weight: bold;
margin-bottom: 2px;
margin-bottom: 4px;
}

.button {
font-size: 16px;
background-color: rgb(22, 49, 115);
border: solid 1px rgb(158, 172, 181);
padding: 2px;
outline: none;
border: solid 1px black;
padding: 5px;
background-color: var(--button-primary);
}

.button:hover {
background-color: rgb(32, 80, 128);
cursor: pointer;
background-color: var(--button-primary-hover);
}

.button:active {
background-color: rgb(103, 148, 193);
cursor: pointer;
background-color: var(--button-primary-active);
}

.danger-button {
background-color: var(--button-danger);
}

.danger-button:hover {
background-color: var(--button-danger-hover);
}

.danger-button:active {
background-color: var(--button-danger-active);
}

@supports ( -moz-appearance:none ){
.file-manager-file-list {
scrollbar-width: thin;
scrollbar-color: rgba(213, 213, 213, 0.163) #00000000;
scrollbar-color: var(--scrollbar-color) #0000;
scrollbar-gutter: stable;
}
}
Expand Down
2 changes: 1 addition & 1 deletion src/features/aiken/projectSlice.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,7 @@ export const projectSlice = createSlice({
}
})
}

console.log(state.buildResults)

},
}
Expand Down
5 changes: 4 additions & 1 deletion src/features/management/managementSlice.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ export interface ContractInput {
script: Script,
name: string,
paramsFileName: string,
paramsContent: string,
address: string,
scriptHash: string
}
Expand All @@ -27,6 +28,7 @@ export type AddressUpdate = Record<string, string> // <oldAddress, newAddress>

export type Contract = {
version: number,
createdAt: number,
} & ContractInput

interface ManagementState {
Expand Down Expand Up @@ -113,7 +115,8 @@ const managementSlice = createSlice({

state.contracts.unshift({
...action.payload,
version
version,
createdAt: new Date().valueOf()
})
},
removeContract(state, action: PayloadAction<DeleteContractInput>) {
Expand Down
29 changes: 16 additions & 13 deletions src/panels/TopBar.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,47 +8,50 @@
min-height: 45px;
overflow: hidden;
padding-top: 5px;
padding-bottom: 5px;
border: 1px solid black;
gap: 20px;
background-color: #00000022;
background-color: var(--main-background-darker);
padding-left: 10px;
padding-right: 10px;
box-shadow: inset 15px 0px 25px 1px rgb(0, 0, 0, 0.18);
}

.editor-top-bar {
display: flex;
justify-content: space-between;
align-items: center;
gap: 20px;

margin-right: 8px;
box-shadow: inset 7px 0px 11px 1px rgb(0, 0, 0, 0.18);
}

.management-top-bar {
box-shadow: inset -7px 0px 11px 1px rgb(0, 0, 0, 0.18);
}

.top-bar-item {
padding: 5px;
margin-top: none;
}

.title-logo {
margin-bottom: 6px;
}

.editor-top-bar-item {
margin-top: none;
background-color: var(--main-background-color);
border: 1px solid rgba(0, 0, 0, 1.0);
min-width: 50px;
font-size: 13px;
transition: background-color linear 0.2s;
}

.editor-top-bar-item:hover {
cursor: pointer;
}

.no-last-build-notice {
margin-left: 10px;
background-color: var(--main-background-darkest);
transition: background-color ease 0.2s;
}

.editor-top-bar-right-side {
display: flex;
gap: 20px;
font-size: 16px;
gap: 10px;
}

.editor-top-bar-left-side {
Expand Down
22 changes: 11 additions & 11 deletions src/panels/editor/Editor.css
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
.monaco-editor {
--vscode-editorGutter-background: #00000077 !important;
--vscode-editorGutter-background: var(--main-background-darkest) !important;
--vscode-editor-background: #00000000 !important;
}

Expand All @@ -13,12 +13,13 @@
bottom: 0;
pointer-events: none;
/* Allows clicks to pass through to the scrollbar */
background-color: #00000077;
z-index: -100;

box-shadow: inset -15px -25px 25px 1px rgb(0, 0, 0, 0.18);
background-color:var(--main-background-darkest)
}


.margin-view-overlays {
box-shadow: inset 15px 0px 25px 1px rgb(0, 0, 0, 0.18);
}
Expand All @@ -29,6 +30,7 @@

.slider {
width: 8px !important;
background: var(--scrollbar-color);
}

.decorationsOverviewRuler {
Expand All @@ -46,7 +48,6 @@
overflow-x: scroll;
overflow-y: scroll;
padding: 0px;
/* scrollbar-color: rgba(213, 213, 213, 0.163) #00000000; */
background-color: #00000000;
min-height: 35px;
font-size: 13px;
Expand All @@ -55,7 +56,7 @@
@supports (-moz-appearance:none) {
.editor-tab-container {
scrollbar-width: thin;
scrollbar-color: rgba(213, 213, 213, 0.163) #00000000;
scrollbar-color: var(--scrollbar-color) #0000;
scrollbar-gutter: stable;
}
}
Expand All @@ -71,19 +72,19 @@
border-bottom: 1px solid black;
box-sizing: border-box;
box-shadow: inset 0px -3px 3px 0px rgba(0, 0, 0, 0.38);
background-color: #00000022;
background-color: var(--main-background-dark);
}

.editor-tab-container .editor-tab:first-child {
border-left: 1px solid black;
}

.highlight-open-focused-tab {
background-color: #00000055;
background-color: var(--main-background-darkest);
}

.editor-tab:not(.highlight-open-focused-tab):hover {
background-color: #ffffff09;
background-color: var(--main-background-color);
}

.editor-tab:hover {
Expand All @@ -101,8 +102,7 @@
display: flex;
flex-direction: column;
min-width: 10vw;
height: calc(97vh - 42px);
background-color: #00000000;
height: calc(97vh - 26px);
}

.file-manager-header {
Expand Down Expand Up @@ -135,15 +135,15 @@
padding: 0;
margin: 0;
width: 100%;
background-color: #00000044;
background-color: var(--main-background-darker);
flex-grow: 1;
box-shadow: inset -4px 0px 25px 1px rgba(0, 0, 0, 0.18);
}

@supports (-moz-appearance:none) {
.file-manager-file-list {
scrollbar-width: thin;
scrollbar-color: rgba(213, 213, 213, 0.163) #00000000;
scrollbar-color: var(--scrollbar-color) #0000;
scrollbar-gutter: stable;
}
}
Expand Down
3 changes: 2 additions & 1 deletion src/panels/editor/MonacoEditor.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -146,10 +146,11 @@ function MonacoEditor({ onLoad }: MonacoEditorProps) {
}
>
<Editor
height="calc(97vh - 76px)"
height="calc(97vh - 60px)"
width="100%"
theme="aiken-theme"
defaultLanguage="aiken"
className='monaco-customizer'
defaultValue={files.files[0].content}
options={{ minimap: { enabled: false } }}
onMount={handleEditorDidMount}
Expand Down
Loading

0 comments on commit 32d1c01

Please sign in to comment.