forked from github-starred/komodo
try this
This commit is contained in:
@@ -1,4 +1,4 @@
|
||||
import { Component, For, Show } from "solid-js";
|
||||
import { Component, For, Match, Show, Switch } from "solid-js";
|
||||
import { useAppState } from "../../state/StateProvider";
|
||||
import { useTheme } from "../../state/ThemeProvider";
|
||||
import { useUser } from "../../state/UserProvider";
|
||||
@@ -10,9 +10,11 @@ import s from "./home.module.scss";
|
||||
import AddServer from "./Tree/AddServer";
|
||||
import Summary from "./Summary/Summary";
|
||||
import Updates from "./Updates/Updates";
|
||||
import { useAppDimensions } from "../../state/DimensionProvider";
|
||||
|
||||
const Home: Component<{}> = (p) => {
|
||||
const { servers } = useAppState();
|
||||
const { width, isMobile } = useAppDimensions();
|
||||
const serverIDs = () => servers.loaded() && servers.ids();
|
||||
return (
|
||||
<Grid gap="0rem" class={s.Home} placeItems="start center">
|
||||
@@ -40,6 +42,59 @@ const Home: Component<{}> = (p) => {
|
||||
<Updates />
|
||||
</Grid>
|
||||
</Grid>
|
||||
// <Switch>
|
||||
// <Match when={width() >= 1200}>
|
||||
// <Grid gap="0rem" class={s.Home} placeItems="start center">
|
||||
// <Tabs
|
||||
// localStorageKey="home-tab"
|
||||
// containerClass={s.Tabs}
|
||||
// tabs={[
|
||||
// {
|
||||
// title: "deployments",
|
||||
// element: (
|
||||
// <Grid>
|
||||
// <For each={serverIDs()}>{(id) => <Server id={id} />}</For>
|
||||
// <AddServer />
|
||||
// </Grid>
|
||||
// ),
|
||||
// },
|
||||
// {
|
||||
// title: "builds",
|
||||
// element: <Builds />,
|
||||
// },
|
||||
// ]}
|
||||
// />
|
||||
// <Grid gap="0rem" style={{ width: "80%" }}>
|
||||
// <Summary />
|
||||
// <Updates />
|
||||
// </Grid>
|
||||
// </Grid>
|
||||
// </Match>
|
||||
// <Match when={width() < 1200}>
|
||||
// <Grid gap="0rem" class={s.Home} placeItems="start center">
|
||||
// <Summary />
|
||||
// <Tabs
|
||||
// localStorageKey="home-tab"
|
||||
// containerClass={s.Tabs}
|
||||
// tabs={[
|
||||
// {
|
||||
// title: "deployments",
|
||||
// element: (
|
||||
// <Grid>
|
||||
// <For each={serverIDs()}>{(id) => <Server id={id} />}</For>
|
||||
// <AddServer />
|
||||
// </Grid>
|
||||
// ),
|
||||
// },
|
||||
// {
|
||||
// title: "builds",
|
||||
// element: <Builds />,
|
||||
// },
|
||||
// ]}
|
||||
// />
|
||||
// </Grid>
|
||||
// </Match>
|
||||
// </Switch>
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
@@ -6,6 +6,12 @@
|
||||
padding-top: 1rem;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 1200px) {
|
||||
.Home {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
.Tabs {
|
||||
padding: 1rem;
|
||||
width: 80%;
|
||||
@@ -74,6 +80,12 @@
|
||||
margin: 1rem;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 1200px) {
|
||||
.Summary {
|
||||
width: 80%;
|
||||
}
|
||||
}
|
||||
|
||||
.Updates {
|
||||
padding: 1rem;
|
||||
margin: 1rem;
|
||||
|
||||
Reference in New Issue
Block a user