History of StylistPackage

Version 3

StylistPackage

Created by: xing, Last modification: 22 Aug 2004 (14:39 UTC) by xing

My Site Stylist


my site stylist is a configurable graphical user interface to modify (perhaps even create) new themes.

note: this package is still in developement and certain aspects are nowhere near completion :)


update

now it's possible to select the style you want to edit rather than just picking the one that is being displayed
it's not required to use the GUI. you can use edit the css file using a massive textarea

features and items available

  • admin area allows users with permissions to add/remove elements and modify definable properties that can be set for these
  • relatively simple to work with and allows basically full customisation of the site if you take the time to add all classes, tags and ids to the list of editable items.
  • it's possible to customise a css file that is visible globally for all users using that particular theme
  • in addition every user can have his/her own css file that is only applied when that user calls that theme
    • ideally this file should be visible if the style is applied to the individual area
    • basically:
      • user selects his/her favorite theme for his/her user area
      • user customises his/her favorite theme
      • user applies modifications to his/her user area
      • customisation is visible to every user accessing his/her user area
  • it is possible to manage images in all these customisations making my site stylist quite flexible and powerful

this is a brief log of things that have been done and will be done
gui related
form is collapsable at every element to save space
individual and unified settings for borders and margins available
admin area is now
  • sortable
  • searchable
  • pagination
link to view original file is available
  • for simplicity reasons, i think it's better if the original file isn't directly modified (or copied and modified) but custom settings are loaded later resulting in overwriting of original css settings

data related
form submission results in easy to manage variables, similar to css syntax
individual form buttons work (still submit full form - should be fixed at some point)
final submit button for entire form is working as well
read css file and
  • create array of classes
  • pass all variables to form and populate it
  • create css file from date generated in form
classes, ids and tags have appropriate column settings in table since . and # conflict php varibles
array structure
{CODE()}
$css_elements = array(
'tag' => array(
'body' => array( 'border','margin','font','background' ),
'table' => array( 'border','margin','font','background' )
);
'id' => array(
...
);
'class' => array(
...
);
);
{CODE}
on the admin page
classfeatures
bodyfont
border
margin
background
tablefont
border
margin
background


permissions and preferences that are available
permissions
feature_stylistobvious
tiki_p_admin_stylistobvious as well
tiki_p_edit_globaluser has rights to edit the global css
upload_style_imagesleads to the fact that 'background' can't be set by users without this perm
copy_style_imagescan't copy images from original image folder to custom folder
apply_style_globallyallows user to apply his/her modifications globally for the given theme

preferences
max_file_sizeset MAX_FILE_SIZE for image upload
ignore_max_file_sizeignore the above setting and set it to 100MB
use_color_pickershould we use the color picker popup window?


custom css files that are created
  • global css files are stored in the storage directory
  • private css files are stored in the individual storage folder

  • when you use the stylist the file created is in
    • <style>/custom.css
  • when editing the css file without stylist, the file is called
    • <style>/<style>.css

order of loading css files is
  • base.css
  • <style>.css
    • first check if user has <style>/<style>.css --> continue with loading <style>_<browser>.css
    • then check if there is a global version of <style>/<style>.css --> continue with loading <style>_<browser>.css
    • finally load original <style>/<style>.css --> continue with loading <style>_<browser>.css
  • <style>_<browser>.css
    • this is a css file that is loaded in addition to <style>.css if <browser> matches the client browser
  • custom.css
    • first load custom.css found in the global storage directory
    • then load custom.css found in individual storage area

Page History
Date/CommentUserIPVersion
23 Feb 2005 (04:57 UTC)
xing66.93.240.2049
Current • Source
xing62.99.189.1308
View • Compare • Difference • Source
xing62.99.189.1307
View • Compare • Difference • Source
xing62.99.189.1306
View • Compare • Difference • Source
xing62.99.189.1305
View • Compare • Difference • Source
xing62.99.189.1304
View • Compare • Difference • Source
xing62.99.189.1303
View • Compare • Difference • Source
xing62.46.201.1412
View • Compare • Difference • Source