Code Monkey home page Code Monkey logo

qqmbr's Issues

Preview images on click on the reference

It is probably better to open a modal preview of the image on click on its reference rather than scroll the page to that image. After preview is opened, there should be a way to scroll there (to see it in context).

Fix block tags inside special inline tags

The following tests raise Exception

doc = r"""\blocktag Some \inlinetag[Hello \blocktag test]"""
parser = QqParser(allowed_tags={'inlinetag', 'blocktag'})
tree = parser.parse(doc)

and

doc = r"""Some \inlinetag[Hello \blocktag test
\blocktag another test]"""
parser = QqParser(allowed_tags={'inlinetag', 'blocktag'})
tree = parser.parse(doc)

Blocks #2 .

Better TOC and chapter navigation

Current book TOC and chapter navigation is a bit clumsy and easily discoverable. Probably, we have to put TOC on screen permanently (instead of this chapter TOC that is currently on the right?), and add left-right buttons like on gitbook?

Better equation preview on mobile

Now equation preview (on click/hover over the reference) broke the layout completely on mobile.

IMG_7284

That's due to the fact that equation previews are obtained from the original layout and are usually too wide.

How to use?

This project, that powers ode book, is amazing. Can you please add more info on the README page on how one can render a web page from a *.qq file?

Punctuation detach from the equation

Sometimes when we have a MathJax equation followed by the punctuation near the end of the line, the punctuation is detached and moved to the next line, like it is shown on the screenshot.

Screenshot 2022-08-21 at 15 36 49

It can be fixed by shifting punctuation into the MathJax equation, e.g. writing like $R,$, but probably some better solution exists?

Highlight parts of images

It should be possible to highlight a part of an image on hover over special kind of a reference. Something like this:

Let's consider \imref[fig12][point-x][point $x$].

Then on hover on text point $x$, the corresponding point should be highlighted on figure fig12.

Not clear what to do if fig12 is currently not visible. Probably, on mobile we should open it in a modal. Not sure about desktop.

Mobile-friendly уравнения не отображаются на iPad

Если зайти с iPad на calculus.mathbook.info и пролистать до Примера 3, то формулу для множества B мы не увидим:

IMG_5330

Но если перевернуть планшет горизонтально, то нужная формула появится:

IMG_5331 (2)

Почему так происходит:

На странице в этом месте расположено два уравнения: long-eq и splitted-eq.

Если ширина экрана <= 768px, то на long-eq вешается свойство display: none.
Если ширина экрана >= 768px, то это свойство вешается на splitted-eq.

@media screen and (min-width: 768px) {
.splitted-eq {
display: none;
}
}
@media print {
.splitted-eq {
display: none;
}
}
@media screen and (max-width: 768px) {
.long-eq {
display: none;
}
}

И так совпало, что у айпадов ширина экрана ровно 768px.
То есть display: none вешается на обе версии уравнения и пользователю не показывается ничего.

Possible fix

    @media screen and (max-width: 768px) {
        .long-eq {
            display: none;
        }
    }

    @media not screen and (max-width: 768px) { 
        .splitted-eq {
            display: none;
        }
    }

Отмечу, что следующее медиавыражение тогда должно оказаться ненужным:

@media print {
.splitted-eq {
display: none;
}
}

Можете также вдохновиться этим stackoverflow.com/questions/41449476/media-queries-running-weird-because-of-non-integer-width

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.