New theming system

This commit is contained in:
Agate 2020-05-15 14:12:36 +02:00
commit cd422832dd
196 changed files with 3359 additions and 3486 deletions

View file

@ -1,7 +1,7 @@
<template>
<span class="feedback" v-if="isLoading || isDone">
<span v-if="isLoading" :class="['ui', 'active', size, 'inline', 'loader']"></span>
<i v-if="isDone" :class="['green', size, 'check', 'icon']"></i>
<i v-if="isDone" :class="['success', size, 'check', 'icon']"></i>
</span>
</template>

View file

@ -1,5 +1,5 @@
<template>
<div class="table-wrapper">
<div class="table-wrapper component-action-table">
<table class="ui compact very basic unstackable table">
<thead>
<tr>
@ -30,7 +30,7 @@
<div class="field">
<dangerous-button
v-if="selectAll || currentAction.isDangerous" :class="['ui', {disabled: checked.length === 0}, {'loading': actionLoading}, 'button']"
:confirm-color="currentAction.confirmColor || 'green'"
:confirm-color="currentAction.confirmColor || 'success'"
@confirm="launchAction">
<translate translate-context="Content/*/Button.Label/Short, Verb">Go</translate>
<p slot="modal-header">
@ -300,11 +300,3 @@ export default {
}
}
</script>
<style scoped>
.count.field {
font-weight: normal;
}
.ui.form .inline.fields {
margin: 0;
}
</style>

View file

@ -20,10 +20,3 @@ export default {
}
}
</script>
<style lang="scss">
.ui.circular.avatar {
width: 28px;
height: 28px;
font-size: 1em !important;
}
</style>

View file

@ -39,7 +39,7 @@
</template>
</div>
<div class="ui bottom attached segment">
<span :class="['right', 'floated', {'ui red text': remainingChars < 0}]" v-if="charLimit">
<span :class="['right', 'floated', {'ui danger text': remainingChars < 0}]" v-if="charLimit">
{{ remainingChars }}
</span>
<p>

View file

@ -1,5 +1,5 @@
<template>
<div class="ui fluid action input">
<div class="ui fluid action input component-copy-input">
<p class="message" v-if="copied">
<translate translate-context="Content/*/Paragraph">Text copied to clipboard!</translate>
</p>
@ -39,14 +39,3 @@ export default {
}
}
</script>
<style scoped>
.message {
position: absolute;
right: 0;
bottom: -3em;
padding: 0.3em;
box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
background-color: white;
z-index: 999;
}
</style>

View file

@ -34,7 +34,7 @@ export default {
props: {
action: {type: Function, required: false},
disabled: {type: Boolean, default: false},
confirmColor: {type: String, default: "red", required: false}
confirmColor: {type: String, default: "danger", required: false}
},
components: {
Modal

View file

@ -1,5 +1,5 @@
<template>
<div class="ui small placeholder segment">
<div class="ui small placeholder segment component-placeholder component-empty-state">
<div class="ui header">
<div class="content">
<slot name="title">
@ -28,13 +28,3 @@ export default {
}
}
</script>
<style scoped>
.ui.small.placeholder.segment {
min-height: auto;
}
.ui.header .content {
text-align: center;
display: block;
}
</style>

View file

@ -1,5 +1,5 @@
<template>
<span>
<span class="component-user-link">
<template v-if="avatar">
<img
class="ui tiny circular avatar"
@ -32,9 +32,3 @@ export default {
}
}
</script>
<style scoped>
.tiny.circular.avatar {
width: 1.7em;
height: 1.7em;
}
</style>