diff --git a/.gitignore b/.gitignore
index 1fa4844..02f2ce0 100644
--- a/.gitignore
+++ b/.gitignore
@@ -35,3 +35,6 @@ yarn-error.log*
.env
.env.**
!.env.example
+
+# tsc
+tsconfig.tsbuildinfo
\ No newline at end of file
diff --git a/components/TopListItem.module.scss b/components/TopListItem.module.scss
new file mode 100644
index 0000000..a4352c8
--- /dev/null
+++ b/components/TopListItem.module.scss
@@ -0,0 +1,52 @@
+
+$topItemSpace: 7px;
+
+.topItemIcon {
+ min-width: 35px!important;
+ margin-top: $topItemSpace!important;
+ padding-right: $topItemSpace!important;
+ text-align: right;
+}
+
+.topItemText {
+ max-width: 80%!important;
+ //background-color: darkorchid;
+}
+
+.topItemTitle {
+ @media (max-width: 768px) {
+ line-height: 1.15!important;
+ }
+ padding-top: 0;
+}
+
+.topItemSubtitle {
+ line-height: 1.2!important;
+ padding: calc(0.75em / 2) 0;
+ padding-top: 0;
+}
+
+.hintedMetric {
+ font-size: 0.75rem!important;
+ font-style: italic;
+ margin-top: calc($topItemSpace + 1px)!important;
+ padding-right: 2px;
+ white-space: break-spaces!important;
+ text-align: right;
+ min-width: 45px;
+ margin-left: auto!important;
+ align-self: stretch;
+ //background-color: darkgreen;
+ @media(min-width: 991px) {
+ flex-shrink: 0;
+ }
+ @media (max-width: 450px) {
+ max-width: 60px;
+ }
+}
+
+.hintedMetricExtended {
+ @media (max-width: 990px) {
+ display: none;
+ }
+}
diff --git a/components/TopListItem.tsx b/components/TopListItem.tsx
new file mode 100644
index 0000000..2d4978a
--- /dev/null
+++ b/components/TopListItem.tsx
@@ -0,0 +1,65 @@
+import React, { useState } from 'react'
+import Link from 'next/link'
+import { TopResult } from '../lib/data/useTopResults'
+import ListItemButton from '@mui/material/ListItemButton';
+import ListItemIcon from '@mui/material/ListItemIcon';
+import Typography from '@mui/material/Typography';
+import ListItemText from '@mui/material/ListItemText';
+import Box from '@mui/material/Box';
+import Tooltip from '@mui/material/Tooltip';
+import { Badge } from './badge'
+import { TopMetric } from '../lib/top_back';
+
+import styles from './TopListItem.module.scss'
+//import interactivity from '../../styles/interactivity.module.scss'
+import instructorCardStyles from './instructorcard.module.scss'
+
+interface TopListItemProps {
+ data: TopResult;
+ index: number;
+ viewMetric: TopMetric;
+}
+
+export function TopListItem({ data: item, index, viewMetric }: TopListItemProps) {
+ return (
+
+
You are missing these claims to gain access:
-{`${missingClaims[e].expected}`}
{`${missingClaims[e].actual}`}
You are not signed in!
- > - ); - } -} diff --git a/components/auth/LoginForm.tsx b/components/auth/LoginForm.tsx deleted file mode 100644 index 7accee3..0000000 --- a/components/auth/LoginForm.tsx +++ /dev/null @@ -1,44 +0,0 @@ -import React from 'react' -import { useAuth } from 'reactfire' - -export function LoginForm() { - const auth = useAuth(); - const fbAuth = useAuth; - const provider = new fbAuth.GoogleAuthProvider(); - provider.addScope('profile'); - provider.addScope('email'); - - const signIn = async () => { - await auth.signInWithPopup(provider) - }; - - // If already signed in, offer account options - if (auth.currentUser) return ( -You're already signed in!
-Only authorized users will be permitted to access. Before proceeding, please sign in.
-- - This is limited to: your display name, your email, and the URL of your Google account picture. - Users will have the option of having their account deleted from our database. - CougarGrades.io is open-source and not for profit. We are not interested in contacting you with this information or sharing it with third-parties. - -
-Field | -Value | -
---|
You're not signed in!
-{ - isValidating ? '' : - `${data.totalSponsorCount} people sponsor CougarGrades - totalling $${data.monthlyEstimatedSponsorsIncomeFormatted} per month. Thank you!` + status === 'success' ? + `${data!.totalSponsorCount} people sponsor CougarGrades + totalling $${data!.monthlyEstimatedSponsorsIncomeFormatted} per month. Thank you!` : '' }