Loading...
 

Redo CSS Structure to be less local and more mode-driven

Status
Closed
Subject
Redo CSS Structure to be less local and more mode-driven
Version
2.x
Category
  • Feature request
Feature
Theme: Look & feel, Styles, CSS, Theme Control Center
Resolution status
Out of Date
Submitted by
jhwheuer
Volunteered to solve
jhwheuer
Lastmod by
Bernard Sfez / Tiki Specialist
Rating
(0)
Description

After looking through the CSS for TikiWiki, one quickly find several redundancies and inconsistencies (modules are not consistently using CSS in the same way, just take a look at the login box with different renderings to see what I mean). On top of that, some CSS classes requested by the code are actually not existing in some CSS... (separatorline etc in some menus)

SO, should we not rethink the styles system?

What I am thinking of is less of a local (modul-driven) approach but rather a context/mode-driven approach.

For example, we could structure the class names so they properly represent the place of usage: header,main, left, middle, right, bottom as pre-fixes, and the usage as the tag, and a qualifier as the postfix.

Example:
A Menu item would be location_menuitem_qualifier
A Menu item on the left side would be left_menuitem_qualifier.
A Menu Option on the left side would be left_menuitem_option

SMARTY knows precisely where it is rendering. So we could generate a standard variable in smarty called $CSS_LOCATION, which smarty maintains. All css requests are parsed through a smarty function that assembles the propper prefix.

The qualifier is there to make writing CSS a little easier. We can simply create a DIV as an envelope around a structure, assigning the class location_usage to that. All elements inside would then automatically inherit those characteristics, and the CSS part would only have to deal with the diviation. Those should be clustered together in the CSS to give a clear view on what happens in this particular usage...

I know that this is most probably a &%$&-load of nitty-gritty work, but once done, we should be able to then write a little app that makes developing CSS much easier (maybe even inside TikiWiki) Biggest problem: how to we manage the transition to the new approach, how to maintain backwards compatibility, and how to get alignment on the structure itself...

COMMENTS are very welcome.

J

Importance
5
Priority
25
Demonstrate Bug (Tiki 19+)
Please demonstrate your bug on show2.tiki.org
 About show2.tiki.org

To help developers solve the bug, we kindly request that you demonstrate your bug on a show2.tiki.org instance. To start, simply select a version and click on "Create show2.tiki.org instance". Once the instance is ready (in a minute or two), as indicated in the status window below, you can then access that instance, login (the initial admin username/password is "admin") and configure the Tiki to demonstrate your bug. Priority will be given to bugs that have been demonstrated on show2.tiki.org.

Version: Create show2.tiki.org instance
Demonstrate Bug (older Tiki versions)
Please demonstrate your bug on show.tikiwiki.org
 About show.tikiwiki.org

To help developers solve the bug, we kindly request that you demonstrate your bug on a show.tikiwiki.org instance. To start, simply select a version and click on "Create show.tikiwiki.org instance". Once the instance is ready (in a minute or two), as indicated in the status window below, you can then access that instance, login (the initial admin username/password is "admin") and configure the Tiki to demonstrate your bug. Priority will be given to bugs that have been demonstrated on show.tikiwiki.org.

Version: Create show.tikiwiki.org instance
Ticket ID
725
Created
Monday 22 May, 2006 15:15:21 GMT-0000
by Unknown
LastModif
Monday 11 October, 2021 12:06:13 GMT-0000

Attachments

 filenamecreatedhitscommentversionfiletype 
No attachments for this item


Keywords

The following is a list of keywords that should serve as hubs for navigation within the Tiki development and should correspond to documentation keywords.

Each feature in Tiki has a wiki page which regroups all the bugs, requests for enhancements, etc. It is somewhat a form of wiki-based project management. You can also express your interest in a feature by adding it to your profile. You can also try out the Dynamic filter.

Accessibility (WAI & 508)
Accounting
Administration
Ajax
Articles & Submissions
Backlinks
Banner
Batch
BigBlueButton audio/video/chat/screensharing
Blog
Bookmark
Browser Compatibility
Calendar
Category
Chat
Comment
Communication Center
Consistency
Contacts Address book
Contact us
Content template
Contribution
Cookie
Copyright
Credits
Custom Home (and Group Home Page)
Database MySQL - MyISAM
Database MySQL - InnoDB
Date and Time
Debugger Console
Diagram
Directory (of hyperlinks)
Documentation link from Tiki to doc.tiki.org (Help System)
Docs
DogFood
Draw -superseded by Diagram
Dynamic Content
Preferences
Dynamic Variable
External Authentication
FAQ
Featured links
Feeds (RSS)
File Gallery
Forum
Friendship Network (Community)
Gantt
Group
Groupmail
Help
History
Hotword
HTML Page
i18n (Multilingual, l10n, Babelfish)
Image Gallery
Import-Export
Install
Integrator
Interoperability
Inter-User Messages
InterTiki
jQuery
Kaltura video management
Kanban
Karma
Live Support
Logs (system & action)
Lost edit protection
Mail-in
Map
Menu
Meta Tag
Missing features
Visual Mapping
Mobile
Mods
Modules
MultiTiki
MyTiki
Newsletter
Notepad
OS independence (Non-Linux, Windows/IIS, Mac, BSD)
Organic Groups (Self-managed Teams)
Packages
Payment
PDF
Performance Speed / Load / Compression / Cache
Permission
Poll
Profiles
Quiz
Rating
Realname
Report
Revision Approval
Scheduler
Score
Search engine optimization (SEO)
Search
Security
Semantic links
Share
Shopping Cart
Shoutbox
Site Identity
Slideshow
Smarty Template
Social Networking
Spam protection (Anti-bot CATPCHA)
Spellcheck
Spreadsheet
Staging and Approval
Stats
Survey
Syntax Highlighter (Codemirror)
Tablesorter
Tags
Task
Tell a Friend
Terms and Conditions
Theme
TikiTests
Federated Timesheets
Token Access
Toolbar (Quicktags)
Tours
Trackers
TRIM
User Administration
User Files
User Menu
Watch
Webmail and Groupmail
WebServices
Wiki History, page rename, etc
Wiki plugins extends basic syntax
Wiki syntax text area, parser, etc
Wiki structure (book and table of content)
Workspace and perspectives
WYSIWTSN
WYSIWYCA
WYSIWYG
XMLRPC
XMPP




Useful Tools