MediaWiki:Common.css - Revision history

Willow: thanks claude

2026-06-15T23:47:02Z

thanks claude

Show changes

Willow: dungeon page changes

2026-06-12T14:57:01Z

dungeon page changes

Show changes

Willow at 13:32, 12 June 2026

2026-06-12T13:32:07Z

Show changes

Willow: test

2026-06-12T12:28:54Z

test

Show changes

Willow at 14:28, 1 January 2026

2026-01-01T14:28:05Z

← Older revision		Revision as of 14:28, 1 January 2026
Line 35:		Line 35:
	* Sound *		* Sound *
	******************************/		******************************/
	.sound-button,		.sound-button,.sound-button a,.sound-button a.image,.sound-button img {
	.sound-button a,
	.sound-button a.image,
	.sound-button img {
	background: none !important;		background: none !important;
	background-color: transparent !important;		background-color: transparent !important;
Line 46:		Line 43:
	text-decoration: none !important;		text-decoration: none !important;
	padding: 0 !important;		padding: 0 !important;
	margin: 0 !important;		margin: 0 !important
	}

	~~.sound-button {~~
	~~cursor: pointer;~~
	~~display: inline-flex;~~
	~~align-items: center;~~
	~~justify-content: center;~~
	~~vertical-align: middle;~~
	~~margin: 0 4px !important;~~
	}		}

Line 61:		Line 49:
	filter: invert(93%) sepia(5%) saturate(782%) hue-rotate(151deg) brightness(96%) contrast(89%);		filter: invert(93%) sepia(5%) saturate(782%) hue-rotate(151deg) brightness(96%) contrast(89%);
	transition: filter 0.2s ease-in-out;		transition: filter 0.2s ease-in-out;
	~~/* This ensures only the icon shape is seen */~~
	display: inline-block !important;		display: inline-block !important;
	vertical-align: middle;		vertical-align: middle;
			margin: 0 !important;
	}		}

	.sound-button:~~hover img,~~		.sound-button {
	~~.sound~~-~~button.playing img {~~		cursor: pointer;
	~~filter~~: ~~invert(93%) sepia(5%) saturate(782%) hue~~-~~rotate(151deg) brightness(115%) contrast(100%)~~		display: inline-block !important;
	~~drop~~-~~shadow(0 0 2px rgba(201, 225, 230, 0.7))~~;		vertical-align: middle;
			margin: 0 2px !important;
			line-height: 1;
			white-space: nowrap;
	}		}

	.sound-button a:hover,		.sound-button:hover img,.sound-button.playing img {
	.sound-button a:focus {		filter: invert(93%) sepia(5%) saturate(782%) hue-rotate(151deg) brightness(115%) contrast(100%) drop-shadow(0 0 2px rgba(201,225,230,0.7))
			}

			.sound-button a:hover,.sound-button a:focus {
	background: none !important;		background: none !important;
	border: none !important;		border: none !important
	}		}
	/*****************************		/*****************************

Willow at 14:23, 1 January 2026

2026-01-01T14:23:16Z

← Older revision		Revision as of 14:23, 1 January 2026
Line 62:		Line 62:
	transition: filter 0.2s ease-in-out;		transition: filter 0.2s ease-in-out;
	/* This ensures only the icon shape is seen */		/* This ensures only the icon shape is seen */
	display: block !important;		display: inline-block !important;
			vertical-align: middle;
	}		}

Willow: more mobile stuff

2026-01-01T13:12:52Z

more mobile stuff

@@ Line 3,894: / Line 3,894: @@
      .mp-box h2 { font-size: 1.5em !important; padding: 0.2em 0 !important; }
      .mp-box .welcome-message { font-size: 1.3em !important; padding: 0.4em !important; }
      .druid-infobox .druid-title { font-size: 1.3em !important; min-height: auto !important; }
      a.tabber__tab { font-size: 1.1em !important; }
@@ Line 4,036: / Line 4,035: @@
          padding: 10px 5px !important;
+     }
+}

Willow: mobile fixes (by SublimeText.Mediawiker)

2025-12-31T15:29:20Z

mobile fixes (by SublimeText.Mediawiker)

Show changes

Willow at 12:54, 31 December 2025

2025-12-31T12:54:47Z

← Older revision		Revision as of 12:54, 31 December 2025
Line 35:		Line 35:
	* Sound *		* Sound *
	******************************/		******************************/
			.sound-button,
			.sound-button a,
			.sound-button a.image,
			.sound-button img {
			background: none !important;
			background-color: transparent !important;
			border: none !important;
			outline: none !important;
			box-shadow: none !important;
			text-decoration: none !important;
			padding: 0 !important;
			margin: 0 !important;
			}

	.sound-button {		.sound-button {
	cursor: pointer;		cursor: pointer;
Line 40:		Line 54:
	align-items: center;		align-items: center;
	justify-content: center;		justify-content: center;
	~~padding: 3px;~~
	~~border-radius: 4px;~~
	~~transition: all 0.3s ease;~~
	vertical-align: middle;		vertical-align: middle;
			margin: 0 4px !important;
	}		}

	.sound-button img {		.sound-button img {
	filter: invert(93%) sepia(5%) saturate(782%) hue-rotate(151deg) brightness(96%) contrast(89%);		filter: invert(93%) sepia(5%) saturate(782%) hue-rotate(151deg) brightness(96%) contrast(89%);
	transition: filter 0.3s ease;		transition: filter 0.2s ease-in-out;
			/* This ensures only the icon shape is seen */
			display: block !important;
	}		}

	.sound-button:hover img,		.sound-button:hover img,
	.sound-button.playing img {		.sound-button.playing img {
	filter: invert(93%) sepia(5%) saturate(782%) hue-rotate(151deg) brightness(~~105~~%) contrast(89%)		filter: invert(93%) sepia(5%) saturate(782%) hue-rotate(151deg) brightness(115%) contrast(100%)
	drop-shadow(0 0 ~~3px #c9e1e6)~~		drop-shadow(0 0 2px rgba(201, 225, 230, 0.7));
	~~drop-shadow(0 0 6px~~ rgba(201, 225, 230, 0.6));
	}

	~~.sound-button:hover,~~
	~~.sound-button.playing {~~
	~~background: rgba(201, 225, 230, 0.1~~);
	}		}

	.sound-button a.~~image~~ {		.sound-button a:hover,
	~~pointer-events~~: none !important;		.sound-button a:focus {
			background: none !important;
			border: none !important;
	}		}
	/*****************************		/*****************************

Willow: test

2025-12-31T12:49:42Z

test

← Older revision		Revision as of 12:49, 31 December 2025
Line 35:		Line 35:
	* Sound *		* Sound *
	******************************/		******************************/
	~~/* Container Setup */~~
	.sound-button {		.sound-button {
	cursor: pointer;		cursor: pointer;
Line 41:		Line 40:
	align-items: center;		align-items: center;
	justify-content: center;		justify-content: center;
	padding: ~~2px~~;		padding: 3px;
	border-radius: 4px;		border-radius: 4px;
	transition: all 0.2s ease;		transition: all 0.3s ease;
	~~background~~: ~~rgba(0, 0, 0, 0.1);~~		vertical-align: middle;
	~~border: 1px solid transparent~~;
	}		}

	.sound-button~~:hover~~ {		.sound-button img {
	~~background~~: ~~rgba~~(~~255, 255, 255, 0.1~~);		filter: invert(93%) sepia(5%) saturate(782%) hue-rotate(151deg) brightness(96%) contrast(89%);
	~~border-color~~: ~~#D3D3D3~~;		transition: filter 0.3s ease;
	}		}

	.sound-~~icon-playing {~~		.sound-button:hover img,
	~~display~~: ~~none;~~		.sound-button.playing img {
	}		filter: invert(93%) sepia(5%) saturate(782%) hue-rotate(151deg) brightness(105%) contrast(89%)
			drop-shadow(0 0 3px #c9e1e6)
	.sound-button.playing ~~.sound-icon-static~~ {		drop-shadow(0 0 6px rgba(201, 225, 230, 0.6));
	~~display~~: ~~none;~~
	}

	~~.sound~~-~~button~~.~~playing .sound-icon-playing {~~
	~~display: inline-block~~;
	}		}

			.sound-button:hover,
	.sound-button.playing {		.sound-button.playing {
	background: rgba(93, ~~190~~, ~~255~~, 0.2);		background: rgba(201, 225, 230, 0.1);
	}		}