Slidorion Accordion

[actionit]

Does anyone know if it is possible to increase the font size in the Slidorion Accordion widget, and if so, how?
I can increase the font size in the widget, but when it displays in a browser, it is back to the default size.

[steve.ledger]

You can do it if you are prepared to fiddle.
These instructions suit version 7 and 8 only.

1. Drag the Slidorion Accordion Widget onto your page.
2. Export the page to a temp folder on the desktop
3. Go to index_htm_files and find slidorion.css
4. Open slidorion.css in a text editor and find ;

#accordion > .link-content {
	/*height: 170px;*/			/* This height needs to be changed as it depends on the accordion height and number of tabs */
	font-weight: normal;
	font-size: 11px;

5. Change the font-size to your requirments
6. Also find ;

#accordion > .link-header {
	padding: 4px;
	font-size: 10px;

7. Change font-size to your requirments
8. Save the slidorion.css
9. In Xara, select the widget then press SHIFT+CTRL+ALT+A and browse to the index_htm_files folder to select the slidorion.css
(this attaches the modified *.css to your current document only)

Done.

Note: This would be non-Xara-supported editing

[actionit]

Awesome. Thanks Steve. You da man!!

[David Major]

Hi sledger, I'm new to Xara. I wanted to tweak the layout of the 'easy-accordion' widget, and so I've used the steps you've outlined above, and played around with the CSS. I've got the text formatting the way I want it -- thanks for that -- but I also want to move the image upwards. I've found that I can move the image sideways using the ".accordion-1 dd img{float:right;margin:0 0 0 30px;}" line, but I can't find a way to move the image vertically.

There must be some setting somwhere holding it in place, because I can move the image anywhere in the widget editing screen, but when I preview or publish the widget, the image is always placed back where it was by default.

Any ideas how I can change this behaviour?

Edit: I've just looked at the code generated, and seen that the image is inline, in the paragraph of text, which would explain why it insists on aligning with the top of the paragraph. So, I suppose my question becomes: is there any way that I can get the image out of that paragraph, and positioned anywhere on the page I want? Whatever is writing the code -- is it easyaccordion.js? -- I suppose I need to tweak that...

Thanks, and enjoying Xara so far, it's very good...

David

[David Major]

Solved it ... added "position: relative; top: -40px;" to the line for the image in the css file, and it's all good now....