Tufte-css: Teilen Sie Ihre Verwendung von Tufte CSS!

Ich habe TufteCSS hier verwendet: gwydion.uk .

Ich habe einige wenige CSS-Änderungen vorgenommen (alle in index.html), einschließlich des Verschärfens der Nebenbemerkung und des Auffüllens der Oberseite, um die Basislinien neu auszurichten (siehe Nr. 29). Andere Änderungen betrafen die Integration von Lightbox und damit die Vermeidung von unteren Rändern für verknüpfte Bilder. Ich habe auch einen alternativen Beschriftungsstil gewählt, da (für mein Auge) die Beschriftung in der Seitenleiste eher mit Fotos als mit Zahlen seltsam aussah.

Was ich weniger sicher bin, ist, ob dies die Art von Seite ist, für die TufteCSS wirklich geeignet ist. Es ist sicherlich das Biegen des beabsichtigten Anwendungsfalls. Es gibt jedoch ein Scherzelement bei meiner Verwendung hier, so dass es für das beabsichtigte Publikum funktioniert… es ist nur so, dass das beabsichtigte Publikum bescheiden ist!

Glückwunsch @jjsanderson! Ich gebe zu, ich hatte mir eine Geburtsanzeige nicht als Anwendungsfall vorgestellt, aber es ist ganz nett.

Vielen Dank! Ja, es ist ein seltsamer Anwendungsfall. Sie können es natürlich auch als Beispiel zu den Dokumenten hinzufügen, obwohl es ziemlich weit vom beabsichtigten Dokumenttyp entfernt ist.

Ich benutze es für ein kleines Blog-Ding, das ich vor ein paar Wochen angefangen habe. Leute, die lesen, was ich dort schreibe, haben es gemocht! Das heißt, es ist so ziemlich ein persönliches Projekt.

Off-Topic, aber ich habe diese Seite vor ungefähr drei Wochen (22. Oktober) gemacht. Hat es seitdem bedeutende Updates für Tufte CSS gegeben, über die ich Bescheid wissen sollte?

Update: Verwenden Sie dieses Projekt nicht mehr, daher habe ich den Link entfernt.

@sotojuan schön! Auch ich bevorzuge Palatino gegenüber Bembo. : +1:

@jjsanderson Ich liebe es, dass du das Open Graph Zeug hinzugefügt hast!

@ Mandaris Hah! Weißt du, ich hatte vergessen, dass ich das getan hatte. Ich bin vielleicht gegen Babyfotos, die überall auf Facebook mit Teppichbomben bombardiert werden, aber in diesem Fall war Facebook so ziemlich das beabsichtigte Publikum. Also ... ja, Opengraph. :-)

Ich verwende Tufte CSS - und Tufte-LaTeX - auf meiner Website _Secretary of Foreign Relations_ ( Github Repo ). Jede Seite auf dieser Site existiert sowohl als Webseite als auch als PDF-Datei in der Tufte Handout-Klasse, die beide aus demselben Markup mit Pollen generiert wurden.

Um das Markup anzuzeigen, das Pollen zum Generieren jeder Seite verwendet (mit Ausnahme der Hauptseite), können Sie oben auf den Link „Pollenquelle“ klicken ( Beispiel ). Pollen ist insofern sehr schön, als Sie damit Ihr eigenes Markup entwerfen und auf jedes Textformat abzielen können. Obwohl das HTML-Markup in Tufte CSS etwas umständlich ist, wird es in der Praxis recht einfach zu verwenden: z. B. generiert ◊numbered-note{Sidenote text} das gesamte Markup für eine Randnotiz.

Darüber hinaus werden mit Pollen einzelne Seiten zu einem vollständigen druckfertigen PDF des Buches 'Flatland' zusammengefügt, ebenfalls im Tufte-Stil.

Ich verwende die neueste Version von Tufte CSS ohne echte Änderungen. Ich habe jedes eigene CSS in einem separaten Stylesheet gespeichert.

@otherjoel Sehr schönes Zeug. Danke für das Teilen!

Ich habe eine interessante Kombination mit Bootstrap, die ich auf einer Projektseite verwende: http://frostbitten.github.io/ByeBox/

Ich habe auch eine Abzweigung erstellt, die das Tufte-CSS-Format unterteilt, damit ich modulare Inhaltsblöcke wie folgt erstellen kann:

Ich habe gerade allen CSS-Selektoren eine benutzerdefinierte Kennung .tufte-body vorangestellt

Eine weitere Iteration:
Dieser enthält benutzerdefinierte Formularelemente:

Desktop: Handy, Mobiltelefon:

Ich habe es für Ranked Situational Fury verwendet , bei dem es sich hauptsächlich um Listen von Wörtern, deren Definitionen und die Quellen ihrer Definitionen handelt.

Ich habe begonnen, einen neuen Blog mit Tufte CSS zu schreiben. Mir gefällt sehr, wie es aussieht. Ich hatte zuvor mein eigenes CSS für eine andere Site erstellt, die Tufte CSS ziemlich nahe kam, sodass ich dachte, ich könnte nur Tufte verwenden, anstatt den alten Code auf den neuen statischen Site-Generator zu portieren.

Ich verwende jetzt Lekor, das IMO einige der Probleme aller vorherigen statischen Site-Generatoren (wie Hexo usw.) behoben hat.

Eine Sache, die mir aufgefallen ist, ist, dass es kein Printmedien-CSS gibt. Wäre das etwas, das Sie hinzufügen könnten?

@steckerhalter Am

Ich habe ein Jekyll-Thema erstellt, das Tufte CSS implementiert! Es ist auch AMP-konform, also super schnell. Probieren Sie es aus: Makellos .

Ich habe TufteCSS für meine Website übernommen und liebe es. Bisher waren weder Änderungen noch Anpassungen erforderlich (an der Hauptseite und einigen anderen), und ich habe das Framework so verwendet, wie es ist. Gute Arbeit!

Verwenden Sie es für meinen Blog auf markbucciarelli.com . Sehr zufrieden mit der Arbeit, danke! (Ich benutze es mit Code Wrapping Pull Request.)

Ich verwende TufteCSS für meine persönliche Website durch ein von mir erstelltes Projekt namens ox-tufte , das Emacs 'Org-Modus-Dokumente in HTML exportiert, das mit TufteCSS kompatibel ist.

@siawyoung (und @ Clayh53 ) haben mich teilweise geschlagen, aber ich habe auch ein kleines Jekyll-Thema zusammengestellt. Es versucht, so nah wie möglich am Tufte-CSS zu bleiben. https://github.com/sdruskat/tufte-css-jekyll.

Ich habe ein Projekt namens tufte-markdown erstellt, damit Sie Ihre Artikel einfach mit Markdown schreiben und sie dann im Tufte-Stil in schöne HTML- und PDF-Artikel konvertieren können.

Sie können herausfinden, wie es beim Tufte-Markdown ist .

Ich benutze Tufte CSS in mplewis.com ( Quellcode ).

Es ist in Arbeit, aber ich verwende meine eigene Anpassung von Tufte CSS auf mercury.photo . Ich werde einen Artikel darüber veröffentlichen, wie Sie die von mir erstellten Wordpress-Shortcodes für Randnotizen und Randnotizen verwenden, um meinen Workflow später zu beschleunigen. Ich werde darauf verlinken, wenn es fertig ist.

Ich habe gerade meine persönliche Website für die Verwendung von tufte-css neu erstellt:

https://jasonpeacock.com

Ich habe meine Erkenntnisse und Tools, die zum Generieren meiner Website aus Abschriften verwendet wurden, mit Pandoc, Pandocomatic, Pandoc-Nebenbemerkung und Tufte-Pandoc-CSS aufgeschrieben:

https://jasonpeacock.com/projects/markdown-websites/

Alles ist in meinem Repo verfügbar:

https://github.com/jasonpeacock/websites/tree/master/jasonpeacock.markdown

Ich versuche, mit Bootstrap 4 ein Tufte CSS-Layout zu erstellen.
https://github.com/dylan-k/tufte-bootstrap
Mitwirkende willkommen.

Ich versuche, mit Bootstrap 4 ein Tufte CSS-Layout zu erstellen.
https://github.com/dylan-k/tufte-bootstrap
Mitwirkende willkommen.

Ich habe mir Ihren Fehler in den Inspektor-Tools angesehen und konnte nicht herausfinden, was den Absatz nach unten drückte. Das ursprüngliche Tufte CSS verwendet einen rechten Float, um die Neben- und Randnotizen zu erstellen. Ihre Lösung ist eleganter - ich hoffe, Sie können sie beheben!

Ich habe meine Site kürzlich mit Tufte CSS neu erstellt, indem ich sie in Jekyll eingebaut habe und sie so wie sie ist verwendet habe. Hauptpunkte sind:

• Passt gut zu MathJax.
• Einfache horizontale Navigation am oberen Rand jeder Seite hinzugefügt.
• Homepage listet die 5 neuesten Beiträge auf.
• Die Archivseite enthält Permalinks zu allen Posts in umgekehrter chronologischer Reihenfolge.
• Jeder Beitrag wird in HTML-Markup geschrieben, wobei Jekyll jeden Beitrag in ein <article> -Tag einwickelt.
• Die Möglichkeit, Markdown für Posts mit dem Thema zu verwenden, ist ungewiss.

https://juliuso.com

Hey Leute, nachdem ich hier lange Zeit Tufte CSS gesammelt hatte, beschloss ich, die Dinge ins Wiki zu verschieben , wo es etwas besser passt. Ich glaube, ich habe alles kopiert; Wenn ich etwas verpasst habe, kannst du das Wiki gerne selbst bearbeiten.

Danke für das Teilen :)

Ich habe eine etwas unkonventionelle Verwendung für Tufte CSS auf meiner kleinen Website für Palindrome, die ich auf Finnisch geschrieben habe: palindromi.fi

Eine andere Site, in der ich gerade Tufte CSS verwendet habe, ist etätunnit.taiteilijat.fi (bisher nur auf Finnisch), die Anleitungen zur Verwendung der Zoom-Videokonferenz-App für Remote-Musikinstrumentenunterricht und zur Konfiguration der einzigartigen Fähigkeit enthält, eine gute Klangqualität zu erzielen Musik statt Sprachoptimierung.