upstream/nextcloud
1
0
Fork 0
mirror of https://github.com/nextcloud/server.git synced 2026-05-28 04:32:30 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions 54

fix(weather_status): remove unnecessaries LI wrapper and inline mode

Browse source 
Weather Status is only used as a Dashboard Status and only in so-called inline mode.
- Remove LI wrapper (actual only for User Menu Entry)
- Remove `inline` prop, consider component as always inline

Signed-off-by: Grigorii K. Shartsev <me@shgk.me>
This commit is contained in:
Grigorii K. Shartsev 2023-10-18 12:20:28 +02:00
parent f439505816
commit 4312fa803e
2 changed files with 56 additions and 107 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

157
apps/weather_status/src/App.vue
View file

@ -20,64 +20,62 @@
-->
<template>
<li :class="{ inline }">
<div id="weather-status-menu-item">
<NcActions class="weather-status-menu-item__subheader"
:default-icon="weatherIcon"
<div id="weather-status-menu-item">
<NcActions class="weather-status-menu-item__subheader"
:default-icon="weatherIcon"
:aria-hidden="true"
:aria-label="currentWeatherMessage"
:menu-name="currentWeatherMessage">
<NcActionText v-if="gotWeather"
:aria-hidden="true"
:aria-label="currentWeatherMessage"
:menu-name="currentWeatherMessage">
<NcActionText v-if="gotWeather"
:aria-hidden="true"
:icon="futureWeatherIcon">
{{ forecastMessage }}
</NcActionText>
<NcActionLink v-if="gotWeather"
icon="icon-address"
target="_blank"
:aria-hidden="true"
:href="weatherLinkTarget"
:close-after-click="true">
{{ locationText }}
</NcActionLink>
<NcActionButton v-if="gotWeather"
:aria-hidden="true"
@click="onAddRemoveFavoriteClick">
<template #icon>
<component :is="addRemoveFavoriteIcon" :size="20" class="favorite-color" />
</template>
{{ addRemoveFavoriteText }}
</NcActionButton>
<NcActionSeparator v-if="address && !errorMessage" />
<NcActionButton icon="icon-crosshair"
:close-after-click="true"
:aria-hidden="true"
@click="onBrowserLocationClick">
{{ t('weather_status', 'Detect location') }}
</NcActionButton>
<NcActionInput ref="addressInput"
:label="t('weather_status', 'Set custom address')"
:disabled="false"
icon="icon-rename"
:aria-hidden="true"
type="text"
value=""
@submit="onAddressSubmit" />
<template v-if="favorites.length > 0">
<NcActionCaption :name="t('weather_status', 'Favorites')" />
<NcActionButton v-for="favorite in favorites"
:key="favorite"
:aria-hidden="true"
@click="onFavoriteClick($event, favorite)">
<template #icon>
<IconStar :size="20" :class="{'favorite-color': address === favorite}" />
</template>
{{ favorite }}
</NcActionButton>
:icon="futureWeatherIcon">
{{ forecastMessage }}
</NcActionText>
<NcActionLink v-if="gotWeather"
icon="icon-address"
target="_blank"
:aria-hidden="true"
:href="weatherLinkTarget"
:close-after-click="true">
{{ locationText }}
</NcActionLink>
<NcActionButton v-if="gotWeather"
:aria-hidden="true"
@click="onAddRemoveFavoriteClick">
<template #icon>
<component :is="addRemoveFavoriteIcon" :size="20" class="favorite-color" />
</template>
</NcActions>
</div>
</li>
{{ addRemoveFavoriteText }}
</NcActionButton>
<NcActionSeparator v-if="address && !errorMessage" />
<NcActionButton icon="icon-crosshair"
:close-after-click="true"
:aria-hidden="true"
@click="onBrowserLocationClick">
{{ t('weather_status', 'Detect location') }}
</NcActionButton>
<NcActionInput ref="addressInput"
:label="t('weather_status', 'Set custom address')"
:disabled="false"
icon="icon-rename"
:aria-hidden="true"
type="text"
value=""
@submit="onAddressSubmit" />
<template v-if="favorites.length > 0">
<NcActionCaption :name="t('weather_status', 'Favorites')" />
<NcActionButton v-for="favorite in favorites"
:key="favorite"
:aria-hidden="true"
@click="onFavoriteClick($event, favorite)">
<template #icon>
<IconStar :size="20" :class="{'favorite-color': address === favorite}" />
</template>
{{ favorite }}
</NcActionButton>
</template>
</NcActions>
</div>
</template>
<script>
@ -214,12 +212,6 @@ export default {
NcActionSeparator,
NcActionText,
},
props: {
inline: {
type: Boolean,
default: false,
},
},
data() {
return {
locale: getLocale(),
@ -601,42 +593,7 @@ export default {
color: #a08b00;
}
li:not(.inline) .weather-status-menu-item {
&__header {
display: block;
align-items: center;
color: var(--color-main-text);
padding: 10px 12px 5px 12px;
box-sizing: border-box;
opacity: 1;
white-space: nowrap;
width: 100%;
text-align: center;
max-width: 250px;
text-overflow: ellipsis;
min-width: 175px;
}
&__subheader {
width: 100%;
.trigger > .icon {
background-color: var(--color-main-background);
background-size: 16px;
border: 0;
border-radius: 0;
font-weight: normal;
padding-left: 40px;
&:hover,
&:focus {
box-shadow: inset 4px 0 var(--color-primary-element);
}
}
}
}
.inline .weather-status-menu-item__subheader {
.weather-status-menu-item__subheader {
width: 100%;
.trigger > .icon {
@ -653,8 +610,4 @@ li:not(.inline) .weather-status-menu-item {
}
}
}
li {
list-style-type: none;
}
</style>

6
apps/weather_status/src/weather-status.js
View file

@ -36,10 +36,6 @@ document.addEventListener('DOMContentLoaded', function() {
OCA.Dashboard.registerStatus('weather', (el) => {
const Dashboard = Vue.extend(App)
return new Dashboard({
propsData: {
inline: true,
},
}).$mount(el)
return new Dashboard().$mount(el)
})
})