mirror of
				https://codeberg.org/yeentown/barkey.git
				synced 2025-11-04 07:24:13 +00:00 
			
		
		
		
	wip
This commit is contained in:
		
							parent
							
								
									e69ab45044
								
							
						
					
					
						commit
						def5ea7978
					
				
					 5 changed files with 10 additions and 5 deletions
				
			
		| 
						 | 
					@ -652,7 +652,7 @@ export default Vue.extend({
 | 
				
			||||||
	$header-height: 60px;
 | 
						$header-height: 60px;
 | 
				
			||||||
	$nav-width: 250px;
 | 
						$nav-width: 250px;
 | 
				
			||||||
	$nav-icon-only-width: 74px;
 | 
						$nav-icon-only-width: 74px;
 | 
				
			||||||
	$main-width: 700px;
 | 
						$main-width: 650px;
 | 
				
			||||||
	$ui-font-size: 1em;
 | 
						$ui-font-size: 1em;
 | 
				
			||||||
	$nav-icon-only-threshold: 1300px;
 | 
						$nav-icon-only-threshold: 1300px;
 | 
				
			||||||
	$nav-hide-threshold: 700px;
 | 
						$nav-hide-threshold: 700px;
 | 
				
			||||||
| 
						 | 
					@ -976,6 +976,7 @@ export default Vue.extend({
 | 
				
			||||||
			width: $main-width;
 | 
								width: $main-width;
 | 
				
			||||||
			min-width: $main-width;
 | 
								min-width: $main-width;
 | 
				
			||||||
			box-shadow: 1px 0 0 0 var(--divider), -1px 0 0 0 var(--divider);
 | 
								box-shadow: 1px 0 0 0 var(--divider), -1px 0 0 0 var(--divider);
 | 
				
			||||||
 | 
								background: var(--mainBg);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
			@media (max-width: $side-hide-threshold) {
 | 
								@media (max-width: $side-hide-threshold) {
 | 
				
			||||||
				min-width: 0;
 | 
									min-width: 0;
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -1,5 +1,5 @@
 | 
				
			||||||
<template>
 | 
					<template>
 | 
				
			||||||
<div class="wrpstxzv">
 | 
					<div class="wrpstxzv" v-size="[{ max: 450 }]">
 | 
				
			||||||
	<mk-avatar class="avatar" :user="note.user"/>
 | 
						<mk-avatar class="avatar" :user="note.user"/>
 | 
				
			||||||
	<div class="main">
 | 
						<div class="main">
 | 
				
			||||||
		<x-note-header class="header" :note="note" :mini="true"/>
 | 
							<x-note-header class="header" :note="note" :mini="true"/>
 | 
				
			||||||
| 
						 | 
					@ -61,7 +61,7 @@ export default Vue.extend({
 | 
				
			||||||
	padding: 16px 32px;
 | 
						padding: 16px 32px;
 | 
				
			||||||
	font-size: 0.9em;
 | 
						font-size: 0.9em;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	@media (max-width: 450px) {
 | 
						&.max-width_450px {
 | 
				
			||||||
		padding: 14px 16px;
 | 
							padding: 14px 16px;
 | 
				
			||||||
	}
 | 
						}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -2,7 +2,7 @@
 | 
				
			||||||
<div class="thvuemwp" :data-is-me="isMe">
 | 
					<div class="thvuemwp" :data-is-me="isMe">
 | 
				
			||||||
	<mk-avatar class="avatar" :user="message.user"/>
 | 
						<mk-avatar class="avatar" :user="message.user"/>
 | 
				
			||||||
	<div class="content">
 | 
						<div class="content">
 | 
				
			||||||
		<div class="balloon _panel" :data-no-text="message.text == null">
 | 
							<div class="balloon" :data-no-text="message.text == null">
 | 
				
			||||||
			<button class="delete-button" v-if="isMe" :title="$t('delete')" @click="del">
 | 
								<button class="delete-button" v-if="isMe" :title="$t('delete')" @click="del">
 | 
				
			||||||
				<img src="/assets/remove.png" alt="Delete"/>
 | 
									<img src="/assets/remove.png" alt="Delete"/>
 | 
				
			||||||
			</button>
 | 
								</button>
 | 
				
			||||||
| 
						 | 
					@ -243,6 +243,7 @@ export default Vue.extend({
 | 
				
			||||||
	}
 | 
						}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	&:not([data-is-me]) {
 | 
						&:not([data-is-me]) {
 | 
				
			||||||
 | 
							padding-left: var(--margin);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
		> .content {
 | 
							> .content {
 | 
				
			||||||
			padding-left: 16px;
 | 
								padding-left: 16px;
 | 
				
			||||||
| 
						 | 
					@ -279,6 +280,7 @@ export default Vue.extend({
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	&[data-is-me] {
 | 
						&[data-is-me] {
 | 
				
			||||||
		flex-direction: row-reverse;
 | 
							flex-direction: row-reverse;
 | 
				
			||||||
 | 
							padding-right: var(--margin);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
		> .content {
 | 
							> .content {
 | 
				
			||||||
			padding-right: 16px;
 | 
								padding-right: 16px;
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -17,9 +17,10 @@
 | 
				
			||||||
		fgHighlighted: ':lighten<3<@fg',
 | 
							fgHighlighted: ':lighten<3<@fg',
 | 
				
			||||||
		html: '@bg',
 | 
							html: '@bg',
 | 
				
			||||||
		indicator: '@accent',
 | 
							indicator: '@accent',
 | 
				
			||||||
		panel: '#111213',
 | 
							panel: '#000',
 | 
				
			||||||
		shadow: 'rgba(0, 0, 0, 0.1)',
 | 
							shadow: 'rgba(0, 0, 0, 0.1)',
 | 
				
			||||||
		header: 'rgba(20, 20, 20, 0.75)',
 | 
							header: 'rgba(20, 20, 20, 0.75)',
 | 
				
			||||||
 | 
							mainBg: ':lighten<3<@bg',
 | 
				
			||||||
		navBg: '@panel',
 | 
							navBg: '@panel',
 | 
				
			||||||
		navFg: '@fg',
 | 
							navFg: '@fg',
 | 
				
			||||||
		navHoverFg: ':lighten<17<@fg',
 | 
							navHoverFg: ':lighten<17<@fg',
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -20,6 +20,7 @@
 | 
				
			||||||
		panel: '#fff',
 | 
							panel: '#fff',
 | 
				
			||||||
		shadow: 'rgba(0, 0, 0, 0.1)',
 | 
							shadow: 'rgba(0, 0, 0, 0.1)',
 | 
				
			||||||
		header: 'rgba(255, 255, 255, 0.75)',
 | 
							header: 'rgba(255, 255, 255, 0.75)',
 | 
				
			||||||
 | 
							mainBg: '@bg',
 | 
				
			||||||
		navBg: '@panel',
 | 
							navBg: '@panel',
 | 
				
			||||||
		navFg: '@fg',
 | 
							navFg: '@fg',
 | 
				
			||||||
		navHoverFg: ':darken<17<@fg',
 | 
							navHoverFg: ':darken<17<@fg',
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
		Loading…
	
	Add table
		
		Reference in a new issue