mirror of
				https://github.com/superseriousbusiness/gotosocial.git
				synced 2025-11-02 20:02:25 -06:00 
			
		
		
		
	* Add login button to index page which reiterates info about clients * bit of CSS fiddling, move apps from front page to login info * fix indentation --------- Co-authored-by: tobi <tobi.smethurst@protonmail.com>
		
			
				
	
	
		
			143 lines
		
	
	
	
		
			2.5 KiB
		
	
	
	
		
			CSS
		
	
	
	
	
	
			
		
		
	
	
			143 lines
		
	
	
	
		
			2.5 KiB
		
	
	
	
		
			CSS
		
	
	
	
	
	
/*
 | 
						|
	GoToSocial
 | 
						|
	Copyright (C) GoToSocial Authors admin@gotosocial.org
 | 
						|
	SPDX-License-Identifier: AGPL-3.0-or-later
 | 
						|
 | 
						|
	This program is free software: you can redistribute it and/or modify
 | 
						|
	it under the terms of the GNU Affero General Public License as published by
 | 
						|
	the Free Software Foundation, either version 3 of the License, or
 | 
						|
	(at your option) any later version.
 | 
						|
 | 
						|
	This program is distributed in the hope that it will be useful,
 | 
						|
	but WITHOUT ANY WARRANTY; without even the implied warranty of
 | 
						|
	MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 | 
						|
	GNU Affero General Public License for more details.
 | 
						|
 | 
						|
	You should have received a copy of the GNU Affero General Public License
 | 
						|
	along with this program.  If not, see <http://www.gnu.org/licenses/>.
 | 
						|
*/
 | 
						|
 | 
						|
.page {
 | 
						|
	display: grid;
 | 
						|
	min-height: 100vh;
 | 
						|
 | 
						|
	grid-template-columns: 1fr minmax(auto, 50rem) 1fr;
 | 
						|
	grid-template-columns: 1fr min(92%, 50rem) 1fr;
 | 
						|
	grid-template-rows: auto 1fr auto;
 | 
						|
}
 | 
						|
 | 
						|
.page-header, .page-footer {
 | 
						|
	grid-column: 1 / span 3;
 | 
						|
}
 | 
						|
 | 
						|
.page-content {
 | 
						|
	grid-column: 2;
 | 
						|
	align-self: start;
 | 
						|
}
 | 
						|
 | 
						|
.page-header {
 | 
						|
	display: flex;
 | 
						|
	flex-direction: column;
 | 
						|
	justify-content: center;
 | 
						|
	padding: 1.5rem;
 | 
						|
	gap: 1rem;
 | 
						|
 | 
						|
	.trusted-proxies-rec {
 | 
						|
		color: $info-fg;
 | 
						|
		background: $info-bg;
 | 
						|
		max-width: fit-content;
 | 
						|
		padding-left: 1rem;
 | 
						|
		padding-right: 1rem;
 | 
						|
		border-radius: $br;
 | 
						|
		text-align: center;
 | 
						|
		align-self: center;
 | 
						|
 | 
						|
		code {
 | 
						|
			background: $info-bg;
 | 
						|
		}
 | 
						|
 | 
						|
		a {
 | 
						|
			color: $info-fg;
 | 
						|
		}
 | 
						|
	}
 | 
						|
 | 
						|
	& > a {
 | 
						|
		display: flex;
 | 
						|
		flex-wrap: wrap;
 | 
						|
		gap: 1rem;
 | 
						|
		justify-content: center;
 | 
						|
 | 
						|
		img,
 | 
						|
		picture {
 | 
						|
			align-self: center;
 | 
						|
			
 | 
						|
			/*
 | 
						|
				Shrink too-wide / too-tall instance
 | 
						|
				icons to sensible proportions. Allow
 | 
						|
				pretty wide images but prevent things
 | 
						|
				getting too out of hand + looking bad.
 | 
						|
			*/
 | 
						|
			max-height: 4rem;
 | 
						|
			max-width: 16rem;
 | 
						|
		}
 | 
						|
 | 
						|
		h1 {
 | 
						|
			align-self: center;
 | 
						|
			text-align: center;
 | 
						|
	
 | 
						|
			font-size: 1.5rem;
 | 
						|
			line-height: 1.5rem;
 | 
						|
			word-wrap: anywhere;
 | 
						|
			color: $fg;
 | 
						|
		}
 | 
						|
	}
 | 
						|
 | 
						|
	aside {
 | 
						|
		margin: 0;
 | 
						|
		font-style: italic;
 | 
						|
		font-weight: normal;
 | 
						|
		text-align: center;
 | 
						|
		font-size: 1.2rem;
 | 
						|
	
 | 
						|
		.count {
 | 
						|
			font-weight: bold;
 | 
						|
			color: $fg-accent;
 | 
						|
		}
 | 
						|
	}
 | 
						|
}
 | 
						|
 | 
						|
.page-footer {
 | 
						|
	align-self: end;
 | 
						|
 | 
						|
	nav ul {
 | 
						|
		display: flex;
 | 
						|
		flex-wrap: wrap;
 | 
						|
		justify-content: space-around;
 | 
						|
		
 | 
						|
		/* Override list styling */
 | 
						|
		list-style-type: none;
 | 
						|
		padding-left: 0;
 | 
						|
 | 
						|
		li {
 | 
						|
			text-align: center;
 | 
						|
			padding: 1rem;
 | 
						|
			flex-grow: 1;
 | 
						|
 | 
						|
			a {
 | 
						|
				font-weight: bold;
 | 
						|
			}
 | 
						|
		}
 | 
						|
	}
 | 
						|
}
 | 
						|
 | 
						|
@media screen and (max-width: 600px) {
 | 
						|
	.page-header {
 | 
						|
		text-align: center;
 | 
						|
	}
 | 
						|
}
 | 
						|
 | 
						|
.login {
 | 
						|
	position: absolute;
 | 
						|
	top: 2vh;
 | 
						|
	right: 2vh;
 | 
						|
}
 |