search

phibr0 / obsidian-dictionary

Dictionary - Obsidian Plugin | This plugin adds a multilingual dictionary to the Obsidian note taking tool.
GNU Affero General Public License v3.0
365 stars 45 forks source link

[Bug]: Dictionary view pane does not work on mobile #63

Open oxdc opened 2 years ago

oxdc commented 2 years ago

Describe the bug

The pane won't show anything except the input box, see the screenshot below,

image

If one emulates the mobile mode on a PC, contents and buttons are there but the page is misaligned,

image

Relevant errors (if available)

No response

Steps to reproduce

On a mobile:

  1. Open the command palette;
  2. Open the dictionary view;
  3. Type a word and hit Enter.

On a PC:

  1. Open the Obsidian Developer Console by pressing Ctrl + Shift + I;
  2. Execute app.emulateMobile(true) in the console;
  3. Open the command palette;
  4. Open the dictionary view;
  5. Type a word and hit Enter.

Expected Behavior

image

Addition context

No response

Language

No response

API Name

No response

Operating system

Android

oxdc commented 2 years ago

I figured it out on my own, see #64.

Besides, for those who want a better layout on mobile, you may use the following css snippet,

div[data-type="dictionary-view"] .results .container {
  max-width: none !important;
}

div[data-type="dictionary-view"] h3 {
  font-size: 1.25rem;
  line-height: 1.2rem;
  margin: 0.3rem;
}
phibr0 commented 2 years ago

I will take a look at the styling for mobile when I have the time soon.