diff --git a/public/themes/default.css b/public/themes/default.css index bbf0789c..c015dbbf 100644 --- a/public/themes/default.css +++ b/public/themes/default.css @@ -87,7 +87,7 @@ --form-element-border-color: rgba(241, 246, 243, 0.15); --form-element-bg-color: var(--app-bg-color); --form-element-text-color: var(--app-text-primary-color); - --form-element-primary-text-color: var(--form-element-text-color); + --form-element-primary-text-color: var(--app-text-primary-color); --form-element-label-color: var(--app-text-secondary-color); --form-element-primary-color: var(--app-accent-color); --form-element-secondary-color: rgba(255, 255, 255, 0.2); diff --git a/public/themes/light.css b/public/themes/light.css index ce4a3256..7431c68a 100644 --- a/public/themes/light.css +++ b/public/themes/light.css @@ -36,8 +36,8 @@ /* form colors */ --form-element-border-color: rgba(0, 0, 0, 0.3); --form-element-bg-color: var(--app-bg-color); - --form-element-text-color: var(--app-text-color); - --form-element-primary-text-color: var(--app-bg-color); + --form-element-text-color: var(--app-text-primary-color); + --form-element-primary-text-color: var(--app-text-primary-color); --form-element-label-color: rgba(0, 0, 0, 0.6); --form-element-secondary-color: rgba(0, 0, 0, 0.09); --form-element-icon-color: rgb(0, 0, 0, 0.6); diff --git a/src/app/common/elements/button.less b/src/app/common/elements/button.less index e992f72a..15a86b4b 100644 --- a/src/app/common/elements/button.less +++ b/src/app/common/elements/button.less @@ -27,6 +27,10 @@ } } + &.primary.danger { + background: var(--app-error-color); + } + &.primary.outlined { background: none; border: 1px solid var(--form-element-primary-color); @@ -36,6 +40,37 @@ } } + &.primary.greyoutlined { + background: none; + border: 1px solid var(--app-text-secondary-color); + + i { + fill: var(--app-text-secondary-color); + } + } + + &.primary.outlined, + &.primary.greyoutlined { + &.hover-danger:hover { + color: var(--form-element-primary-text-color); + border: 1px solid var(--app-error-color); + background: var(--app-error-color); + } + } + + &.primary.outlined.danger { + background: none; + border: 1px solid var(--app-error-color); + + i { + fill: var(--app-error-color); + } + } + + &.greytext { + color: var(--app-text-secondary-color); + } + &.primary.ghost { background: none; i { @@ -43,6 +78,13 @@ } } + &.primary.ghost.danger { + background: none; + i { + fill: var(--app-error-color); + } + } + &.secondary { color: var(--form-element-text-color); background: var(--form-element-secondary-color); @@ -56,6 +98,11 @@ border: 1px solid var(--form-element-text-color); } + &.secondary.outlined.danger { + background: none; + border: 1px solid var(--app-error-color); + } + &.secondary.ghost { background: none; } diff --git a/src/app/workspace/screen/screenview.less b/src/app/workspace/screen/screenview.less index c458532a..ae2bd411 100644 --- a/src/app/workspace/screen/screenview.less +++ b/src/app/workspace/screen/screenview.less @@ -161,11 +161,11 @@ } .newtab-container { - margin: 16px; + margin: 8px 16px 0 16px; .newtab-section { display: flex; - padding: 16px; + padding: 10px 16px; flex-direction: column; align-items: flex-start; gap: 8px; diff --git a/src/app/workspace/screen/screenview.tsx b/src/app/workspace/screen/screenview.tsx index bd907ca6..2c088d99 100644 --- a/src/app/workspace/screen/screenview.tsx +++ b/src/app/workspace/screen/screenview.tsx @@ -558,9 +558,6 @@ class ScreenWindowView extends React.Component<{ session: Session; screen: Scree return (