1580158
/
sd-webui-lobe-theme
mirror of https://github.com/canisminor1990/sd-webui-lobe-theme.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #493 from kaalibro/fix/styles 

💄 style: Style fixes
pull/495/head
kaalibro 2023-12-16 13:07:41 +06:00 committed by GitHub
parent 52c08974a1 75b009d81d
commit 052d4f0a93
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 220 additions and 114 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

181
javascript/main.js
View File

File diff suppressed because one or more lines are too long

11
src/features/Content/style.ts
View File

@ -285,8 +285,8 @@ export const useStyles = createStyles(
margin: 0 !important;
padding: 16px !important;
background-color: ${token.colorBgContainer}!important;
border-radius: ${token.borderRadius}px !important;
background-color: ${token.colorBgContainer};
border-radius: ${token.borderRadius}px;
}
.gradio-tabitem:has(.gradio-image) {
@ -360,7 +360,12 @@ export const useStyles = createStyles(
background: transparent !important;
> div {
background-color: ${token.colorBgContainer}!important;
background-color: ${token.colorBgContainer};
border-radius: ${token.borderRadius}px !important;
}
span.icon {
margin-right: 0;
}
}

2
src/modules/PromptHighlight/features/promptTheme.ts
View File

@ -19,7 +19,7 @@ export const themeConfig: any = (isDarkMode: ThemeAppearance) => {
{
scope: 'comma',
settings: {
foreground: colorScales.gray[type][6],
foreground: colorScales.gray[type][11],
},
},
{

44
src/styles/components/extensions.ts
View File

@ -87,9 +87,10 @@ export default (token: Theme) => {
/* Aspect Ratio selector */
[id$='2img_container_aspect_ratio'] {
padding: var(--block-padding);
padding: 16px;
background-color: ${token.colorBgContainer};
border: 1px solid var(--block-border-color);
border-radius: 8px;
border-radius: ${token.borderRadius}px;
#arc_empty_space {
display: none;
@ -106,10 +107,12 @@ export default (token: Theme) => {
font-weight: 500;
border: none;
border-radius: 0.5em;
border-radius: ${token.borderRadius}px;
}
#arc_panel {
padding: 8px 0 0 !important;
.block.gradio-markdown.padded.hide-container {
.hide,
.pending {
@ -139,6 +142,41 @@ export default (token: Theme) => {
align-self: end;
}
}
/* WebUI txt2img/img2img Extra options */
.gr-group:has([id^='extra_options_'].gradio-accordion) {
padding: 4px 0 !important;
}
.gr-group:has([id^='extra_options_'].gradio-group) {
padding: 0 0 4px !important;
}
.gr-group:has([id^='extra_options_']) {
background: transparent;
.styler {
flex-grow: 1;
}
[id^='extra_options_'] {
&.gradio-accordion {
background-color: ${token.colorBgContainer};
}
&.gradio-group {
padding: 16px;
background-color: ${token.colorBgContainer};
border-radius: ${token.borderRadius}px;
}
.styler,
.gap,
.form {
gap: 16px;
}
}
}
}
`;
};

6
src/styles/components/input.ts
View File

@ -6,6 +6,12 @@ export default (token: Theme) => {
margin: 0 !important;
}
.block.gradio-slider {
input[type='number'] {
margin-left: 12px;
}
}
label:has(input[type='radio']),
label:has(input[type='checkbox']) {
border-radius: ${token.borderRadius}px !important;

90
src/styles/components/popup.ts
View File

@ -1,59 +1,63 @@
import { Theme, css } from 'antd-style';
export default (token: Theme) => css`
.global-popup-close {
background-color: ${token.colorBgMask} !important;
backdrop-filter: blur(4px);
.global-popup {
.global-popup-close {
background-color: ${token.colorBgMask} !important;
backdrop-filter: blur(4px);
&::before {
font-size: 24px !important;
line-height: 24px !important;
}
}
.global-popup-inner {
> div {
border-radius: ${token.borderRadiusLG}px !important;
box-shadow: ${token.boxShadow} !important;
&::before {
font-size: 24px !important;
line-height: 24px !important;
}
}
.popup-metadata {
overflow: auto;
.global-popup-inner {
max-height: unset;
width: 75vw;
max-height: 85vh;
padding: 32px;
font-family: ${token.fontFamilyCode};
color: ${token.colorText};
word-break: break-word;
background: ${token.colorBgLayout};
border-radius: ${token.borderRadiusLG}px !important;
border-radius: ${token.borderRadius}px;
box-shadow: ${token.boxShadow} !important;
}
.edit-user-metadata {
> div:not(.edit-user-metadata-buttons):not(:last-child) {
margin: 0 0 8px;
> div {
border-radius: ${token.borderRadiusLG}px !important;
box-shadow: ${token.boxShadow} !important;
}
.standalone-card-preview {
cursor: default;
display: contents;
width: 100%;
height: auto;
.popup-metadata {
overflow: auto;
> img {
position: relative;
width: 75vw;
max-height: 85vh;
padding: 32px;
font-family: ${token.fontFamilyCode};
color: ${token.colorText};
word-break: break-word;
background: ${token.colorBgLayout};
border-radius: ${token.borderRadiusLG}px !important;
border-radius: ${token.borderRadius}px;
box-shadow: ${token.boxShadow} !important;
}
.edit-user-metadata {
> div:not(.edit-user-metadata-buttons):not(:last-child) {
margin: 0 0 8px;
}
.standalone-card-preview {
cursor: default;
display: contents;
width: 100%;
height: auto;
> img {
position: relative;
}
}
}
}
.popup-dialog,
.edit-user-metadata {
width: 50vw !important;
.popup-dialog,
.edit-user-metadata {
width: 50vw !important;
}
}
}
`;