mirror of
https://git.joinsharkey.org/Sharkey/Sharkey.git
synced 2024-11-26 01:43:09 +02:00
ae5d052274
to keep things manageable i merged a lot of one off values into just a handful of common sizes, so some parts of the ui will look different than upstream even with the "Misskey" rounding mode
59 lines
1.2 KiB
Vue
59 lines
1.2 KiB
Vue
<!--
|
|
SPDX-FileCopyrightText: syuilo and other misskey contributors
|
|
SPDX-License-Identifier: AGPL-3.0-only
|
|
-->
|
|
|
|
<template>
|
|
<div :class="$style.root">
|
|
<input v-model="query" :class="$style.input" type="search" :placeholder="q">
|
|
<button :class="$style.button" @click="search"><i class="ph-magnifying-glass ph-bold ph-lg"></i> {{ i18n.ts.searchByGoogle }}</button>
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import { ref } from 'vue';
|
|
import { i18n } from '@/i18n.js';
|
|
|
|
const props = defineProps<{
|
|
q: string;
|
|
}>();
|
|
|
|
const query = ref(props.q);
|
|
|
|
const search = () => {
|
|
const sp = new URLSearchParams();
|
|
sp.append('q', query.value);
|
|
window.open(`https://www.google.com/search?${sp.toString()}`, '_blank');
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss" module>
|
|
.root {
|
|
display: flex;
|
|
margin: 8px 0;
|
|
}
|
|
|
|
.input {
|
|
flex-shrink: 1;
|
|
padding: 10px;
|
|
width: 100%;
|
|
height: 40px;
|
|
font-size: 16px;
|
|
border: solid 1px var(--divider);
|
|
border-radius: var(--radius-xs) 0 0 var(--radius-xs);
|
|
-webkit-appearance: textfield;
|
|
}
|
|
|
|
.button {
|
|
flex-shrink: 0;
|
|
margin: 0;
|
|
padding: 0 16px;
|
|
border: solid 1px var(--divider);
|
|
border-left: none;
|
|
border-radius: 0 var(--radius-xs) var(--radius-xs) 0;
|
|
|
|
&:active {
|
|
box-shadow: 0 2px 4px rgba(#000, 0.15) inset;
|
|
}
|
|
}
|
|
</style>
|