GithubHelp home page GithubHelp logo

Headers about pen-paper-coffee-syntax HOT 15 CLOSED

nylki avatar nylki commented on June 10, 2024
Headers

from pen-paper-coffee-syntax.

Comments (15)

nylki avatar nylki commented on June 10, 2024

I am aware of that issue and it annoys me aswell.

Screenshot of the issue:
bildschirmfoto 2015-07-22 um 15 07 54

how it looks like with no changes to font-size in the syntax-theme (One-Light):
bildschirmfoto 2015-07-22 um 15 13 36

The problem lies in the fixed with of Atoms absolute positioned lines.
Each line of text in Atom has its own div class="line" which contains divs with classes used for styling specific syntax features.

When a line wraps is determined by its width. Example of a line with a markdown header:

<div class="line" style="position: absolute; top: 0px; width: 550px;" data-screen-row="108">
   <span class="source gfm">
       <span class="markup heading heading-2 gfm">
           <span class="markup heading marker gfm">##</span>
           <span class="markup heading space gfm"> </span>
           Very very long header, that flows over in the current version off 
       </span>
     </span>
</div>

If I just do a word-wrap inside any of those spans on eg. .gfm .heading the result would be even worse, as the <span class="markup heading heading-2 gfm"> would wrap in itelf (that is, inside the line) and its impossible to control.

The problem I think (which I can't confirm right now) lies in the wrapping/linelength being determined by the font-size set via your settings. So when manipulation the font-size in the syntax theme, the calculation of the propper wrapping or line-length by atom doesn't properly work for those lines anymore.

I guess, if it was possible to select the .line that contains a .heading you could set a max-width to earlier wrap the text. As there is no parent selector in css, this is at the moment not possible. But even if that would be possible I am not quite sure if it would work out properly as it might break the structure of the document.

Of course, if anybody has a different view on the situation I am eager to hear it 😃 . Maybe I am just overseeing a detail. /cc @braver @jesseweed @kevinsawicki @abe33

from pen-paper-coffee-syntax.

sbaack avatar sbaack commented on June 10, 2024

Not really a solution, but could you include an option to not change the font size as a workaround? I really like the theme, but issues with the headers prevent me from using it :-(

from pen-paper-coffee-syntax.

nylki avatar nylki commented on June 10, 2024

@sbaack It got even worse with cursor positioning etc. :/

I am pushing an update disabling the fontsize changes until the issues are fixed (possibly in Atom itself). I can't really add an option as syntax-themes don't expose options.

from pen-paper-coffee-syntax.

nylki avatar nylki commented on June 10, 2024

this issue is most likely relevant: atom/atom#6055

from pen-paper-coffee-syntax.

sbaack avatar sbaack commented on June 10, 2024

Thanks! I hope the issues in Atom will get fixed in the not-so-distant future. Unfortunately I now have a new issue with footnotes which I think is related to the change: Sometimes (but not always) the font-size is not only reduced for the footnote itself but also for the text that comes after it (for the rest of the line).

from pen-paper-coffee-syntax.

nylki avatar nylki commented on June 10, 2024

@sbaack Ahh, about the newly styled footnotes. I suppose you are using the pfm/pandoc-flavoured-markdown package as well?
Do you have an example at hand where that issues is visible? :)

from pen-paper-coffee-syntax.

sbaack avatar sbaack commented on June 10, 2024

Good that you mention the pfm package, citations seem to cause the issue:
screen shot 2015-10-02 at 1 28 24 am

from pen-paper-coffee-syntax.

nylki avatar nylki commented on June 10, 2024

@sbaack I linked your image in an issue at pfm. Let's see if somebody got a solution to that! Hope it's not too much of an issue to you right now. Otherwise you can edit your local copy of the theme and edit/comment out the .pfm .footnote section, so that no styling is applied to footnotes.

from pen-paper-coffee-syntax.

sbaack avatar sbaack commented on June 10, 2024

I will comment out the section for now then. Thanks again for your help and for the great theme :-)

from pen-paper-coffee-syntax.

nylki avatar nylki commented on June 10, 2024

@sbaack You are welcome! Glad you like it even though it has some problems because of experimental stylings ;)

I suppose I'll actually comment the section out in the master if there is no quick fix. I prefer to not have style breaking features in the theme.

from pen-paper-coffee-syntax.

the-solipsist avatar the-solipsist commented on June 10, 2024

The base issues atom/atom#6055 and atom/atom#7945 seem to be fixed, so any chance that we will have header-resizing again?

from pen-paper-coffee-syntax.

nylki avatar nylki commented on June 10, 2024

@the-solipsist Unfortunately, there still are issues with bigger than 1em/100% fontsizes.
ppc_fontsize

from pen-paper-coffee-syntax.

the-solipsist avatar the-solipsist commented on June 10, 2024

Are there any other external blockers to this being solved? If so, should one of us open up an issue report with Atom?

from pen-paper-coffee-syntax.

nylki avatar nylki commented on June 10, 2024

@the-solipsist I just created a meta-issue at atom-core (see above). I am not sure if other work is currently underway to overcome those rendering issues.

from pen-paper-coffee-syntax.

nylki avatar nylki commented on June 10, 2024

closed as wontfix.

from pen-paper-coffee-syntax.

Related Issues (20)

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.