2018-10-19 05:15:28 +00:00
|
|
|
<template lang="html">
|
|
|
|
<div class="panel">
|
|
|
|
<slot />
|
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
|
|
|
|
<script>
|
|
|
|
export default {
|
|
|
|
};
|
|
|
|
</script>
|
|
|
|
|
|
|
|
<style lang="scss" rel="stylesheet/scss" scoped>
|
2019-04-05 19:16:32 +00:00
|
|
|
@import "~styles/styles.scss";
|
2018-10-19 05:15:28 +00:00
|
|
|
|
|
|
|
.panel {
|
|
|
|
padding: $gp / 2;
|
|
|
|
border-radius: $border-radius;
|
|
|
|
|
|
|
|
p {
|
|
|
|
margin: $gp / 2 0;
|
|
|
|
}
|
|
|
|
|
2019-02-06 06:57:56 +00:00
|
|
|
a {
|
|
|
|
color: unset;
|
|
|
|
font-weight: bold;
|
|
|
|
}
|
|
|
|
|
2018-10-19 05:15:28 +00:00
|
|
|
&.warning {
|
|
|
|
background: $color-orange;
|
|
|
|
color: darken($color-orange, 40);
|
|
|
|
}
|
|
|
|
|
|
|
|
&.positive {
|
|
|
|
background: $color-green;
|
|
|
|
color: lighten($color-green, 50);
|
|
|
|
}
|
|
|
|
|
|
|
|
&.info {
|
|
|
|
background: $color-gray;
|
|
|
|
color: lighten($color-gray, 40);
|
|
|
|
}
|
|
|
|
|
|
|
|
&.error {
|
|
|
|
background: $color-red;
|
|
|
|
color: lighten($color-red, 40);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
</style>
|