noham/gitprofile
1
0
Fork 0
mirror of https://github.com/NohamR/gitprofile.git synced 2026-05-25 12:27:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add experience and education

Browse Source
This commit is contained in:
MD. Ariful Alam
2021-08-22 18:39:03 +06:00
parent 9d87bbcb8e
commit ef61419b0f
15 changed files with 441 additions and 1438 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
src/components/ThemeChanger.js
View File

@@ -1,39 +1,38 @@
import { Fragment } from 'react';
import { Select } from 'antd';
import { useDispatch, useSelector } from 'react-redux';
import { setTheme } from '../store/slices/themeSlice';
import config from '../config';
const { Option } = Select;
import { skeleton } from '../helpers/utils';
const ThemeChanger = () => {
const dispatch = useDispatch();
const theme = useSelector(state => state.theme);
const loading = useSelector(state => state.loading);
const handleChange = (value) => {
dispatch(setTheme(value));
const handleChange = (e) => {
dispatch(setTheme(e.target.value));
}
return (
<div className="card shadow-lg compact side bg-base-100">
<div className="flex-row items-center space-x-4 card-body">
<div className="flex-1">
<h2 className="card-title">{loading ? <div className="bg-base-300 w-20 h-8 animate-pulse rounded-full" /> : 'Theme'}</h2>
<p className="text-base-content text-opacity-40">{loading ? <div className="bg-base-300 w-24 h-4 animate-pulse rounded-full" /> : 'Change Theme'}</p>
<div className="section-title">
<h5 className="card-title">
{loading ? skeleton({width: 'w-20', height: 'h-8'}) : 'Theme'}
</h5>
</div>
<span className="text-base-content text-opacity-40">{loading ? skeleton({width: 'w-24', height: 'h-4'}) : 'Change Theme'}</span>
</div>
<div className="flex-0">
{
loading ? <div className="bg-base-300 w-28 h-8 animate-pulse rounded-full" /> : (
<Select defaultValue="lucy" style={{ width: 120 }} onChange={handleChange} bordered={false} value={theme}>
loading ? skeleton({width: 'w-28', height: 'h-10'}) : (
<select class="select w-full max-w-xs opacity-50" value={theme} onChange={handleChange}>
{
config.themeConfig.themes.map((item, index) => (
<Option key={index} value={item}>
<span className="capitalize text-base-content text-opacity-60">{item === config.themeConfig.default ? 'Default' : item}</span>
</Option>
<option className="capitalize text-base-content text-opacity-60" value={item}>{item === config.themeConfig.default ? 'Default' : item}</option>
))
}
</Select>
</select>
)
}
</div>