FLEx: Need help on two columns, multiple row layout for dictionary (print version)

128 views
Skip to first unread message

Michael BCM

unread,
Mar 8, 2022, 1:05:42 AM3/8/22
to FLEx list
We are working on a dictionary that has multiple scripts for the vernacular as well as multiple analysis languages. All of these should be in the final product.

For uability we found that a layout like the following would be best:
Simple entry:
simple_entry.png

Complex entry:
complex_entry.png

I tried to achieve that sneaking in html table tags through "before" - "in between" - "after" format fields but those only end up in the css stylesheet and as css can't insert html tags this way it doesn't work.

Could anyone of you please help me to achieve this two column layout? (Borders can be ignored -- though if a separating line between the lexeme and the sense column  and above and below each entry  is possible that might be a bonus ).

Best,
Michael

Michael BCM

unread,
Mar 9, 2022, 1:42:06 AM3/9/22
to FLEx list
Actually our requirements have changed a little. To optimize space and account for two of the scripts that are RTL scripts the new layout should be three columns instead of two. We imagine a dictionary page to look something like this:

dictionary_page.png

Any helpful hint of how to manipulate the css file so I can achieve a layout like this is very much welcome!

Best,
Michael

Albright, Jim

unread,
Mar 10, 2022, 2:23:33 PM3/10/22
to flex...@googlegroups.com
It looks like you want tables to handle your situation. Let me know if you will need help achieving this. I would need to clear it with my boss before I could work on it.
I would export to XHTML and then process with XSLT to insert the table structure.

Jim Albright
Wycliffe Bible Translators


--
"FLEx list" messages are public. Only members can post.
flex_d...@sil.org
http://groups.google.com/group/flex-list.
---
You received this message because you are subscribed to the Google Groups "FLEx list" group.
To unsubscribe from this group and stop receiving emails from it, send an email to flex-list+...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/flex-list/6e618c74-5ae1-45fd-8fc8-6f31973c2b56n%40googlegroups.com.

Ken Zook

unread,
Mar 10, 2022, 4:15:26 PM3/10/22
to flex...@googlegroups.com

Hi Michael,

 

I don’t think it’s possible to get this output straight from Flex, but it might be possible with some post processing.

 

In case you are not aware of it, in ConfigurationSettings\Dictionary there is a ProjectDictionaryOverrides.css file. There is also one for reversals. In this file you can manually add additional css overrides that can provide some formatting that is not provided in the Dictionary Configuration dialog. These overrides will affect your dictionary display in Flex and is passed along via Pathway and Webonary. It adds some nice customization capabilities, but can also be confusing because none of this shows up in the Dictionary Configuration dialog, so unless you realize there are overrides, you may not understand what’s happening.

 

Ken

--

"FLEx list" messages are public. Only members can post.
flex_d...@sil.org
http://groups.google.com/group/flex-list.
---
You received this message because you are subscribed to the Google Groups "FLEx list" group.
To unsubscribe from this group and stop receiving emails from it, send an email to flex-list+...@googlegroups.com.

Michael

unread,
Mar 11, 2022, 10:45:23 PM3/11/22
to 'Albright, Jim' via FLEx list

Dear Jim,

That would be a very, very great help. As this is a project where we actually have a March 31st deadline I need to be able to acomplish that within the next two weeks and both my css and xslt skills are at a very, ver beginners level. If you could have a xslt prototype for me that achieves the basic layout we could just tinker around with it till the details work out. 

Please let me know if you are willing to do that/your boss allows for and what kind of files you'd need for testing it.

Also even if you won't be able to do this any help that guides me into a quick start with xslt is very much welcome!

Blessings,

Michael

You received this message because you are subscribed to a topic in the Google Groups "FLEx list" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/flex-list/q2YBEECJg18/unsubscribe.
To unsubscribe from this group and all its topics, send an email to flex-list+...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/flex-list/CAKi9ZYdCcwYdcmv5K%2Br5ansAbpxJoS_-SfFWznPeMVRGogBafA%40mail.gmail.com.
-- 
Warm regards,
Michael
___
BCM Southeast
Media Technician
Phone: +8801821791071
www.bengalcreativemedia.com

Albright, Jim

unread,
Mar 11, 2022, 11:44:38 PM3/11/22
to flex...@googlegroups.com, Bryan Wussow
Michael,
You will need to ask for my time from my supervisor, Bryan Wussow.  Please tell him who you are, who you are affiliated with, and what you need. What will the final product look like?
From what I understand of your project it does fall under my skill set. If I understand correctly you need a transformation after an XHTML dictionary export to allow a PDF with tables.
Please send me a backup of your project so I can see what it looks like. If Bryan gives me the go-ahead then I will work on it. Will your final product be given away or sold?
That makes a difference in the tools that I am allowed to use.


Jim Albright
Wycliffe Bible Translators

Albright, Jim

unread,
Mar 12, 2022, 12:17:31 AM3/12/22
to flex...@googlegroups.com, Bryan Wussow, Verna Stutzman
Michael,
On further thought, I think this request would fall under my other supervisor's purview.
So please check with Verna for my time. She is head of Dictionary Services.

Jim Albright
Wycliffe Bible Translators

Message has been deleted

Michael BCM

unread,
Mar 12, 2022, 7:39:49 AM3/12/22
to FLEx list
So far I had some success on a stripped down Lexeme Form and Sense only dictionary by modifying the lexemeform class to be two seperate ones for the LTR fonts (class="lexemeform") and for the RTL fonts (class="lexemeform2"). And then ammending the .css file with the following:

/* Adds the same padding as on the left side (though I couldn't find out where the padding/indentation on the left side comes from)*/
.body{
        padding-right:10px;
}        

/* Creates the grid layout and makes sure that empty rows are filled */
.entry{
        display: grid;
        gap: 5px 5px;
        grid-auto-columns: 25% 50% 25%;
        grid-auto-rows: minmax(10px, auto);
        grid-auto-flow: dense;
}

/* Adds the separators for in between and after as on the lexemeform */
.entry> .lexemeform2> span+span[lang|='rhg-Arab']:before,.entry> .lexemeform2> span+span[lang|='rhg-Rohg']:before,.entry> .lexemeform2> span+span[lang|='rhg-fonipa']:before{
                content:'\a';
        }
.entry> .lexemeform2> span:last-child:after{
                content:'\a';
        }

/* puts the LTR fonts be in the left (1st) column */
.lexemeform{
                grid-column: 1;
}

/* puts the RTL fonts be in the right (3rd) column */
.lexemeform2{
                text-align: right;
                grid-column: 3;
}

/* puts the sense in the middle (2nd) column */
.senses{
                grid-column: 2;
        }

/* Add other content here */
Reply all
Reply to author
Forward
0 new messages