btwedutech/hoppscotch
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 6 Wiki Activity

TailwindCSS v2.x (#1540)

Browse Source
This commit is contained in:
Liyas Thomas
2021-03-16 01:49:21 -07:00
committed by GitHub
parent 5399ddf6ac
commit f1389cdba0
30 changed files with 6068 additions and 21361 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
components/smart/AccentModePicker.vue
View File

@@ -2,12 +2,15 @@
<div class="flex flex-col">
<label>{{ $t("color") }}: {{ active.charAt(0).toUpperCase() + active.slice(1) }}</label>
<div>
<!-- text-indigo-400 -->
<!-- text-purple-400 -->
<!-- text-pink-400 -->
<span
v-for="(color, index) of colors"
v-for="(color, index) of accentColors"
:key="`color-${index}`"
v-tooltip="`${color.charAt(0).toUpperCase()}${color.slice(1)}`"
class="inline-flex items-center justify-center p-3 m-2 transition duration-150 ease-in-out bg-transparent rounded-full cursor-pointer border-collapseer-2 hover:shadow-none"
:class="[{ 'bg-bgDarkColor': color === active }, `text-${color}-400`]"
class="inline-flex items-center justify-center p-3 m-2 transition duration-150 ease-in-out bg-transparent rounded-full cursor-pointer hover:shadow-none"
:class="[`text-${color}-400`, { 'bg-actColor': color === active }]"
@click="setActiveColor(color)"
>
<i class="material-icons">lens</i>
@@ -21,7 +24,7 @@ export default {
data() {
return {
active: localStorage.getItem("THEME_COLOR") || "green",
colors: ["blue", "green", "teal", "purple", "orange", "pink", "red", "yellow"],
accentColors: ["blue", "green", "indigo", "purple", "red", "pink", "yellow"],
}
},
methods: {