oscar-surf/misskey
oscar-surf/misskey
0
0
Fork 0
Code Issues Activity

refactor(client): use css modules

Browse source
This commit is contained in:
syuilo 2023-01-15 14:03:28 +09:00
parent 1c0289e490
commit 07025caee9
3 changed files with 152 additions and 150 deletions
Download patch file Download diff file Expand all files Collapse all files

20
packages/frontend/src/widgets/WidgetDigitalClock.vue
View file

@ -1,10 +1,10 @@
<template>
<div class="mkw-digitalClock _monospace" :class="{ _panel: !widgetProps.transparent }" :style="{ fontSize: `${widgetProps.fontSize}em` }">
<div v-if="widgetProps.showLabel" class="label">{{ tzAbbrev }}</div>
<div class="time">
<div class="_monospace" :class="[$style.root, { _panel: !widgetProps.transparent }]" :style="{ fontSize: `${widgetProps.fontSize}em` }">
<div v-if="widgetProps.showLabel" :class="$style.label">{{ tzAbbrev }}</div>
<div>
<MkDigitalClock :show-ms="widgetProps.showMs" :offset="tzOffset"/>
</div>
<div v-if="widgetProps.showLabel" class="label">{{ tzOffsetLabel }}</div>
<div v-if="widgetProps.showLabel" :class="$style.label">{{ tzOffsetLabel }}</div>
</div>
</template>
@ -79,14 +79,14 @@ defineExpose<WidgetComponentExpose>({
});
</script>
<style lang="scss" scoped>
.mkw-digitalClock {
<style lang="scss" module>
.root {
padding: 16px 0;
text-align: center;
}
> .label {
font-size: 65%;
opacity: 0.7;
}
.label {
font-size: 65%;
opacity: 0.7;
}
</style>