Skip to content

Commit

Permalink
Merge pull request #161 from microsoft/sethjuarez/web
Browse files Browse the repository at this point in the history
updated website
  • Loading branch information
sethjuarez authored Jan 10, 2025
2 parents 56c911a + 0cf39c6 commit be01d3c
Show file tree
Hide file tree
Showing 30 changed files with 7,996 additions and 6,325 deletions.
2 changes: 1 addition & 1 deletion web/.eslintrc.json
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
{
"extends": ["next", "next/babel", "next/core-web-vitals"],
"extends": ["next", "next/core-web-vitals"],
"rules": {
// Other rules
"@next/next/no-img-element": "off",
Expand Down
12,246 changes: 6,420 additions & 5,826 deletions web/package-lock.json

Large diffs are not rendered by default.

46 changes: 23 additions & 23 deletions web/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -11,34 +11,34 @@
"lint": "next lint"
},
"dependencies": {
"@mdx-js/loader": "^3.0.1",
"@mdx-js/react": "^3.0.1",
"@next/mdx": "^14.2.3",
"@types/mdx": "^2.0.13",
"@headlessui/react": "^2.2.0",
"@hookform/resolvers": "^3.9.1",
"clsx": "^2.1.1",
"esbuild": "^0.24.2",
"glob": "^11.0.0",
"gray-matter": "^4.0.3",
"mermaid": "^10.9.3",
"next": "14.2.10",
"katex": "^0.16.19",
"mermaid": "^11.4.1",
"next": "^15.1.3",
"next-mdx-remote": "^5.0.0",
"next-themes": "^0.3.0",
"react": "^18",
"react-dom": "^18",
"react-icons": "^5.2.1",
"react-syntax-highlighter": "^15.5.0",
"remark-gfm": "^4.0.0",
"sharp": "^0.33.4"
"next-themes": "^0.4.4",
"nunjucks": "^3.2.4",
"react": "^19.0.0",
"react-dom": "^19.0.0",
"react-hook-form": "^7.54.2",
"react-icons": "^5.4.0",
"react-syntax-highlighter": "^15.6.1",
"sass": "^1.83.1"
},
"devDependencies": {
"@babel/plugin-transform-logical-assignment-operators": "^7.24.7",
"@tailwindcss/typography": "^0.5.15",
"@types/node": "^20",
"@types/react": "^18",
"@types/react-dom": "^18",
"@babel/plugin-transform-logical-assignment-operators": "^7.25.9",
"@types/node": "^20.17.12",
"@types/react": "^18.3.18",
"@types/react-dom": "^18.3.5",
"@types/react-syntax-highlighter": "^15.5.13",
"eslint": "^8",
"eslint-config-next": "14.2.3",
"postcss": "^8",
"tailwindcss": "^3.4.1",
"typescript": "^5"
"eslint": "^9.17.0",
"eslint-config-next": "^15.1.4",
"postcss": "^8.4.49",
"typescript": "^5.7.2"
}
}
1 change: 0 additions & 1 deletion web/postcss.config.mjs
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
/** @type {import('postcss-load-config').Config} */
const config = {
plugins: {
tailwindcss: {},
},
};

Expand Down
9 changes: 0 additions & 9 deletions web/process.ts
Original file line number Diff line number Diff line change
Expand Up @@ -49,15 +49,6 @@ export const indexdocs = async (dir?: string) => {
return index;
};

const statPath = async (path: string): Promise<string> => {
try {
await pfs.access(path);
} catch (e) {
await pfs.mkdir(path);
}
return path;
};

const fetchAuthor = (author: string): Promise<void> => {
return new Promise(async (resolve, reject) => {
const imageUrl = `https://github.com/${author}.png`;
Expand Down
7 changes: 5 additions & 2 deletions web/src/app/content/[[...slug]]/route.ts
Original file line number Diff line number Diff line change
@@ -1,10 +1,13 @@
import { promises as fs } from "fs";
import path from "path";
import { promises as fs } from "fs";

type Params = Promise<{ slug?: string[] }>;

export async function GET(
request: Request,
{ params }: { params: { slug?: string[] } }
segmentData: { params: Params }
) {
const params = await segmentData.params;
if (params.slug) {
const file = path.normalize(
path.join(...[process.cwd(), "docs", ...params.slug])
Expand Down
20 changes: 20 additions & 0 deletions web/src/app/defaults.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
$layout-breakpoint-small: 768px;
$layout-breakpoint-medium: 1024px;

$sky-200: #bae6fd;
$sky-300: #7dd3fc;
$sky-500: #0ea5e9;
$sky-600: #0284c7;
$sky-700: #0369a1;
$sky-800: #075985;

$stone-50: #fafaf9;
$stone-100: #f5f5f4;
$stone-200: #e7e5e4;
$stone-300: #d6d3d1;
$stone-400: #a8a29e;
$stone-500: #78716c;
$stone-600: #57534e;
$stone-700: #44403c;
$stone-800: #292524;
$stone-900: #1c1917;
215 changes: 215 additions & 0 deletions web/src/app/docs/[[...slug]]/page.module.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,215 @@
@use "@/app/defaults.scss" as *;


.page {
display: flex;

gap: 0.25rem;
flex-direction: column;

@media (min-width: $layout-breakpoint-small) {
flex-direction: row;
}
}

.toc {
background-color: $stone-100;
padding: 0.5rem;
margin-bottom: 0;
border-radius: 0.375rem;
width: 100%;

@media (min-width: $layout-breakpoint-small) {
width: 224px;
margin-bottom: 0.5rem;
}

@container style(--theme: light) {
background-color: $stone-100;
}

@container style(--theme: dark) {
background-color: $stone-700;
}
}

.contentContainer {
margin-left: 0.25rem;

@media (min-width: $layout-breakpoint-small) {
margin-left: 1.5rem;
width: calc(100% - 256px);
}
}

.titleSection {
display: flex;
flex-direction: row;
margin-bottom: 1rem;
gap: 1rem;
}

.title {
font-size: 1.5rem;
line-height: 2rem;
font-weight: 700;

@media (min-width: $layout-breakpoint-small) {
font-size: 2.25rem;
line-height: 2.5rem;
}
}

.links {
display: flex;
flex-direction: row;
gap: 0.5rem;
}

.linkIcon {
display: flex;
flex-direction: column;
justify-content: center;
vertical-align: middle;

&:hover {
cursor: pointer;
}
}

.icon {
width: 1.5rem;
height: 1.5rem;
color: $sky-600;

&:hover {
color: $stone-500;
}
}

.authorContainer {
display: flex;
margin-bottom: 1.5rem;
flex-direction: row;
}

.authorIcons {
padding: 0.25rem;
overflow: hidden;
display: flex;
isolation: isolate;
unicode-bidi: isolate;
padding-right: 20px;
align-items: center;
}

.authorIcons>* {
margin-right: -0.65rem;
}

.authorIcon a {
&:hover {
cursor: pointer;
}
}

.authorIcon {
display: inline-block;
position: relative;
z-index: 30;
border-radius: 9999px;
width: 2rem;
height: 2rem;

box-shadow: 0 0 0 2px transparent;

@container style(--theme: light) {
box-shadow: 0 0 0 2px transparent;
}

@container style(--theme: dark) {
box-shadow: 0 0 0 2px $stone-50;
}
}

.date {
vertical-align: middle;
display: flex;
align-items: center;
font-size: 1.25rem;

color: $stone-500;

@container style(--theme: light) {
color: $stone-500;
}

@container style(--theme: dark) {
color: $stone-400;
}
}

.content {
font-size: 1.125rem;
line-height: 1.75rem;

pre {
margin-top: 0;
margin-bottom: 0;
padding-top: 0;
padding-bottom: 0;
}

h1 {
margin-top: 1rem;
margin-bottom: 0.25rem;
}

h2 {
margin-top: 0.75rem;
margin-bottom: 0.25rem;
}

p {
margin-top: 0.75rem;
margin-bottom: 0.75rem;
}

details {
margin-top: 0.75rem;
margin-bottom: 0.75rem;
}

ul {
margin-top: 0.75rem;
list-style-type: disc;
list-style-position: outside;
margin-inline-start: 2rem;
}

ol {
margin-top: 0.75rem;
list-style-type: decimal;
list-style-position: outside;
margin-inline-start: 2rem;
}

a {
color: $sky-600;
text-decoration: none;
font-weight: 600;

&:hover {
color: $stone-500;
}

&[aria-current] {
color: $stone-500;
}
}

summary {
font-weight: 600;
cursor: pointer;
}
}
Loading

0 comments on commit be01d3c

Please sign in to comment.