aboutsummaryrefslogtreecommitdiffstats
path: root/src/app.css
diff options
context:
space:
mode:
authorAdam Soltys <[email protected]>2022-10-21 13:29:04 -0700
committerAdam Soltys <[email protected]>2022-10-21 13:29:52 -0700
commita005ef51ee46618a1875dee4559ccddfec41dfcd (patch)
treeea30cefa854f45160d88f01417a98707a26873a6 /src/app.css
parentdbf440fc4f553e1ac3d02c7941377a67ffb0cd8d (diff)
downloadcoinos-ui-a005ef51ee46618a1875dee4559ccddfec41dfcd.tar.gz
coinos-ui-a005ef51ee46618a1875dee4559ccddfec41dfcd.zip
move 2fa to separate step
Diffstat (limited to 'src/app.css')
0 files changed, 0 insertions, 0 deletions
highlight .cpf { color: #888 } /* Comment.PreprocFile */ .highlight .c1 { color: #888 } /* Comment.Single */ .highlight .cs { color: #C00; font-weight: bold; background-color: #FFF0F0 } /* Comment.Special */ .highlight .gd { color: #000; background-color: #FDD } /* Generic.Deleted */ .highlight .ge { font-style: italic } /* Generic.Emph */ .highlight .ges { font-weight: bold; font-style: italic } /* Generic.EmphStrong */ .highlight .gr { color: #A00 } /* Generic.Error */ .highlight .gh { color: #333 } /* Generic.Heading */ .highlight .gi { color: #000; background-color: #DFD } /* Generic.Inserted */ .highlight .go { color: #888 } /* Generic.Output */ .highlight .gp { color: #555 } /* Generic.Prompt */ .highlight .gs { font-weight: bold } /* Generic.Strong */ .highlight .gu { color: #666 } /* Generic.Subheading */ .highlight .gt { color: #A00 } /* Generic.Traceback */ .highlight .kc { color: #080; font-weight: bold } /* Keyword.Constant */ .highlight .kd { color: #080; font-weight: bold } /* Keyword.Declaration */ .highlight .kn { color: #080; font-weight: bold } /* Keyword.Namespace */ .highlight .kp { color: #080 } /* Keyword.Pseudo */ .highlight .kr { color: #080; font-weight: bold } /* Keyword.Reserved */ .highlight .kt { color: #888; font-weight: bold } /* Keyword.Type */ .highlight .m { color: #00D; font-weight: bold } /* Literal.Number */ .highlight .s { color: #D20; background-color: #FFF0F0 } /* Literal.String */ .highlight .na { color: #369 } /* Name.Attribute */ .highlight .nb { color: #038 } /* Name.Builtin */ .highlight .nc { color: #B06; font-weight: bold } /* Name.Class */ .highlight .no { color: #036; font-weight: bold } /* Name.Constant */ .highlight .nd { color: #555 } /* Name.Decorator */ .highlight .ne { color: #B06; font-weight: bold } /* Name.Exception */ .highlight .nf { color: #06B; font-weight: bold } /* Name.Function */ .highlight .nl { color: #369; font-style: italic } /* Name.Label */ .highlight .nn { color: #B06; font-weight: bold } /* Name.Namespace */ .highlight .py { color: #369; font-weight: bold } /* Name.Property */ .highlight .nt { color: #B06; font-weight: bold } /* Name.Tag */ .highlight .nv { color: #369 } /* Name.Variable */ .highlight .ow { color: #080 } /* Operator.Word */ .highlight .w { color: #BBB } /* Text.Whitespace */ .highlight .mb { color: #00D; font-weight: bold } /* Literal.Number.Bin */ .highlight .mf { color: #00D; font-weight: bold } /* Literal.Number.Float */ .highlight .mh { color: #00D; font-weight: bold } /* Literal.Number.Hex */ .highlight .mi { color: #00D; font-weight: bold } /* Literal.Number.Integer */ .highlight .mo { color: #00D; font-weight: bold } /* Literal.Number.Oct */ .highlight .sa { color: #D20; background-color: #FFF0F0 } /* Literal.String.Affix */ .highlight .sb { color: #D20; background-color: #FFF0F0 } /* Literal.String.Backtick */ .highlight .sc { color: #D20; background-color: #FFF0F0 } /* Literal.String.Char */ .highlight .dl { color: #D20; background-color: #FFF0F0 } /* Literal.String.Delimiter */ .highlight .sd { color: #D20; background-color: #FFF0F0 } /* Literal.String.Doc */ .highlight .s2 { color: #D20; background-color: #FFF0F0 } /* Literal.String.Double */ .highlight .se { color: #04D; background-color: #FFF0F0 } /* Literal.String.Escape */ .highlight .sh { color: #D20; background-color: #FFF0F0 } /* Literal.String.Heredoc */ .highlight .si { color: #33B; background-color: #FFF0F0 } /* Literal.String.Interpol */ .highlight .sx { color: #2B2; background-color: #F0FFF0 } /* Literal.String.Other */ .highlight .sr { color: #080; background-color: #FFF0FF } /* Literal.String.Regex */ .highlight .s1 { color: #D20; background-color: #FFF0F0 } /* Literal.String.Single */ .highlight .ss { color: #A60; background-color: #FFF0F0 } /* Literal.String.Symbol */ .highlight .bp { color: #038 } /* Name.Builtin.Pseudo */ .highlight .fm { color: #06B; font-weight: bold } /* Name.Function.Magic */ .highlight .vc { color: #369 } /* Name.Variable.Class */ .highlight .vg { color: #D70 } /* Name.Variable.Global */ .highlight .vi { color: #33B } /* Name.Variable.Instance */ .highlight .vm { color: #369 } /* Name.Variable.Magic */ .highlight .il { color: #00D; font-weight: bold } /* Literal.Number.Integer.Long */
<script>
	import { Avatar, Icon } from '$comp';
	export let event;

	let { id, user, seen, content } = event;

	let distance = (date) => {
		let m = 60;
		let h = 60 * m;
		let d = 24 * h;

		let diff = Math.round(Date.now() / 1000) - date;
		return diff > d
			? Math.round(diff / d) + 'd'
			: diff > h
			? Math.round(diff / h) + 'h'
			: diff > m
			? Math.round(diff / m) + 'm'
			: diff > 2
			? diff + 's'
			: 'now';
	};

	let w;
</script>

<svelte:window bind:innerWidth={w} />

<div class="flex text-sm lg:text-base text-secondary hover:bg-gray-100 px-4 py-3" :key={id}>
	<a href={`/${user.pubkey}`}>
		<div class="mb-auto mr-2">
			<div class="md:hidden">
				<Avatar size={12} {user} disabled={true} />
			</div>
			<div class="hidden md:block">
				<Avatar size={20} {user} disabled={true} />
			</div>
		</div>
	</a>

	<div class="grow" style={`max-width: ${w - 100}px`}>
		<div class="w-full flex pb-1 text-black pt-1">
			<div>
				{user.display_name || ''}
				<span class="text-secondary">@{user.username}</span>
			</div>
			<div class="text-secondary">&nbsp;{distance(seen)}</div>
		</div>
		<div class="break-words text-black">
			{content}
		</div>

		<div class="flex justify-between text-sm text-secondary pt-3">
			<div class="flex group">
				<Icon
					icon="party"
					style="mr-1 w-10 my-auto opacity-50 group-hover:opacity-100 group-hover:bg-white rounded-full p-2"
				/>
				<div class="my-auto group-hover:text-black">444</div>
			</div>
			<div class="flex group">
				<Icon
					icon="support"
					style="mr-1 w-10 my-auto opacity-50 group-hover:opacity-100 group-hover:bg-white rounded-full p-2"
				/>
				<div class="my-auto group-hover:text-black">1072</div>
			</div>
			<div class="flex group">
				<Icon
					icon="smile"
					style="mr-1 w-10 my-auto opacity-50 group-hover:opacity-100 group-hover:bg-white rounded-full p-2"
				/>
				<div class="my-auto group-hover:text-black">26</div>
			</div>
			<div class="flex group">
				<Icon
					icon="bolt"
					style="mr-1 h-10 my-auto opacity-50 group-hover:opacity-100 group-hover:bg-white rounded-full p-2"
				/>
				<div class="my-auto group-hover:text-black">4</div>
			</div>
		</div>
	</div>
</div>