Tufte-css: شارك استخداماتك لـ Tufte CSS!

تم إنشاؤها على ٧ أغسطس ٢٠١٥  ·  29تعليقات  ·  مصدر: edwardtufte/tufte-css

سيكون من الجيد أن يكون لديك قائمة بالصفحات حيث يتم استخدام Tufte CSS. سيساعد ذلك في إعطائنا فكرة عن الوظائف التي نريد أن نستهدفها.

documentation help wanted

التعليق الأكثر فائدة

أنا أستخدم Tufte CSS - و Tufte-LaTeX - على موقعي _Secretary of Foreign Relations_ ( Github repo ). توجد كل صفحة على هذا الموقع كصفحة ويب وكملف PDF في فئة Tufte Handout ، وكلاهما تم إنشاؤه من نفس العلامة باستخدام Pollen .

لرؤية الترميز المستخدم بواسطة حبوب اللقاح لإنشاء كل صفحة (باستثناء الصفحة الرئيسية) ، يمكنك النقر فوق الارتباط "مصدر اللقطة" في الجزء العلوي ( مثال ). حبوب اللقاح رائعة حقًا من حيث أنها تتيح لك تصميم العلامات الخاصة بك واستهداف أي تنسيق مصدره نص. لذلك على الرغم من أن ترميز HTML في Tufte CSS صعب بعض الشيء ، فإنه يصبح من السهل جدًا استخدامه عمليًا: على سبيل المثال ، ◊numbered-note{Sidenote text} سيولد كل الترميز لملاحظة جانبية.

بالإضافة إلى ذلك ، يتم استخدام حبوب اللقاح لربط الصفحات الفردية معًا في ملف PDF كامل جاهز للطباعة من كتاب "Flatland" ، أيضًا بأسلوب Tufte.

أنا أستخدم أحدث إصدار من Tufte CSS بدون تغييرات حقيقية ؛ احتفظت بأي CSS خاص بي في ورقة أنماط منفصلة.

ال 29 كومينتر

لقد استخدمت TufteCSS هنا: gwydion.uk .

لقد أجريت عددًا قليلاً جدًا من تغييرات CSS (جميعها في index.html) ، بما في ذلك تشديد المقدمة الجانبية وتثبيت الجزء العلوي لإعادة محاذاة الخطوط الأساسية (انظر # 29). كانت التغييرات الأخرى هي دمج Lightbox ، وبالتالي تجنب الحدود السفلية على الصور المرتبطة. كما أنني ارتديت أسلوب تعليق بديل ، حيث (بالنسبة لعيني) بدت التسمية التوضيحية المائلة للشريط الجانبي غريبة مع الصور بدلاً من الأشكال.

ما أنا غير متأكد منه هو ما إذا كان هذا هو نوع الصفحة التي تناسبها TufteCSS حقًا. من المؤكد أنها تثني حالة الاستخدام المقصودة. ومع ذلك ، هناك عنصر مزاح لاستخدامي هنا ، لذا فهو يعمل مع الجمهور المستهدف ... إنه فقط أن الجمهور المستهدف متواضع!

تهانيناjjsanderson! أعترف أنني لم أفكر في إعلان ولادة كحالة استخدام ، لكنها لطيفة للغاية.

شكر! نعم ، إنها حالة استخدام غريبة. يمكنك إضافته إلى المستندات كمثال ، بالطبع ، على الرغم من أنه بعيد جدًا عن نوع المستند المقصود.

أستخدمه في مدونة صغيرة بدأتها منذ بضعة أسابيع. الناس الذين قرأوا ما أكتبه هناك أحبوه! ومع ذلك ، فهو مشروع شخصي إلى حد كبير.

خارج الموضوع ، لكنني أنشأت هذا الموقع منذ حوالي ثلاثة أسابيع (22 أكتوبر ~ العش). هل كانت هناك أي تحديثات مهمة لـ Tufte CSS منذ ذلك الحين يجب أن أعرف عنها؟

تحديث: لا تستخدم هذا المشروع بعد الآن ، لذلك أزلت الرابط.

sotojuan لطيف! أنا أيضا أفضل بلاتينو على بيمبو. : +1:

jjsanderson أحب أنك أضفت عناصر الرسم البياني المفتوحة!

تضمين التغريدة كما تعلم ، لقد نسيت أنني فعلت ذلك. قد أعارض صور الأطفال المفجّرة في جميع أنحاء Facebook ، لكن في هذه الحالة كان Facebook إلى حد كبير الجمهور المستهدف. لذا ... نعم ، opengraph. :-)

أنا أستخدم Tufte CSS - و Tufte-LaTeX - على موقعي _Secretary of Foreign Relations_ ( Github repo ). توجد كل صفحة على هذا الموقع كصفحة ويب وكملف PDF في فئة Tufte Handout ، وكلاهما تم إنشاؤه من نفس العلامة باستخدام Pollen .

لرؤية الترميز المستخدم بواسطة حبوب اللقاح لإنشاء كل صفحة (باستثناء الصفحة الرئيسية) ، يمكنك النقر فوق الارتباط "مصدر اللقطة" في الجزء العلوي ( مثال ). حبوب اللقاح رائعة حقًا من حيث أنها تتيح لك تصميم العلامات الخاصة بك واستهداف أي تنسيق مصدره نص. لذلك على الرغم من أن ترميز HTML في Tufte CSS صعب بعض الشيء ، فإنه يصبح من السهل جدًا استخدامه عمليًا: على سبيل المثال ، ◊numbered-note{Sidenote text} سيولد كل الترميز لملاحظة جانبية.

بالإضافة إلى ذلك ، يتم استخدام حبوب اللقاح لربط الصفحات الفردية معًا في ملف PDF كامل جاهز للطباعة من كتاب "Flatland" ، أيضًا بأسلوب Tufte.

أنا أستخدم أحدث إصدار من Tufte CSS بدون تغييرات حقيقية ؛ احتفظت بأي CSS خاص بي في ورقة أنماط منفصلة.

otherjoel أشياء جميلة جدا. شكرا للمشاركة!

لدي مجموعة مثيرة للاهتمام مع bootstrap التي أستخدمها في صفحة المشروع: http://frostbitten.github.io/ByeBox/

لقد صنعت أيضًا شوكة تقسم تنسيق tufte-css حتى أتمكن من إنشاء كتل محتوى معيارية مثل:

لقد سبقت للتو جميع محددات css بمعرف مخصص .tufte-body

تكرار آخر:
يتضمن هذا العنصر عناصر نموذج مخصصة:

سطح المكتب: التليفون المحمول:

لقد استخدمتها في تصنيف الغضب الوضعي ، والذي

لقد بدأت في كتابة مدونة جديدة باستخدام Tufte CSS. أنا حقا أحب كيف يبدو. كنت قد أنجزت سابقًا CSS الخاص بي لموقع آخر اقترب جدًا من Tufte CSS ، لذلك اعتقدت أنه يمكنني فقط استخدام Tufte بدلاً من نقل الكود القديم إلى مولد الموقع الثابت الجديد.

أنا أستخدم Lekor الآن حيث قامت IMO بإصلاح بعض مشكلات جميع مولدات الموقع الثابتة السابقة (مثل hexo وما إلى ذلك).

شيء واحد لاحظته هو عدم وجود أي وسائط طباعة CSS. هل هذا شيء يمكنك إضافته؟

steckerhalter كان هناك بالفعل بعض وسائط الطباعة الأساسية CSS في البداية. لست متأكدًا مما إذا كانت قد تمت إزالته في التحديث الكبير الماضي ~ يونيو / يوليو أو إذا كان قبل ذلك ، ولكن السبب كان عدم الرغبة في ضمان الجودة حالة استخدام مختلفة تمامًا. أقترح التحقق من سجل الالتزام من الخلف. في صحتك!

لقد قمت بإنشاء سمة Jekyll التي تنفذ Tufte CSS! إنه متوافق أيضًا مع AMP ، لذا فهو سريع جدًا. تحقق من ذلك: طاهر .

لقد اعتمدت TufteCSS ل موقعي والحب. حتى الآن ، لم تكن هناك حاجة إلى إجراء تعديلات ولم يتم إجراؤها (على الصفحة الرئيسية وعدد قليل من الصفحات الأخرى) وقد استخدمت الإطار كما هو. عمل عظيم!

استخدامه لمدونتي في

أنا أستخدم TufteCSS لموقعي الشخصي من خلال مشروع أنشأته يسمى ox-tufte والذي يقوم بتصدير

لقد ضربنيsiawyoung@ clayh53 ) جزئيًا ، لكنني قمت أيضًا بتجميع موضوع Jekyll. يحاول التمسك بالقرب من tufte-css قدر الإمكان. https://github.com/sdruskat/tufte-css-jekyll.

لقد أنشأت مشروعًا باسم tufte-markdown بحيث يمكنك ببساطة كتابة مقالاتك باستخدام Markdown ، ثم يمكنك تحويلها إلى مقالات جميلة بتنسيق HTML و PDF باستخدام أسلوب Tufte.

يمكنك معرفة كيف يتم ذلك على علامة خصر .

أستخدم Tufte CSS في mplewis.com ( شفرة المصدر ).

إنه عمل مستمر ، لكنني أستخدم تكيفي الخاص مع Tufte CSS في mercury.photo . سأقوم بنشر مقال حول كيفية استخدام رموز Wordpress المختصرة لملاحظة الهامش والملاحظة الجانبية التي أنشأتها لتسريع سير العمل لاحقًا ؛ سأربطها عندما تكون جاهزة.

لقد انتهيت للتو من إعادة بناء موقع الويب الشخصي الخاص بي لاستخدام tufte-css:

https://jasonpeacock.com

لقد كتبت ما تعلمته والأدوات المستخدمة لإنشاء موقع الويب الخاص بي من تخفيض السعر باستخدام Pandoc و Pandocomatic و pandoc-sidenote و tufte-pandoc-css:

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

كل شيء متاح في الريبو الخاص بي:

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

أحاول إنشاء تخطيط Tufte CSS باستخدام Bootstrap 4.
https://github.com/dylan-k/tufte-bootstrap
نرحب بالمساهمين.

أحاول إنشاء تخطيط Tufte CSS باستخدام Bootstrap 4.
https://github.com/dylan-k/tufte-bootstrap
نرحب بالمساهمين.

ألقيت نظرة على الخطأ الخاص بك في أدوات المفتش ولم أتمكن من معرفة سبب دفع الفقرة لأسفل. يستخدم Tufte CSS الأصلي تعويمًا صحيحًا لإنجاز sidenotes & marginnotes. حلك أكثر أناقة - أتمنى أن تتمكن من إصلاحه!

لقد أعدت مؤخرًا بناء موقعي باستخدام Tufte CSS عن طريق نقله إلى Jekyll ، واستخدامه كما هو. النقاط الرئيسية هي:

  • يمتزج جيدًا مع MathJax.
  • تمت إضافة التنقل الأفقي البسيط إلى أعلى كل صفحة.
  • تسرد الصفحة الرئيسية أحدث 5 مشاركات.
  • تتضمن صفحة المحفوظات روابط ثابتة لجميع المنشورات بترتيب زمني عكسي.
  • تتم كتابة كل مشاركة بترميز html ، مع قيام Jekyll بلف كل منشور بعلامة <article> .
  • جدوى استخدام Markdown للمشاركات ذات السمة غير مؤكدة.

https://juliuso.com

مرحبًا يا رفاق ، بعد وقت طويل من جمع استخدامات Tufte CSS هنا ، قررت نقل الأشياء إلى الويكي ، حيث تناسبها بشكل أفضل قليلاً. أعتقد أنني نسخت كل شيء ؛ إذا فاتني شيء ، فلا تتردد في تحرير الويكي بنفسك.

شكرا للمشاركة :)

لدي استخدام غير تقليدي إلى حد ما لـ Tufte CSS على موقعي الصغير من أجل المتجانسات التي كتبتها بالفنلندية: palindromi.fi

موقع آخر استخدمته للتو Tufte CSS هو

هل كانت هذه الصفحة مفيدة؟
0 / 5 - 0 التقييمات

القضايا ذات الصلة

danielnixon picture danielnixon  ·  3تعليقات

langford picture langford  ·  21تعليقات

Saturate picture Saturate  ·  5تعليقات

adamschwartz picture adamschwartz  ·  16تعليقات

gamecubate picture gamecubate  ·  10تعليقات