User:Inutt/Scratchpad - Revision history

Inutt: Test note css

2019-11-27T22:43:40Z

Test note css

@@ Line 1: / Line 1: @@
 = Notes =
-<css>
+{{Note
-div.note {
+| Icon = Lore
-    position: relative;
+| Content = This is a lore note, for noting things about the game's background and IC (in-character) history.
-    min-height: 3.1em;
+}}

2019-10-31T16:33:22Z

Add opacity filter to note icon

← Older revision		Revision as of 16:33, 31 October 2019
Line 16:		Line 16:
	top: 0.6em;		top: 0.6em;
	transform: translatex(-50%);		transform: translatex(-50%);
			opacity: 60%
	}		}
	</css>		</css>

	<div class="note" style="margin:0.5em 5em;padding:0.1em 1em 0.1em 4em;border:1px solid #8d8d8d;border-radius:0.5em;background-color:#efefef">		<div class="note" style="margin:0.5em 5em;padding:0.1em 1em 0.1em 4em;border:1px solid #8d8d8d;border-radius:0.5em;background-color:#efefef">
	[[File:icon_note.png\|frameless\|link=]]		[[File:icon_note.png\|frameless\|link=]]

2019-10-31T16:30:22Z

Move note CSS in from local override

@@ Line 1: / Line 1: @@
 = Notes =
 <div class="note" style="margin:0.5em 5em;padding:0.1em 1em 0.1em 4em;border:1px solid #8d8d8d;border-radius:0.5em;background-color:#efefef">
 [[File:icon_note.png|frameless|link=]]

2019-10-31T16:26:08Z

Note development

← Older revision		Revision as of 16:26, 31 October 2019
Line 1:		Line 1:
			= Notes =

	<div class="note" style="margin:0.5em 5em;padding:0.1em 1em 0.1em 4em;border:1px solid #8d8d8d;border-radius:0.5em;background-color:#efefef">		<div class="note" style="margin:0.5em 5em;padding:0.1em 1em 0.1em 4em;border:1px solid #8d8d8d;border-radius:0.5em;background-color:#efefef">
	[[File:icon_note.png\|frameless~~\|32px~~\|link=]]		[[File:icon_note.png\|frameless\|link=]]
	Some contents		Some contents that fgo longer wirkd fribble no noe that asdf l ghoo owejkal j eueuja alsldkjf as s dlldkfkj jfkd;a;lk ojalsdfasl; fasl;d a;sldas;ldkjflsdkh dfkgh sdklgh sdkljhg sdklhg skldfhglsdkfh glsdkfhsd hlsdgkls dfghds fkjsdh fklsdfklsdklfh slkdfjghskldfgh lksdfhglskd fghslkd fhgskldflsdfksdklsdkl ghskld slgh dfkl ghsdkl gskld gskl fl skldf hsgkl sfkl gsklgh klsdskl lkgh slgh sdklhgskh sdfkl gsldk flks glsd hgsldkgh lskd hfsdkl gskldh gskld hgklsdh gklsdh klsd hlksdgklsd fgklsdhglsdlkgskld hgsdklgh skldh gksldfhgklsd
	</div>		</div>


	= Complex overlay testing =		= Complex overlay testing =

2019-10-31T04:20:59Z

Add note experiment

← Older revision		Revision as of 04:20, 31 October 2019
Line 1:		Line 1:
			<div class="note" style="margin:0.5em 5em;padding:0.1em 1em 0.1em 4em;border:1px solid #8d8d8d;border-radius:0.5em;background-color:#efefef">
			[[File:icon_note.png\|frameless\|32px\|link=]]
			Some contents
			</div>

	= Complex overlay testing =		= Complex overlay testing =
	<css>		<css>

2019-06-05T07:31:24Z

Fiddling with overlay stuff

@@ Line 35: / Line 35: @@
    </div><div class="label-outer right">
      <div class="label right">Right Text label</div>
    </div>
 </div>

2018-11-04T00:29:41Z

← Older revision		Revision as of 00:29, 4 November 2018
Line 23:		Line 23:
	font-size: initial;		font-size: initial;
	background: transparent;		background: transparent;
	~~border: 1px dashed red;~~
	}		}
	div.label-outer.left { right: 7em; flex-direction: row-reverse; }		div.label-outer.left { right: 7em; flex-direction: row-reverse; }
Line 31:		Line 30:
	<div class="area">		<div class="area">

	<div style="display:inline-block;width:2em;height:2em;box-sizing:border-box;border:1px solid ~~green~~;border-radius:0.6em">		<div style="display:inline-block;width:2em;height:2em;box-sizing:border-box;background:rgba(0,153,0,0.57);border:1px solid rgb(0,153,0);border-radius:0.6em">
	<div class="label-outer left">		<div class="label-outer left">
	<div class="label left">Left Text label</div>		<div class="label left">Left Text label</div>

2018-11-04T00:26:00Z

← Older revision		Revision as of 00:26, 4 November 2018
Line 14:		Line 14:
	background: rgba(0,0,153,0.57);		background: rgba(0,0,153,0.57);
	}		}
	div.label.left { ~~flex-direction: row-reverse;~~ }		div.label.left { }
	div.label.right { }		div.label.right { }
	div.label-outer {		div.label-outer {
Line 25:		Line 25:
	border: 1px dashed red;		border: 1px dashed red;
	}		}
	div.label-outer.left { right: 7em; }		div.label-outer.left { right: 7em; flex-direction: row-reverse; }
	div.label-outer.right { left: 1em; }		div.label-outer.right { left: 1em; }
	</css>		</css>

2018-11-04T00:25:05Z

← Older revision		Revision as of 00:25, 4 November 2018
Line 5:		Line 5:
	display: block;		display: block;
	box-sizing: border-box;		box-sizing: border-box;
	~~position: relative;~~
	width: max-content;		width: max-content;
	border-radius: 0.6em;		border-radius: 0.6em;
Line 15:		Line 14:
	background: rgba(0,0,153,0.57);		background: rgba(0,0,153,0.57);
	}		}
	div.label.left { flex-direction:row-reverse; }		div.label.left { flex-direction: row-reverse; }
	div.label.right { }		div.label.right { }
	div.label-outer {		div.label-outer {

2018-11-04T00:23:56Z

← Older revision		Revision as of 00:23, 4 November 2018
Line 15:		Line 15:
	background: rgba(0,0,153,0.57);		background: rgba(0,0,153,0.57);
	}		}
	div.label.left { ~~float:right;~~ flex-direction:row-reverse; }		div.label.left { flex-direction:row-reverse; }
	div.label.right { ~~float:left;~~ }		div.label.right { }
	div.label-outer {		div.label-outer {
	display: flex;		display: flex;