إخفاء أيقونة التعديل لمُنشئ الجداول للأجهزة اللوحية والجوالات؟

من فضلكم أيها السحرة، أحتاج بعض التوجيه.

منشئ الجداول عديم الفائدة تمامًا للهواتف المحمولة والأجهزة اللوحية، لأنه لا يمكنهم فعل أي شيء. لهذا السبب يجب إخفاء أيقونة التحرير الخاصة بالجداول. الآن هي مجرد ضوضاء مربكة.

CSS هي أداة واضحة، لأنه لو كان هناك حل آخر لتم استخدامه، أليس كذلك؟ لكن ليس لدي أي فهم لكيفية إخفاء أيقونة القلم الرصاص غير الضرورية هذه.

ليس مثالياً ولكني أنشأت هذا الجدول باستخدام هاتفي:

العمود 1 العمود 2 العمود 3 العمود 4
تم بناء هذا الجدول على هاتفي. ليس مستحيلاً. النقر المزدوج يفتح لوحة المفاتيح.
لست متأكداً من كيفية إزالة الصفوف الإضافية. أوه! فقط قم بالتحرير بعد البناء.

إزالة الأعمدة تتطلب الكثير من التحرير الممل، لذلك لم أفعل ذلك. :wink:

حسنًا، في جهازي iPad و iPhone، يتطلب الأمر نقرات مزدوجة سريعة جدًا. ولكن لا يزال - التحرير بأي شكل من الأشكال أسهل بكثير في المحرر، وإذا وعند الحاجة إلى إضافة أو حذف صفوف وما إلى ذلك، فلا يمكن القيام بذلك في محرر الجدول.

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

هذا هو على الأرجح المرة الأولى التي أكون فيها ضد التصميم من نوع wysiwyg - ربما لأنه معاق للغاية.

إليك مقتطف CSS يمكنك استخدامه لإخفاء زر “تعديل الجدول” على الهاتف المحمول:

.mobile-view .fullscreen-table-wrapper:hover .fullscreen-table-wrapper__buttons .btn-edit-table {
  display: none;
  opacity:0;
}
3 إعجابات

شكراً جزيلاً!
والآن أفهم لماذا لم تنجح محاولاتي. حسناً، أفهم تقريباً. لماذا opacity:0؟

إعجاب واحد (1)

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.