Category: Theme: Look & feel, Styles, CSS, Theme Control Center

Multiple divs show up in code when using the "all languages" feature.

The .top and .page-bar ids show multiple times when using this feature.

Navigate to wiki page, with multiple languages. Ensure the "all languages feature is enabled.

Look under #role_main to find the duplicate ID's

I had a screenshot, but don't see a way to attach it.

1.9.0DR4 worked fine. 1.9.0 fails.
If you have a multitiki and create custom css/tpl files, they are not traversed. For example, If you have a multiwiki on www.foo.com and create a style called 'bar', the correct place to put the customized css files is
/styles/www.foo.com/bar.css
But this no longer works. It has to be in /styles/bar.css

The tpl files should be in
/templates/www.foo.com/styles/bar/
But this no longer works. It has to be in /templates/styles/bar

Please put back the old way. The current (broken) way prevents me from having styles of the same name on different multiwikis. each with customization.

Two aspects:

A- Alternate theme for certain browsers:
Ex.: simple theme for IE6 or pocket browsers.

B- Showfor plugin, as developed for Support.mozilla.com


Should the plugin be called SHOWFOR? (if so, it's should be quite generic).

*printer
*various browsers
*mobile versions
*users, groups, perms, upon feature check
*etc

Even if the generic plugin is not called browser, SUMO can continue to use SHOWFOR (And avoid needing to edit all the content) thanks to ((doc:plugin Alias))

See: ((Alternate content by media))

There are two ways to specify navbar foreground and background colors: the "Navbar background color" checkboxes on the admin Look and Feel page and the "CSS class(es) for the menu nav element" on the admin-modules page. The Look and Feel checkbox value is used in all cases, though, so if that preference is set to "Dark", for example, to get a dark-background navbar for the main navigation, then ''every'' navbar instance assigned on the admin-modules page gets the CSS classes for "Dark". This causes a problem if, for example, a Light-background system menu is wanted in the footer. Then the CSS classes for the navbar are "navbar-light bg-light navbar-dark bg-dark". In my test, this caused light text on light background, so it's unreadable.

Unless I'm missing something, I think it would be good if the navbar color switch on the Look and Feel admin page was removed and the navbar color specified by the module only (maybe using a checkbox or radio buttons instead of inputting the class names as is required now), or else make the L&F switch apply only to the admin interface. This would be similar to moving the setting of the site logo and title from Look and Feel to the module admin page.

I am unable to click any of the links on the top navigation while on my iPad. Entering full screen does not help. That includes the option to log-in or visit any area of the site using the main navigation.

Theme: Dev.tiki.org theme
Version: 15.3svn
iOS Version: 9.3.5

Chrome is also effected. One on one computer is completely broken, while on another, works fine.

*No Console Errors
*Same behaviour on working and non working chrome while JS disabled.
*No effect when all browser extensions are disabled
*Drop down navigation and Tabs effected
*Simple links not affected
*Browser updates url with what is clicked (in the case of tabs) but no action results
*Navigating to that link manually in the nav var has no effect
*Copy the url and navigate to it in another browser, and the correct page will load.
*Issue appears consistently, (my ipad and chrome are always broken) but not consistently across platforms (other chrome installs on other computers work fine)

{syntax type="tiki" editor="plain"}
When Tiki adds the antibot code to a form or table, there is no specific class assigned to the TD or TR. Sometime this results in odd UI (because sometimes the table is NORMAL, sometimes FORM, someimtes FORMCOLOR, etc.)

In IE7, the wiki edit help appears at the page bottom as before, always on. In Opera 9.6, the wiki edit page only displays down to the Quicktags. (I didn't check with IE6 yet.) This is in a trunk installl, Dec. 4, 2008.

top & bottom bars are now showing on tiki-newsletters.php, as there is no setting to de-activate them on tiki-admin_layout.php and the master setting from tiki-admin.php?page=features is not used.

Selecting "Admin/Admin Home/General/Theme/ChaSelecting "Admin/Admin Home/General/Theme/Change Style Only" does not refresh the screen with the new theme.
Selecting "Change Style Only" twice shows the new theme.
Navigating to another page shows the new theme.
I wonder if it is a PHP cache thing.nge Style Only" does not refresh the screen with the new theme.
Selecting "Change Style Only" twice shows the new theme.
Navigating to another page shows the new theme.
I wonder if it is a PHP cache thing.

{syntax type="tiki" editor="plain"}
In Windows 11, when running npm to produce content from _custom/shared/themes/MyTheme, two paths are created in public/generated/shared. The directory /public/generated/shared contains two subdirectories, /laragon and /shared. laragon is directly under C: directory here, and contains the WAMP stack. The directory path in laragon reflects the path to the Tiki instance I'm testing with, and so also contains a /custom/shared/themes directory.

The problem seems to be that this longer path to the themes contains the image directories (one having images), and the other set of /shared/themes contains the CSS files, so the images can't be found, as specified by the CSS.

Please see this conversation: [https://matrix.to/#/!SLEgqpTNTlGYAhzNvK:gitter.im/$h6R2W_KSy-wxq7EDullkNWSotkH8HEJRKdzhW-ABPKI?via=gitter.im&via=matrix.org&via=sans-nuage.fr], which includes screenshots of the directory structure.

A workaround is to manually copy the missing theme subdirectories from _custom/shared/themes to public/generated/custom/shared/themes, but it would be better if this worked automatically.

{syntax type="tiki" editor="plain"}
For 13.x bootstrapping we have lost the feature that lets the user open/close the left and right hand columns so that a wider area of screen content can be used on-demand

This very useful capability should be restored if at all possible

the output of {maketoc} in Wiki is not contained in a special
DIV so one can not define a style for displaying it for example in a box or ...

Like this site:
http://agilewebsolutions.com/downloads


When you scroll down, the menu stays. The same idea could be done for a menu on the bottom of the page.

To be specific, the perspective's theme is applied on pages like tiki-admin_calendars.php, but not on tiki-edit_perspective.php or pages like tiki-admin.php or tiki-admin.php?page=general. On these pages, the default theme of the site is used instead. I haven't checked yet if other perspective preferences are also ignored.

When you rollover any of the phplayers horiz menu, causing the menu to popup, and then subsequently try to use an overlib, e.g. the userlink popup that appears when you rollover the name of a user, the overlib will fail with javascript error "windowWidth is not a function".

The reason is because phplayers layersmenu.js (or if you have copied its contents into another file like layersmeny-header.ijs) defines windowWidth as it works, destroying the overlib function.

on 1.9.cvs

Horizontal phplayer menu is behaving weird when adding new options, etc. (sections level 0 and options inside dissapearing + separators rare)
Menú and menú items below, in utf-8 encoding.

{CODE()}
INSERT INTO `tiki_menu_options` (`optionId`, `menuId`, `type`, `name`, `url`, `position`, `section`, `perm`, `groupname`) VALUES
(171, 43, 'r', 'Comissions', 'Comissions', 10, '', '', ''),
(172, 43, 'o', 'Secretaria', 'Comissió+de+Secretaria', 20, '', '', ''),
(173, 43, 'o', 'Turisme', 'Comissió+de+Turisme', 30, '', '', ''),
(174, 43, 'o', 'Dinamització social', 'Comissió+de+Dinamització+social', 40, '', '', ''),
(175, 43, 'o', 'Medi ambient', 'Comissió+de+Medi+ambient', 50, '', '', ''),
(191, 43, 's', 'Enllaços', 'tiki-directory_browse.php', 300, '', '', ''),
(177, 43, 'o', 'Login', 'tiki-login_scr.php', 1010, '', '', 'Anonymous'),
(178, 43, 'o', 'Logout', 'tiki-logout.php', 1010, '', '', 'Registered'),
(179, 43, 's', 'Activitats', '', 200, '', '', ''),
(180, 43, '1', '2007', '', 210, '', '', ''),
(181, 43, '2', 'Artístiques i artesanals', 'Activitats+artístiques+i+artesanals', 220, '', '', ''),
(182, 43, 'o', 'Comerç Just', 'Activitats+artístiques+i+artesanals+de+Comerç+Just', 230, '', '', ''),
(190, 43, '-', '', '', 1001, '', '', ''),
(185, 43, '1', '2006', '', 250, '', '', ''),
(186, 43, 'o', '<img src="img/rss.png" alt="Sindicació de notícies per Agregadors RSS" title="Sindicació de notícies per Agregadors RSS" border="0" />', 'Notícies+per+RSS', 1008, '', '', ''),
(189, 43, '-', '', '', 1000, '', '', ''),
(192, 43, 's', 'Home', 'index.php', 5, '', '', ''),
(193, 43, 'o', 'Presentació', 'Presentació', 7, '', '', ''),
(194, 43, 'o', 'Història de l''associació', 'Història+de+l´associació', 400, '', '', ''),
(195, 43, '-', '', '', 1002, '', '', ''),
(196, 43, '-', '', '', 1003, '', '', ''),
(197, 43, '-', '', '', 1004, '', '', ''),
(198, 43, '-', '', '', 1005, '', '', ''),
(199, 43, '-', '', '', 1009, '', '', ''),
(200, 43, 'o', 'Historia2', 'Historia2', 410, '', '', ''),
(201, 43, 'o', 'Presentació de les activitats', 'Presentació+de+les+activitats', 205, '', '', ''),
(202, 43, '-', '', '', 60, '', '', '');

INSERT INTO `tiki_menus` (`menuId`, `name`, `description`, `type`) VALUES
(43, 'Menú horitzontal capçalera', 'Menú horitzontal per la capçalera de la web', 'd');
{CODE}

If interested in analyzing any more in the server where it happened, please, request me an admin account at:
http://www.moviments.net/valldelcorb

so that you can reproduce the buggy behavior.
I'm afraid of adding new items or sections since they break the present layout of phplayer menus if it is set as horitzontal.
when previewed as vertical, it's always shown ok, at it should.

I was using twist.css theme style.
-------
April 4th: the problem seems to dissapear if using tikineat style instead of twist.css theme style. See the screenshots of the same menu with each theme style.

From tiki 12 on (I think)
The plugin mouseover's tip has a too big offset in both vertical and horizontal position
Example can be seen on this page:
[http://doc.tiki.org/PluginMouseover]

((doc:PluginSlider)) lost start/stop control after upgrade from 12.x to 15.x

See the problem reproduced in doc.t.o, where the param to build Start/stop is set (buildstartstop="y" ), but nothing is shown:
https://doc.tiki.org/PluginSlider#Example

(compare with the screenshots from Tiki9/Tiki12 sites in the doc page)

Add an AJAX service to check the syntax of custom look and feel prefs before saving to make sure you're not going to break your entire Tiki

{syntax type="tiki" editor="plain"}
I noticed that the the stylesheets of the themes I have in public/generated/_custom/shared/themes have an error in the console like "GET http://localhost . . . /public/generated/_custom/shared/themes/MyThemecss/MyTheme.css - [HTTP/1 404 Not Found]" The slash between the theme name and its css directory is missing. Looking at the page source, I see the theme stylesheet link twice. It's correct the first time it's called, as the third stylesheet link, but it's called again as the last stylesheet link, and this time it's incorrect (missing the slash).

The first instance of the link isn't necessary, and should be removed as far as I know. Then the path in the second instance, the last stylesheet link, should be corrected (the missing slash should be restored).

Also, I'm seeing a difference comparing one custom theme to another. Here's the page source of a theme that displays correctly:

{CODE()}
<link rel="stylesheet" href="themes/base_files/css/tiki_base.css" type="text/css">
<link rel="stylesheet" href="public/generated/js/vendor_dist/@fortawesome/fontawesome/all.css" type="text/css">
<link rel="stylesheet" href="public/generated/_custom/shared/themes/Shapely/css/Shapely.css" type="text/css">
<link rel="stylesheet" href="vendor_bundled/vendor/studio-42/elfinder/css/elfinder.min.css" type="text/css">
<link rel="stylesheet" href="vendor_bundled/vendor/studio-42/elfinder/css/theme.css" type="text/css">
<link rel="stylesheet" href="lib/openlayers/theme/default/style.css" type="text/css">
<link rel="stylesheet" href="public/generated/js/vendor_dist/jquery-ui/dist/themes/flick/jquery-ui.css" type="text/css">
<link rel="stylesheet" href="vendor_bundled/vendor/jquery/jquery-timepicker-addon/dist/jquery-ui-timepicker-addon.css" type="text/css">
<link rel="stylesheet" href="vendor_bundled/vendor/npm-asset/select2/dist/css/select2.min.css" type="text/css">
<link rel="stylesheet" href="vendor_bundled/vendor/npm-asset/select2-bootstrap-5-theme/dist/select2-bootstrap-5-theme.css" type="text/css">
<link rel="stylesheet" href="vendor_bundled/vendor/drmonty/smartmenus/css/sm-core-css.css" type="text/css">
<link rel="stylesheet" href="vendor_bundled/vendor/drmonty/smartmenus/css/jquery.smartmenus.bootstrap-4.css" type="text/css">
<link rel="stylesheet" href="vendor_bundled/vendor/jquery-plugins/colorbox/example1/colorbox.css" type="text/css">
<link rel="stylesheet" href="vendor_bundled/vendor/jquery-plugins/treetable/css/jquery.treetable.css" type="text/css">
<link rel="stylesheet" href="public/generated/_custom/shared/themes/Shapelycss/Shapely.css" type="text/css">
{CODE}

So the first link to the theme stylesheet is correct although the second one isn't, so the theme works correctly. I believe most of my custom themes have this pattern of links. And here is the page source of a theme that isn't working (its stylesheet is not being applied). I'm not sure yet if it's something I did that caused this weirdness (why is themes/default/ involved at all), or something in the build process, etc.:

{CODE()}
<link rel="stylesheet" href="public/generated/js/vendor_dist/@fortawesome/fontawesome/all.css" type="text/css">
<link rel="stylesheet" href="themes/default/css/default.css" type="text/css">
<link rel="stylesheet" href="vendor_bundled/vendor/studio-42/elfinder/css/elfinder.min.css" type="text/css">
<link rel="stylesheet" href="vendor_bundled/vendor/studio-42/elfinder/css/theme.css" type="text/css">
<link rel="stylesheet" href="lib/openlayers/theme/default/style.css" type="text/css">
<link rel="stylesheet" href="public/generated/js/vendor_dist/jquery-ui/dist/themes/flick/jquery-ui.css" type="text/css">
<link rel="stylesheet" href="vendor_bundled/vendor/jquery/jquery-timepicker-addon/dist/jquery-ui-timepicker-addon.css" type="text/css">
<link rel="stylesheet" href="vendor_bundled/vendor/npm-asset/select2/dist/css/select2.min.css" type="text/css">
<link rel="stylesheet" href="vendor_bundled/vendor/npm-asset/select2-bootstrap-5-theme/dist/select2-bootstrap-5-theme.css" type="text/css">
<link rel="stylesheet" href="vendor_bundled/vendor/drmonty/smartmenus/css/sm-core-css.css" type="text/css">
<link rel="stylesheet" href="vendor_bundled/vendor/drmonty/smartmenus/css/jquery.smartmenus.bootstrap-4.css" type="text/css">
<link rel="stylesheet" href="vendor_bundled/vendor/jquery-plugins/colorbox/example1/colorbox.css" type="text/css">
<link rel="stylesheet" href="vendor_bundled/vendor/jquery-plugins/treetable/css/jquery.treetable.css" type="text/css">
<link rel="stylesheet" href="public/generated/_custom/shared/themes/Mondrianiccss/Mondrianic.css" type="text/css">
{CODE}

The pages that the theme is assigned for are using the "default" theme because that stylesheet has a correct link, and the second link is missing the slash between theme name and its css directory.

__Update__; Checking again after Benoit's [https://matrix.to/#/!SLEgqpTNTlGYAhzNvK:gitter.im/$M5cFIfFW-1Nsqj9SIfu94wqUcIAWrtsmYcGqRzYkYtU?via=gitter.im&via=matrix.org&via=sans-nuage.fr|question] on Matrix, I see that the theme with the wrong URL is assigned by Theme Control, so I guess that's where the fix for the wrong URL is needed. Unrelated, the theme stylesheet does need to come last, not earlier in the loading of stylesheets, in order to override declarations in external scripts, etc.

When an external style sheet is used (specified by its URL on the Look & Feel admin page) and Theme Control is used to specify a theme for a category's objects, both the external style sheet and the style sheet activated by Theme Control are used. The external style sheet is loaded first and the Theme Control-activated style sheet is loaded below it. The second style sheet should replace the first, not be used in addition to it.

This is a regression compared to the behavior of the profile in 12.x
See screenshot included in:
http://profiles.tiki.org/Random_Header_Images_14

which corresponds to the equivalent profile in 12.x

You can see it reproduced here:
http://xavi-9794-5617.show.tikiwiki.org/

u: admin
p: 12345

provide a clicable link to login to dev.t.o from a smartphone out of the menu icon at the top right corner

Have you tried recently (in the last several weeks?) {sign user="xavi" datetime="2016-04-06T15:43:28+00:00"}
Same issue when testing https://nextdev.tiki.org

You can't click there at any login link, it's hidden below the square icon of the collapsed menu at the topbar.

And ensure that this fix is applied to the main *.t.o sites , at least. (tiki.org, dev, doc, I would say)

{file type="gallery" fileId="2050" showicon="y"}
The popover that appears for tracker extra details is too transparent and needs to be changed as the overlapping white fonts are not visible. I used be able to change this in previous versions of tiki but I'm not familiar with SCSS I'm still in CSS land :-)

This should be migrated to the community site, and handled with ((doc:Organic groups)) and ((doc:User Trackers))