Skip to content

Improve admin pages styling #1392

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
jsharkey13 merged 2 commits into from
Apr 14, 2025
Merged

Improve admin pages styling #1392

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
e312aa3
Improve admin pages styling
axlewin Apr 10, 2025
675ab7d
Add border to "Find user" button
axlewin Apr 14, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion src/app/components/elements/panels/AddUsersToBooking.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -83,7 +83,7 @@ export const AddUsersToBooking = ({event, eventBookingUserIds}: AddUsersToBookin
</Row>
<Row>
<Col>
<Input type="submit" className="btn w-100 btn-secondary border-0 my-2" value="Find user" />
<Input type="submit" className="btn w-100 btn-secondary my-2" value="Find user" />
</Col>
</Row>
</Form>
Expand Down
23 changes: 10 additions & 13 deletions src/app/components/pages/Admin.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,6 @@ import classnames from "classnames";
import {AnonymisationCheckboxes} from "../elements/AnonymisationCheckboxes";
import {IsaacSpinner} from "../handlers/IsaacSpinner";
import {MisuseStats} from "../elements/MisuseStats";
import classNames from "classnames";
import {ShowLoadingQuery} from "../handlers/ShowLoadingQuery";
import { Container, Card, CardTitle, ListGroup, ListGroupItem, CardBody, Form, InputGroup, Input, Button, Alert } from 'reactstrap';

Expand Down Expand Up @@ -49,12 +48,12 @@ export const Admin = ({user}: {user: RegisteredUserDTO}) => {

<Card className="p-3 my-3">
<CardTitle tag="h2">Useful links</CardTitle>
<ListGroup className="flex-row">
<ListGroupItem className="w-auto"><Link to="/admin/usermanager">User Manager</Link></ListGroupItem>
<ListGroupItem className="w-auto"><Link to="/admin/emails">Admin emails</Link></ListGroupItem>
<ListGroupItem className="w-auto"><Link to="/equality">Equation builder</Link></ListGroupItem>
<ListGroupItem className="w-auto"><Link to="/free_text">Free-text builder</Link></ListGroupItem>
<ListGroupItem className="w-auto"><Link to="/markdown">Markdown builder</Link></ListGroupItem>
<ListGroup className="flex-row border-0">
<ListGroupItem className="w-auto border-0"><Link to="/admin/usermanager">User Manager</Link></ListGroupItem>
<ListGroupItem className="w-auto border-0"><Link to="/admin/emails">Admin emails</Link></ListGroupItem>
<ListGroupItem className="w-auto border-0"><Link to="/equality">Equation builder</Link></ListGroupItem>
<ListGroupItem className="w-auto border-0"><Link to="/free_text">Free-text builder</Link></ListGroupItem>
<ListGroupItem className="w-auto border-0"><Link to="/markdown">Markdown builder</Link></ListGroupItem>
</ListGroup>
</Card>

Expand All @@ -77,9 +76,7 @@ export const Admin = ({user}: {user: RegisteredUserDTO}) => {
thenRender={liveContentVersion => {
const displayVersion = newVersion || liveContentVersion || null;
return <>
<div>
<strong>Live Content Version</strong>
</div>
<strong>Live Content Version</strong>
{isDefined(displayVersion) && !contentVersionUpdateIsLoading &&
<Form onSubmit={startVersionUpdate}>
<InputGroup className={"separate-input-group"}>
Expand All @@ -88,10 +85,11 @@ export const Admin = ({user}: {user: RegisteredUserDTO}) => {
type="text" value={displayVersion}
onChange={e => setNewVersion(e.target.value)}
placeholder="Enter commit SHA"
className={siteSpecific("", "h-100")}
/>
<a
className={classnames("btn btn-secondary", {
"p-1 border-dark": isPhy,
"px-2 d-flex align-items-center": isPhy,
"disabled": displayVersion === liveContentVersion
})}
href={`${EDITOR_COMPARE_URL}/${liveContentVersion}/${displayVersion}`}
Expand All @@ -100,7 +98,7 @@ export const Admin = ({user}: {user: RegisteredUserDTO}) => {
Preview Changes
</a>
<Button
type="button" className={classNames("py-0", {"px-0 border-dark": isPhy})}
type="button"
onClick={startVersionUpdate}
disabled={!isAdmin(user) || displayVersion === liveContentVersion}
>
Expand Down Expand Up @@ -138,7 +136,6 @@ export const Admin = ({user}: {user: RegisteredUserDTO}) => {
</>}
</CardBody>
</Card>

</div>
</Container>;
};
4 changes: 2 additions & 2 deletions src/app/components/pages/AdminEmails.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -98,7 +98,7 @@ export const AdminEmails = (props: AdminEmailsProps) => {
<Col>
<Input
type="submit" value="Load template"
className={"btn w-100 btn-secondary border-0 " + classnames({disabled: contentObjectID.length == 0})}
className={"btn btn-secondary " + classnames({disabled: contentObjectID.length == 0})}
disabled={contentObjectID.length == 0}
onClick={() => getEmailTemplate(contentObjectID)}
/>
Expand Down Expand Up @@ -151,7 +151,7 @@ export const AdminEmails = (props: AdminEmailsProps) => {
</div>}
<Input
type="button" value="Send emails"
className={"btn btn-xl btn-secondary border-0 " + classnames({disabled: !canSubmit})}
className={"btn btn-xl btn-secondary " + classnames({disabled: !canSubmit})}
disabled={!canSubmit}
onClick={() => {
if (window.confirm(`Are you sure you want to send a ${emailType} email (${contentObjectID}) to ${numberOfUsers} user${numberOfUsers > 1 ? "s" : ""}?`)) {
Expand Down
8 changes: 4 additions & 4 deletions src/app/components/pages/AdminUserManager.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -257,7 +257,7 @@ export const AdminUserManager = () => {
<CardFooter>
<Row>
<Col md={{size: 4, offset: 4}} >
<Input type="submit" value="Search" className="btn w-100 btn-secondary border-0"/>
<Input type="submit" value="Search" className="btn btn-secondary"/>
</Col>
</Row>
</CardFooter>
Expand Down Expand Up @@ -305,7 +305,7 @@ export const AdminUserManager = () => {
</UncontrolledButtonDropdown>}
</Col>
<Col>
<Link className="btn float-end btn-secondary border-0" to={{
<Link className="btn btn-secondary float-end" to={{
pathname: "/admin/emails",
state: {
csvIDs: selectedUserIds
Expand Down Expand Up @@ -388,7 +388,7 @@ export const AdminUserManager = () => {
<CardBody>
<h3>Merge user accounts</h3>
<FormGroup className="form-group">
<InputGroup className={"separate-input-group"}>
<InputGroup className={"separate-input-group d-flex align-items-center"}>
<Input
type="text"
placeholder="User ID to keep"
Expand All @@ -402,7 +402,7 @@ export const AdminUserManager = () => {
onChange={(e => setMergeSourceId(e.target.value))}
/>
<Button
type="button" className={classNames("py-0", {"px-0 border-dark": isPhy})}
type="button"
disabled={mergeTargetId === "" || Number.isNaN(Number(mergeTargetId)) || mergeSourceId === "" || Number.isNaN(Number(mergeSourceId))}
onClick={confirmMergeUsers}
>
Expand Down
2 changes: 1 addition & 1 deletion src/app/components/pages/Equality.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -277,7 +277,7 @@ const Equality = withRouter(({location}: RouteComponentProps<{}, {}, {board?: st
placeholder="Type your expression here"/>
<>
{siteSpecific(
<Button type="button" className="eqn-editor-help pt-2" id="inequality-help" size="sm" tag="a" href="/solving_problems#symbolic_text">?</Button>,
<Button type="button" className="eqn-editor-help d-flex align-items-center" id="inequality-help" size="sm" tag="a" href="/solving_problems#symbolic_text">?</Button>,
<span id={"inequality-help"} className="icon-help-q my-auto ms-2"/>
)}
<UncontrolledTooltip placement="top" autohide={false} target='inequality-help'>
Expand Down
2 changes: 1 addition & 1 deletion src/app/components/pages/FreeTextBuilder.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -376,7 +376,7 @@ export const FreeTextBuilder = () => {
</Card>

<div className="mb-5 text-center">
<Input type="submit" value="Test question" className="btn btn-xl btn-secondary border-0" />
<Input type="submit" value="Test question" className="btn btn-xl btn-secondary" />
</div>
</Form>
</Container>;
Expand Down
Loading