deploy: f7f0b2d

objectionary · Oct 16, 2024 · 0dccbd5 · 0dccbd5
commit 0dccbd5
Show file tree

Hide file tree

Showing 4 changed files with 150 additions and 0 deletions.
diff --git a/.nojekyll b/.nojekyll
diff --git a/index.html b/index.html
@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="UTF-8">
+  <title>try-phi</title>
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <!-- <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/css/bootstrap.min.css" rel="stylesheet">
+  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/js/bootstrap.bundle.min.js"></script> -->
+  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.3.0/font/bootstrap-icons.css">
+  <style rel="stylesheet" href="styles.css"></style>
+  <link rel="stylesheet"
+    href="https://cdnjs.cloudflare.com/ajax/libs/github-fork-ribbon-css/0.2.3/gh-fork-ribbon.min.css" />
+  <style>
+    .github-fork-ribbon:before {
+      background-color: #54c234;
+    }
+  </style>
+</head>
+
+<body>
+  <a class="github-fork-ribbon" href="https://github.com/objectionary/try-phi" data-ribbon="Fork me on GitHub!"
+    title="Fork me on GitHub!">Fork me on GitHub!</a>
+  <div>
+    <script type="module" src="./index.js"></script>
+  </div>
+
+</body>
+
+</html>
diff --git a/index.js b/index.js
diff --git a/styles.css b/styles.css
@@ -0,0 +1,108 @@
+.switch {
+    position: relative;
+    display: inline-block;
+    width: 60px;
+    height: 34px;
+    vertical-align: middle
+}
+
+.switch input {
+    opacity: 0;
+    width: 0;
+    height: 0;
+}
+
+.popover-content kbd {
+    background-color: #eee;
+    border-radius: 3px;
+    border: 1px solid #b4b4b4;
+    box-shadow: 0 1px 1px rgba(0, 0, 0, .2), 0 2px 0 0 rgba(255, 255, 255, .7) inset;
+    color: #333;
+    display: inline-block;
+    font-size: .85em;
+    font-weight: 700;
+    line-height: 1;
+    padding: 2px 4px;
+    white-space: nowrap;
+   }
+
+.slider {
+    position: absolute;
+    cursor: pointer;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background-color: #42b340;
+    -webkit-transition: .4s;
+    transition: .4s;
+}
+
+.slider:before {
+    position: absolute;
+    content: "";
+    height: 26px;
+    width: 26px;
+    left: 4px;
+    bottom: 4px;
+    background-color: white;
+    -webkit-transition: .4s;
+    transition: .4s;
+}
+
+input:checked+.slider {
+    background-color: #2196F3;
+}
+
+input:focus+.slider {
+    box-shadow: 0 0 1px #2196F3;
+}
+
+input:checked+.slider:before {
+    -webkit-transform: translateX(26px);
+    -ms-transform: translateX(26px);
+    transform: translateX(26px);
+}
+
+/* Rounded sliders */
+.slider.round {
+    border-radius: 34px;
+}
+
+.slider.round:before {
+    border-radius: 50%;
+}
+
+.selected_mode{
+    vertical-align: middle;
+    font-weight: bold;
+}
+
+.reference_line {
+    vertical-align: middle;
+}
+
+
+.btn-yellow,
+.btn-yellow:hover,
+.btn-yellow:active,
+.btn-yellow:visited {
+  background-color: #eab42b !important;
+}
+
+.btn-yellow:focus{
+  border-color: #eab42b !important;
+  box-shadow: 0 0 0 0.2rem #eab42b7c !important;
+}
+
+.btn-green,
+.btn-green:hover,
+.btn-green:active,
+.btn-green:visited {
+  background-color: #54c234;
+}
+
+.btn-green:focus{
+  border-color: #54c234;
+  box-shadow: 0 0 0 0.2rem #55c23480;
+}