Add leaderboard page (#212)

Co-authored-by: Shishir Patil <[email protected]>
ShishirPatil · Feb 27, 2024 · 91bb6c3 · 91bb6c3
1 parent 5889a10
commit 91bb6c3
Show file tree

Hide file tree

Showing 23 changed files with 2,506 additions and 146 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1 +1,3 @@
+_site/
+.jekyll-cache/
 *.DS_Store
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+    "liveServer.settings.port": 5501
+}
diff --git a/assets/css/Highlight-Clean-blog.css b/assets/css/Highlight-Clean-blog.css
@@ -0,0 +1,66 @@
+.highlight-clean {
+  color: #313437;
+  background-color: #fff;
+  padding: 50px 0;
+}
+
+.highlight-clean p {
+  color: #7d8285;
+}
+
+.highlight-clean h2 {
+  font-weight: bold;
+  margin-bottom: 25px;
+  line-height: 1.5;
+  padding-top: 0;
+  margin-top: 0;
+  color: inherit;
+}
+
+.highlight-clean .intro {
+  font-size: 16px;
+  max-width: 500px;
+  margin: 0 auto 25px;
+}
+
+.highlight-clean .buttons {
+  text-align: center;
+}
+
+.highlight-clean .buttons .btn {
+  padding: 16px 32px;
+  margin: 6px;
+  border: none;
+  background: none;
+  box-shadow: none;
+  text-shadow: none;
+  opacity: 0.90;
+  /*text-transform: uppercase;*/
+  font-weight: bold;
+  font-size: 13px;
+  letter-spacing: 0.4px;
+  line-height: 1;
+  outline: none;
+  background-color: #ddd;
+}
+
+.highlight-clean .buttons .btn:hover {
+  opacity: 1;
+}
+
+.highlight-clean .buttons .btn:active {
+  transform: translateY(1px);
+}
+
+.highlight-clean .buttons .btn-primary {
+  background-color: #055ada;
+  color: #fff;
+}
+
+body {
+  font-family: 'Source Sans Pro', sans-serif;
+  padding-bottom: 50px;
+}
+
+
+
diff --git a/assets/css/Highlight-Clean-leaderboard.css b/assets/css/Highlight-Clean-leaderboard.css
@@ -0,0 +1,76 @@
+.highlight-clean {
+  color: #313437;
+  background-color: #fff;
+  padding: 50px 0;
+}
+
+.highlight-clean p {
+  color: #7d8285;
+}
+
+.highlight-clean h2 {
+  font-weight: bold;
+  margin-bottom: 25px;
+  line-height: 1.5;
+  padding-top: 0;
+  margin-top: 0;
+  color: inherit;
+}
+
+.highlight-clean .intro {
+  font-size: 16px;
+  max-width: 500px;
+  margin: 0 auto 25px;
+}
+
+.highlight-clean .buttons {
+  text-align: center;
+}
+
+.highlight-clean .buttons .btn {
+  padding: 16px 32px;
+  margin: 6px;
+  border: none;
+  background: none;
+  box-shadow: none;
+  text-shadow: none;
+  opacity: 0.90;
+  /*text-transform: uppercase;*/
+  font-weight: bold;
+  font-size: 13px;
+  letter-spacing: 0.4px;
+  line-height: 1;
+  outline: none;
+  background-color: #ddd;
+}
+
+.highlight-clean .buttons .btn:hover {
+  opacity: 1;
+}
+
+.highlight-clean .buttons .btn:active {
+  transform: translateY(1px);
+}
+
+.highlight-clean .buttons .btn-primary {
+  background-color: #055ada;
+  color: #fff;
+}
+
+body {
+  font-family: 'Source Sans Pro', sans-serif;
+  padding-bottom: 50px;
+}
+
+.header-image {
+  height: auto;
+  width: 3%;
+}
+
+
+@media only screen and (max-width: 768px) {
+  .header-image {
+    height: auto;
+    width: 10%;
+  }
+}
diff --git a/assets/css/api-explorer.css b/assets/css/api-explorer.css
@@ -0,0 +1,207 @@
+#api-explorer .container {
+    display: flex;
+}
+
+#api-explorer .inputs,
+#api-explorer .output-section {
+    flex: 1;
+    margin: 0 10px;
+}
+
+#input-text,
+#input-function {
+    width: 100%;
+    resize: vertical;
+    margin-bottom: 10px;
+}
+
+#input-function {
+    min-height: 360px;
+}
+
+#input-text {
+    min-height: 160px;
+}
+
+#api-explorer .output {
+    border: 1px solid #ccc;
+    padding: 10px;
+    height: fit-content;
+    margin-top: 10px;
+}
+
+#api-explorer #code-output {
+    min-height: 75px;
+}
+
+#api-explorer #json-output {
+    min-height: 300px;
+}
+
+#api-explorer #exec-output {
+    min-height: 150px;
+}
+
+
+#api-explorer {
+    margin-top: 20px;
+}
+
+#submit-btn {
+    display: block;
+    width: 20%;
+    margin: auto;
+}
+
+#exec-btn {
+    display: block;
+    width: 20%;
+    margin: auto;
+}
+
+
+#examples button {
+    font-size: 16px;
+    /* Adjust the font size as needed */
+    font-weight: bold;
+    color: white;
+    /* Text color */
+    background-color: #007bff;
+    /* Background color */
+    border: none;
+    border-radius: 5px;
+    /* Rounded corners */
+    padding: 10px 20px;
+    /* Padding inside the button */
+    margin: 0 20px;
+    /* Space between buttons */
+    cursor: pointer;
+    /* Changes the cursor to a pointer on hover */
+    transition: background-color 0.3s ease;
+    /* Smooth transition for hover effect */
+}
+
+#examples button:hover {
+    background-color: #0056b3;
+    /* Darker shade when hovered */
+}
+
+
+#examples {
+    display: flex;
+    justify-content: center;
+    /* Center horizontally */
+    align-items: center;
+    /* Center vertically */
+}
+
+
+@media only screen and (max-width: 768px) {
+    #examples button {
+        padding: 2px 10px;
+        font-size: small;
+        margin: 0 10px;
+    }
+}
+
+
+#demo-input-container {
+    max-width: 95%;
+}
+
+
+#report-issue-btn {
+    display: block;
+    /* This makes the button a block-level element, enabling it to occupy its own line */
+    width: 25%;
+    margin: 15px auto;
+}
+
+
+.centered-options {
+    text-align: center;
+}
+
+
+.centered-options #option1+label {
+    margin-right: 20px;
+}
+
+
+.api-explorer-button {
+    background-color: #ff5722;
+    /* A vibrant orange */
+    color: #ffffff;
+    /* White text */
+    border: none;
+    /* Remove default border */
+    padding: 10px 15px;
+    /* Vertical and horizontal padding */
+    border-radius: 4px;
+    /* Slightly rounded corners for a modern look */
+    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
+    /* Subtle shadow for depth */
+    cursor: pointer;
+    /* Cursor changes to pointer to indicate clickable */
+    transition: transform 0.2s ease, box-shadow 0.2s ease;
+    /* Smooth transition for press and hover effects */
+    text-align: center;
+    min-width: 120px;
+}
+
+@media only screen and (max-width: 768px) {
+    .api-explorer-button {
+        padding: 0;
+        min-width: none;
+    }
+}
+
+
+
+.api-explorer-button:hover,
+.api-explorer-button:focus {
+    background-color: #e64a19;
+    /* Darker shade of orange on hover/focus */
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
+    /* Larger shadow for a "lifted" effect */
+}
+
+.api-explorer-button:active {
+    transform: translateY(2px);
+    /* Button appears pressed on click */
+    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
+    /* Smaller shadow for pressed effect */
+}
+
+
+#report-issue-btn {
+    background-color: #a53931;
+    color: white;
+    border: 2px solid transparent;
+    padding: 8px 16px;
+    font-size: 14px;
+    border-radius: 3px;
+    cursor: pointer;
+    transition: background-color 0.3s, border-color 0.3s;
+}
+
+#report-issue-btn:hover {
+    background-color: #d32f2f;
+    /* Darker shade of red */
+    border-color: #b71c1c;
+    /* Border color changes on hover */
+}
+
+#report-issue-btn:focus {
+    outline: none;
+    /* Removes default focus outline */
+    border-color: #b71c1c;
+    /* Ensures visibility in focus state */
+}
+
+#report-issue-btn:active {
+    background-color: #c62828;
+    /* Even darker for the pressed effect */
+    transform: scale(0.98);
+    /* Slightly smaller on click */
+}