MediaWiki:Common.less/oswf.less

From Old School RuneScape Wiki
Jump to: navigation, search
.oswf-page-container {
    width: 100%;
    border-radius: .5em;
    max-width: 80rem;
    margin-left: auto;
    margin-right: auto;
    border: 1px solid @mystic;
    background: @white;
    box-shadow: @box-shadow;
    
    .mw-headline-underline {
    	display: none;
    }
    
    .oswf-tile {
    	max-width: 35em;
    	padding: 0;
    	border-color: @la-palma;
    	
    	&.oswf-tile-complete {
    		order: 10;
    		border-color: @old-brick;
    		
    		.oswf-tile-banner {
	    		background: @old-brick;
    		}
    		
    		.oswf-tile-content {
    			opacity: 0.5;
    		}
    	}
	
		.oswf-tile-banner {
		    padding: .5em 2em;
		    background: @la-palma;
		    color: @white;
		}
		
		.oswf-tile-content {
			padding: 1.5em 2em 1.5em;
		}
    }
}

.oswf-section-header {
    padding: .25em 2em;
    background: @gallery;
    display: flex;
    flex-direction: row;
    align-items: center;
    border-top: 1px solid @base-heading-border;
    border-bottom: 1px solid @base-heading-border;
    justify-content: space-between;
    
    h2, h5 {
    	padding: 0;
    	margin: .3em 0;
    }

    &.oswf-page-header {
        background: @ecstasy;
        border-radius: .5em .5em 0 0;
        border: none;
        
		h2, h5 {
        	color: @white;
        	padding: 0;
    		margin: .5em 0;
    	}
    }
}

.oswf-page-section {
    padding: 1em 2em;
    
    p:last-child,
    &.rules-section ul {
    	margin-bottom: 0;
    }
}

.oswf-page-quicklinks {
    padding: 0 2em;
    background: @black-haze;
    display: flex;
    flex-direction: row;
    align-items: center;
    border-bottom: 1px solid @base-heading-border;

    .oswf-page-quicklinks-col {
        padding: .5em 1em .5em 0;
        border-right: 1px solid @base-heading-border;
        
        p, h5 {
        	margin: 0;
        	padding: 0;
        }

        &:not(:first-child) {
            padding-left: 1em;
        }

        &.oswf-ql-discord {
            background: #5865F2;

            a, h5 {
                color: @white;
            }
            
            img {
            	margin-right: .3em;
            }
        }
    }
}

.oswf-text-primary {
    color: @ecstasy;
}