Skip to content

Instantly share code, notes, and snippets.

@ravipatel2293
Created August 5, 2020 13:01
Show Gist options
  • Save ravipatel2293/52937a8f580e1dd7a784791c5a417d90 to your computer and use it in GitHub Desktop.
Save ravipatel2293/52937a8f580e1dd7a784791c5a417d90 to your computer and use it in GitHub Desktop.
<template>
<button class="button">{{text}}</button>
</template>
<script>
export default {
name: "Button",
props: {
text: {
type: String,
required: true
}
}
};
</script>
<style lang="scss" scoped>
// Common button style
.button {
border-radius: 2px;
color: #ffffff;
padding: 12px 30px;
cursor: pointer;
&:focus {
opacity: 0.6;
outline: none;
}
}
// Button style for the light theme
.light-theme .button{
background-color: #999999;
border:1px solid #999999;
}
// Button style for the dark theme
.dark-theme .button{
background-color: #9aa7b0;
border:1px solid #9aa7b0;
}
</style>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment