MediaWiki:Common.less/messagebox.less

From Old School RuneScape Wiki
Jump to navigation Jump to search
/* Messageboxes */
:root {
    --messagebox-obsolete-background: #cfcfcf;
    --messagebox-obsolete-border: #464646;
    --messagebox-obsolete-color: #6c6c6c;
    --messagebox-info-background: #ebebeb;
    --messagebox-info-border: #898989;
    --messagebox-info-color: #6c6c6c;
    --messagebox-warn-background: #dfc0ba;
    --messagebox-warn-border: #861c10;
    --messagebox-warn-color: #8e221a;
    --messagebox-safe-background: #d8f0d3;
    --messagebox-safe-border: #1b8408;
    --messagebox-safe-color: #1b8408;
    --messagebox-disambig-background: #ebebeb;
    --messagebox-disambig-border: #898989;
    --messagebox-disambig-color: #6c6c6c;
    --messagebox-discord-background: @discord-bg;
    --messagebox-discord-border: @discord-bg-darker;
    --messagebox-discord-color: #d2e5fc;
}

.messagebox {
	color: var(--text-color);
	width: 65%;
	margin-left: auto;
	margin-right: auto;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
	border: 0;
	border-left: 15px solid @BODY_DARK;
	background-color: @BODY_LIGHT;
	padding: 0;

	&.obsolete {
		background-color: var(--messagebox-obsolete-background);
		border-color: var(--messagebox-obsolete-border);

		a,
		a:visited,
		a:active {
			color: var(--messagebox-obsolete-color);
		}
	}

	&.info {
		background-color: var(--messagebox-info-background);
		border-color: var(--messagebox-info-border);

		a,
		a:visited,
		a:active {
			color: var(--messagebox-info-color);
		}
	}

	&.action {
		background-color: @BODY_LIGHT;
		border-color: @BODY_BORDER;

		a,
		a:visited,
		a:active {
			color: @LINK_COLOR;
		}
	}

	&.file {
		background-color: @BODY_LIGHT;
		border-color: @BODY_BORDER;

		a,
		a:visited,
		a:active {
			color: @LINK_COLOR;
		}
	}

	&.warn {
        background-color: var(--messagebox-warn-background);
        border-color: var(--messagebox-warn-border);

        a,
        a:visited,
        a:active {
            color: var(--messagebox-warn-color);
        }

    }
    
    &.safe {
        background-color: var(--messagebox-safe-background);
        border-color: var(--messagebox-safe-border);

        a,
        a:visited,
        a:active {
            color: var(--messagebox-safe-color);
        }
    }

	&.disambig {
		background-color: var(--messagebox-disambig-background);
		border-color: var(--messagebox-disambig-border);

		a,
		a:visited,
		a:active {
			color: var(--messagebox-disambig-color);
		}
	}

	&.discord {
		background-color: var(--messagebox-discord-background);
		border-color: var(--messagebox-discord-border);
		color: white;
		
		a,
		a:visited,
		a:active {
			color: var(--messagebox-discord-color);
			
			&.external.text {				// Links to the discord
				color: var(--messagebox-discord-color);
				font-style: italic;
			}
		}
	}

	&.stub {
		width: 40%;
	}

	&.hasdialogue {
		padding: 0 10px;
		width: auto;
	}
}