mirror of
https://github.com/Ocelot-Social-Community/Ocelot-Social.git
synced 2026-04-02 23:55:33 +00:00
refactor(webapp): replace ds-icon with OsIcon and add missing svgs (#9429)
This commit is contained in:
GitHub
parent
7eb1bbdb3f
commit
d62abc524b
Binary file not shown.
|
Before Width: | Height: | Size: 78 KiB After Width: | Height: | Size: 82 KiB |
5
packages/ui/src/ocelot/icons/svgs/at.svg
Executable file
5
packages/ui/src/ocelot/icons/svgs/at.svg
Executable file
@ -0,0 +1,5 @@
|
||||
<!-- Generated by IcoMoon.io -->
|
||||
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
|
||||
<title>at</title>
|
||||
<path d="M16.188 4c6.337 0.093 11.62 5.29 11.813 11.625 0.005 0.143 0 0.274 0 0.406-0.012 3.289-2.716 5.97-6 5.969-1.271-0.001-2.391-0.628-3.125-1.563-0.827 0.948-2.027 1.563-3.375 1.563-2.473 0-4.5-2.027-4.5-4.5v-3c0-2.473 2.027-4.5 4.5-4.5 0.928 0 1.781 0.295 2.5 0.781v-0.781h2v8c0 1.116 0.883 1.999 2 2 2.208 0.001 3.992-1.766 4-3.969 0-0.122 0.003-0.231 0-0.344-0.16-5.253-4.589-9.61-9.844-9.688-6.165-0.090-11.048 5.348-10 11.719 0.696 4.234 4.182 7.613 8.438 8.188 2.919 0.394 5.61-0.452 7.656-2.094l1.25 1.563c-2.452 1.968-5.691 2.968-9.156 2.5-5.139-0.694-9.346-4.723-10.188-9.844-1.242-7.545 4.666-14.139 12.031-14.031zM15.5 12c-1.393 0-2.5 1.107-2.5 2.5v3c0 1.393 1.107 2.5 2.5 2.5s2.5-1.107 2.5-2.5v-3c0-1.393-1.107-2.5-2.5-2.5z"></path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 906 B |
5
packages/ui/src/ocelot/icons/svgs/envelope.svg
Executable file
5
packages/ui/src/ocelot/icons/svgs/envelope.svg
Executable file
@ -0,0 +1,5 @@
|
||||
<!-- Generated by IcoMoon.io -->
|
||||
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
|
||||
<title>envelope</title>
|
||||
<path d="M3 8h26v18h-26v-18zM7.313 10l8.688 5.781 8.688-5.781h-17.375zM5 10.875v13.125h22v-13.125l-10.438 6.969-0.563 0.344-0.563-0.344z"></path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 308 B |
5
packages/ui/src/ocelot/icons/svgs/paperclip.svg
Executable file
5
packages/ui/src/ocelot/icons/svgs/paperclip.svg
Executable file
@ -0,0 +1,5 @@
|
||||
<!-- Generated by IcoMoon.io -->
|
||||
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
|
||||
<title>paperclip</title>
|
||||
<path d="M21 4c1.39 0 2.789 0.539 3.844 1.594 2.109 2.109 2.109 5.547 0 7.656l-9.375 9.375c-1.246 1.245-3.286 1.245-4.531 0s-1.245-3.286 0-4.531l8.594-8.594 1.406 1.406-8.594 8.594c-0.481 0.481-0.481 1.237 0 1.719 0.481 0.481 1.237 0.481 1.719 0l9.375-9.375c1.345-1.345 1.345-3.499 0-4.844s-3.499-1.345-4.844 0l-9.375 9.375c-2.208 2.208-2.208 5.76 0 7.969 2.208 2.208 5.76 2.208 7.969 0l6.25-6.25 1.406 1.406-6.25 6.25c-2.973 2.972-7.809 2.972-10.781 0s-2.972-7.809 0-10.781l9.375-9.375c1.055-1.055 2.423-1.594 3.813-1.594z"></path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 696 B |
@ -4,12 +4,15 @@
|
||||
{{ label }}
|
||||
</label>
|
||||
<div class="ds-input-wrap">
|
||||
<div v-if="icon" class="ds-input-icon">
|
||||
<ds-icon :name="icon" />
|
||||
<div v-if="resolvedIcon" class="ds-input-icon">
|
||||
<os-icon :icon="resolvedIcon" />
|
||||
</div>
|
||||
<component
|
||||
class="ds-input"
|
||||
:class="[icon && 'ds-input-has-icon', iconRight && 'ds-input-has-icon-right']"
|
||||
:class="[
|
||||
resolvedIcon && 'ds-input-has-icon',
|
||||
resolvedIconRight && 'ds-input-has-icon-right',
|
||||
]"
|
||||
:id="id"
|
||||
:name="name ? name : model"
|
||||
:type="type"
|
||||
@ -25,8 +28,8 @@
|
||||
@blur="handleBlur"
|
||||
:rows="type === 'textarea' ? rows : null"
|
||||
/>
|
||||
<div v-if="iconRight" class="ds-input-icon-right">
|
||||
<ds-icon :name="iconRight" />
|
||||
<div v-if="resolvedIconRight" class="ds-input-icon-right">
|
||||
<os-icon :icon="resolvedIconRight" />
|
||||
</div>
|
||||
</div>
|
||||
<transition name="ds-input-error">
|
||||
@ -38,6 +41,8 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { OsIcon } from '@ocelot-social/ui'
|
||||
import { resolveIcon } from '~/utils/iconRegistry'
|
||||
import Schema from 'async-validator'
|
||||
|
||||
Schema.warning = function () {}
|
||||
@ -48,6 +53,7 @@ function getNestedValue(obj, path) {
|
||||
|
||||
export default {
|
||||
name: 'OcelotInput',
|
||||
components: { OsIcon },
|
||||
inject: {
|
||||
$parentForm: {
|
||||
default: null,
|
||||
@ -135,6 +141,12 @@ export default {
|
||||
}
|
||||
return 'input'
|
||||
},
|
||||
resolvedIcon() {
|
||||
return resolveIcon(this.icon)
|
||||
},
|
||||
resolvedIconRight() {
|
||||
return resolveIcon(this.iconRight)
|
||||
},
|
||||
stateClasses() {
|
||||
return [
|
||||
this.size && `ds-input-size-${this.size}`,
|
||||
|
||||
@ -41,16 +41,16 @@ exports[`Users given badges are disabled renders 1`] = `
|
||||
class="ds-input-icon"
|
||||
>
|
||||
<span
|
||||
aria-label="icon"
|
||||
class="ds-icon"
|
||||
aria-hidden="true"
|
||||
class="os-icon inline-flex items-center align-bottom shrink-0 h-[1.2em] [&>svg]:h-full [&>svg]:w-auto [&>svg]:fill-current"
|
||||
>
|
||||
<svg
|
||||
class="ds-icon-svg"
|
||||
fill="currentColor"
|
||||
viewBox="0 0 32 32"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M19 3c5.511 0 10 4.489 10 10s-4.489 10-10 10a9.923 9.923 0 01-6.313-2.25l-7.969 7.969-1.438-1.438 7.969-7.969a9.919 9.919 0 01-2.25-6.313c0-5.511 4.489-10 10-10zm0 2c-4.43 0-8 3.57-8 8s3.57 8 8 8 8-3.57 8-8-3.57-8-8-8z"
|
||||
d="M19 3c5.511 0 10 4.489 10 10s-4.489 10-10 10c-2.395 0-4.588-0.839-6.313-2.25l-7.969 7.969-1.438-1.438 7.969-7.969c-1.411-1.724-2.25-3.917-2.25-6.313 0-5.511 4.489-10 10-10zM19 5c-4.43 0-8 3.57-8 8s3.57 8 8 8 8-3.57 8-8-3.57-8-8-8z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
@ -494,16 +494,16 @@ exports[`Users given badges are enabled renders 1`] = `
|
||||
class="ds-input-icon"
|
||||
>
|
||||
<span
|
||||
aria-label="icon"
|
||||
class="ds-icon"
|
||||
aria-hidden="true"
|
||||
class="os-icon inline-flex items-center align-bottom shrink-0 h-[1.2em] [&>svg]:h-full [&>svg]:w-auto [&>svg]:fill-current"
|
||||
>
|
||||
<svg
|
||||
class="ds-icon-svg"
|
||||
fill="currentColor"
|
||||
viewBox="0 0 32 32"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M19 3c5.511 0 10 4.489 10 10s-4.489 10-10 10a9.923 9.923 0 01-6.313-2.25l-7.969 7.969-1.438-1.438 7.969-7.969a9.919 9.919 0 01-2.25-6.313c0-5.511 4.489-10 10-10zm0 2c-4.43 0-8 3.57-8 8s3.57 8 8 8 8-3.57 8-8-3.57-8-8-8z"
|
||||
d="M19 3c5.511 0 10 4.489 10 10s-4.489 10-10 10c-2.395 0-4.588-0.839-6.313-2.25l-7.969 7.969-1.438-1.438 7.969-7.969c-1.411-1.724-2.25-3.917-2.25-6.313 0-5.511 4.489-10 10-10zM19 5c-4.43 0-8 3.57-8 8s3.57 8 8 8 8-3.57 8-8-3.57-8-8-8z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user