* Redesign the landing page, mount public timeline on it * Adjust the standalone mounted component to the lacking of router * Adjust auth layout pages to new design * Fix tests * Standalone public timeline polling every 5 seconds * Remove now obsolete translations * Add responsive design for new landing page * Address reviews * Add floating clouds behind frontpage form * Use access token from public page when available * Fix mentions and hashtags links, cursor on status content in standalone mode * Add footer link to source code * Fix errors on pages that don't embed the component, use classnames * Fix tests * Change anonymous autoPlayGif default to false * When gif autoplay is disabled, hover to play * Add option to hide the timeline preview * Slightly improve alt layout * Add elephant friend to new frontpage * Display "back to mastodon" in place of "login" when logged in on frontpage * Change polling time to 3s
		
			
				
	
	
		
			86 lines
		
	
	
		
			1.9 KiB
		
	
	
	
		
			SCSS
		
	
	
	
	
	
			
		
		
	
	
			86 lines
		
	
	
		
			1.9 KiB
		
	
	
	
		
			SCSS
		
	
	
	
	
	
| body {
 | |
|   font-family: 'mastodon-font-sans-serif', sans-serif;
 | |
|   background: $ui-base-color;
 | |
|   background-size: cover;
 | |
|   background-attachment: fixed;
 | |
|   font-size: 13px;
 | |
|   line-height: 18px;
 | |
|   font-weight: 400;
 | |
|   color: $primary-text-color;
 | |
|   padding-bottom: 140px;
 | |
|   text-rendering: optimizelegibility;
 | |
|   font-feature-settings: "kern";
 | |
|   text-size-adjust: none;
 | |
|   -webkit-tap-highlight-color: rgba(0,0,0,0);
 | |
|   -webkit-tap-highlight-color: transparent;
 | |
| 
 | |
|   &.app-body {
 | |
|     position: fixed;
 | |
|     width: 100%;
 | |
|     height: 100%;
 | |
|     padding: 0;
 | |
|     background: $ui-base-color;
 | |
|   }
 | |
| 
 | |
|   &.about-body {
 | |
|     background: darken($ui-base-color, 8%);
 | |
|     padding-bottom: 0;
 | |
|   }
 | |
| 
 | |
|   &.embed {
 | |
|     background: transparent;
 | |
|     margin: 0;
 | |
| 
 | |
|     .container {
 | |
|       position: absolute;
 | |
|       width: 100%;
 | |
|       height: 100%;
 | |
|       overflow: hidden;
 | |
|     }
 | |
|   }
 | |
| 
 | |
|   &.admin {
 | |
|     background: darken($ui-base-color, 4%);
 | |
|     position: fixed;
 | |
|     width: 100%;
 | |
|     height: 100%;
 | |
|     padding: 0;
 | |
|   }
 | |
| 
 | |
|   @media screen and (max-width: 360px) {
 | |
|     padding-bottom: 0;
 | |
|   }
 | |
| }
 | |
| 
 | |
| button {
 | |
|   font-family: inherit;
 | |
|   cursor: pointer;
 | |
| 
 | |
|   &:focus {
 | |
|     outline: none;
 | |
|   }
 | |
| }
 | |
| 
 | |
| .app-holder {
 | |
|   display: flex;
 | |
|   width: 100%;
 | |
|   height: 100%;
 | |
|   align-items: center;
 | |
|   justify-content: center;
 | |
| }
 | |
| 
 | |
| .system-font {
 | |
|   // system-ui => standard property (Chrome/Android WebView 56+, Opera 43+, Safari 11+)
 | |
|   // -apple-system => Safari <11 specific
 | |
|   // BlinkMacSystemFont => Chrome <56 on macOS specific
 | |
|   // Segoe UI => Windows 7/8/10
 | |
|   // Oxygen => KDE
 | |
|   // Ubuntu => Unity/Ubuntu
 | |
|   // Cantarell => GNOME
 | |
|   // Fira Sans => Firefox OS
 | |
|   // Droid Sans => Older Androids (<4.0)
 | |
|   // Helvetica Neue => Older macOS <10.11
 | |
|   // mastodon-font-sans-serif => web-font (Roboto) fallback and newer Androids (>=4.0)
 | |
|   font-family: system-ui, -apple-system,BlinkMacSystemFont, "Segoe UI","Oxygen", "Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",mastodon-font-sans-serif, sans-serif;
 | |
| }
 |