diff --git a/index.html b/index.html
index e41d753..3ff6bac 100644
--- a/index.html
+++ b/index.html
@@ -131,12 +131,19 @@
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/clicker/clicker.js b/src/clicker/clicker.js
index 7e9678d..edd5c8e 100644
--- a/src/clicker/clicker.js
+++ b/src/clicker/clicker.js
@@ -5,7 +5,7 @@ import storage from "/src/modules/storage.js";
import * as auth from "/src/modules/auth.js";
import * as themes from "/src/themes/themes.js";
-import { autocomplete } from "/src/symbols/symbols.js";
+import { autocomplete, insertFromIndex } from "/src/symbols/symbols.js";
import { unixToTimeString } from "/src/modules/time.js";
import { getExtendedPeriod } from "/src/periods/periods";
import { convertLatexToAsciiMath, convertLatexToMarkup, renderMathInElement } from "mathlive";
diff --git a/src/design.css b/src/design.css
index 00ab40f..a9d0f53 100644
--- a/src/design.css
+++ b/src/design.css
@@ -395,6 +395,11 @@ div.ML__keyboard {
width: -webkit-fill-available;
}
+.input-group.row {
+ flex-direction: row;
+ gap: 0.25em;
+}
+
[square] {
width: 2.25em !important;
min-width: 36px;
diff --git a/src/layout.css b/src/layout.css
index 0e98a91..7b7e684 100644
--- a/src/layout.css
+++ b/src/layout.css
@@ -227,7 +227,7 @@ div.spacer {
width: fit-content;
overflow: hidden;
align-self: center;
- position: sticky;
+ position: fixed;
bottom: 25px;
}
diff --git a/src/modules/ui.css b/src/modules/ui.css
index 0be20fb..2d54c2c 100644
--- a/src/modules/ui.css
+++ b/src/modules/ui.css
@@ -138,12 +138,11 @@ dialog > button[data-suggestions] {
}
div.modeless {
- position: absolute;
+ position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 999;
-
display: flex;
flex-direction: column;
align-items: center;
@@ -151,6 +150,7 @@ div.modeless {
border-radius: 1rem;
box-shadow: 0 0 2rem rgba(0, 0, 0, 0.2);
pointer-events: none;
+ background: var(--background-color);
}
div.modeless > h2 {
@@ -538,6 +538,26 @@ body:has(.topbar) {
transition: border-right-width 0.25s ease-in-out;
}
+[data-modal-page="store"] .themes-grid .theme-item.suggest-theme {
+ border: 2px dashed var(--accent-color) !important;
+ background: transparent !important;
+ cursor: pointer;
+ transition: background-color 0.25s ease-in-out;
+}
+
+[data-modal-page="store"] .themes-grid .theme-item.suggest-theme:hover {
+ background: var(--surface-color) !important;
+ transition: background-color 0.25s ease-in-out;
+}
+
+[data-modal-page="store"] .themes-grid .theme-item.suggest-theme i {
+ position: relative !important;
+ margin: auto;
+ padding: 0;
+ top: 0;
+ left: 0;
+}
+
[data-modal-page="store"] .themes-grid .theme-item i:not(.hd) {
position: absolute;
bottom: 10px;
diff --git a/src/symbols/symbols.json b/src/symbols/symbols.json
index 6be0eeb..2823f44 100644
--- a/src/symbols/symbols.json
+++ b/src/symbols/symbols.json
@@ -36,5 +36,10 @@
"mu": "μ",
"lambda": "λ",
"gamma": "γ",
- "kappa": "κ"
+ "kappa": "κ",
+ "omega": "ω",
+ "omegacap": "Ω",
+ "ihat": "î",
+ "jhat": "ĵ",
+ "khat": "k̂"
}
diff --git a/src/themes/themes.js b/src/themes/themes.js
index 15b0934..744591f 100644
--- a/src/themes/themes.js
+++ b/src/themes/themes.js
@@ -404,10 +404,20 @@ export async function renderStore() {
const freeThemesGridText = document.createElement("b");
freeThemesGridText.innerText = 'Free Themes';
store.appendChild(freeThemesGridText);
+ const freeThemesGridSuggestTheme = document.createElement("div");
+ freeThemesGridSuggestTheme.classList = 'theme-item suggest-theme';
+ freeThemesGridSuggestTheme.innerHTML = ``;
+ freeThemesGridSuggestTheme.onclick = ui.suggestionsModal;
+ freeThemesGrid.appendChild(freeThemesGridSuggestTheme);
store.appendChild(freeThemesGrid);
const premiumThemesGridText = document.createElement("b");
premiumThemesGridText.innerText = 'Premium Themes';
store.appendChild(premiumThemesGridText);
+ const premiumThemesGridSuggestTheme = document.createElement("div");
+ premiumThemesGridSuggestTheme.classList = 'theme-item suggest-theme';
+ premiumThemesGridSuggestTheme.innerHTML = ``;
+ premiumThemesGridSuggestTheme.onclick = ui.suggestionsModal;
+ premiumThemesGrid.appendChild(premiumThemesGridSuggestTheme);
store.appendChild(premiumThemesGrid);
const costInfo = document.createElement("ul");
costInfo.classList = 'cost-info';