Skip to content

Commit

Permalink
馃敡 Basic theme support
Browse files Browse the repository at this point in the history
  • Loading branch information
@felixrieseberg
felixrieseberg committed Aug 13, 2018
1 parent 4025412 commit 37168a9
Show file tree
Hide file tree
Showing 19 changed files with 156 additions and 81 deletions.
4 changes: 2 additions & 2 deletions src/less/chrome-mac.less
View file
@@ -1,8 +1,8 @@
.darwin {
.chrome {
text-align: center;
background-color: @electron-background;
border-bottom: @default-border;
background-color: @background-1;
border-bottom: @border;
-webkit-app-region: drag;
height: 23px;
font-size: 1.4rem;
Expand Down
6 changes: 3 additions & 3 deletions src/less/commands.less
View file
Expand Up @@ -6,7 +6,7 @@
height: 50px;
padding: 10px;
box-sizing: border-box;
font-family: @default-fonts;
font-family: @fonts-common;

button,
input,
Expand Down Expand Up @@ -44,7 +44,7 @@

input,
span {
font-family: @default-fonts;
font-family: @fonts-common;
font-weight: 300;
font-size: 11px;
cursor: auto;
Expand Down Expand Up @@ -105,7 +105,7 @@
&:focus-within {
span,
input {
border-color: @electron-bright;
border-color: @foreground-bright;
}
}
}
Expand Down
28 changes: 14 additions & 14 deletions src/less/core/button.less
View file
Expand Up @@ -2,11 +2,11 @@ button,
input[type='button'],
input[type='reset'],
input[type='submit'] {
background-color: @electron-bright;
border: @default-border;
background-color: @foreground-bright;
border: @border;
border-radius: .4rem;
cursor: pointer;
color: @default-text-color-dark;
color: @text-color-dark;
display: inline-block;
font-size: 1.1rem;
font-weight: 700;
Expand All @@ -20,54 +20,54 @@ input[type='submit'] {

&:hover {
box-shadow: inset 0 0 100px 100px rgba(255, 255, 255, 0.15);
background-color: @electron-brighter;
border-color: @electron-brighter;
background-color: @foreground-brighter;
border-color: @foreground-brighter;
outline: 0;
color: initial;
}

&[disabled] {
cursor: default;
opacity: .5;
border-color: @electron-tuned;
border-color: @foreground-tuned;

&:focus,
&:hover {
border-color: @electron-tuned;
border-color: @foreground-tuned;
background: unset;
color: unset;
}
}

&.button-outline {
background-color: transparent;
color: @electron-bright;
border: @default-border;
color: @foreground-bright;
border: @border;

&:focus,
&:hover {
background-color: transparent;
border-color: @electron-brighter;
color: @electron-brighter;
border-color: @foreground-brighter;
color: @foreground-brighter;
}
}

&.button-clear {
background-color: transparent;
border-color: transparent;
color: @electron-bright;
color: @foreground-bright;

&:focus,
&:hover {
background-color: transparent;
border-color: transparent;
color: @electron-brighter;;
color: @foreground-brighter;;
}

&[disabled] {
&:focus,
&:hover {
color: @electron-bright;
color: @foreground-bright;
}
}
}
Expand Down
2 changes: 1 addition & 1 deletion src/less/core/divider.less
View file
Expand Up @@ -2,6 +2,6 @@

hr {
border: 0;
border-top: @default-border;
border-top: @border;
margin: 3.0rem 0;
}
2 changes: 1 addition & 1 deletion src/less/core/form.less
View file
Expand Up @@ -20,7 +20,7 @@ select {
width: 100%;

&:focus {
border-color: @electron-bright;
border-color: @foreground-bright;
outline: 0;
}
}
Expand Down
2 changes: 1 addition & 1 deletion src/less/core/links.less
View file
@@ -1,5 +1,5 @@
@import "../variables.less";

a {
color: @electron-bright;
color: @foreground-bright;
}
2 changes: 1 addition & 1 deletion src/less/core/table.less
View file
Expand Up @@ -6,7 +6,7 @@ table {
}

td, th {
border-bottom: @default-border;
border-bottom: @border;
padding: 1.2rem 1.5rem;
text-align: left;

Expand Down
26 changes: 13 additions & 13 deletions src/less/dialogs.less
View file
Expand Up @@ -23,8 +23,8 @@
}

.dialog {
background-color: @electron-background-3;
border: @default-border;
background-color: @background-3;
border: @border;
color: #f3f3f3;
border-radius: 6px;
padding: 10px;
Expand Down Expand Up @@ -84,12 +84,12 @@
}

&.arrow-top::after {
border-bottom-color: @electron-background-3;
border-bottom-color: @background-3;
margin-left: -9px;
}

&.arrow-top::before {
border-bottom-color: @default-border-color;
border-bottom-color: @border-color;
margin-left: -10px;
}

Expand All @@ -100,12 +100,12 @@
}

&.arrow-bottom::after {
border-top-color: @electron-background-3;
border-top-color: @background-3;
margin-left: -9px;
}

&.arrow-bottom::before {
border-top-color: @default-border-color;
border-top-color: @border-color;
margin-left: -10px;
}

Expand All @@ -116,12 +116,12 @@
}

&.arrow-left::after {
border-right-color: @electron-background-3;
border-right-color: @background-3;
margin-top: -9px;
}

&.arrow-left::before {
border-right-color: @default-border-color;
border-right-color: @border-color;
margin-top: -10px;
}

Expand All @@ -132,12 +132,12 @@
}

&.arrow-right::after {
border-left-color: @electron-background-3;
border-left-color: @background-3;
margin-top: -9px;
}

&.arrow-right::before {
border-left-color: @default-border-color;
border-left-color: @border-color;
margin-top: -10px;
}

Expand Down Expand Up @@ -165,12 +165,12 @@
color: rgba(159, 234, 249, 0.5);
height: 28px;
margin-top: 10px;
background-color: @electron-background;
border: 1px solid @electron-dark;
background-color: @background-1;
border: 1px solid @border-color-dark;
outline: 0 solid transparent;

&:focus {
border-color: @electron-bright;
border-color: @foreground-bright;
}

&.hasError {
Expand Down
10 changes: 5 additions & 5 deletions src/less/main.less
View file
@@ -1,13 +1,13 @@
body {
padding: 0;
margin: 0;
background: @electron-background-2;
background: @background-2;
overflow: hidden;
display: flex;
flex-direction: column;
height: 100vh;
font-family: @default-fonts;
color: @default-text-color;
font-family: @fonts-common;
color: @text-color;
font-size: 1.6em;
font-weight: 300;
letter-spacing: 0.01em;
Expand Down Expand Up @@ -36,8 +36,8 @@ body {
}

header {
border-bottom: @default-border;
background-color: @electron-background;
border-bottom: @border;
background-color: @background-1;
-webkit-app-region: drag;
}

Expand Down
4 changes: 2 additions & 2 deletions src/less/mosaic.less
View file
Expand Up @@ -39,7 +39,7 @@
height: 100vh;

&.mosaic-blueprint-theme {
background: @electron-background-2;
background: @background-2;
}
}

Expand All @@ -50,6 +50,6 @@
}

.editorContainer {
background: @electron-background;
background: @background-1;
}
}
4 changes: 2 additions & 2 deletions src/less/output.less
View file
Expand Up @@ -2,7 +2,7 @@

.output {
font-size: 12px;
font-family: @default-fonts;
font-family: @fonts-common;
font-weight: 600;
color: #f3f3f3;
background: rgba(0, 0, 0, 0.4);
Expand All @@ -16,7 +16,7 @@
-webkit-app-region: no-drag;

&.showing {
border-top: @default-border;
border-top: @border;
padding-top: 10px;
height: 150px;
}
Expand Down
10 changes: 5 additions & 5 deletions src/less/resets.less
View file
Expand Up @@ -6,24 +6,24 @@ button:focus {
}

pre.prettyprint .lit {
color: @electron-bright;
color: @foreground-bright;
}

.share-icon {
background-color: @electron-bright;
background-color: @foreground-bright;
color: white;
}

pre {
background: #f4f5f6;
border-left: 0.3rem solid @electron-bright;
border-left: 0.3rem solid @foreground-bright;

&.prettyprint {
border-left: 0.3rem solid @electron-bright !important;
border-left: 0.3rem solid @foreground-bright !important;
color: #655d5d;

.tag {
color: @electron-bright;
color: @foreground-bright;
}

.atn {
Expand Down
14 changes: 7 additions & 7 deletions src/less/settings.less
View file
@@ -1,7 +1,7 @@
@import "variables.less";

.settings {
background: @electron-background-3;
background: @background-3;
z-index: 10;
position: absolute;
height: 100%;
Expand Down Expand Up @@ -67,8 +67,8 @@
}

svg {
background: @electron-background-3;
box-shadow: 0 0 12px 6px @electron-background-3;
background: @background-3;
box-shadow: 0 0 12px 6px @background-3;
}
}

Expand Down Expand Up @@ -112,7 +112,7 @@
.settings-menu {
height: 100%;
width: 250px;
background-color: @electron-background;
background-color: @background-1;
user-select: none;

ul {
Expand All @@ -122,18 +122,18 @@

li {
padding-bottom: 5px;
border-bottom: @default-border;
border-bottom: @border;
color: rgba(255, 255, 255, 0.8);

&:hover {
padding-bottom: 5px;
border-bottom: @default-border;
border-bottom: @border;
color: rgb(255, 255, 255);
cursor: pointer;
}

&.selected {
color: @electron-bright;
color: @foreground-bright;
}
}
}
Expand Down

0 comments on commit 37168a9

Please sign in to comment.