mirror of
https://github.com/matrix-org/matrix-hookshot.git
synced 2025-03-10 21:19:13 +00:00
Correctly apply CSS for recent RSS feed changes (#604)
* Button: Extend HTMLButton prop types * Use className prop instad of styles * Move style prop into scss file
This commit is contained in:
parent
1e8a112a28
commit
46467ac810
1
changelog.d/604.bugfix
Normal file
1
changelog.d/604.bugfix
Normal file
@ -0,0 +1 @@
|
||||
Correctly apply CSS for recent RSS feed changes.
|
@ -1,3 +1,7 @@
|
||||
.icon {
|
||||
width: 48px;
|
||||
}
|
||||
|
||||
.serviceCard {
|
||||
display: grid !important;
|
||||
grid-template-columns: 0.6fr 1fr 1fr;
|
||||
|
@ -4,7 +4,7 @@ import style from "./ServiceCard.module.scss";
|
||||
|
||||
export const ServiceCard: FunctionComponent<{serviceName: string, iconUrl: string, onConfigure: () => void}> = ({ serviceName, iconUrl, onConfigure }) => {
|
||||
return <div className={`card ${style.serviceCard}`}>
|
||||
<img style="width: 48px;" src={iconUrl} />
|
||||
<img className={style.icon} src={iconUrl} />
|
||||
<div>
|
||||
<span>{serviceName}</span>
|
||||
<button onClick={onConfigure}>Configure</button>
|
||||
|
@ -1,7 +1,11 @@
|
||||
import { FunctionComponent, h } from "preact";
|
||||
import style from "./Button.module.scss";
|
||||
|
||||
export const Button: FunctionComponent = (props: { [key: string]: unknown, intent?: string}) => {
|
||||
interface ButtonProps extends h.JSX.HTMLAttributes<HTMLButtonElement> {
|
||||
intent?: string;
|
||||
}
|
||||
|
||||
export const Button: FunctionComponent = (props: ButtonProps) => {
|
||||
let className = style.button;
|
||||
if (props.intent === "remove") {
|
||||
className += ` ${style.remove}`;
|
||||
|
@ -16,12 +16,11 @@ const FeedRecentResults: FunctionComponent<{item: FeedResponseItem}> = ({ item }
|
||||
<h3>Recent feed results</h3>
|
||||
{!item.secrets.lastResults.length && <span>There have been no recent updates for this feed.</span>}
|
||||
<ul>
|
||||
{item.secrets.lastResults.map(item => <li styles={styles.resultListItem} key={item.timestamp}>
|
||||
{item.secrets.lastResults.map(item => <li className={styles.resultListItem} key={item.timestamp}>
|
||||
{new Date(item.timestamp).toLocaleString()}:
|
||||
{item.ok && `✅ Successful fetch`}
|
||||
{!item.ok && `⚠️ ${item.error}`}
|
||||
</li>
|
||||
)}
|
||||
</li>)}
|
||||
</ul>
|
||||
</>;
|
||||
}
|
||||
|
Loading…
x
Reference in New Issue
Block a user