53 lines
		
	
	
		
			1.1 KiB
		
	
	
	
		
			SCSS
		
	
	
	
	
	
			
		
		
	
	
			53 lines
		
	
	
		
			1.1 KiB
		
	
	
	
		
			SCSS
		
	
	
	
	
	
/**
 | 
						|
    The essential.scss defines proerties that
 | 
						|
    are essential for the basic features of an 
 | 
						|
    info card and are completely 
 | 
						|
*/
 | 
						|
.unselectable {
 | 
						|
    user-select: none;
 | 
						|
}
 | 
						|
 | 
						|
.info-card {
 | 
						|
    position: absolute;
 | 
						|
    user-select: none;
 | 
						|
}
 | 
						|
 | 
						|
.zoomable-wrapper {
 | 
						|
    display: inline-block;
 | 
						|
    align-self: center;
 | 
						|
 | 
						|
    figure {
 | 
						|
        // Is required that the zoomable tween works properly.
 | 
						|
        display: inline-block;
 | 
						|
    }
 | 
						|
 | 
						|
    // Problem with display-block is, that it produces spaces
 | 
						|
    // when elements contain a linebreak. Setting the font-size
 | 
						|
    // to 0 prevents that.
 | 
						|
    font-size: 0;
 | 
						|
 | 
						|
    figcaption {
 | 
						|
        font-size: initial;
 | 
						|
    }
 | 
						|
 | 
						|
    //Discuss: There is a weird div that needs to be scaled
 | 
						|
    // alongside. Maybe this introduces the jittering of the graphic.
 | 
						|
    // Try to get rid of it
 | 
						|
    // - SO
 | 
						|
    & > figure > div {
 | 
						|
        height: 100%;
 | 
						|
    }
 | 
						|
 | 
						|
    svg {
 | 
						|
        overflow: visible;
 | 
						|
        width: 100%;
 | 
						|
        height: 100%;
 | 
						|
    }
 | 
						|
}
 | 
						|
 | 
						|
div {
 | 
						|
    // Resets a weird styling, when certain elements
 | 
						|
    // are (long) clicked on using a touch screen.
 | 
						|
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 | 
						|
}
 |