├── dev
├── states.js
├── caches.js
├── home.js
├── request.js
├── constants.js
├── utils.js
├── skeleton.js
├── autocomplete.js
└── events.js
├── compile.py
├── LICENSE
├── README.md
├── .github
└── workflows
│ └── codeql-analysis.yml
├── parts
├── footerResponsive.html
├── footer.html
└── extendedKeyboard.html
├── main.js
├── wolframalpha.svg
└── main.css
/dev/states.js:
--------------------------------------------------------------------------------
1 | const states = {
2 | "currentEquation": 0,
3 | "home": false
4 | }
--------------------------------------------------------------------------------
/dev/caches.js:
--------------------------------------------------------------------------------
1 | const store = {
2 | "xml": "",
3 | "equation": ""
4 | }
5 |
6 | const caches = {
7 | "footer": null,
8 | "responsiveFooter": null,
9 | "keyboard": null,
10 | "responsiveKeyboard": null,
11 | "home": null,
12 | "responsiveHome": null
13 | }
--------------------------------------------------------------------------------
/compile.py:
--------------------------------------------------------------------------------
1 | from os import listdir
2 |
3 | result = ""
4 |
5 | for script in listdir("dev"):
6 | with open(f"dev/{script}") as reading_file:
7 | result += f"/* {script} */\n\n"
8 | result += reading_file.read()
9 | result += "\n\n\n"
10 |
11 | with open("main.js", "w") as out:
12 | out.write(result)
--------------------------------------------------------------------------------
/dev/home.js:
--------------------------------------------------------------------------------
1 | async function goHome() {
2 | states.home = true;
3 | resizeHandler()
4 | window.location.hash = ""
5 | document.getElementById("equationInput").focus()
6 | document.getElementById("equationInput").blur()
7 | document.getElementById('equationFooter').style.display = "none"
8 | title.innerText = "Wolfram|Alpha: Computational Intelligence"
9 | }
--------------------------------------------------------------------------------
/dev/request.js:
--------------------------------------------------------------------------------
1 | async function request(endpoint) {
2 | try {
3 | let request = await fetch(endpoint)
4 | response = await request.json()
5 | if (response.success) {
6 | response = response.data
7 | } else {
8 | response = null
9 | }
10 | } catch {
11 | response = null
12 | }
13 | return response
14 | }
--------------------------------------------------------------------------------
/dev/constants.js:
--------------------------------------------------------------------------------
1 | const QUERY_URL = "https://freewolframalpha-api.vercel.app/query?question={question}&timeout={timeout}&podstate={podstate}"
2 | const AUTOCOMPLETE_URL = "https://freewolframalpha-api.vercel.app/autocomplete?question={question}"
3 | const RECALCULATION_URL = "https://freewolframalpha-api.vercel.app/recalculate?domain={domain}&id={id}"
4 | const RELATEDQUERIES_URL = "https://freewolframalpha-api.vercel.app/related?domain={domain}&id={id}"
5 | const TIMEOUT = 3
6 |
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2020 Animenosekai
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | 
2 |
3 | # [free](https://freewolframalpha.netlify.app)WolframAlpha
4 |
5 | [](https://app.netlify.com/sites/freewolframalpha/deploys)
6 |
7 | ## Free Wolfram|Alpha Step-by-Step Solutions
8 |
9 | - [**Try it now**](https://freewolframalpha.netlify.app), it's gratis!
10 | - Unlock/Receive FREE unlimited access to [Wolfram|Alpha's full Step-by-step solutions](https://www.wolframalpha.com/examples/pro-features/step-by-step-solutions/).
11 | - Facilitate the use of [Wolfram|Alpha Show Steps API](https://products.wolframalpha.com/show-steps-api/documentation/).
12 | - Feels like you are on Wolfram|Alpha.
13 | - Serverless Backend, providing both efficiency, privacy and speed
14 | - Fast Queries, letting the site show you part of the final results in the first time and computing the other part in the background (WolframAlpha Recalculation)
15 | - Related Queries
16 | - Clickable Result (Searching something by clicking on the result image)
17 | - Caching, both front-end wise and back-end wise
18 | - Responsive
19 | - Query Autocomplete
20 | - Skeleton Loading
21 | - "Did you mean", "Image Source" and "Definition" support
22 |
23 | ## Backend
24 |
25 | Check out the serverless backend at [Animenosekai/freewolframalpha-api](https://github.com/Animenosekai/freewolframalpha-api)
26 |
27 | > © Anime no Sekai — 2021 ✨
28 |
--------------------------------------------------------------------------------
/dev/utils.js:
--------------------------------------------------------------------------------
1 | String.prototype.format = function () {
2 | /* C / Python like string formatter --> "Hello {name}".format("world") */
3 | "use strict";
4 | var str = this.toString();
5 | if (arguments.length) {
6 | var t = typeof arguments[0];
7 | var key;
8 | var args = ("string" === t || "number" === t) ?
9 | Array.prototype.slice.call(arguments) :
10 | arguments[0];
11 |
12 | for (key in args) {
13 | str = str.replace(new RegExp("\\{" + key + "\\}", "gi"), args[key]);
14 | }
15 | }
16 |
17 | return str;
18 | };
19 |
20 |
21 | async function download() {
22 | var element = document.createElement('a');
23 | element.setAttribute('href', 'data:text/xml;charset=utf-8,' + encodeURIComponent(store.xml));
24 | element.setAttribute('download', store.equation + " - Wolfram|Alpha Result.xml");
25 |
26 | element.style.display = 'none';
27 | document.body.appendChild(element);
28 |
29 | element.click();
30 |
31 | document.body.removeChild(element);
32 | }
33 |
34 | async function addSpecial(specialCharButton) {
35 | equationInput.value = equationInput.value + specialCharButton.getAttribute("value")
36 | //document.getElementById("inputOutput").innerText = equationInput.value
37 | }
38 |
39 | /*
40 | async function addInput() {
41 | document.getElementById("inputOutput").innerText = document.getElementById("equationInput").value
42 | if (equationInput.value.replace(" ", '') == "") {
43 | document.getElementById("inputOutput").innerText = "Enter what you want to calculate or know about"
44 | }
45 | }
46 | */
47 |
48 | function encode(value) {
49 | return encodeURIComponent(String(value)).replace(/[-_.!~*'()]/g, char => '%' + char.charCodeAt(0).toString(16))
50 | }
--------------------------------------------------------------------------------
/dev/skeleton.js:
--------------------------------------------------------------------------------
1 | async function createSkeleton() {
2 | let newElem = document.createElement("queryresult")
3 | let newHeader = document.createElement("h2")
4 | newHeader.classList.add("pod-header")
5 | newHeader.classList.add("skeleton-box")
6 | newHeader.style.borderRadius = "8px 8px 0 0"
7 | newElem.appendChild(newHeader)
8 | let newSubPod = document.createElement("subpod")
9 | newSubPod.style.height = "25px"
10 | newElem.appendChild(newSubPod)
11 |
12 | newHeader = document.createElement("h2")
13 | newHeader.classList.add("pod-header")
14 | newHeader.classList.add("skeleton-box")
15 | newElem.appendChild(newHeader)
16 | newSubPod = document.createElement("subpod")
17 | newSubPod.style.height = "150px"
18 | newElem.appendChild(newSubPod)
19 |
20 | newHeader = document.createElement("h2")
21 | newHeader.classList.add("pod-header")
22 | newHeader.classList.add("skeleton-box")
23 | newElem.appendChild(newHeader)
24 | newSubPod = document.createElement("subpod")
25 | newSubPod.style.height = "35px"
26 | newElem.appendChild(newSubPod)
27 |
28 | newHeader = document.createElement("h2")
29 | newHeader.classList.add("pod-header")
30 | newHeader.classList.add("skeleton-box")
31 | newElem.appendChild(newHeader)
32 | newSubPod = document.createElement("subpod")
33 | newSubPod.style.height = "120px"
34 | newElem.appendChild(newSubPod)
35 |
36 |
37 | for (var i = 0; i < 5; i++) {
38 | newHeader = document.createElement("h2")
39 | newHeader.classList.add("pod-header")
40 | newHeader.classList.add("skeleton-box")
41 | newElem.appendChild(newHeader)
42 | newSubPod = document.createElement("subpod")
43 | newSubPod.style.height = (Math.random() * 200 + 15).toString() + "px"
44 | newElem.appendChild(newSubPod)
45 | }
46 |
47 |
48 | document.getElementById("pod").innerHTML = ""
49 | document.getElementById("pod").appendChild(newElem)
50 | document.getElementById("pod-height").style.height = document.getElementById("pod").offsetHeight + 50 + "px"
51 | }
--------------------------------------------------------------------------------
/dev/autocomplete.js:
--------------------------------------------------------------------------------
1 | async function autocompleteClickHandler(elem) {
2 | document.getElementById("equationInput").value = elem.innerText
3 | inputSubmit()
4 | }
5 |
6 | function createAutocompleteElement(complete, query) {
7 | let newListElement = document.createElement("li")
8 | newListElement.classList.add("autocomplete-list-element")
9 | let newAnchor = document.createElement("a")
10 | newAnchor.setAttribute("onclick", 'autocompleteClickHandler(this)')
11 | newAnchor.classList.add("autocomplete-anchor")
12 | let newSpan = document.createElement("span")
13 | let bold = ""
14 | let nonBold = ""
15 | let checkingBold = true
16 | for (var index = 0; index < complete.length; index++) {
17 | if (index < query.length && complete[index].toLowerCase() == query[index].toLowerCase() && checkingBold) {
18 | bold += complete[index]
19 | } else {
20 | checkingBold = false
21 | nonBold += complete[index]
22 | }
23 | }
24 | if (bold.length > 0) {
25 | let newBoldSpan = document.createElement("span")
26 | newBoldSpan.classList.add("autocomplete-bold-span")
27 | newBoldSpan.innerText = bold
28 | newSpan.appendChild(newBoldSpan)
29 | }
30 | newSpan.innerHTML += nonBold
31 | newAnchor.appendChild(newSpan)
32 | newListElement.appendChild(newAnchor)
33 | return newListElement
34 | }
35 |
36 | async function autocomplete() {
37 | result = await request(AUTOCOMPLETE_URL.format({question: encode(document.getElementById("equationInput").value)}))
38 | if (result) {
39 | let newAutocompleteList = document.createElement("ul")
40 | newAutocompleteList.classList.add("autocomplete-list")
41 | for (index in result.results) {
42 | newAutocompleteList.appendChild(createAutocompleteElement(result.results[index].input, result.query))
43 | }
44 | while (document.getElementById("autocompleteResults").firstElementChild != null) {
45 | document.getElementById("autocompleteResults").firstElementChild.remove()
46 | }
47 | document.getElementById("autocompleteResults").appendChild(newAutocompleteList)
48 | }
49 | }
--------------------------------------------------------------------------------
/.github/workflows/codeql-analysis.yml:
--------------------------------------------------------------------------------
1 | # For most projects, this workflow file will not need changing; you simply need
2 | # to commit it to your repository.
3 | #
4 | # You may wish to alter this file to override the set of languages analyzed,
5 | # or to provide custom queries or build logic.
6 | #
7 | # ******** NOTE ********
8 | # We have attempted to detect the languages in your repository. Please check
9 | # the `language` matrix defined below to confirm you have the correct set of
10 | # supported CodeQL languages.
11 | #
12 | name: "CodeQL"
13 |
14 | on:
15 | push:
16 | branches: [ main ]
17 | pull_request:
18 | # The branches below must be a subset of the branches above
19 | branches: [ main ]
20 | schedule:
21 | - cron: '32 3 * * 0'
22 |
23 | jobs:
24 | analyze:
25 | name: Analyze
26 | runs-on: ubuntu-latest
27 |
28 | strategy:
29 | fail-fast: false
30 | matrix:
31 | language: [ 'javascript' ]
32 | # CodeQL supports [ 'cpp', 'csharp', 'go', 'java', 'javascript', 'python' ]
33 | # Learn more:
34 | # https://docs.github.com/en/free-pro-team@latest/github/finding-security-vulnerabilities-and-errors-in-your-code/configuring-code-scanning#changing-the-languages-that-are-analyzed
35 |
36 | steps:
37 | - name: Checkout repository
38 | uses: actions/checkout@v2
39 |
40 | # Initializes the CodeQL tools for scanning.
41 | - name: Initialize CodeQL
42 | uses: github/codeql-action/init@v1
43 | with:
44 | languages: ${{ matrix.language }}
45 | # If you wish to specify custom queries, you can do so here or in a config file.
46 | # By default, queries listed here will override any specified in a config file.
47 | # Prefix the list here with "+" to use these queries and those in the config file.
48 | # queries: ./path/to/local/query, your-org/your-repo/queries@main
49 |
50 | # Autobuild attempts to build any compiled languages (C/C++, C#, or Java).
51 | # If this step fails, then you should remove it and run the build manually (see below)
52 | - name: Autobuild
53 | uses: github/codeql-action/autobuild@v1
54 |
55 | # ℹ️ Command-line programs to run using the OS shell.
56 | # 📚 https://git.io/JvXDl
57 |
58 | # ✏️ If the Autobuild fails above, remove it and uncomment the following three lines
59 | # and modify them (or add more) to build your code if your project
60 | # uses a compiled language
61 |
62 | #- run: |
63 | # make bootstrap
64 | # make release
65 |
66 | - name: Perform CodeQL Analysis
67 | uses: github/codeql-action/analyze@v1
68 |
--------------------------------------------------------------------------------
/parts/footerResponsive.html:
--------------------------------------------------------------------------------
1 |
345 |
--------------------------------------------------------------------------------
/parts/footer.html:
--------------------------------------------------------------------------------
1 |
342 |
--------------------------------------------------------------------------------
/dev/events.js:
--------------------------------------------------------------------------------
1 | async function hashChange() {
2 | equationInput.focus()
3 | equationInput.value = decodeURIComponent(location.hash.slice(1))
4 | //document.getElementById("inputOutput").innerText = decodeURIComponent(location.hash.slice(1))
5 | if (decodeURIComponent(location.hash.slice(1)).replace(" ", '') == "") {
6 | //document.getElementById("inputOutput").innerText = "Enter what you want to calculate or know about"
7 | goHome()
8 | }
9 | }
10 |
11 | function parse() {
12 | document.querySelectorAll("dropdown > option").forEach((item) => {
13 | try {
14 | item.remove()
15 | } catch {
16 | console.warn("An error occured while removing the stray option:", item)
17 | }
18 | })
19 | document.querySelectorAll("dropdown").forEach((item) => {
20 | try {
21 | while (item.previousElementSibling.tagName != "H2")
22 | item.parentNode.insertBefore(item, item.previousElementSibling)
23 | item.previousElementSibling.append(item)
24 | } catch {
25 | console.warn("An error occured while moving the drop-down menu right next to the nearest heading:", item)
26 | }
27 | })
28 | document.querySelectorAll("option").forEach((item) => {
29 | try {
30 | item.text = item.getAttribute("name")
31 | } catch {
32 | console.warn("An error occured while extracting the names of all available options:", item)
33 | }
34 | })
35 | document.querySelectorAll("select").forEach((item) => {
36 | try {
37 | item.value = item.getAttribute("value")
38 | } catch {
39 | console.warn("An error occured while extracting the currently selected option name:", item)
40 | }
41 | })
42 | document.querySelectorAll("select").forEach((item) => {
43 | try {
44 | item.style = `
45 | background: white;
46 | color: orangered;
47 | border: thin solid darkorange;
48 | border-radius: .5em;
49 | `
50 | } catch {
51 | console.warn("An error occured while styling the drop-down menu:", item)
52 | }
53 | })
54 | document.querySelectorAll("select").forEach((item) => {
55 | try {
56 | item.onchange = () => inputSubmit(item.value)
57 | } catch {
58 | console.warn("An error occured. The selected changes to the following drop-down menus will not send requests for status update properly:", item)
59 | }
60 | })
61 | Array.prototype.slice.call(document.getElementsByTagName('pre')).forEach((item) => {
62 | try {
63 | item.remove();
64 | } catch {
65 | console.warn("An error occured while removing the following item")
66 | console.log(item)
67 | }
68 | });
69 | Array.prototype.forEach.call(document.getElementById("pod").getElementsByTagName("h2"), (item) => {
70 | try {
71 | item.classList.add("pod-header")
72 | } catch {
73 | console.warn("An error occured while setting the pod-header with the following item")
74 | console.log(item)
75 | }
76 | });
77 | Array.prototype.forEach.call(document.getElementById("pod").getElementsByTagName("img"), (item) => {
78 | try {
79 | if (item.parentNode.tagName == "SUBPOD" && item.parentNode.getAttribute("title") == "") {
80 | item.setAttribute("onclick", "document.getElementById('equationInput').value = this.getAttribute('alt'); inputSubmit();")
81 | item.classList.add("clickable-result")
82 | }
83 | } catch {
84 | console.warn("An error occured while setting the direct query for the following item")
85 | console.log(item)
86 | }
87 | });
88 | Array.prototype.forEach.call(document.getElementById("pod").getElementsByTagName("info"), (item) => {
89 | try {
90 | item.querySelector("img").setAttribute("onclick", "window.open(this.parentNode.querySelector('link').getAttribute('url'), '_blank')")
91 | } catch {
92 | console.warn("An error occured while setting the info linking for the following item")
93 | console.log(item)
94 | }
95 | });
96 | document.getElementById("pod").querySelectorAll("imagesource").forEach((item) => {
97 | try {
98 | item.parentNode.querySelector("img").setAttribute("source-forward", item.innerText)
99 | item.parentNode.querySelector("img").setAttribute("onclick", "window.open(this.getAttribute('source-forward'), '_blank')")
100 | item.classList.add("unload")
101 | } catch {
102 | console.warn("An error occured while setting link for the following item")
103 | console.log(item)
104 | }
105 | });
106 | document.getElementById("pod-height").style.height = document.getElementById("pod").offsetHeight + 50 + "px"
107 | document.getElementById('equationFooter').style.display = "block"
108 | }
109 |
110 | async function inputSubmit(podstate) {
111 | try {
112 | document.querySelectorAll("relatedqueries").forEach((item) => {
113 | item.remove()
114 | })
115 | document.querySelectorAll("related-height").forEach((item) => {
116 | item.remove()
117 | })
118 | } catch {
119 | console.info("No Related Queries Container to remove")
120 | }
121 | document.getElementById("pod").setAttribute("home-type", "")
122 | createSkeleton()
123 | document.getElementById('equationFooter').style.display = "none"
124 | if (document.getElementById("equationInput").value.replace(" ", '') == "") {
125 | goHome();
126 | return;
127 | }
128 | window.location.hash = encode(document.getElementById("equationInput").value)
129 | states.currentEquation++;
130 | let equationNumber = states.currentEquation
131 | document.getElementById("equationInput").focus()
132 | document.getElementById("equationInput").blur()
133 | document.querySelector("title").innerText = document.getElementById("equationInput").value + " - Wolfram|Alpha"
134 | request(QUERY_URL.format({
135 | podstate: podstate,
136 | question: encode(document.getElementById("equationInput").value),
137 | timeout: String(TIMEOUT)
138 | }))
139 | .then((xml) => {
140 | if (xml) {
141 | if (states.currentEquation == equationNumber) {
142 | store.xml = xml
143 | store.equation = document.getElementById("equationInput").value
144 | if (store.xml.includes('input parameter not present in query')) {
145 | goHome()
146 | } else {
147 | states.home = false
148 | document.getElementById("pod").innerHTML = xml.replace(/plaintext/g, 'pre').replace(/').replace(/.......scanner/gs, ' {
154 | item.setAttribute("onclick", "document.getElementById('equationInput').value = this.innerText; inputSubmit();")
155 | })
156 | }
157 |
158 | if (document.querySelector("tips")) {
159 | document.querySelector("tips").lastElementChild.style.marginBottom = "20px"
160 | }
161 |
162 | // related queries
163 | if (document.getElementById("pod").querySelector("queryresult").getAttribute("related") != "") {
164 | url = new URL(document.getElementById("pod").querySelector("queryresult").getAttribute("related"))
165 | request(RELATEDQUERIES_URL.format({
166 | domain: url.host,
167 | id: url.searchParams.get("id")
168 | }))
169 | .then((response) => {
170 | if (response) {
171 | let tempRelated = document.createElement("temp")
172 | tempRelated.innerHTML = response
173 | if (tempRelated.querySelector("relatedqueries").getAttribute("count") != "0") {
174 | document.getElementById("pod-height").parentNode.appendChild(tempRelated.querySelector("relatedqueries"))
175 | document.querySelector("relatedqueries").lastElementChild.style.marginBottom = "20px"
176 | let newRelatedHeight = document.createElement("related-height")
177 | newRelatedHeight.style.height = document.querySelector("relatedqueries").offsetHeight + 50 + "px"
178 | newRelatedHeight.style.display = "block"
179 | document.getElementById("pod-height").parentNode.appendChild(newRelatedHeight)
180 | document.querySelectorAll("relatedquery").forEach((item) => {
181 | item.setAttribute("onclick", "document.getElementById('equationInput').value = this.innerText; inputSubmit();")
182 | })
183 | }
184 | }
185 | })
186 | }
187 |
188 | // WolframAlpha's "lazy" loading of queryresult
189 | if (document.getElementById("pod").querySelector("queryresult").getAttribute("recalculate") != "") {
190 | url = new URL(document.getElementById("pod").querySelector("queryresult").getAttribute("recalculate"))
191 | request(RECALCULATION_URL.format({
192 | domain: url.host,
193 | id: url.searchParams.get("id")
194 | }))
195 | .then((response) => {
196 | if (response) {
197 | let tempElem = document.createElement("temp")
198 | store.xml += response
199 | tempElem.innerHTML = response.replace(/plaintext/g, 'pre').replace(/').replace(/.......scanner/gs, ' {
211 | if (response) {
212 | tempElem = document.createElement("temp")
213 | store.xml += response
214 | tempElem.innerHTML = response.replace(/plaintext/g, 'pre').replace(/').replace(/.......scanner/gs, ' {
341 | hashChange()
342 | .then(() => {
343 | inputSubmit()
344 | resizeHandler()
345 | })
346 | document.getElementById("equationForm").addEventListener("submit", (e) => {
347 | e.preventDefault(); // prevents it from reloading
348 | inputSubmit()
349 | })
350 | document.getElementById("equationInput").addEventListener("keydown", () => {
351 | setTimeout(() => {
352 | autocomplete()
353 | }, 50);
354 | })
355 | document.getElementById("equationInput").addEventListener("focus", () => {
356 | document.getElementById("autocompletionContainer").classList.add("autocompletion-container-shown")
357 | })
358 | document.getElementById("equationInput").addEventListener("blur", () => {
359 | setTimeout(() => {
360 | if (document.activeElement !== document.getElementById("equationInput")) {
361 | document.getElementById("autocompletionContainer").classList.remove("autocompletion-container-shown")
362 | }
363 | }, 100);
364 | })
365 | })
366 | window.addEventListener("hashchange", hashChange)
367 | window.addEventListener("resize", resizeHandler)
368 |
--------------------------------------------------------------------------------
/main.js:
--------------------------------------------------------------------------------
1 | /* constants.js */
2 |
3 | const QUERY_URL = "https://freewolframalpha-api.vercel.app/query?question={question}&timeout={timeout}&podstate={podstate}"
4 | const AUTOCOMPLETE_URL = "https://freewolframalpha-api.vercel.app/autocomplete?question={question}"
5 | const RECALCULATION_URL = "https://freewolframalpha-api.vercel.app/recalculate?domain={domain}&id={id}"
6 | const RELATEDQUERIES_URL = "https://freewolframalpha-api.vercel.app/related?domain={domain}&id={id}"
7 | const TIMEOUT = 3
8 |
9 |
10 | /* events.js */
11 |
12 | async function hashChange() {
13 | equationInput.focus()
14 | equationInput.value = decodeURIComponent(location.hash.slice(1))
15 | //document.getElementById("inputOutput").innerText = decodeURIComponent(location.hash.slice(1))
16 | if (decodeURIComponent(location.hash.slice(1)).replace(" ", '') == "") {
17 | //document.getElementById("inputOutput").innerText = "Enter what you want to calculate or know about"
18 | goHome()
19 | }
20 | }
21 |
22 | function parse() {
23 | document.querySelectorAll("dropdown > option").forEach((item) => {
24 | try {
25 | item.remove()
26 | } catch {
27 | console.warn("An error occured while removing the stray option:", item)
28 | }
29 | })
30 | document.querySelectorAll("dropdown").forEach((item) => {
31 | try {
32 | while (item.previousElementSibling.tagName != "H2")
33 | item.parentNode.insertBefore(item, item.previousElementSibling)
34 | item.previousElementSibling.append(item)
35 | } catch {
36 | console.warn("An error occured while moving the drop-down menu right next to the nearest heading:", item)
37 | }
38 | })
39 | document.querySelectorAll("option").forEach((item) => {
40 | try {
41 | item.text = item.getAttribute("name")
42 | } catch {
43 | console.warn("An error occured while extracting the names of all available options:", item)
44 | }
45 | })
46 | document.querySelectorAll("select").forEach((item) => {
47 | try {
48 | item.value = item.getAttribute("value")
49 | } catch {
50 | console.warn("An error occured while extracting the currently selected option name:", item)
51 | }
52 | })
53 | document.querySelectorAll("select").forEach((item) => {
54 | try {
55 | item.style = `
56 | background: white;
57 | color: orangered;
58 | border: thin solid darkorange;
59 | border-radius: .5em;
60 | `
61 | } catch {
62 | console.warn("An error occured while styling the drop-down menu:", item)
63 | }
64 | })
65 | document.querySelectorAll("select").forEach((item) => {
66 | try {
67 | item.onchange = () => inputSubmit(item.value)
68 | } catch {
69 | console.warn("An error occured. The selected changes to the following drop-down menus will not send requests for status update properly:", item)
70 | }
71 | })
72 | Array.prototype.slice.call(document.getElementsByTagName('pre')).forEach((item) => {
73 | try {
74 | item.remove();
75 | } catch {
76 | console.warn("An error occured while removing the following item")
77 | console.log(item)
78 | }
79 | });
80 | Array.prototype.forEach.call(document.getElementById("pod").getElementsByTagName("h2"), (item) => {
81 | try {
82 | item.classList.add("pod-header")
83 | } catch {
84 | console.warn("An error occured while setting the pod-header with the following item")
85 | console.log(item)
86 | }
87 | });
88 | Array.prototype.forEach.call(document.getElementById("pod").getElementsByTagName("img"), (item) => {
89 | try {
90 | if (item.parentNode.tagName == "SUBPOD" && item.parentNode.getAttribute("title") == "") {
91 | item.setAttribute("onclick", "document.getElementById('equationInput').value = this.getAttribute('alt'); inputSubmit();")
92 | item.classList.add("clickable-result")
93 | }
94 | } catch {
95 | console.warn("An error occured while setting the direct query for the following item")
96 | console.log(item)
97 | }
98 | });
99 | Array.prototype.forEach.call(document.getElementById("pod").getElementsByTagName("info"), (item) => {
100 | try {
101 | item.querySelector("img").setAttribute("onclick", "window.open(this.parentNode.querySelector('link').getAttribute('url'), '_blank')")
102 | } catch {
103 | console.warn("An error occured while setting the info linking for the following item")
104 | console.log(item)
105 | }
106 | });
107 | document.getElementById("pod").querySelectorAll("imagesource").forEach((item) => {
108 | try {
109 | item.parentNode.querySelector("img").setAttribute("source-forward", item.innerText)
110 | item.parentNode.querySelector("img").setAttribute("onclick", "window.open(this.getAttribute('source-forward'), '_blank')")
111 | item.classList.add("unload")
112 | } catch {
113 | console.warn("An error occured while setting link for the following item")
114 | console.log(item)
115 | }
116 | });
117 | document.getElementById("pod-height").style.height = document.getElementById("pod").offsetHeight + 50 + "px"
118 | document.getElementById('equationFooter').style.display = "block"
119 | }
120 |
121 | async function inputSubmit(podstate) {
122 | try {
123 | document.querySelectorAll("relatedqueries").forEach((item) => {
124 | item.remove()
125 | })
126 | document.querySelectorAll("related-height").forEach((item) => {
127 | item.remove()
128 | })
129 | } catch {
130 | console.info("No Related Queries Container to remove")
131 | }
132 | document.getElementById("pod").setAttribute("home-type", "")
133 | createSkeleton()
134 | document.getElementById('equationFooter').style.display = "none"
135 | if (document.getElementById("equationInput").value.replace(" ", '') == "") {
136 | goHome();
137 | return;
138 | }
139 | window.location.hash = encode(document.getElementById("equationInput").value)
140 | states.currentEquation++;
141 | let equationNumber = states.currentEquation
142 | document.getElementById("equationInput").focus()
143 | document.getElementById("equationInput").blur()
144 | document.querySelector("title").innerText = document.getElementById("equationInput").value + " - Wolfram|Alpha"
145 | request(QUERY_URL.format({
146 | podstate: podstate,
147 | question: encode(document.getElementById("equationInput").value),
148 | timeout: String(TIMEOUT)
149 | }))
150 | .then((xml) => {
151 | if (xml) {
152 | if (states.currentEquation == equationNumber) {
153 | store.xml = xml
154 | store.equation = document.getElementById("equationInput").value
155 | if (store.xml.includes('input parameter not present in query')) {
156 | goHome()
157 | } else {
158 | states.home = false
159 | document.getElementById("pod").innerHTML = xml.replace(/plaintext/g, 'pre').replace(/').replace(/.......scanner/gs, ' {
165 | item.setAttribute("onclick", "document.getElementById('equationInput').value = this.innerText; inputSubmit();")
166 | })
167 | }
168 |
169 | if (document.querySelector("tips")) {
170 | document.querySelector("tips").lastElementChild.style.marginBottom = "20px"
171 | }
172 |
173 | // related queries
174 | if (document.getElementById("pod").querySelector("queryresult").getAttribute("related") != "") {
175 | url = new URL(document.getElementById("pod").querySelector("queryresult").getAttribute("related"))
176 | request(RELATEDQUERIES_URL.format({
177 | domain: url.host,
178 | id: url.searchParams.get("id")
179 | }))
180 | .then((response) => {
181 | if (response) {
182 | let tempRelated = document.createElement("temp")
183 | tempRelated.innerHTML = response
184 | if (tempRelated.querySelector("relatedqueries").getAttribute("count") != "0") {
185 | document.getElementById("pod-height").parentNode.appendChild(tempRelated.querySelector("relatedqueries"))
186 | document.querySelector("relatedqueries").lastElementChild.style.marginBottom = "20px"
187 | let newRelatedHeight = document.createElement("related-height")
188 | newRelatedHeight.style.height = document.querySelector("relatedqueries").offsetHeight + 50 + "px"
189 | newRelatedHeight.style.display = "block"
190 | document.getElementById("pod-height").parentNode.appendChild(newRelatedHeight)
191 | document.querySelectorAll("relatedquery").forEach((item) => {
192 | item.setAttribute("onclick", "document.getElementById('equationInput').value = this.innerText; inputSubmit();")
193 | })
194 | }
195 | }
196 | })
197 | }
198 |
199 | // WolframAlpha's "lazy" loading of queryresult
200 | if (document.getElementById("pod").querySelector("queryresult").getAttribute("recalculate") != "") {
201 | url = new URL(document.getElementById("pod").querySelector("queryresult").getAttribute("recalculate"))
202 | request(RECALCULATION_URL.format({
203 | domain: url.host,
204 | id: url.searchParams.get("id")
205 | }))
206 | .then((response) => {
207 | if (response) {
208 | let tempElem = document.createElement("temp")
209 | store.xml += response
210 | tempElem.innerHTML = response.replace(/plaintext/g, 'pre').replace(/').replace(/.......scanner/gs, ' {
222 | if (response) {
223 | tempElem = document.createElement("temp")
224 | store.xml += response
225 | tempElem.innerHTML = response.replace(/plaintext/g, 'pre').replace(/').replace(/.......scanner/gs, ' {
352 | hashChange()
353 | .then(() => {
354 | inputSubmit()
355 | resizeHandler()
356 | })
357 | document.getElementById("equationForm").addEventListener("submit", (e) => {
358 | e.preventDefault(); // prevents it from reloading
359 | inputSubmit()
360 | })
361 | document.getElementById("equationInput").addEventListener("keydown", () => {
362 | setTimeout(() => {
363 | autocomplete()
364 | }, 50);
365 | })
366 | document.getElementById("equationInput").addEventListener("focus", () => {
367 | document.getElementById("autocompletionContainer").classList.add("autocompletion-container-shown")
368 | })
369 | document.getElementById("equationInput").addEventListener("blur", () => {
370 | setTimeout(() => {
371 | if (document.activeElement !== document.getElementById("equationInput")) {
372 | document.getElementById("autocompletionContainer").classList.remove("autocompletion-container-shown")
373 | }
374 | }, 100);
375 | })
376 | })
377 | window.addEventListener("hashchange", hashChange)
378 | window.addEventListener("resize", resizeHandler)
379 |
380 |
381 | /* skeleton.js */
382 |
383 | async function createSkeleton() {
384 | let newElem = document.createElement("queryresult")
385 | let newHeader = document.createElement("h2")
386 | newHeader.classList.add("pod-header")
387 | newHeader.classList.add("skeleton-box")
388 | newHeader.style.borderRadius = "8px 8px 0 0"
389 | newElem.appendChild(newHeader)
390 | let newSubPod = document.createElement("subpod")
391 | newSubPod.style.height = "25px"
392 | newElem.appendChild(newSubPod)
393 |
394 | newHeader = document.createElement("h2")
395 | newHeader.classList.add("pod-header")
396 | newHeader.classList.add("skeleton-box")
397 | newElem.appendChild(newHeader)
398 | newSubPod = document.createElement("subpod")
399 | newSubPod.style.height = "150px"
400 | newElem.appendChild(newSubPod)
401 |
402 | newHeader = document.createElement("h2")
403 | newHeader.classList.add("pod-header")
404 | newHeader.classList.add("skeleton-box")
405 | newElem.appendChild(newHeader)
406 | newSubPod = document.createElement("subpod")
407 | newSubPod.style.height = "35px"
408 | newElem.appendChild(newSubPod)
409 |
410 | newHeader = document.createElement("h2")
411 | newHeader.classList.add("pod-header")
412 | newHeader.classList.add("skeleton-box")
413 | newElem.appendChild(newHeader)
414 | newSubPod = document.createElement("subpod")
415 | newSubPod.style.height = "120px"
416 | newElem.appendChild(newSubPod)
417 |
418 |
419 | for (var i = 0; i < 5; i++) {
420 | newHeader = document.createElement("h2")
421 | newHeader.classList.add("pod-header")
422 | newHeader.classList.add("skeleton-box")
423 | newElem.appendChild(newHeader)
424 | newSubPod = document.createElement("subpod")
425 | newSubPod.style.height = (Math.random() * 200 + 15).toString() + "px"
426 | newElem.appendChild(newSubPod)
427 | }
428 |
429 |
430 | document.getElementById("pod").innerHTML = ""
431 | document.getElementById("pod").appendChild(newElem)
432 | document.getElementById("pod-height").style.height = document.getElementById("pod").offsetHeight + 50 + "px"
433 | }
434 |
435 |
436 | /* request.js */
437 |
438 | async function request(endpoint) {
439 | try {
440 | let request = await fetch(endpoint)
441 | response = await request.json()
442 | if (response.success) {
443 | response = response.data
444 | } else {
445 | response = null
446 | }
447 | } catch {
448 | response = null
449 | }
450 | return response
451 | }
452 |
453 |
454 | /* caches.js */
455 |
456 | const store = {
457 | "xml": "",
458 | "equation": ""
459 | }
460 |
461 | const caches = {
462 | "footer": null,
463 | "responsiveFooter": null,
464 | "keyboard": null,
465 | "responsiveKeyboard": null,
466 | "home": null,
467 | "responsiveHome": null
468 | }
469 |
470 |
471 | /* home.js */
472 |
473 | async function goHome() {
474 | states.home = true;
475 | resizeHandler()
476 | window.location.hash = ""
477 | document.getElementById("equationInput").focus()
478 | document.getElementById("equationInput").blur()
479 | document.getElementById('equationFooter').style.display = "none"
480 | title.innerText = "Wolfram|Alpha: Computational Intelligence"
481 | }
482 |
483 |
484 | /* states.js */
485 |
486 | const states = {
487 | "currentEquation": 0,
488 | "home": false
489 | }
490 |
491 |
492 | /* autocomplete.js */
493 |
494 | async function autocompleteClickHandler(elem) {
495 | document.getElementById("equationInput").value = elem.innerText
496 | inputSubmit()
497 | }
498 |
499 | function createAutocompleteElement(complete, query) {
500 | let newListElement = document.createElement("li")
501 | newListElement.classList.add("autocomplete-list-element")
502 | let newAnchor = document.createElement("a")
503 | newAnchor.setAttribute("onclick", 'autocompleteClickHandler(this)')
504 | newAnchor.classList.add("autocomplete-anchor")
505 | let newSpan = document.createElement("span")
506 | let bold = ""
507 | let nonBold = ""
508 | let checkingBold = true
509 | for (var index = 0; index < complete.length; index++) {
510 | if (index < query.length && complete[index].toLowerCase() == query[index].toLowerCase() && checkingBold) {
511 | bold += complete[index]
512 | } else {
513 | checkingBold = false
514 | nonBold += complete[index]
515 | }
516 | }
517 | if (bold.length > 0) {
518 | let newBoldSpan = document.createElement("span")
519 | newBoldSpan.classList.add("autocomplete-bold-span")
520 | newBoldSpan.innerText = bold
521 | newSpan.appendChild(newBoldSpan)
522 | }
523 | newSpan.innerHTML += nonBold
524 | newAnchor.appendChild(newSpan)
525 | newListElement.appendChild(newAnchor)
526 | return newListElement
527 | }
528 |
529 | async function autocomplete() {
530 | result = await request(AUTOCOMPLETE_URL.format({
531 | question: encode(document.getElementById("equationInput").value)
532 | }))
533 | if (result) {
534 | let newAutocompleteList = document.createElement("ul")
535 | newAutocompleteList.classList.add("autocomplete-list")
536 | for (index in result.results) {
537 | newAutocompleteList.appendChild(createAutocompleteElement(result.results[index].input, result.query))
538 | }
539 | while (document.getElementById("autocompleteResults").firstElementChild != null) {
540 | document.getElementById("autocompleteResults").firstElementChild.remove()
541 | }
542 | document.getElementById("autocompleteResults").appendChild(newAutocompleteList)
543 | }
544 | }
545 |
546 |
547 | /* utils.js */
548 |
549 | String.prototype.format = function () {
550 | /* C / Python like string formatter --> "Hello {name}".format("world") */
551 | "use strict";
552 | var str = this.toString();
553 | if (arguments.length) {
554 | var t = typeof arguments[0];
555 | var key;
556 | var args = ("string" === t || "number" === t) ?
557 | Array.prototype.slice.call(arguments) :
558 | arguments[0];
559 |
560 | for (key in args) {
561 | str = str.replace(new RegExp("\\{" + key + "\\}", "gi"), args[key]);
562 | }
563 | }
564 |
565 | return str;
566 | };
567 |
568 |
569 | async function download() {
570 | var element = document.createElement('a');
571 | element.setAttribute('href', 'data:text/xml;charset=utf-8,' + encodeURIComponent(store.xml));
572 | element.setAttribute('download', store.equation + " - Wolfram|Alpha Result.xml");
573 |
574 | element.style.display = 'none';
575 | document.body.appendChild(element);
576 |
577 | element.click();
578 |
579 | document.body.removeChild(element);
580 | }
581 |
582 | async function addSpecial(specialCharButton) {
583 | equationInput.value = equationInput.value + specialCharButton.getAttribute("value")
584 | //document.getElementById("inputOutput").innerText = equationInput.value
585 | }
586 |
587 | /*
588 | async function addInput() {
589 | document.getElementById("inputOutput").innerText = document.getElementById("equationInput").value
590 | if (equationInput.value.replace(" ", '') == "") {
591 | document.getElementById("inputOutput").innerText = "Enter what you want to calculate or know about"
592 | }
593 | }
594 | */
595 |
596 | function encode(value) {
597 | return encodeURIComponent(String(value)).replace(/[-_.!~*'()]/g, char => '%' + char.charCodeAt(0).toString(16))
598 | }
599 |
--------------------------------------------------------------------------------
/wolframalpha.svg:
--------------------------------------------------------------------------------
1 |
101 |
--------------------------------------------------------------------------------
/main.css:
--------------------------------------------------------------------------------
1 | @import "https://fonts.googleapis.com/css2?family=Roboto:wght@400&display=swap";
2 |
3 | ._10um4 {
4 | text-align: center;
5 | vertical-align: middle;
6 | touch-action: manipulation;
7 | cursor: pointer;
8 | background-image: none;
9 | box-shadow: none;
10 | border: 1px solid transparent;
11 | white-space: nowrap;
12 | -webkit-user-select: none;
13 | -moz-user-select: none;
14 | -ms-user-select: none;
15 | user-select: none;
16 | font-weight: inherit;
17 | font-size: inherit;
18 | text-decoration: none;
19 | box-sizing: border-box;
20 | margin: 0
21 | }
22 |
23 | ._10um4:not([data-focus-visible-added]) {
24 | outline: none
25 | }
26 |
27 | .krBQN {
28 | display: inline-flex;
29 | padding: 1px 5px;
30 | border-radius: 3px;
31 | align-items: center
32 | }
33 |
34 | ._1B-y0 {
35 | margin-left: 5px
36 | }
37 |
38 | ._2DVTv {
39 | color: #f36f21;
40 | background-color: rgba(0, 0, 0, 0);
41 | border-color: rgba(0, 0, 0, 0)
42 | }
43 |
44 | ._2DVTv ._1tPJM {
45 | fill: #f36f21
46 | }
47 |
48 | ._2DVTv:hover {
49 | color: #db0004;
50 | background-color: rgba(0, 0, 0, 0);
51 | border-color: rgba(0, 0, 0, 0)
52 | }
53 |
54 | ._2DVTv:hover ._1tPJM {
55 | fill: #db0004
56 | }
57 |
58 | ._2DVTv:active {
59 | color: #f36f21;
60 | border-color: rgba(0, 0, 0, 0);
61 | outline: none;
62 | background: rgba(0, 0, 0, 0)
63 | }
64 |
65 | ._2DVTv:active ._1tPJM {
66 | fill: #f36f21
67 | }
68 |
69 | .wolfram-small-svg {
70 | width: 20px;
71 | height: 20px
72 | }
73 |
74 | div,
75 | span,
76 | a,
77 | img,
78 | ul,
79 | li,
80 | form,
81 | section {
82 | margin: 0;
83 | padding: 0;
84 | border: 0;
85 | font: 100% inherit;
86 | vertical-align: baseline;
87 | box-sizing: border-box
88 | }
89 |
90 | div:not([data-focus-visible-added]),
91 | span:not([data-focus-visible-added]),
92 | a:not([data-focus-visible-added]),
93 | img:not([data-focus-visible-added]),
94 | ul:not([data-focus-visible-added]),
95 | li:not([data-focus-visible-added]),
96 | form:not([data-focus-visible-added]),
97 | section:not([data-focus-visible-added]) {
98 | outline: none
99 | }
100 |
101 | ul {
102 | list-style: none
103 | }
104 |
105 | input {
106 | -webkit-appearance: none
107 | }
108 |
109 | ._2dgCA {
110 | border: none;
111 | justify-content: center
112 | }
113 |
114 | ._3XkhH {
115 | height: 56px;
116 | width: 486px;
117 | -o-object-fit: contain;
118 | object-fit: contain;
119 | margin: 45px 0 25px
120 | }
121 |
122 | .wolfram-input-section {
123 | width: 100%;
124 | text-align: left
125 | }
126 |
127 | .gqU8h {
128 | width: 100%;
129 | height: 38px;
130 | background-color: #fff;
131 | box-sizing: border-box;
132 | display: flex;
133 | align-items: center;
134 | justify-content: flex-start;
135 | padding: 0 7px
136 | }
137 |
138 | .wolfram-input-container-container {
139 | display: flex;
140 | align-items: center;
141 | flex: 1 1 100%;
142 | height: 38px;
143 | margin-right: 6px;
144 | overflow: hidden
145 | }
146 |
147 | .wolfram-input-container {
148 | width: 100%;
149 | position: relative;
150 | vertical-align: middle;
151 | overflow-x: auto;
152 | overflow-y: hidden;
153 | align-self: baseline;
154 | padding-bottom: 30px;
155 | white-space: nowrap;
156 | color: #333;
157 | text-align: left;
158 | z-index: 1;
159 | font: 16px/1.38 WebRoboto, "Hiragino Kaku Gothic ProN", "\30D2\30E9\30AE\30CE\89D2\30B4 ProN", Meiryo, メイリオ, Arial, Helvetica, sans-serif
160 | }
161 |
162 | .wolfram-input-output {
163 | position: absolute;
164 | top: 0;
165 | left: 0;
166 | height: 38px;
167 | min-width: 100%;
168 | padding: 8px 5px;
169 | pointer-events: none;
170 | z-index: -1;
171 | font: 16px/1.38 WebRoboto, "Hiragino Kaku Gothic ProN", "\30D2\30E9\30AE\30CE\89D2\30B4 ProN", Meiryo, メイリオ, Arial, Helvetica, sans-serif
172 | }
173 |
174 | .wolfram-input-class {
175 | background: transparent;
176 | box-sizing: border-box;
177 | border: 0;
178 | height: 38px;
179 | min-width: 100%;
180 | padding: 8px 5px;
181 | outline: none;
182 | caret-color: #333;
183 | font-family: WebRoboto, "Hiragino Kaku Gothic ProN", "\30D2\30E9\30AE\30CE\89D2\30B4 ProN", Meiryo, メイリオ, Arial, Helvetica, sans-serif;
184 | font-size: 16px;
185 | line-height: 1.38;
186 |
187 | white-space: nowrap;
188 | color: #333;
189 | text-align: left;
190 | letter-spacing: normal;
191 | font-weight: 500;
192 | }
193 |
194 | .wolfram-input-class:hover {
195 | cursor: text
196 | }
197 |
198 | .wolfram-input-class::-webkit-input-placeholder {
199 | color: transparent
200 | }
201 |
202 | .wolfram-input-class::-moz-placeholder {
203 | color: transparent
204 | }
205 |
206 | .wolfram-input-class:-ms-input-placeholder {
207 | color: transparent
208 | }
209 |
210 | .wolfram-input-class::-ms-input-placeholder {
211 | color: transparent
212 | }
213 |
214 | .wolfram-input-class::placeholder {
215 | color: transparent
216 | }
217 |
218 | .autocompletion-container {
219 | display: none;
220 | }
221 |
222 | .autocompletion-container-shown {
223 | display: block;
224 | }
225 |
226 | .HuMWM {
227 | flex: 0 0 20px;
228 | height: 20px;
229 | margin: 0;
230 | padding: 0;
231 | border: none
232 | }
233 |
234 | ._3fnRK {
235 | color: #ec561a;
236 | background-color: inherit;
237 | border-color: rgba(0, 0, 0, 0)
238 | }
239 |
240 | ._3fnRK .jzBOk {
241 | fill: #ec561a
242 | }
243 |
244 | ._3fnRK:hover {
245 | color: #cb1000;
246 | background-color: inherit;
247 | border-color: rgba(0, 0, 0, 0)
248 | }
249 |
250 | ._3fnRK:hover .jzBOk {
251 | fill: #cb1000
252 | }
253 |
254 | ._3fnRK:active {
255 | color: #fff;
256 | border-color: #c7c7c7;
257 | outline: none;
258 | background: #c7c7c7
259 | }
260 |
261 | .keyboard-button-active {
262 | color: #fff !important;
263 | border-color: #c7c7c7 !important;
264 | outline: none !important;
265 | background: #c7c7c7 !important;
266 | }
267 |
268 | ._3fnRK:active .jzBOk {
269 | fill: #fff
270 | }
271 |
272 | ._3gsYZ {
273 | color: #ec561a;
274 | background-color: inherit;
275 | border-color: rgba(0, 0, 0, 0)
276 | }
277 |
278 | ._3gsYZ .jzBOk {
279 | fill: #ec561a
280 | }
281 |
282 | ._3gsYZ:hover {
283 | color: #cb1000;
284 | background-color: inherit;
285 | border-color: rgba(0, 0, 0, 0)
286 | }
287 |
288 | ._3gsYZ:hover .jzBOk {
289 | fill: #cb1000
290 | }
291 |
292 | ._3gsYZ:active {
293 | color: #cb1000;
294 | border-color: rgba(0, 0, 0, 0);
295 | outline: none;
296 | background: inherit
297 | }
298 |
299 | ._3gsYZ:active .jzBOk {
300 | fill: #cb1000
301 | }
302 |
303 | ._373wu {
304 | display: inline-flex;
305 | align-items: center;
306 | border-radius: 3px;
307 | padding: 3px 12px;
308 | font: 15px "Source Sans Pro", Arial, Helvetica, sans-serif
309 | }
310 |
311 | .b9R6n {
312 | display: flex;
313 | max-width: 780px;
314 | width: 100%;
315 | margin-top: 9px
316 | }
317 |
318 | ._1Qrw- {
319 | margin-left: 4px
320 | }
321 |
322 | ._1Qrw-:first-child {
323 | margin-left: 0
324 | }
325 |
326 | ._2Qj7y {
327 | display: flex;
328 | margin-right: 18px
329 | }
330 |
331 | .mPLZE {
332 | display: flex;
333 | margin-left: auto
334 | }
335 |
336 | ._1NMGv {
337 | display: flex;
338 | flex-direction: column;
339 | align-items: center;
340 | justify-content: center;
341 | text-align: center;
342 | width: 100%;
343 | padding: 0 20px
344 | }
345 |
346 | ._1YsE2 {
347 | width: 100%;
348 | max-width: 780px;
349 | position: relative
350 | }
351 |
352 | ._3-WTd {
353 | border: 1px solid #ff9339;
354 | border-radius: 4px;
355 | box-shadow: 0 0 0 3px #ffc230
356 | }
357 |
358 | ._10um4 {
359 | text-align: center;
360 | vertical-align: middle;
361 | touch-action: manipulation;
362 | cursor: pointer;
363 | background-image: none;
364 | box-shadow: none;
365 | border: 1px solid transparent;
366 | white-space: nowrap;
367 | -webkit-user-select: none;
368 | -moz-user-select: none;
369 | -ms-user-select: none;
370 | user-select: none;
371 | font-weight: inherit;
372 | font-size: inherit;
373 | text-decoration: none;
374 | box-sizing: border-box;
375 | margin: 0
376 | }
377 |
378 | ._10um4:not([data-focus-visible-added]) {
379 | outline: none
380 | }
381 |
382 | .krBQN {
383 | display: inline-flex;
384 | padding: 1px 5px;
385 | border-radius: 3px;
386 | align-items: center
387 | }
388 |
389 | div,
390 | span,
391 | a {
392 | margin: 0;
393 | padding: 0;
394 | border: 0;
395 | font: 100% inherit;
396 | vertical-align: baseline;
397 | box-sizing: border-box
398 | }
399 |
400 | div:not([data-focus-visible-added]),
401 | span:not([data-focus-visible-added]),
402 | a:not([data-focus-visible-added]) {
403 | outline: none
404 | }
405 |
406 | ._2LSg_ {
407 | display: flex
408 | }
409 |
410 | ._3BX2Z,
411 | ._5VPfe {
412 | border: none;
413 | font-size: 12px;
414 | padding: 10px;
415 | display: flex;
416 | align-items: flex-end
417 | }
418 |
419 | ._3BX2Z {
420 | color: #777;
421 | background-color: rgba(0, 0, 0, 0);
422 | border-color: rgba(0, 0, 0, 0)
423 | }
424 |
425 | ._3BX2Z ._2MoRn {
426 | fill: #777
427 | }
428 |
429 | ._3BX2Z:hover {
430 | color: #ec561a;
431 | background-color: rgba(0, 0, 0, 0);
432 | border-color: rgba(0, 0, 0, 0)
433 | }
434 |
435 | ._3BX2Z:hover ._2MoRn {
436 | fill: #ec561a
437 | }
438 |
439 | ._3BX2Z:active {
440 | color: #cb1000;
441 | border-color: rgba(0, 0, 0, 0);
442 | outline: none;
443 | background: rgba(0, 0, 0, 0)
444 | }
445 |
446 | ._3BX2Z:active ._2MoRn {
447 | fill: #cb1000
448 | }
449 |
450 | ._1zLOS {
451 | width: 16px;
452 | margin-right: 5px
453 | }
454 |
455 | ._5YPtM {
456 | background: #f5f5f5
457 | }
458 |
459 | ._3l3lx,
460 | ._2-WIS {
461 | font: 12px/20px WebRoboto, "Hiragino Kaku Gothic ProN", "\30D2\30E9\30AE\30CE\89D2\30B4 ProN", Meiryo, メイリオ, Arial, Helvetica, sans-serif
462 | }
463 |
464 | ._3l3lx {
465 | color: #777
466 | }
467 |
468 | ._2-WIS {
469 | display: flex;
470 | justify-content: space-between
471 | }
472 |
473 | ._5VPfe {
474 | color: #777;
475 | background-color: rgba(0, 0, 0, 0);
476 | border-color: rgba(0, 0, 0, 0);
477 | display: flex;
478 | align-items: center
479 | }
480 |
481 | ._5VPfe:hover {
482 | color: #777;
483 | background-color: rgba(0, 0, 0, 0);
484 | border-color: rgba(0, 0, 0, 0)
485 | }
486 |
487 | ._5VPfe:active {
488 | color: #777;
489 | border-color: rgba(0, 0, 0, 0);
490 | outline: none;
491 | background: rgba(0, 0, 0, 0)
492 | }
493 |
494 | ._5VPfe:hover ._25kcj {
495 | color: #ec561a
496 | }
497 |
498 | ._5VPfe:active ._25kcj {
499 | color: #cb1000
500 | }
501 |
502 | ._25kcj {
503 | font-weight: 700;
504 | border: none
505 | }
506 |
507 | h2,
508 | header {
509 | margin: 0;
510 | padding: 0;
511 | border: 0;
512 | font: 100% inherit;
513 | vertical-align: baseline;
514 | box-sizing: border-box
515 | }
516 |
517 | h2:not([data-focus-visible-added]),
518 | header:not([data-focus-visible-added]) {
519 | outline: none
520 | }
521 |
522 | header {
523 | display: block
524 | }
525 |
526 | ._124pH {
527 | min-height: 30px;
528 | background: #f7f7f7;
529 | display: flex;
530 | justify-content: space-between;
531 | align-items: center;
532 | padding: 6px 19px;
533 | font: 13px WebRoboto, "Hiragino Kaku Gothic ProN", "\30D2\30E9\30AE\30CE\89D2\30B4 ProN", Meiryo, メイリオ, Arial, Helvetica, sans-serif
534 | }
535 |
536 | ._124pH:first-child {
537 | border-top-left-radius: inherit;
538 | border-top-right-radius: inherit
539 | }
540 |
541 | .pxQx2 {
542 | color: #678e9c;
543 | margin-right: 19px
544 | }
545 |
546 | ._1oLFT {
547 | position: relative;
548 | display: inline-block
549 | }
550 |
551 | ._10um4 {
552 | text-align: center;
553 | vertical-align: middle;
554 | touch-action: manipulation;
555 | cursor: pointer;
556 | background-image: none;
557 | box-shadow: none;
558 | border: 1px solid transparent;
559 | white-space: nowrap;
560 | -webkit-user-select: none;
561 | -moz-user-select: none;
562 | -ms-user-select: none;
563 | user-select: none;
564 | font-weight: inherit;
565 | font-size: inherit;
566 | text-decoration: none;
567 | box-sizing: border-box;
568 | margin: 0
569 | }
570 |
571 | ._10um4:not([data-focus-visible-added]) {
572 | outline: none
573 | }
574 |
575 | .krBQN {
576 | display: inline-flex;
577 | padding: 1px 5px;
578 | border-radius: 3px;
579 | align-items: center
580 | }
581 |
582 | .wolfram-small-svg {
583 | width: 20px;
584 | height: 20px
585 | }
586 |
587 | div,
588 | h1,
589 | ul,
590 | li,
591 | section {
592 | margin: 0;
593 | padding: 0;
594 | border: 0;
595 | font: 100% inherit;
596 | vertical-align: baseline;
597 | box-sizing: border-box
598 | }
599 |
600 | div:not([data-focus-visible-added]),
601 | h1:not([data-focus-visible-added]),
602 | ul:not([data-focus-visible-added]),
603 | li:not([data-focus-visible-added]),
604 | section:not([data-focus-visible-added]) {
605 | outline: none
606 | }
607 |
608 | ul {
609 | list-style: none
610 | }
611 |
612 | ._3F1W_ {
613 | width: 100%;
614 | padding: 10px 0px;
615 | }
616 |
617 | ._2cA4H {
618 | display: block;
619 | text-align: left;
620 | width: 100%;
621 | max-width: 780px;
622 | margin: 0 auto
623 | }
624 |
625 | ._2hVzI {
626 | display: grid;
627 | grid-template-columns: repeat(14, 1fr)
628 | }
629 |
630 | ._3t0Vs {
631 | display: block;
632 | height: 48px;
633 | width: auto;
634 | color: #7db4c9;
635 | font: 300 16px/48px Lexia, "Roboto Slab", Georgia, "Times New Roman", Times, serif
636 | }
637 |
638 | ._31Yc9 {
639 | font: 400 12px "Source Sans Pro", Arial, Helvetica, sans-serif
640 | }
641 |
642 | ._31Yc9:focus {
643 | z-index: 1
644 | }
645 |
646 | ._31Yc9 {
647 | margin: 0 0 -1px -1px
648 | }
649 |
650 | ._3nGlG {
651 | position: relative;
652 | display: inline-block;
653 | margin: 0;
654 | padding: 0;
655 | border: 1px solid;
656 | border-radius: 0
657 | }
658 |
659 | ._3nGlG:hover,
660 | ._3nGlG:active {
661 | z-index: 1
662 | }
663 |
664 | ._3nGlG {
665 | height: 50px;
666 | width: 100%
667 | }
668 |
669 | ._2WP2O {
670 | color: rgba(0, 0, 0, 0);
671 | background-color: #fff;
672 | border-color: #ccc
673 | }
674 |
675 | ._2WP2O ._3ijoZ {
676 | fill: #777
677 | }
678 |
679 | ._2WP2O:hover {
680 | color: rgba(0, 0, 0, 0);
681 | background-color: #fff;
682 | border-color: #ec561a
683 | }
684 |
685 | ._2WP2O:hover ._3ijoZ {
686 | fill: #777
687 | }
688 |
689 | ._2WP2O:active {
690 | color: rgba(0, 0, 0, 0);
691 | border-color: #cb1000;
692 | outline: none;
693 | background: #ec561a
694 | }
695 |
696 | ._2WP2O:active ._3ijoZ {
697 | fill: #fff
698 | }
699 |
700 | ._2ZoPo {
701 | height: 38px;
702 | width: 38px
703 | }
704 |
705 | ._1s1Al {
706 | width: 101vw;
707 | background: #f5f5f5;
708 | margin-top: -1px;
709 | margin-left: -1%;
710 | border-top: solid 6px #c7c7c7;
711 | border-bottom: solid 6px #c7c7c7
712 | }
713 |
714 | ._13vNe {
715 | color: rgba(0, 0, 0, 0);
716 | background-color: #ebebeb;
717 | border-color: rgba(0, 0, 0, 0)
718 | }
719 |
720 | ._13vNe ._3oIR7 {
721 | fill: #ec561a
722 | }
723 |
724 | ._13vNe:hover {
725 | color: rgba(0, 0, 0, 0);
726 | background-color: #f7f7f7;
727 | border-color: rgba(0, 0, 0, 0)
728 | }
729 |
730 | ._13vNe:hover ._3oIR7 {
731 | fill: #ec561a
732 | }
733 |
734 | ._13vNe:active {
735 | color: rgba(0, 0, 0, 0);
736 | border-color: rgba(0, 0, 0, 0);
737 | outline: none;
738 | background: #f9f9f9
739 | }
740 |
741 | ._13vNe:active ._3oIR7 {
742 | fill: #cb1000
743 | }
744 |
745 | ._3xlit {
746 | height: 41px;
747 | width: 100%;
748 | justify-content: center
749 | }
750 |
751 | ._1oLFT {
752 | position: relative;
753 | display: inline-block
754 | }
755 |
756 | ._10um4 {
757 | text-align: center;
758 | vertical-align: middle;
759 | touch-action: manipulation;
760 | cursor: pointer;
761 | background-image: none;
762 | box-shadow: none;
763 | border: 1px solid transparent;
764 | white-space: nowrap;
765 | -webkit-user-select: none;
766 | -moz-user-select: none;
767 | -ms-user-select: none;
768 | user-select: none;
769 | font-weight: inherit;
770 | font-size: inherit;
771 | text-decoration: none;
772 | box-sizing: border-box;
773 | margin: 0
774 | }
775 |
776 | ._10um4:not([data-focus-visible-added]) {
777 | outline: none
778 | }
779 |
780 | div,
781 | h1,
782 | ul,
783 | li {
784 | margin: 0;
785 | padding: 0;
786 | border: 0;
787 | font: 100% inherit;
788 | vertical-align: baseline;
789 | box-sizing: border-box
790 | }
791 |
792 | div:not([data-focus-visible-added]),
793 | h1:not([data-focus-visible-added]),
794 | ul:not([data-focus-visible-added]),
795 | li:not([data-focus-visible-added]) {
796 | outline: none
797 | }
798 |
799 | ul {
800 | list-style: none
801 | }
802 |
803 | ._2cA4H {
804 | display: block;
805 | text-align: left;
806 | width: 100%;
807 | max-width: 780px;
808 | margin: 0 auto
809 | }
810 |
811 | ._7CC_P {
812 | display: grid;
813 | grid-template-columns: repeat(8, 1fr)
814 | }
815 |
816 | ._3t0Vs {
817 | display: block;
818 | height: 48px;
819 | width: auto;
820 | color: #7db4c9;
821 | font: 300 16px/48px Lexia, "Roboto Slab", Georgia, "Times New Roman", Times, serif
822 | }
823 |
824 | ._31Yc9 {
825 | font: 400 12px "Source Sans Pro", Arial, Helvetica, sans-serif
826 | }
827 |
828 | ._31Yc9:focus {
829 | z-index: 1
830 | }
831 |
832 | ._31Yc9 {
833 | margin: 0 0 -1px -1px
834 | }
835 |
836 | ._3nGlG {
837 | position: relative;
838 | display: inline-block;
839 | margin: 0;
840 | padding: 0;
841 | border: 1px solid;
842 | border-radius: 0
843 | }
844 |
845 | ._3nGlG:hover,
846 | ._3nGlG:active {
847 | z-index: 1
848 | }
849 |
850 | ._3nGlG {
851 | height: 50px;
852 | width: 100%
853 | }
854 |
855 | ._2WP2O {
856 | color: rgba(0, 0, 0, 0);
857 | background-color: #fff;
858 | border-color: #ccc
859 | }
860 |
861 | ._2WP2O ._3ijoZ {
862 | fill: #777
863 | }
864 |
865 | ._2WP2O:hover {
866 | color: rgba(0, 0, 0, 0);
867 | background-color: #fff;
868 | border-color: #ec561a
869 | }
870 |
871 | ._2WP2O:hover ._3ijoZ {
872 | fill: #777
873 | }
874 |
875 | ._2WP2O:active {
876 | color: rgba(0, 0, 0, 0);
877 | border-color: #cb1000;
878 | outline: none;
879 | background: #ec561a
880 | }
881 |
882 | ._2WP2O:active ._3ijoZ {
883 | fill: #fff
884 | }
885 |
886 | ._2ZoPo {
887 | height: 38px;
888 | width: 38px
889 | }
890 |
891 | * {
892 | font-family: 'Roboto', Arial, Helvetica, sans-serif
893 | }
894 |
895 | body {
896 | background: white
897 | }
898 |
899 | #pod {
900 | background: #fff;
901 | border-radius: 8px;
902 | width: 780px;
903 | margin-top: 50px;
904 | /*
905 | margin-left: 8.5%
906 | */
907 | position: absolute;
908 | left: 50%;
909 | transform: translateX(-50%);
910 | }
911 |
912 | hr {
913 | color: #666;
914 | opacity: .2;
915 | text-shadow: 1px 1px 0 #fff;
916 | margin: 20px 0;
917 | border: none;
918 | border-bottom: 1px solid #666;
919 | position: relative;
920 | transition: box-shadow 200ms ease-in-out;
921 | box-shadow: 0 0 0 0 #f9f9f9;
922 | font: 300 20px/2 'Open Sans', sans-serif
923 | }
924 |
925 |
926 | .hiddenExtendedKeyboard {
927 | display: none
928 | }
929 |
930 | /*
931 | #normalHomeGrid {
932 | display: block
933 | }
934 |
935 | #responsiveHomeGrid {
936 | display: none
937 | }
938 |
939 | .normalHomeGrid {
940 | display: block
941 | }
942 |
943 | .responsiveHomeGrid {
944 | display: none
945 | }
946 |
947 | @media screen and (max-width: 1030px) {
948 | #normalHomeGrid {
949 | display: none
950 | }
951 |
952 | #responsiveHomeGrid {
953 | display: block
954 | }
955 |
956 | .normalHomeGrid {
957 | display: none
958 | }
959 |
960 | .responsiveHomeGrid {
961 | display: block
962 | }
963 | }
964 | */
965 |
966 | @media screen and (max-width: 585px) {
967 | .extraInputOption {
968 | display: none
969 | }
970 | }
971 |
972 | @media screen and (max-width: 500px) {
973 | .wolframLogo {
974 | transform: scale(0.75)
975 | }
976 |
977 | img {
978 | width: 100%;
979 | object-fit: contain
980 | }
981 | }
982 |
983 |
984 |
985 | .autocomplete-list-element:hover {
986 | background-color: #f5f5f5;
987 | }
988 |
989 | .autocomplete-list-element {
990 |
991 | cursor: pointer;
992 | color: inherit;
993 | border-color: #bbb;
994 | outline: none;
995 | border: 0;
996 | display: flex;
997 | align-items: center;
998 | width: 100%;
999 | text-align: center;
1000 | vertical-align: middle;
1001 | touch-action: manipulation;
1002 | background-image: none;
1003 | box-shadow: none;
1004 | white-space: nowrap;
1005 | -webkit-user-select: none;
1006 | -moz-user-select: none;
1007 | -ms-user-select: none;
1008 | user-select: none;
1009 | font-weight: inherit;
1010 | font-size: inherit;
1011 | text-decoration: none;
1012 | box-sizing: border-box;
1013 | margin: 0;
1014 | }
1015 |
1016 | .autocomplete-anchor {
1017 | outline: none;
1018 | justify-content: space-between;
1019 | padding: 0 10px 0 15px;
1020 | margin: 0;
1021 | font-family: WebRoboto, "Hiragino Kaku Gothic ProN", "\30D2\30E9\30AE\30CE\89D2\30B4 ProN", Meiryo, メイリオ, Arial, Helvetica, sans-serif;
1022 | height: 32px;
1023 | display: flex;
1024 | align-items: center;
1025 | width: 100%;
1026 | }
1027 |
1028 | .autocomplete-bold-span {
1029 | font-weight: 700;
1030 | }
1031 |
1032 | .autocompletion-box {
1033 | font-family: WebRoboto, "Hiragino Kaku Gothic ProN", "\30D2\30E9\30AE\30CE\89D2\30B4 ProN", Meiryo, メイリオ, Arial, Helvetica, sans-serif;
1034 | margin-top: -2px;
1035 | margin-left: -6px;
1036 | width: calc(100% + 12px);
1037 | padding: 0 6px 6px;
1038 | position: absolute;
1039 | z-index: 1001;
1040 | }
1041 |
1042 | .autocomplete-orange-box {
1043 | background-color: #fff;
1044 | border-top: 1px solid #bbb;
1045 | border-left: 1px solid #f96932;
1046 | border-right: 1px solid #f96932;
1047 | border-bottom: 1px solid #f96932;
1048 | border-bottom-left-radius: 3px;
1049 | border-bottom-right-radius: 3px;
1050 | box-shadow: 1px 3px 4px 0 rgba(0, 0, 0, 0.4);
1051 | }
1052 |
1053 | .autocomplete-list {
1054 | margin-top: 1px;
1055 | width: 100%;
1056 | list-style: none;
1057 | }
1058 |
1059 | .pod-header {
1060 | color: #678e9c;
1061 | min-height: 30px;
1062 | font-size: 13px;
1063 | font-family: WebRoboto, "Hiragino Kaku Gothic ProN", "\30D2\30E9\30AE\30CE\89D2\30B4 ProN", Meiryo, メイリオ, Arial, Helvetica, sans-serif;
1064 | background: #f7f7f7;
1065 | display: flex;
1066 | justify-content: space-between;
1067 | align-items: center;
1068 | padding: 6px 19px;
1069 | }
1070 |
1071 | .pod-border {
1072 | margin: 15px 0px;
1073 | border-color: #ffd583;
1074 | }
1075 |
1076 | queryresult {
1077 | display: flex;
1078 | flex-direction: column;
1079 | box-shadow: 0 0 20px -15px rgb(100, 100, 100);
1080 | }
1081 |
1082 | subpod {
1083 | margin: 7px 25px;
1084 | }
1085 |
1086 | infos {
1087 | margin: 15px;
1088 | text-align: right;
1089 | }
1090 |
1091 | info>img {
1092 | opacity: .4;
1093 | transform: scale(.9);
1094 | cursor: pointer;
1095 | transition: opacity 250ms ease;
1096 | }
1097 |
1098 | info>img:hover {
1099 | opacity: .65;
1100 | }
1101 |
1102 | datasources,
1103 | microsources {
1104 | display: none;
1105 | }
1106 |
1107 | #equationFooter {
1108 | margin-top: 50px;
1109 | }
1110 |
1111 | .skeleton-box {
1112 | display: inline-block;
1113 | height: 1em;
1114 | position: relative;
1115 | overflow: hidden;
1116 | background-color: #f7f7f7;
1117 | }
1118 |
1119 | .skeleton-box::after {
1120 | position: absolute;
1121 | top: 0;
1122 | right: 0;
1123 | bottom: 0;
1124 | left: 0;
1125 | transform: translateX(-100%);
1126 | background-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, 0.2) 20%, rgba(255, 255, 255, 0.5) 60%, rgba(255, 255, 255, 0));
1127 | -webkit-animation: shimmer 2s infinite;
1128 | animation: shimmer 2s infinite;
1129 | content: "";
1130 | }
1131 |
1132 | @-webkit-keyframes shimmer {
1133 | 100% {
1134 | transform: translateX(100%);
1135 | }
1136 | }
1137 |
1138 | @keyframes shimmer {
1139 | 100% {
1140 | transform: translateX(100%);
1141 | }
1142 | }
1143 |
1144 | .clickable-result {
1145 | border-bottom: 0px solid #b6d4df;
1146 | cursor: pointer;
1147 | }
1148 |
1149 | .clickable-result:hover {
1150 | border-bottom: 1px solid #b6d4df;
1151 | }
1152 |
1153 | relatedqueries {
1154 | background: #fff;
1155 | border-radius: 8px;
1156 | width: 780px;
1157 | margin: 50px 0px;
1158 | position: absolute;
1159 | left: 50%;
1160 | transform: translateX(-50%);
1161 | display: flex;
1162 | flex-direction: column;
1163 | box-shadow: 0 0 20px -15px rgb(100, 100, 100);
1164 | }
1165 |
1166 | relatedqueries::before {
1167 | content: "Related Queries:";
1168 | color: rgb(103, 142, 156);
1169 | font-size: 13px;
1170 | margin: 15px;
1171 | }
1172 |
1173 | relatedquery {
1174 | font-size: 14px;
1175 | cursor: pointer;
1176 | margin: 5px;
1177 | color: #535353;
1178 | }
1179 |
1180 | relatedquery::before {
1181 | content: "=";
1182 | color: #ec561a;
1183 | margin: 0px 5px 0px 15px;
1184 | }
1185 |
1186 | relatedquery:hover {
1187 | color: #ec561a;
1188 | }
1189 |
1190 | didyoumeans {
1191 | display: flex;
1192 | flex-direction: column;
1193 | }
1194 |
1195 | didyoumeans::before {
1196 | content: "Did you mean:";
1197 | color: rgb(103, 142, 156);
1198 | font-size: 13px;
1199 | margin: 15px;
1200 | }
1201 |
1202 | didyoumean {
1203 | font-size: 14px;
1204 | cursor: pointer;
1205 | margin: 5px;
1206 | color: #535353;
1207 | }
1208 |
1209 | didyoumean::before {
1210 | content: "=";
1211 | color: #ec561a;
1212 | margin: 0px 5px 0px 15px;
1213 | }
1214 |
1215 | didyoumean:hover {
1216 | color: #ec561a;
1217 | }
1218 |
1219 | tips {
1220 | display: flex;
1221 | flex-direction: column;
1222 | }
1223 |
1224 | tips::before {
1225 | content: "Tips:";
1226 | color: rgb(103, 142, 156);
1227 | font-size: 13px;
1228 | margin: 15px;
1229 | }
1230 |
1231 | tip {
1232 | font-size: 14px;
1233 | margin: 5px;
1234 | opacity: 1;
1235 | }
1236 |
1237 | tip::before {
1238 | content: attr(text);
1239 | color: rgb(115, 184, 209);
1240 | margin: 0px 5px 0px 15px;
1241 | }
1242 |
1243 | tip:hover {
1244 | opacity: .8;
1245 | }
1246 |
1247 |
1248 | @media screen and (max-width: 830px) {
1249 |
1250 | relatedqueries,
1251 | #pod {
1252 | width: 90%;
1253 | }
1254 | }
1255 |
1256 | @media screen and (max-width: 610px) {
1257 |
1258 | relatedqueries,
1259 | #pod {
1260 | width: 100%;
1261 | }
1262 | }
1263 |
1264 | .unload {
1265 | display: none;
1266 | }
--------------------------------------------------------------------------------
/parts/extendedKeyboard.html:
--------------------------------------------------------------------------------
1 |
2 |
11 |
20 |
29 |
38 |
47 |
56 |
65 |
72 |
81 |
89 |
98 |
107 |
116 |
125 |
126 |
127 |
136 |
145 |
154 |
163 |
172 |
181 |
190 |
199 |
208 |
217 |
226 |
234 |
243 |
252 |
253 |
254 |
263 |
272 |
281 |
290 |
299 |
308 |
315 |
324 |
333 |
342 |
351 |
360 |
369 |
378 |
379 |
380 |
389 |
398 |
407 |
416 |
425 |
434 |
443 |
452 |
461 |
470 |
479 |
488 |
497 |
506 |
--------------------------------------------------------------------------------