User:FlamingMojo/vector.css: Difference between revisions

From Dune: Awakening Community Wiki
Jump to navigation Jump to search
(Add WIP personal CSS)
 
m (Add text color)
Line 14: Line 14:


body {
body {
     background: var(--color-background-base);
     background: var(--color-background-base);
    color: var(--color-text-main);
}
}



Revision as of 13:11, 22 March 2024

/** ResourceLoaderSkinModule: normalize,elements,content-tables,content-links,content-media,interface-message-box,interface-category,toc */

:root {
    --color-background-base: rgb( 214 ,177 , 109 );
    --color-background-main: rgb(26,7,0);
    --color-text-main: #F4CF8B;
    --color-button-text: #F4CF8B;
    --color-button-border: #F4CF8B;
    --color-button-border-hover: #F4CF8B;
    --color-button-background: transparent;
    --color-button-background-hover: rgba(49, 28, 54, 0.65);
}


body {
    background: var(--color-background-base);
    color: var(--color-text-main);
}

body,
h1,
h2,
h3,
h4,
h5,
h6 {
	color: @color-base;
}

a {
	color: @color-link;

	&:visited {
		color: @color-link--visited;
	}
}

/** HEADER */

#mw-head {
    background: var(--color-background-base);
}

/** CONTENT */

#content {
    background: var(--color-background-main);
	&__header {
		position: relative;
	}

	&__heading {
		padding: 0 50px 0 0;
		margin: 0;
		border-bottom: 0;
		float: left;
	}

	&__language-btn {
		float: right;
	}

	&__indicators {
		position: absolute;
		top: 10px;
		right: 0;
	}

	&__tagline {
		clear: both;
		color: @color-base;
		font-size: 0.85em;
		margin-bottom: 12px;
		line-height: 1;

		&:empty {
			display: none;
		}
	}

	&__actions {
		display: flex;
	}
}

/* The following rules will not be needed in future */
.mw-editsection {
	font-size: 0.85em;
	margin-left: 8px;
}

.messagebox {
	color: @color-base;
	background-color: @background-color-warning;
	border-color: @color-gray;

	a {
		color: @color-base;
		font-weight: bold;
	}
}

.thumbimage {
	background: transparent;
	border: 0;
}

.toc,
div.thumbinner {
	border-color: @color-gray;
	background-color: @background-color-thumb;
	color: @color-thumb;

	.toctogglelabel,
	a {
		color: @color-thumb;
	}
}