Ligatures rendered inside code elements

ghost commented 7 years ago

Description

A ligature is a typographer’s solution to the blurring effect of juxtaposing certain characters. For example, in fi the bar of the f can occlude the dot of the i, so the character pair is replaced with a ligature – a glyph – representing their fusion.

This aid to legibility has no place in fixed-width typefaces, and by replacing two characters with one, damages horizontal alignment.

The Markdown terrific official flat fissures renders in MkDocs with ligatures for fi, ff and fl.

ligatures

A similar effect can be observed in the fenced code block. Also see online at code.kx.com.

Expected behavior

The text rendered without ligatures

Actual behavior

The text rendered with ligatures

Steps to reproduce the bug

Include terrific official flat fissures in a Markdown source file.
Compile in MkDocs and inspect result in Chrome or Safari browsers

Notes

Source files for this MkDocs project are online at GitHub: KxSystems/docs.

The bug does not appear when Chrome or Safari render the attached file ligature.txt.

ligatures.txt

The bug does not appear when Chrome or Safari render

<html>
    <head>
        <title>Ligatures</title>
    </head>
    <body>
        <pre>terrific official flat fissures</pre> 
    </body>
</html>

The bug disappears when you comment out in the YML: theme: 'material'.

The bug survives commenting out in the YML:

all the stylesheets under extra_css
all the scripts under extra_javascript
all the extensions under markdown_extensions

Package versions

Python: 2.7.10
MkDocs: 0.16.1
Material: 1.6.1

Project configuration

copyright: "©1993-2017 Kx Systems, Inc. Kx® and kdb+ are registered trademarks of Kx Systems, Inc., a subsidiary of First Derivatives plc."
dev_addr: '0.0.0.0:8000'
docs_dir: 'docs'
extra_css: 
  - stylesheets/extra.css
extra_javascript: 
  - 'https://code.jquery.com/jquery-3.1.1.min.js'
  - 'https://use.fontawesome.com/3dbf29ed12.js'
  - scripts/fdtracker.js
  - scripts/googleanalytics.js
  - scripts/theme.js
  - 'https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-MML-AM_CHTML'
markdown_extensions:
    - admonition
    - codehilite(guess_lang=false)
    - extra
    - fenced_code
    - fontawesome_markdown
    - pymdownx.arithmatex
    # - pymdownx.betterem(smart_enable=all)
    # - pymdownx.caret
    # - pymdownx.critic
    # - pymdownx.emoji:
        # emoji_generator: !!python/name:pymdownx.emoji.to_svg
    # - pymdownx.inlinehilite
    - pymdownx.magiclink
    - pymdownx.mark
    # - pymdownx.smartsymbols
    - pymdownx.superfences
    # - pymdownx.tasklist(custom_checkbox=true)
    # - pymdownx.tilde
    - toc(permalink=true)
site_dir: 'site'
site_author: 'Kx Systems'
site_description: Resources for kdb+ programmers
site_favicon: './img/favicon.ico'
# config.site_name: 'code.kx.com'
site_name: 'code.kx.com'
site_url: 'http://code.kx.com'
remote_branch: 'master'
# repo_name: 'GitHub'
# repo_url: 'https://github.com/kxsystems/docs'
theme: 'material'
# theme_dir for favicon
#theme_dir: 'theme'
extra:
  logo: 'img/kx.jpeg'
  palette: 
    primary: 'blue'
    accent: 'deep orange'
  # version: '0.1.0'
pages:
  - Home: index.md
  - Get started: learn.md
  - Reference card: ref/card.md
  - Reference: 
    - Adverbs: ref/adverbs.md
    - Command line: ref/cmdline.md
    - Datatypes: ref/datatypes.md
    - Debugging: ref/debug.md
    - Elements: ref/elements.md
    - Errors: ref/error-list.md
    - Glossary: ref/glossary.md
    - IPC protocol: ref/ipc.md
    - Releases:
      - Changes in 3.5: ref/releases/ChangesIn3.5.md
      - Changes in 3.4: ref/releases/ChangesIn3.4.md
      - Changes in 3.3: ref/releases/ChangesIn3.3.md
      - Changes in 3.2: ref/releases/ChangesIn3.2.md
      - Changes in 3.1: ref/releases/ChangesIn3.1.md
      - Changes in 3.0: ref/releases/ChangesIn3.0.md
      - Changes in 2.8: ref/releases/ChangesIn2.8.md
      - Changes in 2.7: ref/releases/ChangesIn2.7.md
      - Changes in 2.6: ref/releases/ChangesIn2.6.md
      - Changes in 2.5: ref/releases/ChangesIn2.5.md
      - Changes in 2.4: ref/releases/ChangesIn2.4.md
      - Withdrawn: ref/withdrawn.md
    - Semantics:
      - Arithmetic (integer): ref/arith-integer.md
      - Arithmetic (float): ref/arith-float.md
      - Casting & encoding: ref/casting.md
      - Comparison: ref/comparison.md
      - Database: ref/database.md
      - Dictionaries & tables: ref/dictsandtables.md
      - Enumeration: ref/enums.md
      - Environment: ref/environment.md
      - Evaluation control: ref/control.md
      - Error handling: ref/errors.md
      - Files (numbers): ref/filenumbers.md
      - Files (words): ref/filewords.md
      - Functional SQL: ref/funsql.md
      - Joins: ref/joins.md
      - Lists: ref/lists.md
      - Logic: ref/logic.md
      - Markup: ref/markup.md
      - Matrixes: ref/matrixes.md
      - Metadata: ref/metadata.md
      - OS: ref/os.md
      - Parallel processing: ref/peach.md
      - Parse trees: ref/parsetrees.md
      - Q-SQL: ref/qsql.md
          #   - exec: ref/exec.md
      - Randomness: ref/random.md
      - Search: ref/search.md
      - Selection: ref/select.md
      - Sort: ref/sort.md
      - Statistics (aggregates): ref/stats-aggregates.md
      - Statistics (moving): ref/stats-moving.md
      - Strings: ref/strings.md
      - Trigonometry: ref/trig.md
      - Unclassified: ref/unclassified.md
    - Syntax: ref/syntax.md
    - System commands: ref/syscmds.md
    - Utilities:
      - Developer tools: ref/devtools.md
      - .z namespace: ref/dotz.md
      - .Q namespace: ref/dotq.md
      - .h namespace: ref/doth.md
      - Internal functions: ref/internal.md
  - Tutorials:
    - Dictionaries & tables: tutorials/dictsandtables.md
    - Q by examples: tutorials/q-by-examples.md
    - Starting q:
      - 1. Introduction: tutorials/startingq/introduction.md
      - 2. Language: tutorials/startingq/language.md
      - 3. IPC: tutorials/startingq/ipc.md
      - 4. Tables: tutorials/startingq/tables.md
      - 5. HDB: tutorials/startingq/hdb.md
      - 6. Kdb+tick: tutorials/startingq/tick.md
  - Interfaces: interfaces.md
  - Interfaces:
    - Q client for Bloomberg: interfaces/q-client-for-bloomberg.md # bloomberg-feed-handler.md
    - C client for q: interfaces/c-client-for-q.md # interfacing-with-c.md
    - Using C/C++ functions: interfaces/using-c-functions.md # extending-with-c.md
    - C# client for q: interfaces/csharp-client-for-q.md # interfacing-with-csharp.md
    - Excel client for q: interfaces/excel-client-for-q.md # cookbook/interfacing-with-excel.md
    - GPUs: interfaces/gpus.md # cookbook/interfacing-with-gpus.md
    - J client for q: interfaces/j-client-for-q.md # cookbook/q-server-for-j.md
    - Q client for J: interfaces/q-client-for-j.md # cookbook/j-server-for-q.md
    - Java client for q: interfaces/java-client-for-q.md # cookbook/interfacing-with-java.md
    - Matlab client for q: interfaces/matlab-client-for-q.md # cookbook/interfacing-with-matlab.md
    - Q server for ODBC: interfaces/q-server-for-odbc.md # cookbook/odbc-qserver.md
    - Q server for ODBC3: interfaces/q-server-for-odbc3.md # cookbook/odbc3-qserver.md
    - Q client for ODBC: interfaces/q-client-for-odbc.md # cookbook/odbc-qclient.md
    - Perl client for q: interfaces/perl-client-for-q.md # cookbook/interfacing-with-perl.md
    - Python client for q: interfaces/python-client-for-q.md # cookbook/interfacing-with-python.md
    - Using q with R: interfaces/with-r.md
    - Scala client for q: interfaces/scala-client-for-q.md # cookbook/interfacing-with-scala.md
  - Cookbook:
    - Introduction: cookbook/introduction.md
    - Alternative in-memory layouts: cookbook/alternative-in-memory-layouts.md
    - Authentication and access: cookbook/authentication.md
    - Bulk Copy Program: cookbook/bcp.md
    - Callbacks: cookbook/callbacks.md
    - Chained tickerplant: cookbook/chained-tickerplant.md
    - Client-server: cookbook/client-server.md
    - Compacting HDB sym: cookbook/compacting-hdb-sym.md
    - Corporate actions: cookbook/corporate-actions.md
    - Custom web server: cookbook/custom-web.md
    - Daemon: cookbook/daemon.md
    - FAQ: cookbook/faq.md
    - FAQ from k4 listbox: cookbook/faq-listbox.md
    - File compression: cookbook/file-compression.md
    - Firewalling: cookbook/firewalling.md
    - Geospatial: cookbook/geospatial.md
    - inetd/xinetd: cookbook/inetd.md
    - Interprocess communication: cookbook/ipc.md
    - Kdb+tick configuration: cookbook/kdb-tick.md
    - Linking columns: cookbook/linking-columns.md
    - Linux production notes: cookbook/linux-production.md
    - Load balancing: cookbook/load-balancing.md
    - Loading from large files: cookbook/loading-from-large-files.md
    - Logging: cookbook/logging.md
    - Multithreaded input: cookbook/multithreaded-input.md
    - Named pipes: cookbook/named-pipes.md
    - ODBC: cookbook/odbc.md
    - Performance tips: cookbook/performance-tips.md
    - Precision: cookbook/precision.md
    - Pivoting tables: cookbook/pivoting-tables.md
    - Programming examples: cookbook/programming-examples.md
    - Programming idioms: cookbook/programming-idioms.md
    - Publish and subscribe: cookbook/publish-subscribe.md
    - Server calling client: cookbook/server-calling-client.md
    - Splayed schema change: cookbook/splayed-schema-change.md
    - Splayed tables: cookbook/splayed-tables.md
    - Splaying large files: cookbook/splaying-large-files.md
    - SSL/TLS: cookbook/ssl.md
    - Regular expressions: cookbook/regex.md
    - Temporal data: cookbook/temporal-data.md
    - Timezones: cookbook/timezones.md
    - Unicode: cookbook/unicode.md
    - Unit tests: cookbook/unit-tests.md
    - Using .z: cookbook/using-dotz.md
    - Write-only RDB: cookbook/w-q.md
    - WebSockets: cookbook/websockets.md
    - Windows Service: cookbook/windows-service.md
  - Developer: developer.md
  - GitHub: github.md
  - Q for Mortals 3: qformortals3.md
  - Archive: archive.md
  - About: 
    - This site: about/thissite.md
    - Kx technology: about/kxtechnology.md
    - Terms & conditions: about/TermsAndConditions.md

System information

OS: macOS 10.12.4
Browser: Chrome 58.0.3029.110 (64-bit); Safari 10.1 (12603.1.30.0.34

facelessuser commented 7 years ago

It looks like this isn't seen until it falls through to certain fonts, like in this case: Courier.

font-feature-settings: "kern", "liga"; should probably be font-feature-settings: "kern", "liga" 0;.

facelessuser commented 7 years ago

Also @StephenTaylor-Kx, you don't need to use fenced_code if you are using pymdownx.superfences. The latter replaces the former. extra also includs fenced_code. I would check out http://facelessuser.github.io/pymdown-extensions/usage_notes/.

I imagine it is just working for you, so maybe there are no issues, but it looks like you are probably including fences twice and then including superfences. When mixing pymdownx-extensions with the default extra, it is usually better to just include what you need out of extra individually, and then include what you need out of pymdownx-extensions. That is what I do: https://github.com/facelessuser/pymdown-extensions/blob/master/mkdocs.yml#L43.

squidfunk commented 7 years ago

That's interesting, I didn't know that there are monospace fonts with ligatures. It's indeed a bug. I will provide a fix that removes the "liga" font-feature-setting for code sections.

squidfunk commented 7 years ago

Fixed in #326, will be released as 1.6.2 shortly.

squidfunk / mkdocs-material