Mirrors/stash
1
0
Fork 0
mirror of https://github.com/stashapp/stash.git synced 2025-12-17 20:34:37 +03:00
Code Issues Packages Projects Releases Wiki Activity

UI fixes (#419)

Browse Source
This commit is contained in:
InfiniteTF
2020-04-01 02:08:01 +02:00
committed by GitHub
parent 777cd96759
commit 2a8e5d5b9b
10 changed files with 53 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
ui/v2.5/src/components/List/ListFilter.tsx
View File

@@ -276,7 +276,7 @@ export const ListFilter: React.FC<IListFilterProps> = (
<Form.Control <Form.Control
placeholder="Search..." placeholder="Search..."
defaultValue={props.filter.searchTerm} defaultValue={props.filter.searchTerm}
onChange={onChangeQuery} onInput={onChangeQuery}
className="filter-item col-5 col-sm-2 bg-secondary text-white border-secondary" className="filter-item col-5 col-sm-2 bg-secondary text-white border-secondary"
/> />
<Form.Control <Form.Control

5
ui/v2.5/src/components/Movies/MovieDetails/Movie.tsx
View File

@@ -182,9 +182,8 @@ export const Movie: React.FC = () => {
return ( return (
<div className="row"> <div className="row">
<div <div
className={cx("movie-details", { className={cx("movie-details", "col", {
"col ml-sm-5": !isNew, "col ml-sm-5": !isNew
"col-8": isNew
})} })}
> >
{isNew && <h2>Add Movie</h2>} {isNew && <h2>Add Movie</h2>}

49
ui/v2.5/src/components/Movies/styles.scss
View File

@@ -1,23 +1,26 @@
.card.movie-card { .card.movie-card {
padding: 0 0 1rem 0; padding: 0 0 1rem 0;
} }
.movie-card { .movie-details {
&-header { max-width: 1200px;
height: 240px; }
line-height: 240px;
text-align: center; .movie-card {
} &-header {
height: 240px;
&-image { line-height: 240px;
max-height: 240px; text-align: center;
object-fit: contain; }
vertical-align: middle;
width: 320px; &-image {
max-height: 240px;
@media (max-width: 576px) { object-fit: contain;
width: 100%; vertical-align: middle;
} width: 320px;
}
} @media (max-width: 576px) {
width: 100%;
}
}
}

4
ui/v2.5/src/components/Performers/PerformerDetails/PerformerDetailsPanel.tsx
View File

@@ -103,7 +103,7 @@ export const PerformerDetailsPanel: React.FC<IPerformerDetails> = ({
// image is a base64 string // image is a base64 string
if ((state as GQL.ScrapedPerformerDataFragment).image !== undefined) { if ((state as GQL.ScrapedPerformerDataFragment).image !== undefined) {
let imageStr = (state as GQL.ScrapedPerformerDataFragment).image; const imageStr = (state as GQL.ScrapedPerformerDataFragment).image;
setImage(imageStr ?? undefined); setImage(imageStr ?? undefined);
if (onImageChange) { if (onImageChange) {
onImageChange(imageStr!); onImageChange(imageStr!);
@@ -177,7 +177,7 @@ export const PerformerDetailsPanel: React.FC<IPerformerDetails> = ({
if (!scrapePerformerDetails) return {}; if (!scrapePerformerDetails) return {};
// image is not supported // image is not supported
const { __typename, image, ...ret } = scrapePerformerDetails; const { __typename, image: _image, ...ret } = scrapePerformerDetails;
return ret; return ret;
} }

2
ui/v2.5/src/components/Scenes/SceneDetails/SceneOperationsPanel.tsx
View File

@@ -19,7 +19,7 @@ export const SceneOperationsPanel: FunctionComponent<IOperationsPanelProps> = (
await generateScreenshot({ await generateScreenshot({
variables: { variables: {
id: props.scene.id, id: props.scene.id,
at: at at
} }
}); });
Toast.success({ content: "Generating screenshot" }); Toast.success({ content: "Generating screenshot" });

8
ui/v2.5/src/components/Scenes/styles.scss
View File

@@ -35,12 +35,14 @@
z-index: 1; z-index: 1;
} }
.performer-tag-container, .movie-tag-container { .performer-tag-container,
.movie-tag-container {
display: inline-block; display: inline-block;
margin: 5px; margin: 5px;
} }
.performer-tag.image, .movie-tag.image { .performer-tag.image,
.movie-tag.image {
background-position: center; background-position: center;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: cover; background-size: cover;
@@ -215,4 +217,4 @@
.movie-table td { .movie-table td {
vertical-align: middle; vertical-align: middle;
} }

10
ui/v2.5/src/components/Settings/SettingsConfigurationPanel.tsx
View File

@@ -29,7 +29,9 @@ export const SettingsConfigurationPanel: React.FC = () => {
const [logLevel, setLogLevel] = useState<string>("Info"); const [logLevel, setLogLevel] = useState<string>("Info");
const [logAccess, setLogAccess] = useState<boolean>(true); const [logAccess, setLogAccess] = useState<boolean>(true);
const [excludes, setExcludes] = useState<string[]>([]); const [excludes, setExcludes] = useState<string[]>([]);
const [scraperUserAgent, setScraperUserAgent] = useState<string | undefined>(undefined); const [scraperUserAgent, setScraperUserAgent] = useState<string | undefined>(
undefined
);
const { data, error, loading } = StashService.useConfiguration(); const { data, error, loading } = StashService.useConfiguration();
@@ -315,7 +317,7 @@ export const SettingsConfigurationPanel: React.FC = () => {
<Form.Control <Form.Control
className="col col-sm-6 text-input" className="col col-sm-6 text-input"
defaultValue={username} defaultValue={username}
onChange={(e: React.FormEvent<HTMLInputElement>) => onInput={(e: React.FormEvent<HTMLInputElement>) =>
setUsername(e.currentTarget.value) setUsername(e.currentTarget.value)
} }
/> />
@@ -329,7 +331,7 @@ export const SettingsConfigurationPanel: React.FC = () => {
className="col col-sm-6 text-input" className="col col-sm-6 text-input"
type="password" type="password"
defaultValue={password} defaultValue={password}
onChange={(e: React.FormEvent<HTMLInputElement>) => onInput={(e: React.FormEvent<HTMLInputElement>) =>
setPassword(e.currentTarget.value) setPassword(e.currentTarget.value)
} }
/> />
@@ -347,7 +349,7 @@ export const SettingsConfigurationPanel: React.FC = () => {
<Form.Control <Form.Control
className="col col-sm-6 text-input" className="col col-sm-6 text-input"
defaultValue={logFile} defaultValue={logFile}
onChange={(e: React.FormEvent<HTMLInputElement>) => onInput={(e: React.FormEvent<HTMLInputElement>) =>
setLogFile(e.currentTarget.value) setLogFile(e.currentTarget.value)
} }
/> />

1
ui/v2.5/src/components/Shared/FolderSelect/FolderSelect.tsx
View File

@@ -55,6 +55,7 @@ export const FolderSelect: React.FC<IProps> = (props: IProps) => {
setCurrentDirectory(e.currentTarget.value) setCurrentDirectory(e.currentTarget.value)
} }
defaultValue={currentDirectory} defaultValue={currentDirectory}
spellCheck={false}
/> />
<InputGroup.Append> <InputGroup.Append>
{!data || !data.directories || loading ? ( {!data || !data.directories || loading ? (

2
ui/v2.5/src/components/Shared/ImageInput.tsx
View File

@@ -15,7 +15,7 @@ export const ImageInput: React.FC<IImageInput> = ({
if (!isEditing) return <div />; if (!isEditing) return <div />;
return ( return (
<Form.Label className="image-input"> <Form.Label className="image-input ml-2">
<Button variant="secondary">{text ?? "Browse for image..."}</Button> <Button variant="secondary">{text ?? "Browse for image..."}</Button>
<Form.Control <Form.Control
type="file" type="file"

20
ui/v2.5/src/index.scss
View File

@@ -186,28 +186,28 @@ div.react-select__menu {
background-color: #fff; background-color: #fff;
border-color: inherit; border-color: inherit;
color: $dark-text; color: $dark-text;
.react-select__single-value, .react-select__single-value,
.react-select__input { .react-select__input {
color: $dark-text; color: $dark-text;
} }
.react-select__multi-value { .react-select__multi-value {
background-color: #fff; background-color: #fff;
color: $dark-text; color: $dark-text;
} }
} }
div.react-select__menu { div.react-select__menu {
background-color: #fff; background-color: #fff;
color: $text-color; color: $text-color;
.react-select__option { .react-select__option {
color: $dark-text; color: $dark-text;
} }
.react-select__option--is-focused { .react-select__option--is-focused {
background-color: rgba(167,182,194,.3); background-color: rgba(167, 182, 194, .3);
} }
} }
} }
@@ -368,7 +368,8 @@ div.react-select__menu {
overflow: hidden; overflow: hidden;
position: relative; position: relative;
&:hover { input[type=file], /* FF, IE7+, chrome (except button) */
input[type=file]::-webkit-file-upload-button { /* chromes and blink button */
cursor: pointer; cursor: pointer;
} }
@@ -383,11 +384,6 @@ div.react-select__menu {
right: 0; right: 0;
text-align: right; text-align: right;
top: 0; top: 0;
&:hover {
cursor: pointer;
}
} }
} }