Merge pull request #19 from theHandsomestNerd/dj-tony-spades-rules

Spades rules for 41 Acres DJ and Tony

functions/src/index.ts

@@ -123,7 +123,7 @@ const serveIndexFile = (req: any, res: any) => {
  ogTitle: pageFromSanity?.title,
  description: pageFromSanity?.description,
  ogDescription: pageFromSanity?.description,
- ogImage: pageFromSanity.metaImage && builder.image(pageFromSanity.metaImage).url()?.replace("undefined", process.env.SANITY_DB ?? "development"),
+ ogImage: pageFromSanity?.metaImage && builder.image(pageFromSanity.metaImage).url()?.replace("undefined", process.env.SANITY_DB ?? "development"),
  };
 
  logClient.log("server-side", "NOTICE",

src/App.tsx

@@ -11,6 +11,7 @@ import SnackbarProvider from "./components/modal-context/SnackbarProvider";
 import PageMux from "./components/templates/mackenzies-mind/pages/PageMux";
 import CustomizedThemeProvider from "./components/customized-theme-provider/CustomizedThemeProvider";
 import {queryClient} from "./queryClient";
+import DJSpadesRulesContentSection from "./components/dj-40-spades-rules/41AcresSpadesContentSection";
 
 function App() {
 
@@ -34,6 +35,8 @@ function App() {
 
  <Grid item>
  <Routes>
+ <Route path={"/DJs-40th-spades-rules"}
+ element={<DJSpadesRulesContentSection />}/>
  <Route path={"/" + process.env.REACT_APP_BASE_ROUTE + "/:pageSlug"}
  element={<PageMux/>}/>
  <Route path={'/error'} element={<FourOhFour/>}/>

src/components/dj-40-spades-rules/41AcresSpadesContentSection.tsx

@@ -0,0 +1,77 @@
+import React, {FunctionComponent, PropsWithChildren} from 'react'
+import makeStyles from "@mui/styles/makeStyles";
+import {Theme} from "@mui/material/styles";
+import {Grid, Typography} from "@mui/material";
+import cardsBg from './cardsbg.png'
+
+interface IProps {
+}
+
+interface CSSProps {
+ heroBaseImageUrl: string,
+ heroOverlay?: string | null
+}
+
+export const useStyles = makeStyles((theme: Theme) => ({
+ contentSection: {
+ // height: '500px',
+ // marginTop: '16px',
+ backgroundColor: 'transparent',
+ },
+ contentBullets: {
+ borderLeft: `4px solid ${theme.palette.primary.main}`,
+ paddingLeft: '26px',
+ }
+}))
+
+const DJSpadesRulesContentSection: FunctionComponent<IProps & PropsWithChildren> = (props) => {
+ const theRules = [
+ "Largest Diamond Starts the Game.",
+ "Joker(Large/Color), Joker (Guaranteed), Deuce of Diamonds, Deuce of Spades",
+ "First hand Bids Itself",
+ "First Hand set, game continues(must play, 10s do not double, doesn't count as a set)",
+ "Board is 4",
+ "Double your bid, you go back 100",
+ "3 Books for a renig, one chance to call",
+ "1 Blind, must be down 100/ 6 is the minimum(if set, it doesnt count. Its a welfare.",
+ "2 sets = Game",
+ "Collective bid of 10 or less is books made; Bid increase only by 1 (9 is a number)",
+ "Straight cut. (2 chops max). Straight deal.",
+ "Spades lead anytime.",
+ "2 min dog(must set timer, then call)",
+ "No spades(hands 2-13) option to toss",
+ "No talking across the board",
+ "RESPECT OUR HOME",
+ "Any and all debates are settled by 41 Acres",
+ ]
+ return (
+ <Grid container item
+ style={{overflow: 'hidden', height: "100vh", width: "100vw", backgroundColor: "#19468D", color: "white", position: "relative", zIndex: 2, border:"3px solid white", padding: "16px", overflowX:"scroll"}}>
+ <Grid container item
+ style={{height: "100%", width: "100%", backgroundSize: "cover", backgroundImage: `url('${cardsBg}')`, opacity: .1, position: "absolute", zIndex: 1}}>
+
+ </Grid>
+ <Grid container item style={{zIndex: 2}} justifyContent='center'>
+
+ <Grid item container justifyContent='center' alignContent='center'>
+ <Typography variant='h3'>Spades Rules - DJ's 40th edition</Typography>
+ </Grid>
+ <Grid container item spacing={1} justifyContent='center' sx={{maxWidth:"550px"}}>
+ <ol>
+
+ {
+ theRules.map((aRule, index) => {
+ return <li style={{marginBottom: "8px"}} key={index}><Typography
+ variant='body1'>{aRule}</Typography>
+ </li>
+ })
+ }
+ </ol>
+ </Grid>
+ </Grid>
+
+ </Grid>
+ )
+}
+
+export default DJSpadesRulesContentSection