TinSort Tricks in questfox

Posted: 1. December 2017 | Author: | Filed under: Uncategorized | Leave a comment
Tinsort_Example
Users ask us how to manipulate the design in the questfox question type TinSort.
Here are some hints on how to manipulate design features:
You can enlarge or squeeze the overall dimension by changing height and width. It is even possible to go into a new non-rectangle format by manipulating those values.
Everything needs to be transferred into CSS that you can just implement on the question page under
Page Settings – Page Style – Define Custom Project CSS
page_settings_questfoxpasge_style_css_questfox_tinsort
This script helps you to manipulate the size
Overall size
#TinsortImageSize{max-height: 70em;}
Detailed manipulation
 #tinderslide, .tinderslide.wrap{
margin: 0 auto;
height: 16em;
width: 12em;
}
This would allow you to implement a background picture:

#tinderslide > ul > li{
background-image:url(“https://qfox.blob.core.windows.net/user/DigitalFutur/05_screen_backgrounds/blackboard_wallpaper.jpg”;);
}

Manipulating fonts is also possible 
#tinderslide > ul > li> div > div.answerTitle.ng-binding.ng-scope{
font-size:1.5em;
}

Definition of Picturesize
#TinsortImageSize{max-height: 15em;}