Spotify/top-lists
0
0
Fork 0
Code Issues Activity

Add an icon for the button rather than text

Browse source
This commit is contained in:
Oliver-Akins 2020-10-30 21:34:32 -06:00
parent 0305a10634
commit 32d8134994
1 changed files with 15 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

18
src/App.vue
View file

@ -11,7 +11,14 @@
@close="show_theme_modal = false" @close="show_theme_modal = false"
/> />
<div id="theme-button"> <div id="theme-button">
<button @click="show_theme_modal = true">Themes</button> <button @click="show_theme_modal = true">
<Icon
type="palette"
:size="30"
:innerSize="30"
primary="--button-text"
/>
</button>
</div> </div>
</div> </div>
</template> </template>
@ -24,6 +31,7 @@ import "./js/prototypes.js";
import ThemePicker from './components/modals/ThemeModal'; import ThemePicker from './components/modals/ThemeModal';
import LoginCard from './components/LoginView.vue'; import LoginCard from './components/LoginView.vue';
import MainView from './components/MainView.vue'; import MainView from './components/MainView.vue';
import Icon from './components/Icon.vue';
export default { export default {
name: 'App', name: 'App',
@ -31,6 +39,7 @@ export default {
"LoginCard": LoginCard, "LoginCard": LoginCard,
"MainView": MainView, "MainView": MainView,
"Themes": ThemePicker, "Themes": ThemePicker,
"Icon": Icon,
}, },
data() {return { data() {return {
show_theme_modal: false show_theme_modal: false
@ -96,7 +105,10 @@ body {
#theme-button { #theme-button {
position: absolute; position: absolute;
display: block; display: block;
bottom: 0; bottom: 5px;
right: 0; right: 5px;
}
#theme-button > button {
padding: 5px;
} }
</style> </style>