Using redesigned checkboxes on addons section
This commit is contained in:
Damien Chazoule
@@ -357,15 +357,19 @@ exports[`Addons should render Customize Badges 1`] = `
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
className="checkbox-label flex items-center"
|
||||
htmlFor="visitors-count"
|
||||
>
|
||||
<input
|
||||
checked={false}
|
||||
className="checkbox-label__input"
|
||||
id="visitors-count"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="checkbox-label__control"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
@@ -528,15 +532,19 @@ exports[`Addons should render Customize Badges 1`] = `
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
className="checkbox-label flex items-center"
|
||||
htmlFor="github-profile-trophy"
|
||||
>
|
||||
<input
|
||||
checked={false}
|
||||
className="checkbox-label__input"
|
||||
id="github-profile-trophy"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="checkbox-label__control"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
@@ -576,15 +584,19 @@ exports[`Addons should render Customize Badges 1`] = `
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
className="checkbox-label flex items-center"
|
||||
htmlFor="github-stats"
|
||||
>
|
||||
<input
|
||||
checked={false}
|
||||
className="checkbox-label__input"
|
||||
id="github-stats"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="checkbox-label__control"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
@@ -662,15 +674,19 @@ exports[`Addons should render Customize Badges 1`] = `
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
className="checkbox-label flex items-center"
|
||||
htmlFor="top-languages"
|
||||
>
|
||||
<input
|
||||
checked={false}
|
||||
className="checkbox-label__input"
|
||||
id="top-languages"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="checkbox-label__control"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
@@ -737,14 +753,18 @@ exports[`Addons should render Customize Badges 1`] = `
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
className="checkbox-label flex items-center"
|
||||
htmlFor="streak-stats"
|
||||
>
|
||||
<input
|
||||
className="checkbox-label__input"
|
||||
id="streak-stats"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="checkbox-label__control"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
@@ -800,15 +820,19 @@ exports[`Addons should render Customize Badges 1`] = `
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
className="checkbox-label flex items-center"
|
||||
htmlFor="twitter-badge"
|
||||
>
|
||||
<input
|
||||
checked={false}
|
||||
className="checkbox-label__input"
|
||||
id="twitter-badge"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="checkbox-label__control"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
@@ -826,15 +850,19 @@ exports[`Addons should render Customize Badges 1`] = `
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
className="checkbox-label flex items-center"
|
||||
htmlFor="dev-dynamic-blogs"
|
||||
>
|
||||
<input
|
||||
checked={false}
|
||||
className="checkbox-label__input"
|
||||
id="dev-dynamic-blogs"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="checkbox-label__control"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
@@ -852,15 +880,19 @@ exports[`Addons should render Customize Badges 1`] = `
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
className="checkbox-label flex items-center"
|
||||
htmlFor="medium-dynamic-blogs"
|
||||
>
|
||||
<input
|
||||
checked="some-medium-blogs-value"
|
||||
className="checkbox-label__input"
|
||||
id="medium-dynamic-blogs"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="checkbox-label__control"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
@@ -878,15 +910,19 @@ exports[`Addons should render Customize Badges 1`] = `
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
className="checkbox-label flex items-center"
|
||||
htmlFor="rss-dynamic-blogs"
|
||||
>
|
||||
<input
|
||||
checked={false}
|
||||
className="checkbox-label__input"
|
||||
id="rss-dynamic-blogs"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="checkbox-label__control"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
@@ -1023,15 +1059,19 @@ exports[`Addons should render Customize Github stats card 1`] = `
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
className="checkbox-label flex items-center"
|
||||
htmlFor="visitors-count"
|
||||
>
|
||||
<input
|
||||
checked={false}
|
||||
className="checkbox-label__input"
|
||||
id="visitors-count"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="checkbox-label__control"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
@@ -1087,15 +1127,19 @@ exports[`Addons should render Customize Github stats card 1`] = `
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
className="checkbox-label flex items-center"
|
||||
htmlFor="github-profile-trophy"
|
||||
>
|
||||
<input
|
||||
checked={false}
|
||||
className="checkbox-label__input"
|
||||
id="github-profile-trophy"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="checkbox-label__control"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
@@ -1135,15 +1179,19 @@ exports[`Addons should render Customize Github stats card 1`] = `
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
className="checkbox-label flex items-center"
|
||||
htmlFor="github-stats"
|
||||
>
|
||||
<input
|
||||
checked={false}
|
||||
className="checkbox-label__input"
|
||||
id="github-stats"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="checkbox-label__control"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
@@ -1346,15 +1394,20 @@ exports[`Addons should render Customize Github stats card 1`] = `
|
||||
/>
|
||||
</label>
|
||||
<label
|
||||
className="checkbox-label"
|
||||
htmlFor="stats-hide-border"
|
||||
>
|
||||
Hide border:
|
||||
<input
|
||||
checked={false}
|
||||
className="checkbox-label__input"
|
||||
id="stats-hide-border"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="checkbox-label__control"
|
||||
/>
|
||||
</label>
|
||||
<label
|
||||
htmlFor="stats-cache-seconds"
|
||||
@@ -1419,15 +1472,19 @@ exports[`Addons should render Customize Github stats card 1`] = `
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
className="checkbox-label flex items-center"
|
||||
htmlFor="top-languages"
|
||||
>
|
||||
<input
|
||||
checked={false}
|
||||
className="checkbox-label__input"
|
||||
id="top-languages"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="checkbox-label__control"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
@@ -1494,14 +1551,18 @@ exports[`Addons should render Customize Github stats card 1`] = `
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
className="checkbox-label flex items-center"
|
||||
htmlFor="streak-stats"
|
||||
>
|
||||
<input
|
||||
className="checkbox-label__input"
|
||||
id="streak-stats"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="checkbox-label__control"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
@@ -1557,15 +1618,19 @@ exports[`Addons should render Customize Github stats card 1`] = `
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
className="checkbox-label flex items-center"
|
||||
htmlFor="twitter-badge"
|
||||
>
|
||||
<input
|
||||
checked={false}
|
||||
className="checkbox-label__input"
|
||||
id="twitter-badge"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="checkbox-label__control"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
@@ -1583,15 +1648,19 @@ exports[`Addons should render Customize Github stats card 1`] = `
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
className="checkbox-label flex items-center"
|
||||
htmlFor="dev-dynamic-blogs"
|
||||
>
|
||||
<input
|
||||
checked={false}
|
||||
className="checkbox-label__input"
|
||||
id="dev-dynamic-blogs"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="checkbox-label__control"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
@@ -1609,15 +1678,19 @@ exports[`Addons should render Customize Github stats card 1`] = `
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
className="checkbox-label flex items-center"
|
||||
htmlFor="medium-dynamic-blogs"
|
||||
>
|
||||
<input
|
||||
checked="some-medium-blogs-value"
|
||||
className="checkbox-label__input"
|
||||
id="medium-dynamic-blogs"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="checkbox-label__control"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
@@ -1635,15 +1708,19 @@ exports[`Addons should render Customize Github stats card 1`] = `
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
className="checkbox-label flex items-center"
|
||||
htmlFor="rss-dynamic-blogs"
|
||||
>
|
||||
<input
|
||||
checked={false}
|
||||
className="checkbox-label__input"
|
||||
id="rss-dynamic-blogs"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="checkbox-label__control"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
@@ -1780,15 +1857,19 @@ exports[`Addons should render Customize Top Skills Card 1`] = `
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
className="checkbox-label flex items-center"
|
||||
htmlFor="visitors-count"
|
||||
>
|
||||
<input
|
||||
checked={false}
|
||||
className="checkbox-label__input"
|
||||
id="visitors-count"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="checkbox-label__control"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
@@ -1844,15 +1925,19 @@ exports[`Addons should render Customize Top Skills Card 1`] = `
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
className="checkbox-label flex items-center"
|
||||
htmlFor="github-profile-trophy"
|
||||
>
|
||||
<input
|
||||
checked={false}
|
||||
className="checkbox-label__input"
|
||||
id="github-profile-trophy"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="checkbox-label__control"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
@@ -1892,15 +1977,19 @@ exports[`Addons should render Customize Top Skills Card 1`] = `
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
className="checkbox-label flex items-center"
|
||||
htmlFor="github-stats"
|
||||
>
|
||||
<input
|
||||
checked={false}
|
||||
className="checkbox-label__input"
|
||||
id="github-stats"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="checkbox-label__control"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
@@ -1978,15 +2067,19 @@ exports[`Addons should render Customize Top Skills Card 1`] = `
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
className="checkbox-label flex items-center"
|
||||
htmlFor="top-languages"
|
||||
>
|
||||
<input
|
||||
checked={false}
|
||||
className="checkbox-label__input"
|
||||
id="top-languages"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="checkbox-label__control"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
@@ -2189,15 +2282,20 @@ exports[`Addons should render Customize Top Skills Card 1`] = `
|
||||
/>
|
||||
</label>
|
||||
<label
|
||||
className="checkbox-label"
|
||||
htmlFor="top-lang-hide-border"
|
||||
>
|
||||
Hide border:
|
||||
<input
|
||||
checked={false}
|
||||
className="checkbox-label__input"
|
||||
id="top-lang-hide-border"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="checkbox-label__control"
|
||||
/>
|
||||
</label>
|
||||
<label
|
||||
htmlFor="top-lang-cache-seconds"
|
||||
@@ -2251,14 +2349,18 @@ exports[`Addons should render Customize Top Skills Card 1`] = `
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
className="checkbox-label flex items-center"
|
||||
htmlFor="streak-stats"
|
||||
>
|
||||
<input
|
||||
className="checkbox-label__input"
|
||||
id="streak-stats"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="checkbox-label__control"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
@@ -2314,15 +2416,19 @@ exports[`Addons should render Customize Top Skills Card 1`] = `
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
className="checkbox-label flex items-center"
|
||||
htmlFor="twitter-badge"
|
||||
>
|
||||
<input
|
||||
checked={false}
|
||||
className="checkbox-label__input"
|
||||
id="twitter-badge"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="checkbox-label__control"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
@@ -2340,15 +2446,19 @@ exports[`Addons should render Customize Top Skills Card 1`] = `
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
className="checkbox-label flex items-center"
|
||||
htmlFor="dev-dynamic-blogs"
|
||||
>
|
||||
<input
|
||||
checked={false}
|
||||
className="checkbox-label__input"
|
||||
id="dev-dynamic-blogs"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="checkbox-label__control"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
@@ -2366,15 +2476,19 @@ exports[`Addons should render Customize Top Skills Card 1`] = `
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
className="checkbox-label flex items-center"
|
||||
htmlFor="medium-dynamic-blogs"
|
||||
>
|
||||
<input
|
||||
checked="some-medium-blogs-value"
|
||||
className="checkbox-label__input"
|
||||
id="medium-dynamic-blogs"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="checkbox-label__control"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
@@ -2392,15 +2506,19 @@ exports[`Addons should render Customize Top Skills Card 1`] = `
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
className="checkbox-label flex items-center"
|
||||
htmlFor="rss-dynamic-blogs"
|
||||
>
|
||||
<input
|
||||
checked={false}
|
||||
className="checkbox-label__input"
|
||||
id="rss-dynamic-blogs"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="checkbox-label__control"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
|
||||
@@ -46,31 +46,34 @@ exports[`Skills renders correctly 1`] = `
|
||||
className="flex justify-start items-center flex-wrap w-full mb-6 pl-4 sm:pl-10"
|
||||
>
|
||||
<div
|
||||
className="skillCheckbox w-1/3 sm:w-1/4 my-6 flex items-center"
|
||||
className="w-1/3 sm:w-1/4 my-6"
|
||||
key="javascript"
|
||||
>
|
||||
<input
|
||||
checked={true}
|
||||
className="offscreen"
|
||||
id="javascript"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<label
|
||||
className="switch cursor-pointer"
|
||||
className="checkbox-label flex items-center justify-start"
|
||||
htmlFor="javascript"
|
||||
/>
|
||||
<img
|
||||
alt="javascript"
|
||||
className="ml-4 w-8 h-8 sm:w-10 sm:h-10 cursor-pointer"
|
||||
onClick={[Function]}
|
||||
src="javascript.svg"
|
||||
/>
|
||||
<span
|
||||
className="tooltiptext"
|
||||
>
|
||||
javascript
|
||||
</span>
|
||||
<input
|
||||
checked={true}
|
||||
className="checkbox-label__input"
|
||||
id="javascript"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="checkbox-label__control"
|
||||
/>
|
||||
<img
|
||||
alt="javascript"
|
||||
className="ml-4 w-8 h-8 sm:w-10 sm:h-10"
|
||||
src="javascript.svg"
|
||||
/>
|
||||
<span
|
||||
className="tooltiptext"
|
||||
>
|
||||
javascript
|
||||
</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -87,56 +90,62 @@ exports[`Skills renders correctly 1`] = `
|
||||
className="flex justify-start items-center flex-wrap w-full mb-6 pl-4 sm:pl-10"
|
||||
>
|
||||
<div
|
||||
className="skillCheckbox w-1/3 sm:w-1/4 my-6 flex items-center"
|
||||
className="w-1/3 sm:w-1/4 my-6"
|
||||
key="react"
|
||||
>
|
||||
<input
|
||||
className="offscreen"
|
||||
id="react"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<label
|
||||
className="switch cursor-pointer"
|
||||
className="checkbox-label flex items-center justify-start"
|
||||
htmlFor="react"
|
||||
/>
|
||||
<img
|
||||
alt="react"
|
||||
className="ml-4 w-8 h-8 sm:w-10 sm:h-10 cursor-pointer"
|
||||
onClick={[Function]}
|
||||
src="react.svg"
|
||||
/>
|
||||
<span
|
||||
className="tooltiptext"
|
||||
>
|
||||
react
|
||||
</span>
|
||||
<input
|
||||
className="checkbox-label__input"
|
||||
id="react"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="checkbox-label__control"
|
||||
/>
|
||||
<img
|
||||
alt="react"
|
||||
className="ml-4 w-8 h-8 sm:w-10 sm:h-10"
|
||||
src="react.svg"
|
||||
/>
|
||||
<span
|
||||
className="tooltiptext"
|
||||
>
|
||||
react
|
||||
</span>
|
||||
</label>
|
||||
</div>
|
||||
<div
|
||||
className="skillCheckbox w-1/3 sm:w-1/4 my-6 flex items-center"
|
||||
className="w-1/3 sm:w-1/4 my-6"
|
||||
key="svelte"
|
||||
>
|
||||
<input
|
||||
className="offscreen"
|
||||
id="svelte"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<label
|
||||
className="switch cursor-pointer"
|
||||
className="checkbox-label flex items-center justify-start"
|
||||
htmlFor="svelte"
|
||||
/>
|
||||
<img
|
||||
alt="svelte"
|
||||
className="ml-4 w-8 h-8 sm:w-10 sm:h-10 cursor-pointer"
|
||||
onClick={[Function]}
|
||||
src="svelte.svg"
|
||||
/>
|
||||
<span
|
||||
className="tooltiptext"
|
||||
>
|
||||
svelte
|
||||
</span>
|
||||
<input
|
||||
className="checkbox-label__input"
|
||||
id="svelte"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
class="checkbox-label__control"
|
||||
/>
|
||||
<img
|
||||
alt="svelte"
|
||||
className="ml-4 w-8 h-8 sm:w-10 sm:h-10"
|
||||
src="svelte.svg"
|
||||
/>
|
||||
<span
|
||||
className="tooltiptext"
|
||||
>
|
||||
svelte
|
||||
</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -157,13 +157,15 @@ const CustomizeGithubStatsBase = ({ prefix, options, onUpdate }) =>
|
||||
onChange={(e) => onUpdate('bgColor', e.target.value.replace('#', ''))}
|
||||
/>
|
||||
</label>
|
||||
<label htmlFor={`${prefix}-hide-border`}>Hide border:
|
||||
<label htmlFor={`${prefix}-hide-border`} className="checkbox-label">Hide border:
|
||||
<input
|
||||
id={`${prefix}-hide-border`}
|
||||
type="checkbox"
|
||||
className="checkbox-label__input"
|
||||
checked={options.hideBorder}
|
||||
onChange={(e) => onUpdate('hideBorder', e.target.checked)}
|
||||
/>
|
||||
<span class="checkbox-label__control" />
|
||||
</label>
|
||||
<label htmlFor={`${prefix}-cache-seconds`}>Cache Seconds:
|
||||
<input
|
||||
|
||||
+3
-2
@@ -43,12 +43,13 @@ input[type="checkbox"] {
|
||||
}
|
||||
.checkbox-label__control {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
display: inline-flex;
|
||||
flex-shrink: 0;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
margin-right: 12px;
|
||||
vertical-align: middle;
|
||||
background-color: var(--grey-05);
|
||||
background-color: #f7fafc;
|
||||
border: 2px solid var(--grey-90);
|
||||
transform: scale(0.75);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user