add css

sdgilley · Mar 25, 2024 · 45dc932 · 45dc932
1 parent 5bde53b
commit 45dc932
Show file tree

Hide file tree

Showing 3 changed files with 69 additions and 4 deletions.
diff --git a/docs/DASHBOARD.html b/docs/DASHBOARD.html
@@ -1,9 +1,16 @@
 <html>
 <head>
 <title>Code snippets dashboard</title>
+<link rel="stylesheet" type="text/css" href="styles.css">
+
 </head>
-<body style="margin: 50px;">
-<h2>.yml </h2>
+<body>
+<h1>Code snippets dashboard</h1>
+Jump to:
+<ul><a href=#yml>.yml</a></ul>
+<ul><a href=#ipynb>notebooks</a></ul>
+
+<h2 name="yml">.yml </h2>
 <table>
 <tr><td><a href="https://github.com/Azure/azureml-examples/actions/workflows/cli-assets-component-train.yml"><img src="https://github.com/Azure/azureml-examples/actions/workflows/cli-assets-component-train.yml/badge.svg?branch=main" alt="train&#46;yml "></a></td><td><a href="https://github.com/Azure/azureml-examples/blob/main//cli/assets/component/train.yml ">train.yml </a></td></tr>
 <tr><td><a href="https://github.com/Azure/azureml-examples/actions/workflows/cli-assets-data-cloud-file-https.yml"><img src="https://github.com/Azure/azureml-examples/actions/workflows/cli-assets-data-cloud-file-https.yml/badge.svg?branch=main" alt="cloud-file-https&#46;yml "></a></td><td><a href="https://github.com/Azure/azureml-examples/blob/main//cli/assets/data/cloud-file-https.yml ">cloud-file-https.yml </a></td></tr>
@@ -247,7 +254,7 @@ <h2>.json </h2>
 <tr><td><a href="https://github.com/Azure/azureml-examples/actions/workflows/cli-endpoints-online-model-1-sample-request.yml"><img src="https://github.com/Azure/azureml-examples/actions/workflows/cli-endpoints-online-model-1-sample-request.yml/badge.svg?branch=main" alt="sample-request&#46;json "></a></td><td><a href="https://github.com/Azure/azureml-examples/blob/main//cli/endpoints/online/model-1/sample-request.json ">sample-request.json </a></td></tr>
 <tr><td><a href="https://github.com/Azure/azureml-examples/actions/workflows/cli-endpoints-online-ncd-sample-request-sklearn.yml"><img src="https://github.com/Azure/azureml-examples/actions/workflows/cli-endpoints-online-ncd-sample-request-sklearn.yml/badge.svg?branch=main" alt="sample-request-sklearn&#46;json "></a></td><td><a href="https://github.com/Azure/azureml-examples/blob/main//cli/endpoints/online/ncd/sample-request-sklearn.json ">sample-request-sklearn.json </a></td></tr>
 </table>
-<h2>.ipynb </h2>
+<h2 name="ipynb">.ipynb </h2>
 <table>
 <tr><td><a href="https://github.com/Azure/azureml-examples/actions/workflows/sdk-assets-environment-environment.yml"><img src="https://github.com/Azure/azureml-examples/actions/workflows/sdk-assets-environment-environment.yml/badge.svg?branch=main" alt="environment&#46;ipynb "></a></td><td><a href="https://github.com/Azure/azureml-examples/blob/main//sdk/python/assets/environment/environment.ipynb ">environment.ipynb </a></td></tr>
 <tr><td><a href="https://github.com/Azure/azureml-examples/actions/workflows/sdk-assets-model-model.yml"><img src="https://github.com/Azure/azureml-examples/actions/workflows/sdk-assets-model-model.yml/badge.svg?branch=main" alt="model&#46;ipynb "></a></td><td><a href="https://github.com/Azure/azureml-examples/blob/main//sdk/python/assets/model/model.ipynb ">model.ipynb </a></td></tr>

diff --git a/docs/index.html b/docs/index.html
@@ -2,8 +2,10 @@
 <html>
 <head>
     <title>Azure Machine Learning code snippets</title>
+    <link rel="stylesheet" type="text/css" href="styles.css">
+`
 </head>
-<body style="margin: 50px;">
+<body>
     <h1>Azure Machine Learning code snippets</h1>
     <h2>Find the workflow and file for a code snippet</h2>
     Enter your code snippet here (including `/azureml-`) to find the workflow and file in the AzureML examples repository.

diff --git a/docs/style.css b/docs/style.css
@@ -0,0 +1,56 @@
+/* styles.css */
+body {
+    font-family: Arial, sans-serif;
+    margin: 50px;
+    background-color: #f0f0f0;
+}
+
+h1 {
+    color: #333;
+}
+
+table {
+    width: 100%;
+    border-collapse: collapse;
+}
+
+table, th, td {
+    border: 1px solid #999;
+    padding: 10px;
+    text-align: left;
+}
+
+th {
+    background-color: #4CAF50;
+    color: white;
+}
+
+tr:nth-child(even) {
+    background-color: #f2f2f2;
+}
+
+a {
+    color: #333;
+    text-decoration: none;
+}
+
+a:hover {
+    color: #4CAF50;
+}
+button {
+    background-color: #4CAF50; /* Green */
+    border: none;
+    color: white;
+    padding: 15px 32px;
+    text-align: center;
+    text-decoration: none;
+    display: inline-block;
+    font-size: 16px;
+    margin: 4px 2px;
+    cursor: pointer;
+    transition-duration: 0.4s;
+}
+
+button:hover {
+    background-color: #45a049;
+}