mirror of
https://github.com/ragestudio/comty.git
synced 2025-06-10 19:14:16 +00:00
0.2.26A2
This commit is contained in:
parent
44b186c3af
commit
839ea58aba
14
.umirc.js
14
.umirc.js
@ -3,9 +3,8 @@ import { resolve } from 'path'
|
|||||||
import { i18n } from './config/ycore.config.js'
|
import { i18n } from './config/ycore.config.js'
|
||||||
export default {
|
export default {
|
||||||
ignoreMomentLocale: true,
|
ignoreMomentLocale: true,
|
||||||
targets: {
|
hash: true,
|
||||||
ie: 9,
|
targets: { ie: 9,},
|
||||||
},
|
|
||||||
treeShaking: true,
|
treeShaking: true,
|
||||||
plugins: [
|
plugins: [
|
||||||
[
|
[
|
||||||
@ -13,7 +12,6 @@ export default {
|
|||||||
{
|
{
|
||||||
dva: {
|
dva: {
|
||||||
immer: true,
|
immer: true,
|
||||||
hmr: true,
|
|
||||||
},
|
},
|
||||||
antd: true,
|
antd: true,
|
||||||
dynamicImport: {
|
dynamicImport: {
|
||||||
@ -52,13 +50,12 @@ export default {
|
|||||||
return routes
|
return routes
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
dll: false,
|
dll:false,
|
||||||
pwa: {
|
pwa: {
|
||||||
manifestOptions: {
|
manifestOptions: {
|
||||||
srcPath: 'manifest.json',
|
srcPath: 'manifest.json',
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
hd: false,
|
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
],
|
],
|
||||||
@ -68,13 +65,11 @@ export default {
|
|||||||
// Webpack Configuration
|
// Webpack Configuration
|
||||||
alias: {
|
alias: {
|
||||||
ycore: resolve(__dirname, './src/@ycore/ycore_worker.js'),
|
ycore: resolve(__dirname, './src/@ycore/ycore_worker.js'),
|
||||||
api: resolve(__dirname, './src/services/'),
|
|
||||||
globals: resolve(__dirname, './globals'),
|
globals: resolve(__dirname, './globals'),
|
||||||
components: resolve(__dirname, './src/components'),
|
components: resolve(__dirname, './src/components'),
|
||||||
config: resolve(__dirname, './config/ycore.config.js'),
|
config: resolve(__dirname, './config/ycore.config.js'),
|
||||||
models: resolve(__dirname, './src/models'),
|
models: resolve(__dirname, './src/models'),
|
||||||
routes: resolve(__dirname, './src/routes'),
|
routes: resolve(__dirname, './src/routes'),
|
||||||
services: resolve(__dirname, './src/services'),
|
|
||||||
themes: resolve(__dirname, './src/themes'),
|
themes: resolve(__dirname, './src/themes'),
|
||||||
utils: resolve(__dirname, './src/utils'),
|
utils: resolve(__dirname, './src/utils'),
|
||||||
},
|
},
|
||||||
@ -90,4 +85,7 @@ export default {
|
|||||||
'lodash',
|
'lodash',
|
||||||
],
|
],
|
||||||
],
|
],
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
@ -23,13 +23,10 @@ export var AppSettings = {
|
|||||||
DisablePasswordRecover: true,
|
DisablePasswordRecover: true,
|
||||||
// Activating this, the logs must be trowed
|
// Activating this, the logs must be trowed
|
||||||
force_showDevLogs: fromStorage? SettingStoragedValue('force_showDevLogs') : false,
|
force_showDevLogs: fromStorage? SettingStoragedValue('force_showDevLogs') : false,
|
||||||
StrictLightMode: fromStorage? SettingStoragedValue('strict_lightMode') : false,
|
|
||||||
SignForNotExpire: fromStorage? SettingStoragedValue('sessions_noexpire') : false,
|
SignForNotExpire: fromStorage? SettingStoragedValue('sessions_noexpire') : false,
|
||||||
auto_search_ontype: fromStorage? SettingStoragedValue('auto_search_ontype') : false,
|
auto_search_ontype: fromStorage? SettingStoragedValue('auto_search_ontype') : false,
|
||||||
auto_feedrefresh: fromStorage? SettingStoragedValue('auto_feedrefresh') : false,
|
auto_feedrefresh: fromStorage? SettingStoragedValue('auto_feedrefresh') : false,
|
||||||
default_showpostcreator: fromStorage? SettingStoragedValue('default_showpostcreator') : false,
|
auto_hide_postbar: fromStorage? SettingStoragedValue('auto_hide_postbar') : true,
|
||||||
default_collapse_sider: fromStorage? SettingStoragedValue('default_collapse_sider') : true,
|
|
||||||
force_show_postactions: fromStorage? SettingStoragedValue('force_show_postactions') : false,
|
|
||||||
MaxLengthPosts: '512',
|
MaxLengthPosts: '512',
|
||||||
CurrentBundle: 'light_ng',
|
CurrentBundle: 'light_ng',
|
||||||
// In KB
|
// In KB
|
||||||
|
@ -3,6 +3,6 @@ const path = require('path')
|
|||||||
const lessToJs = require('less-vars-to-js')
|
const lessToJs = require('less-vars-to-js')
|
||||||
|
|
||||||
module.exports = () => {
|
module.exports = () => {
|
||||||
const themePath = path.join(__dirname, `../src/themes/vars.less`)
|
const themePath = path.join(__dirname, `../src/themes/index.less`)
|
||||||
return lessToJs(fs.readFileSync(themePath, 'utf8'))
|
return lessToJs(fs.readFileSync(themePath, 'utf8'))
|
||||||
}
|
}
|
||||||
|
@ -15,20 +15,11 @@ function SettingStoragedValue(e) {
|
|||||||
|
|
||||||
export var ListSettings = [
|
export var ListSettings = [
|
||||||
{
|
{
|
||||||
SettingID: 'strict_lightMode',
|
SettingID: 'sessions_noexpire',
|
||||||
type: 'switch',
|
type: 'switch',
|
||||||
title: 'Strict Light Mode',
|
title: 'No expire session',
|
||||||
description:
|
description: 'Force the app to not expire any session... [Developer]',
|
||||||
'Force the app to apply full light mode theme when the light mode is activated... (Experimental)',
|
value: fromStorage ? SettingStoragedValue('sessions_noexpire') : false,
|
||||||
value: fromStorage ? SettingStoragedValue('strict_lightMode') : false,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
SettingID: 'default_collapse_sider',
|
|
||||||
type: 'switch',
|
|
||||||
title: 'Default Collapse Sider',
|
|
||||||
description:
|
|
||||||
'Force the app to apply collapsed mode theme when the app is mounted...',
|
|
||||||
value: fromStorage ? SettingStoragedValue('default_collapse_sider') : true,
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
SettingID: 'auto_feedrefresh',
|
SettingID: 'auto_feedrefresh',
|
||||||
@ -38,6 +29,22 @@ export var ListSettings = [
|
|||||||
'Force the app to auto refresh the posts feed when exist news posts for update',
|
'Force the app to auto refresh the posts feed when exist news posts for update',
|
||||||
value: fromStorage ? SettingStoragedValue('auto_feedrefresh') : false,
|
value: fromStorage ? SettingStoragedValue('auto_feedrefresh') : false,
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
SettingID: 'auto_search_ontype',
|
||||||
|
type: 'switch',
|
||||||
|
title: 'Detect input on search bar',
|
||||||
|
description:
|
||||||
|
'Force the app to automaticly search when a type input is detected... [Developer]',
|
||||||
|
value: fromStorage ? SettingStoragedValue('auto_search_ontype') : false,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
SettingID: 'auto_hide_postbar',
|
||||||
|
type: 'switch',
|
||||||
|
title: 'Auto hide postbar',
|
||||||
|
description:
|
||||||
|
'Force the app to dont hide the post actions (likes, comments ...etc) automaticly... [Developer]',
|
||||||
|
value: fromStorage ? SettingStoragedValue('auto_hide_postbar') : true,
|
||||||
|
},
|
||||||
{
|
{
|
||||||
SettingID: 'force_showDevLogs',
|
SettingID: 'force_showDevLogs',
|
||||||
type: 'switch',
|
type: 'switch',
|
||||||
@ -45,37 +52,4 @@ export var ListSettings = [
|
|||||||
description: 'Show all console logs... [Developer]',
|
description: 'Show all console logs... [Developer]',
|
||||||
value: fromStorage ? SettingStoragedValue('force_showDevLogs') : false,
|
value: fromStorage ? SettingStoragedValue('force_showDevLogs') : false,
|
||||||
},
|
},
|
||||||
{
|
|
||||||
SettingID: 'sessions_noexpire',
|
|
||||||
type: 'switch',
|
|
||||||
title: 'No expire session',
|
|
||||||
description: 'Force the app to not expire any session... [Developer]',
|
|
||||||
value: fromStorage ? SettingStoragedValue('sessions_noexpire') : false,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
SettingID: 'auto_search_ontype',
|
|
||||||
type: 'switch',
|
|
||||||
title: 'Auto search',
|
|
||||||
description:
|
|
||||||
'Force the app to automaticly search when a type input is detected... [Developer]',
|
|
||||||
value: fromStorage ? SettingStoragedValue('auto_search_ontype') : false,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
SettingID: 'default_showpostcreator',
|
|
||||||
type: 'switch',
|
|
||||||
title: 'Show default Post Creator',
|
|
||||||
description:
|
|
||||||
'Force the app to automaticly search when a type input is detected... [Developer]',
|
|
||||||
value: fromStorage
|
|
||||||
? SettingStoragedValue('default_showpostcreator')
|
|
||||||
: false,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
SettingID: 'force_show_postactions',
|
|
||||||
type: 'switch',
|
|
||||||
title: 'Not auto hide Posts Actions',
|
|
||||||
description:
|
|
||||||
'Force the app to dont hide the post actions (likes, comments ...etc) automaticly... [Developer]',
|
|
||||||
value: fromStorage ? SettingStoragedValue('force_show_postactions') : false,
|
|
||||||
},
|
|
||||||
]
|
]
|
||||||
|
28
package.json
28
package.json
@ -3,8 +3,8 @@
|
|||||||
"UUID": "C8mVSr-4nmPp2-pr5Vrz-CU4kg4",
|
"UUID": "C8mVSr-4nmPp2-pr5Vrz-CU4kg4",
|
||||||
"title": "Comty™",
|
"title": "Comty™",
|
||||||
"DevBuild": true,
|
"DevBuild": true,
|
||||||
"version": "0.2.25",
|
"version": "0.2.26",
|
||||||
"stage": "A1",
|
"stage": "A2",
|
||||||
"description": "",
|
"description": "",
|
||||||
"main": "app/main.js",
|
"main": "app/main.js",
|
||||||
"author": "RageStudio",
|
"author": "RageStudio",
|
||||||
@ -23,10 +23,11 @@
|
|||||||
"@material-ui/icons": "^4.9.1",
|
"@material-ui/icons": "^4.9.1",
|
||||||
"antd": "^4.0.4",
|
"antd": "^4.0.4",
|
||||||
"axios": "^0.19.2",
|
"axios": "^0.19.2",
|
||||||
"babel-core": "7.0.0-bridge.0",
|
"bag.js": "0.0.2",
|
||||||
"classnames": "^2.2.6",
|
"classnames": "^2.2.6",
|
||||||
"cryptr": "^6.0.1",
|
"cryptr": "^6.0.1",
|
||||||
"dotenv": "^8.2.0",
|
"dotenv": "^8.2.0",
|
||||||
|
"dva": "2.4.1",
|
||||||
"dva-model-extend": "^0.1.2",
|
"dva-model-extend": "^0.1.2",
|
||||||
"enquire-js": "^0.2.1",
|
"enquire-js": "^0.2.1",
|
||||||
"jquery": "^3.4.1",
|
"jquery": "^3.4.1",
|
||||||
@ -45,7 +46,7 @@
|
|||||||
"react-dazzle": "^1.4.0",
|
"react-dazzle": "^1.4.0",
|
||||||
"react-helmet": "^5.2.1",
|
"react-helmet": "^5.2.1",
|
||||||
"react-perfect-scrollbar": "^1.5.8",
|
"react-perfect-scrollbar": "^1.5.8",
|
||||||
"react-scripts": "^3.3.1",
|
"react-scripts": "^3.4.1",
|
||||||
"react-select-country-list": "^2.1.2",
|
"react-select-country-list": "^2.1.2",
|
||||||
"react-sound": "^1.2.0",
|
"react-sound": "^1.2.0",
|
||||||
"react-virtualized": "^9.21.2",
|
"react-virtualized": "^9.21.2",
|
||||||
@ -60,16 +61,13 @@
|
|||||||
"@lingui/cli": "^2.9.1",
|
"@lingui/cli": "^2.9.1",
|
||||||
"@lingui/loader": "^2.9.1",
|
"@lingui/loader": "^2.9.1",
|
||||||
"@types/react": "^16.9.19",
|
"@types/react": "^16.9.19",
|
||||||
|
"babel-core": "7.0.0-bridge.0",
|
||||||
"babel-eslint": "^10.0.3",
|
"babel-eslint": "^10.0.3",
|
||||||
"babel-plugin-dev-expression": "^0.2.2",
|
"babel-plugin-dev-expression": "^0.2.2",
|
||||||
"babel-plugin-import": "^1.13.0",
|
"babel-plugin-import": "^1.13.0",
|
||||||
"babel-plugin-macros": "^2.8.0",
|
"babel-plugin-macros": "^2.8.0",
|
||||||
"babel-plugin-module-resolver": "^4.0.0",
|
"babel-plugin-module-resolver": "^4.0.0",
|
||||||
"cross-env": "^7.0.0",
|
"cross-env": "^7.0.0",
|
||||||
"electron": "^8.1.1",
|
|
||||||
"electron-builder": "^22.4.1",
|
|
||||||
"electron-devtools-installer": "^2.2.4",
|
|
||||||
"electron-reload": "^1.5.0",
|
|
||||||
"eslint": "^6.8.0",
|
"eslint": "^6.8.0",
|
||||||
"eslint-config-react-app": "^5.2.0",
|
"eslint-config-react-app": "^5.2.0",
|
||||||
"eslint-plugin-flowtype": "^4.6.0",
|
"eslint-plugin-flowtype": "^4.6.0",
|
||||||
@ -92,6 +90,9 @@
|
|||||||
"wait-on": "^4.0.0",
|
"wait-on": "^4.0.0",
|
||||||
"workbox-webpack-plugin": "^5.0.0"
|
"workbox-webpack-plugin": "^5.0.0"
|
||||||
},
|
},
|
||||||
|
"engines": {
|
||||||
|
"node": ">= 10.0.0"
|
||||||
|
},
|
||||||
"lingui": {
|
"lingui": {
|
||||||
"fallbackLocale": "en",
|
"fallbackLocale": "en",
|
||||||
"sourceLocale": "en",
|
"sourceLocale": "en",
|
||||||
@ -111,17 +112,6 @@
|
|||||||
},
|
},
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"clean": "rimraf dist",
|
"clean": "rimraf dist",
|
||||||
"postinstall": "electron-builder install-app-deps",
|
|
||||||
"app-dev": "concurrently \"npm run start\" \"wait-on http://localhost:8000 && npm run electron-dev\"",
|
|
||||||
"electron-dev": "cross-env NODE_ENV=development electron .",
|
|
||||||
"electron-prod": "cross-env NODE_ENV=production electron .",
|
|
||||||
"pack:mac": "npm run clean && npm run build && npm run private:build:mac",
|
|
||||||
"pack:win": "npm run clean && npm run build && npm run private:build:win",
|
|
||||||
"pack:linux": "npm run clean && npm run build && npm run private:build:linux",
|
|
||||||
"private:build:all": "electron-builder -mwl",
|
|
||||||
"private:build:mac": "electron-builder --mac",
|
|
||||||
"private:build:win": "electron-builder -c.extraMetadata.main=public/electron.js --win --x64",
|
|
||||||
"private:build:linux": "electron-builder --linux",
|
|
||||||
"analyze": "cross-env ANALYZE=1 umi build",
|
"analyze": "cross-env ANALYZE=1 umi build",
|
||||||
"build": "umi build",
|
"build": "umi build",
|
||||||
"start": "umi dev",
|
"start": "umi dev",
|
||||||
|
@ -1,3 +1,4 @@
|
|||||||
|
import { RenderFeed } from '../../../components/MainFeed'
|
||||||
import { transitionToogle } from '../../../pages/login'
|
import { transitionToogle } from '../../../pages/login'
|
||||||
import { SetControls, CloseControls } from '../../../components/Layout/Control'
|
import { SetControls, CloseControls } from '../../../components/Layout/Control'
|
||||||
import { SwapMode } from '../../../components/Layout/Secondary'
|
import { SwapMode } from '../../../components/Layout/Secondary'
|
||||||
@ -20,7 +21,7 @@ export function SetupApp() {
|
|||||||
localStorage.setItem('resource_bundle', 'light_ng')
|
localStorage.setItem('resource_bundle', 'light_ng')
|
||||||
}
|
}
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
ycore.crouter.native('main')
|
ycore.router.go('main')
|
||||||
}, 500)
|
}, 500)
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -41,6 +42,9 @@ export const SecondarySwap = {
|
|||||||
openPost: e => {
|
openPost: e => {
|
||||||
SwapMode.openPost(e)
|
SwapMode.openPost(e)
|
||||||
},
|
},
|
||||||
|
openSearch: e => {
|
||||||
|
SwapMode.openSearch(e)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export const ControlBar = {
|
export const ControlBar = {
|
||||||
|
@ -13,8 +13,33 @@ export const comty_get = {
|
|||||||
formdata
|
formdata
|
||||||
)
|
)
|
||||||
},
|
},
|
||||||
session_data: () => {},
|
session_id: callback => {
|
||||||
general_data: () => {
|
let formdata = new FormData()
|
||||||
|
formdata.append('type', 'get')
|
||||||
|
|
||||||
|
API_Call((err,res) => {
|
||||||
|
if (err) return false
|
||||||
|
try {
|
||||||
|
const a = JSON.parse(res)['data']
|
||||||
|
return callback(err, a.session_id)
|
||||||
|
} catch (error) {
|
||||||
|
return callback(err, '0x0000')
|
||||||
|
}
|
||||||
|
},
|
||||||
|
endpoints.get_sessions,
|
||||||
|
formdata)
|
||||||
|
},
|
||||||
|
session: (callback) => {
|
||||||
|
let formdata = new FormData()
|
||||||
|
formdata.append('type', 'get')
|
||||||
|
|
||||||
|
API_Call((err,res) => {
|
||||||
|
return callback(err, res)
|
||||||
|
},
|
||||||
|
endpoints.get_sessions,
|
||||||
|
formdata)
|
||||||
|
},
|
||||||
|
general_data: (callback, payload) => {
|
||||||
if (!payload) return false
|
if (!payload) return false
|
||||||
const { id } = payload
|
const { id } = payload
|
||||||
|
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
import { API_Call, endpoints, AppSettings } from 'ycore'
|
import { API_Call, endpoints, AppSettings, yconsole } from 'ycore'
|
||||||
|
|
||||||
export const comty_post = {
|
export const comty_post = {
|
||||||
getFeed: (callback, payload) => {
|
getFeed: (callback, payload) => {
|
||||||
@ -127,6 +127,29 @@ export const comty_post = {
|
|||||||
formdata
|
formdata
|
||||||
)
|
)
|
||||||
},
|
},
|
||||||
|
getSaved: (callback, payload) => {
|
||||||
|
if (!payload) {
|
||||||
|
yconsole.log(
|
||||||
|
'Calling api without Payload!!! | Limmit & OffsetKey = default |'
|
||||||
|
)
|
||||||
|
}
|
||||||
|
if (payload) {
|
||||||
|
const { limit, fkey } = payload
|
||||||
|
}
|
||||||
|
|
||||||
|
let formdata = new FormData()
|
||||||
|
formdata.append('type', 'saved')
|
||||||
|
formdata.append('limit', payload? limit : AppSettings.limit_post_catch || 20)
|
||||||
|
formdata.append('after_post_id', payload? fkey : 0)
|
||||||
|
|
||||||
|
API_Call(
|
||||||
|
(err, res) => {
|
||||||
|
return callback(err, res)
|
||||||
|
},
|
||||||
|
endpoints.get_posts,
|
||||||
|
formdata
|
||||||
|
)
|
||||||
|
},
|
||||||
edit: (callback, payload) => {},
|
edit: (callback, payload) => {},
|
||||||
__pin: (callback, payload) => {},
|
__pin: (callback, payload) => {},
|
||||||
__boost: (callback, payload) => {
|
__boost: (callback, payload) => {
|
||||||
|
@ -1,46 +0,0 @@
|
|||||||
import { __server, yconsole, endpoints, token_data } from 'ycore'
|
|
||||||
|
|
||||||
export const get_app_session = {
|
|
||||||
get_id: callback => {
|
|
||||||
let formdata = new FormData()
|
|
||||||
formdata.append('server_key', __server.getKey())
|
|
||||||
formdata.append('type', 'get')
|
|
||||||
const requestOptions = {
|
|
||||||
method: 'POST',
|
|
||||||
body: formdata,
|
|
||||||
redirect: 'follow',
|
|
||||||
}
|
|
||||||
const uriObj = `${endpoints.get_sessions}${token_data.__token()}`
|
|
||||||
fetch(uriObj, requestOptions)
|
|
||||||
.then(response => response.text())
|
|
||||||
.then(result => {
|
|
||||||
const pre = JSON.stringify(result)
|
|
||||||
const pre2 = JSON.parse(pre)
|
|
||||||
const pre3 = JSON.stringify(JSON.parse(pre2)['data'])
|
|
||||||
const obj = JSON.parse(pre3)['session_id']
|
|
||||||
return callback(null, obj)
|
|
||||||
})
|
|
||||||
.catch(error => yconsole.log('error', error))
|
|
||||||
},
|
|
||||||
raw: callback => {
|
|
||||||
const formdata = new FormData()
|
|
||||||
formdata.append('server_key', __server.getKey())
|
|
||||||
formdata.append('type', 'get')
|
|
||||||
const requestOptions = {
|
|
||||||
method: 'POST',
|
|
||||||
body: formdata,
|
|
||||||
redirect: 'follow',
|
|
||||||
}
|
|
||||||
const uriObj = `${endpoints.get_sessions}${token_data.__token()}`
|
|
||||||
fetch(uriObj, requestOptions)
|
|
||||||
.then(response => response.text())
|
|
||||||
.then(result => {
|
|
||||||
const pre = JSON.stringify(result)
|
|
||||||
const parsed = JSON.parse(pre)
|
|
||||||
const obj = JSON.parse(parsed)['data']
|
|
||||||
yconsole.log(result, obj)
|
|
||||||
return callback(null, obj)
|
|
||||||
})
|
|
||||||
.catch(error => yconsole.log('error', error))
|
|
||||||
},
|
|
||||||
}
|
|
@ -5,7 +5,6 @@ import { RenderFeed } from 'components/MainFeed'
|
|||||||
export * from './comty_post.js'
|
export * from './comty_post.js'
|
||||||
export * from './comty_user.js'
|
export * from './comty_user.js'
|
||||||
export * from './comty_post_comment.js'
|
export * from './comty_post_comment.js'
|
||||||
export * from './get_app_session.js'
|
|
||||||
export * from './comty_search.js'
|
export * from './comty_search.js'
|
||||||
export * from './comty_get.js'
|
export * from './comty_get.js'
|
||||||
|
|
||||||
@ -31,6 +30,9 @@ export const IsThisPost = {
|
|||||||
},
|
},
|
||||||
boosted: () => {
|
boosted: () => {
|
||||||
|
|
||||||
|
},
|
||||||
|
saved: () => {
|
||||||
|
|
||||||
},
|
},
|
||||||
pinned: () => {
|
pinned: () => {
|
||||||
|
|
||||||
|
@ -13,13 +13,13 @@ export const Alive_API = {
|
|||||||
ycore.notify.expire(
|
ycore.notify.expire(
|
||||||
'It seems that your token has expired or no longer exists'
|
'It seems that your token has expired or no longer exists'
|
||||||
)
|
)
|
||||||
ycore.crouter.native('login')
|
ycore.router.go('login')
|
||||||
},
|
},
|
||||||
violation: a => {
|
violation: a => {
|
||||||
ycore.notify.expire(
|
ycore.notify.expire(
|
||||||
'It seems that there has been a problem with your token, we need you to log in again.'
|
'It seems that there has been a problem with your token, we need you to log in again.'
|
||||||
)
|
)
|
||||||
ycore.crouter.native('login')
|
ycore.router.go('login')
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
export const __server = {
|
export const __server = {
|
||||||
|
@ -20,7 +20,6 @@ import './libs.js'
|
|||||||
export * from '../../config/app.settings.js'
|
export * from '../../config/app.settings.js'
|
||||||
export * from './libs.js'
|
export * from './libs.js'
|
||||||
|
|
||||||
export var { router } = require('utils')
|
|
||||||
export var endpoints = Endpoints
|
export var endpoints = Endpoints
|
||||||
|
|
||||||
export const package_json = require('../../package.json')
|
export const package_json = require('../../package.json')
|
||||||
@ -200,6 +199,17 @@ export function gotoBottom(id) {
|
|||||||
element.scrollTop = element.scrollHeight - element.clientHeight
|
element.scrollTop = element.scrollHeight - element.clientHeight
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Go to top of an element by id
|
||||||
|
*
|
||||||
|
* @param id {string}
|
||||||
|
* @return null
|
||||||
|
*/
|
||||||
|
export function gotoTop(id) {
|
||||||
|
const element = document.getElementById(id)
|
||||||
|
element.scrollTop = element.scrollHeight + element.clientHeight
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Go to position of an element by id
|
* Go to position of an element by id
|
||||||
*
|
*
|
||||||
@ -233,16 +243,14 @@ export const time = {
|
|||||||
* Framework functionality for navigate between pages (Router)
|
* Framework functionality for navigate between pages (Router)
|
||||||
*
|
*
|
||||||
*/
|
*/
|
||||||
export const crouter = {
|
export const router = {
|
||||||
native: e => {
|
go: e => {
|
||||||
|
gotoElement('primaryContent')
|
||||||
umiRouter.push({
|
umiRouter.push({
|
||||||
pathname: `/${e}`,
|
pathname: `/${e}`,
|
||||||
search: window.location.search,
|
search: window.location.search,
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
default: e => {
|
|
||||||
router.push(e)
|
|
||||||
},
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
@ -2,7 +2,10 @@ const VerifiedBadge = () => (<svg xmlns="http://www.w3.org/2000/svg" fill="#55ac
|
|||||||
const CommonThings = () => (<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="#ff5991" d="M15,2C16.94,2 18.59,2.7 19.95,4.05C21.3,5.41 22,7.06 22,9C22,10.56 21.5,11.96 20.58,13.2C19.64,14.43 18.44,15.27 16.97,15.7L17,15.38V15C17,12.81 16.23,10.93 14.65,9.35C13.07,7.77 11.19,7 9,7H8.63L8.3,7.03C8.73,5.56 9.57,4.36 10.8,3.42C12.04,2.5 13.44,2 15,2M9,8A7,7 0 0,1 16,15A7,7 0 0,1 9,22A7,7 0 0,1 2,15A7,7 0 0,1 9,8M9,10A5,5 0 0,0 4,15A5,5 0 0,0 9,20A5,5 0 0,0 14,15A5,5 0 0,0 9,10Z"></path></svg>)
|
const CommonThings = () => (<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="#ff5991" d="M15,2C16.94,2 18.59,2.7 19.95,4.05C21.3,5.41 22,7.06 22,9C22,10.56 21.5,11.96 20.58,13.2C19.64,14.43 18.44,15.27 16.97,15.7L17,15.38V15C17,12.81 16.23,10.93 14.65,9.35C13.07,7.77 11.19,7 9,7H8.63L8.3,7.03C8.73,5.56 9.57,4.36 10.8,3.42C12.04,2.5 13.44,2 15,2M9,8A7,7 0 0,1 16,15A7,7 0 0,1 9,22A7,7 0 0,1 2,15A7,7 0 0,1 9,8M9,10A5,5 0 0,0 4,15A5,5 0 0,0 9,20A5,5 0 0,0 14,15A5,5 0 0,0 9,10Z"></path></svg>)
|
||||||
const SunSVG = () => (<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 21 21"><g fill="none" fillRule="evenodd"><path fill="#fff" fillRule="nonzero" d="M21 10.5l-3 3V18h-4.5l-3 3-3-3H3v-4.5l-3-3 3-3V3h4.5l3-3 3 3H18v4.5z"></path><circle stroke="#000" strokeWidth="1.5" cx="10.5" cy="10.5" r="4"></circle></g></svg>)
|
const SunSVG = () => (<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 21 21"><g fill="none" fillRule="evenodd"><path fill="#fff" fillRule="nonzero" d="M21 10.5l-3 3V18h-4.5l-3 3-3-3H3v-4.5l-3-3 3-3V3h4.5l3-3 3 3H18v4.5z"></path><circle stroke="#000" strokeWidth="1.5" cx="10.5" cy="10.5" r="4"></circle></g></svg>)
|
||||||
const MoonSVG = () => (<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 21 21"><g fill="none" fillRule="evenodd"><circle fill="#fff" cx="10.5" cy="10.5" r="10.5"></circle><path d="M13.396 11c0-3.019-1.832-5.584-4.394-6.566A6.427 6.427 0 0111.304 4C15.002 4 18 7.135 18 11c0 3.866-2.998 7-6.698 7A6.42 6.42 0 019 17.566c2.564-.98 4.396-3.545 4.396-6.566z" fill="#2F2E30" fillRule="nonzero"></path></g></svg>)
|
const MoonSVG = () => (<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 21 21"><g fill="none" fillRule="evenodd"><circle fill="#fff" cx="10.5" cy="10.5" r="10.5"></circle><path d="M13.396 11c0-3.019-1.832-5.584-4.394-6.566A6.427 6.427 0 0111.304 4C15.002 4 18 7.135 18 11c0 3.866-2.998 7-6.698 7A6.42 6.42 0 019 17.566c2.564-.98 4.396-3.545 4.396-6.566z" fill="#2F2E30" fillRule="nonzero"></path></g></svg>)
|
||||||
const RobotOutlined = () => (<svg viewBox="64 64 896 896" focusable="false" class="" data-icon="robot" width="1em" height="1em" fill="currentColor" aria-hidden="true"><path d="M300 328a60 60 0 10120 0 60 60 0 10-120 0zM852 64H172c-17.7 0-32 14.3-32 32v660c0 17.7 14.3 32 32 32h680c17.7 0 32-14.3 32-32V96c0-17.7-14.3-32-32-32zm-32 660H204V128h616v596zM604 328a60 60 0 10120 0 60 60 0 10-120 0zm250.2 556H169.8c-16.5 0-29.8 14.3-29.8 32v36c0 4.4 3.3 8 7.4 8h729.1c4.1 0 7.4-3.6 7.4-8v-36c.1-17.7-13.2-32-29.7-32zM664 508H360c-4.4 0-8 3.6-8 8v60c0 4.4 3.6 8 8 8h304c4.4 0 8-3.6 8-8v-60c0-4.4-3.6-8-8-8z"></path></svg>)
|
const RobotOutlined = () => (<svg viewBox="64 64 896 896" focusable="false" data-icon="robot" width="1em" height="1em" fill="currentColor" aria-hidden="true"><path d="M300 328a60 60 0 10120 0 60 60 0 10-120 0zM852 64H172c-17.7 0-32 14.3-32 32v660c0 17.7 14.3 32 32 32h680c17.7 0 32-14.3 32-32V96c0-17.7-14.3-32-32-32zm-32 660H204V128h616v596zM604 328a60 60 0 10120 0 60 60 0 10-120 0zm250.2 556H169.8c-16.5 0-29.8 14.3-29.8 32v36c0 4.4 3.3 8 7.4 8h729.1c4.1 0 7.4-3.6 7.4-8v-36c.1-17.7-13.2-32-29.7-32zM664 508H360c-4.4 0-8 3.6-8 8v60c0 4.4 3.6 8 8 8h304c4.4 0 8-3.6 8-8v-60c0-4.4-3.6-8-8-8z"></path></svg>)
|
||||||
|
const SavedPost = () => (<svg viewBox="0 0 24 24" focusable="false" width="1em" height="1em" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" ><path d="M4 3h16a2 2 0 0 1 2 2v6a10 10 0 0 1-10 10A10 10 0 0 1 2 11V5a2 2 0 0 1 2-2z"></path><polyline points="8 10 12 14 16 10"></polyline></svg>)
|
||||||
|
const SavedPostColor = () => (<svg viewBox="0 0 24 24" focusable="false" width="1em" height="1em" fill="rgb(230, 247, 255)" stroke="rgb(24, 144, 255)" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" ><path d="M4 3h16a2 2 0 0 1 2 2v6a10 10 0 0 1-10 10A10 10 0 0 1 2 11V5a2 2 0 0 1 2-2z"></path><polyline points="8 10 12 14 16 10"></polyline></svg>)
|
||||||
|
const SavedPostGrey = () => (<svg viewBox="0 0 24 24" focusable="false" width="1em" height="1em" fill="rgb(196, 196, 196)" stroke="rgba(133, 133, 133, 1)" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" ><path d="M4 3h16a2 2 0 0 1 2 2v6a10 10 0 0 1-10 10A10 10 0 0 1 2 11V5a2 2 0 0 1 2-2z"></path><polyline points="8 10 12 14 16 10"></polyline></svg>)
|
||||||
|
|
||||||
const CustomIcons = {VerifiedBadge, CommonThings, SunSVG, MoonSVG, RobotOutlined}
|
const CustomIcons = {SavedPostGrey, SavedPostColor, VerifiedBadge, CommonThings, SunSVG, MoonSVG, RobotOutlined, SavedPost}
|
||||||
export default CustomIcons
|
export default CustomIcons
|
||||||
|
@ -30,10 +30,16 @@ export default class HeaderSearch extends Component {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
openSearcher = () => {
|
||||||
|
const { value } = this.state
|
||||||
|
ycore.SecondarySwap.openSearch(value);
|
||||||
|
}
|
||||||
|
|
||||||
sendToSearch = () => {
|
sendToSearch = () => {
|
||||||
const { value } = this.state
|
const { value } = this.state
|
||||||
ycore.crouter.native(`s/${value}`)
|
ycore.router.go(`s/${value}`)
|
||||||
}
|
}
|
||||||
|
|
||||||
onChange = e => {
|
onChange = e => {
|
||||||
const { value } = e.target
|
const { value } = e.target
|
||||||
this.setState({ value: value })
|
this.setState({ value: value })
|
||||||
@ -41,6 +47,7 @@ export default class HeaderSearch extends Component {
|
|||||||
this.autosend()
|
this.autosend()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
autosend = () => {
|
autosend = () => {
|
||||||
let timeout = null
|
let timeout = null
|
||||||
let input = document.getElementById('search_input')
|
let input = document.getElementById('search_input')
|
||||||
@ -48,7 +55,7 @@ export default class HeaderSearch extends Component {
|
|||||||
clearTimeout(timeout)
|
clearTimeout(timeout)
|
||||||
timeout = setTimeout(() => {
|
timeout = setTimeout(() => {
|
||||||
const { value } = this.state
|
const { value } = this.state
|
||||||
ycore.crouter.native(`s/${value}`)
|
ycore.router.go(`s/${value}`)
|
||||||
}, 500)
|
}, 500)
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
@ -67,7 +74,7 @@ export default class HeaderSearch extends Component {
|
|||||||
prefix={<Icons.SearchOutlined />}
|
prefix={<Icons.SearchOutlined />}
|
||||||
placeholder=" Search on Comty..."
|
placeholder=" Search on Comty..."
|
||||||
onChange={this.onChange}
|
onChange={this.onChange}
|
||||||
onPressEnter={this.sendToSearch}
|
onPressEnter={this.openSearcher}
|
||||||
/>
|
/>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
@import '~themes/vars.less';
|
@import '~themes/index.less';
|
||||||
|
|
||||||
.HeaderSearchWrapper {
|
.HeaderSearchWrapper {
|
||||||
z-index: 20;
|
z-index: 20;
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
@import '~themes/vars.less';
|
@import '~themes/index.less';
|
||||||
|
|
||||||
@LDarkMode-backgroud: rgba(47, 46, 48, 0.74);
|
@LDarkMode-backgroud: rgba(47, 46, 48, 0.74);
|
||||||
@LLightMode-backgroud: #fff;
|
@LLightMode-backgroud: #fff;
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
@import '~themes/vars.less';
|
@import '~themes/index.less';
|
||||||
|
|
||||||
.ControlCard {
|
.ControlCard {
|
||||||
background-color: rgba(0, 0, 0, 0.1);
|
background-color: rgba(0, 0, 0, 0.1);
|
||||||
|
@ -5,7 +5,7 @@ import * as Icons from '@ant-design/icons'
|
|||||||
import styles from './index.less'
|
import styles from './index.less'
|
||||||
import classnames from 'classnames'
|
import classnames from 'classnames'
|
||||||
|
|
||||||
import { __priPost, __secComments } from './renders.js'
|
import { __priPost, __secComments, __priSearch } from './renders.js'
|
||||||
|
|
||||||
export const SwapMode = {
|
export const SwapMode = {
|
||||||
close: () => {
|
close: () => {
|
||||||
@ -13,10 +13,19 @@ export const SwapMode = {
|
|||||||
},
|
},
|
||||||
openPost: (a, b) => {
|
openPost: (a, b) => {
|
||||||
SecondaryLayoutComponent.setState({
|
SecondaryLayoutComponent.setState({
|
||||||
swap: true,
|
|
||||||
mode: 'post',
|
mode: 'post',
|
||||||
global_raw: a,
|
global_raw: a,
|
||||||
})
|
})
|
||||||
|
SecondaryLayoutComponent.Swapper.open()
|
||||||
|
},
|
||||||
|
openSearch: a => {
|
||||||
|
SecondaryLayoutComponent.setState({
|
||||||
|
halfSwap: true,
|
||||||
|
loading: true,
|
||||||
|
mode: 'search',
|
||||||
|
pri_raw: a,
|
||||||
|
})
|
||||||
|
SecondaryLayoutComponent.Swapper.half()
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -24,6 +33,7 @@ export default class Secondary extends React.PureComponent {
|
|||||||
constructor(props) {
|
constructor(props) {
|
||||||
super(props), (window.SecondaryLayoutComponent = this)
|
super(props), (window.SecondaryLayoutComponent = this)
|
||||||
this.state = {
|
this.state = {
|
||||||
|
half: false,
|
||||||
swap: false,
|
swap: false,
|
||||||
mode: '',
|
mode: '',
|
||||||
global_raw: '',
|
global_raw: '',
|
||||||
@ -32,13 +42,29 @@ export default class Secondary extends React.PureComponent {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
closeSwap() {
|
Swapper = {
|
||||||
|
close: () => {
|
||||||
this.setState({
|
this.setState({
|
||||||
swap: !this.state.swap,
|
swap: false,
|
||||||
|
half: false,
|
||||||
pri_raw: null,
|
pri_raw: null,
|
||||||
sec_raw: null,
|
sec_raw: null,
|
||||||
mode: '',
|
global_raw: null,
|
||||||
|
mode: null,
|
||||||
})
|
})
|
||||||
|
},
|
||||||
|
open: () => {
|
||||||
|
this.setState({
|
||||||
|
swap: true,
|
||||||
|
half: false,
|
||||||
|
})
|
||||||
|
},
|
||||||
|
half : () => {
|
||||||
|
this.setState({
|
||||||
|
swap: false,
|
||||||
|
half: true,
|
||||||
|
})
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
SwapBalanceContent(container) {
|
SwapBalanceContent(container) {
|
||||||
@ -60,6 +86,9 @@ export default class Secondary extends React.PureComponent {
|
|||||||
case 'post': {
|
case 'post': {
|
||||||
return this.renderPost(this.state.global_raw)
|
return this.renderPost(this.state.global_raw)
|
||||||
}
|
}
|
||||||
|
case 'search': {
|
||||||
|
return this.renderSearch(dtraw)
|
||||||
|
}
|
||||||
default:
|
default:
|
||||||
return null
|
return null
|
||||||
}
|
}
|
||||||
@ -75,63 +104,88 @@ export default class Secondary extends React.PureComponent {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
renderSearch = key => {
|
||||||
|
const payload = { key: key }
|
||||||
|
ycore.comty_search.keywords((err, res) => {
|
||||||
|
if (err) {
|
||||||
|
ycore.notify.error(err)
|
||||||
|
}
|
||||||
|
ycore.yconsole.log('Founded entries => ', JSON.parse(res))
|
||||||
|
this.setState({ global_raw: res, loading: false })
|
||||||
|
}, payload)
|
||||||
|
return (
|
||||||
|
<div className={styles.renderSearch_wrapper}>
|
||||||
|
<h2><Icons.SearchOutlined /> Results of {key || '... nothing ?'}</h2>
|
||||||
|
<__priSearch payload={this.state.global_raw} />
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
renderPost = payload => {
|
renderPost = payload => {
|
||||||
const post_data = JSON.parse(payload)['post_data']
|
const post_data = JSON.parse(payload)['post_data']
|
||||||
console.log(post_data)
|
|
||||||
return <__priPost payload={post_data} />
|
return <__priPost payload={post_data} />
|
||||||
}
|
}
|
||||||
|
|
||||||
renderComments = payload => {
|
renderComments = payload => {
|
||||||
|
try {
|
||||||
const post_comments = JSON.parse(payload)['post_comments']
|
const post_comments = JSON.parse(payload)['post_comments']
|
||||||
const post_data = JSON.parse(payload)['post_data']
|
const post_data = JSON.parse(payload)['post_data']
|
||||||
console.log(post_comments)
|
return (
|
||||||
return <__secComments post_id={post_data.post_id} payload={post_comments} />
|
<__secComments post_id={post_data.post_id} payload={post_comments} />
|
||||||
|
)
|
||||||
|
} catch (error) {
|
||||||
|
return null
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
const { userData } = this.props
|
const { userData } = this.props
|
||||||
return (
|
return (
|
||||||
|
<>
|
||||||
|
<div className={styles.__secondary_colider}></div>
|
||||||
<div
|
<div
|
||||||
className={classnames(styles.SecondaryWrapper, {
|
className={classnames(styles.secondary_wrapper, {
|
||||||
[styles.active]: this.state.swap,
|
[styles.active]: this.state.swap,
|
||||||
|
[styles.half]: this.state.half,
|
||||||
})}
|
})}
|
||||||
>
|
>
|
||||||
<div className={styles.UserHeader}>
|
<div className={styles.secondary_userholder}>
|
||||||
<div className={styles.notif_box}></div>
|
<div className={styles.notif_box}></div>
|
||||||
<img
|
<img
|
||||||
onClick={() => ycore.crouter.native(`@${userData.username}`)}
|
onClick={() => ycore.router.go(`@${userData.username}`)}
|
||||||
src={userData.avatar}
|
src={userData.avatar}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div
|
<div
|
||||||
className={classnames(styles.container, {
|
className={styles.secondary_layout_bg}
|
||||||
[styles.desktop_mode]: this.props.desktop_mode,
|
|
||||||
})}
|
|
||||||
>
|
>
|
||||||
<div className={styles.container_body}>
|
|
||||||
{this.state.swap ? (
|
<div className={styles.secondary_container_1}>
|
||||||
|
{this.state.swap || this.state.half ? (
|
||||||
<antd.Button
|
<antd.Button
|
||||||
type="ghost"
|
type="ghost"
|
||||||
icon={<Icons.LeftOutlined />}
|
icon={<Icons.LeftOutlined />}
|
||||||
onClick={() => this.closeSwap()}
|
onClick={() => this.Swapper.close()}
|
||||||
>
|
>
|
||||||
{' '}
|
Back
|
||||||
Back{' '}
|
|
||||||
</antd.Button>
|
</antd.Button>
|
||||||
) : null}
|
) : null}
|
||||||
{this.SwapBalanceContent('__pri')}
|
{this.SwapBalanceContent('__pri')}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div
|
<div
|
||||||
className={classnames(styles.container_2, {
|
className={classnames(styles.secondary_container_2, {
|
||||||
[styles.active]: this.state.swap,
|
[styles.active]: this.state.swap,
|
||||||
})}
|
})}
|
||||||
>
|
>
|
||||||
{this.SwapBalanceContent('__sec')}
|
{this.SwapBalanceContent('__sec')}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -1,45 +1,58 @@
|
|||||||
@SwapAnimDuration: 340ms;
|
@import '~themes/index.less';
|
||||||
|
|
||||||
.SecondaryWrapper {
|
.__secondary_colider{
|
||||||
width: 27%;
|
position: relative;
|
||||||
|
float: right;
|
||||||
|
width: @__secondary_colider_width;
|
||||||
|
height: 100vh;
|
||||||
|
background-color: @__Global_layout_backgroud;
|
||||||
|
}
|
||||||
|
|
||||||
|
.secondary_wrapper {
|
||||||
|
width: @secondary_wrapper_hidden_width;
|
||||||
height: 100vh;
|
height: 100vh;
|
||||||
|
|
||||||
|
z-index: 50;
|
||||||
position: relative;
|
position: absolute;
|
||||||
float: left;
|
right: 0;
|
||||||
overflow-y: hidden !important;
|
top: 0;
|
||||||
overflow-x: hidden;
|
overflow-x: hidden;
|
||||||
|
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
||||||
&.active {
|
&.active {
|
||||||
width: 96vw;
|
width: @secondary_wrapper_showFull_width;
|
||||||
position: absolute;
|
>.container_bg {
|
||||||
right: 0;
|
border-radius: @__Global_layout_border-rd;
|
||||||
|
}
|
||||||
>.container {
|
@media (min-width: 1000px) {
|
||||||
border-radius: 12px 12px 12px 12px;
|
width: 95.4%
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&.half {
|
||||||
|
width: @secondary_wrapper_showHalf_width;
|
||||||
|
>.container_bg {
|
||||||
|
border-radius: 12px 0 0 12px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
transition: all @SwapAnimDuration ease-in-out;
|
transition: width @__Global_SwapAnimDuration ease-in-out;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.UserHeader {
|
.secondary_userholder {
|
||||||
right: 20px;
|
right: 20px;
|
||||||
top: 25px;
|
top: 25px;
|
||||||
display: flex;
|
display: flex;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
z-index: 52;
|
z-index: 51;
|
||||||
|
|
||||||
img {
|
img {
|
||||||
border-radius: 15px;
|
border-radius: 15px;
|
||||||
width: 40px;
|
width: 40px;
|
||||||
transition: all 150ms linear;
|
transition: all 150ms linear;
|
||||||
box-shadow: 0px 0px 0 0px rgba(255, 255, 255, 0);
|
box-shadow: 0px 0px 0 0px rgba(255, 255, 255, 0);
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
img:hover {
|
img:hover {
|
||||||
@ -58,63 +71,78 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.container {
|
.secondary_layout_bg {
|
||||||
z-index: 50;
|
|
||||||
position: relative;
|
|
||||||
background-color: #201F23;
|
|
||||||
color: @DarkMode-color_container !important;
|
|
||||||
|
|
||||||
&.desktop_mode {
|
|
||||||
border-radius: 0 12px 12px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100vh;
|
height: 100%;
|
||||||
|
|
||||||
|
right: 0;
|
||||||
|
z-index: 50;
|
||||||
|
position: absolute;
|
||||||
|
display: flex;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
transition: all @__Global_SwapAnimDuration ease-in-out;
|
||||||
|
background-color: @secondary_container_bg_background;
|
||||||
|
|
||||||
|
border-radius: @__Global_layout_border-rd;
|
||||||
|
}
|
||||||
|
|
||||||
|
.secondary_container_1 {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
|
||||||
|
position: relative;
|
||||||
|
padding: @secondary_container_1_padding;
|
||||||
|
|
||||||
|
color: @secondary_container_1_color;
|
||||||
|
|
||||||
:global {
|
:global {
|
||||||
h1 {
|
|
||||||
color: @DarkMode-color_container;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-btn {
|
.ant-btn {
|
||||||
color: #ffffff;
|
color: @secondary_container_1_btn_color;
|
||||||
background-color: #4c4c4c;
|
background-color: @secondary_container_1_btn_backgroud;
|
||||||
border-color: transparent;
|
border-color: transparent;
|
||||||
border-radius: 12px;
|
border-radius: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.ant-btn:hover {
|
.ant-btn:hover {
|
||||||
box-shadow: 0px 0px 10px 0px rgba(255, 255, 255, 0.205);
|
box-shadow: @secondary_container_1_btn_shadow;
|
||||||
transition: all 150ms linear;
|
transition: all @__Global_Components_transitions_dur linear;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.container_body {
|
.secondary_container_2 {
|
||||||
padding: 30px 375px 30px 75px;
|
position: relative;
|
||||||
}
|
|
||||||
|
|
||||||
.container_2 {
|
|
||||||
z-index: 51;
|
|
||||||
|
|
||||||
background-color: #fff;
|
|
||||||
border-radius: 32px 0 0 32px;
|
|
||||||
padding: 20px 15px 15px 15px;
|
|
||||||
|
|
||||||
width: 0;
|
|
||||||
height: 100vh;
|
height: 100vh;
|
||||||
opacity: 0;
|
width: 0;
|
||||||
|
|
||||||
position: absolute;
|
|
||||||
right: -500px;
|
right: -500px;
|
||||||
|
padding: @secondaty_container_2_padding;
|
||||||
|
|
||||||
|
opacity: 0;
|
||||||
|
color: @secondary_container_2_color;
|
||||||
|
background-color: @secondary_container_2_backgroud;
|
||||||
|
|
||||||
|
border-radius: 32px 0 0 32px;
|
||||||
|
|
||||||
&.active {
|
&.active {
|
||||||
width: 300px;
|
width: 400px;
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
right: 0;
|
right: 0;
|
||||||
|
@media (min-width: 1000px) {
|
||||||
|
width: 600px
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
transition: all @SwapAnimDuration ease-in-out;
|
transition: all @__Global_SwapAnimDuration ease-in-out;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.comments_body {}
|
.renderSearch_wrapper {
|
||||||
|
height: 87vh;
|
||||||
|
overflow: hidden;
|
||||||
|
margin: 20px 0 0 0;
|
||||||
|
font-family: @__Global_general_font_family;
|
||||||
|
h2 {
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
}
|
@ -1,5 +1,6 @@
|
|||||||
import React from 'react'
|
import React from 'react'
|
||||||
import styles from './renders.less'
|
import styles from './renders.less'
|
||||||
|
import { SearchCard } from 'components'
|
||||||
|
|
||||||
import * as antd from 'antd'
|
import * as antd from 'antd'
|
||||||
import * as ycore from 'ycore'
|
import * as ycore from 'ycore'
|
||||||
@ -16,7 +17,6 @@ const VerifiedBadge = () => (
|
|||||||
height="15"
|
height="15"
|
||||||
viewBox="0 0 24 24"
|
viewBox="0 0 24 24"
|
||||||
>
|
>
|
||||||
{' '}
|
|
||||||
<path d="M23 12l-2.44-2.78.34-3.68-3.61-.82-1.89-3.18L12 3 8.6 1.54 6.71 4.72l-3.61.81.34 3.68L1 12l2.44 2.78-.34 3.69 3.61.82 1.89 3.18L12 21l3.4 1.46 1.89-3.18 3.61-.82-.34-3.68L23 12m-13 5l-4-4 1.41-1.41L10 14.17l6.59-6.59L18 9l-8 8z"></path>
|
<path d="M23 12l-2.44-2.78.34-3.68-3.61-.82-1.89-3.18L12 3 8.6 1.54 6.71 4.72l-3.61.81.34 3.68L1 12l2.44 2.78-.34 3.69 3.61.82 1.89 3.18L12 21l3.4 1.46 1.89-3.18 3.61-.82-.34-3.68L23 12m-13 5l-4-4 1.41-1.41L10 14.17l6.59-6.59L18 9l-8 8z"></path>
|
||||||
</svg>
|
</svg>
|
||||||
)
|
)
|
||||||
@ -80,7 +80,7 @@ export class __secComments extends React.Component {
|
|||||||
loading: false,
|
loading: false,
|
||||||
}
|
}
|
||||||
handleDeleteComment(id) {
|
handleDeleteComment(id) {
|
||||||
console.log(`Removing Comment with id => ${id}`)
|
ycore.yconsole.log(`Removing Comment with id => ${id}`)
|
||||||
ycore.comty_post_comment.delete(
|
ycore.comty_post_comment.delete(
|
||||||
(err, res) => {
|
(err, res) => {
|
||||||
if (err) {
|
if (err) {
|
||||||
@ -199,3 +199,99 @@ export class __secComments extends React.Component {
|
|||||||
)
|
)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export class __priSearch extends React.Component {
|
||||||
|
renderResult = source => {
|
||||||
|
try {
|
||||||
|
const Empty = (
|
||||||
|
<div>
|
||||||
|
<antd.Result
|
||||||
|
status="404"
|
||||||
|
title="Nothing..."
|
||||||
|
subTitle="Sorry, this does not exist."
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
|
||||||
|
// TO DO: Settings serach & Post Search
|
||||||
|
const usersParsed = JSON.parse(source)['users']
|
||||||
|
const groupsParsed = JSON.parse(source)['groups']
|
||||||
|
const pagesParsed = JSON.parse(source)['pages']
|
||||||
|
|
||||||
|
const users = () => {
|
||||||
|
if (usersParsed.length >= 1) {
|
||||||
|
ycore.yconsole.log('Users => ', usersParsed)
|
||||||
|
return this.EntryComponent('Users', usersParsed)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
const groups = () => {
|
||||||
|
if (groupsParsed.length >= 1) {
|
||||||
|
ycore.yconsole.log('Groups => ', groupsParsed)
|
||||||
|
return this.EntryComponent('Groups', groupsParsed)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
const pages = () => {
|
||||||
|
if (pagesParsed.length >= 1) {
|
||||||
|
ycore.yconsole.log('Pages => ', pagesParsed)
|
||||||
|
return this.EntryComponent('Pages', pagesParsed)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if (
|
||||||
|
!usersParsed.length >= 1 &&
|
||||||
|
!groupsParsed.length >= 1 &&
|
||||||
|
!pagesParsed.length >= 1
|
||||||
|
) {
|
||||||
|
return Empty
|
||||||
|
}
|
||||||
|
|
||||||
|
return [users(), groups(), pages()]
|
||||||
|
} catch (error) {
|
||||||
|
return (
|
||||||
|
<center>
|
||||||
|
<h2>Render Error</h2>
|
||||||
|
</center>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
EntryComponent = (t, source) => {
|
||||||
|
try {
|
||||||
|
return (
|
||||||
|
<antd.List
|
||||||
|
dataSource={source}
|
||||||
|
renderItem={item =>
|
||||||
|
<div id={item.id} className={styles.search_card} onClick={() => {ycore.router.go(`@${item.username}`)}}>
|
||||||
|
<div className={styles.search_title}>
|
||||||
|
<img src={item.avatar} />
|
||||||
|
<p className={styles.search_user_username}>
|
||||||
|
@{item.username}
|
||||||
|
{ycore.booleanFix(item.verified) ? (
|
||||||
|
<Icon component={VerifiedBadge} />
|
||||||
|
) : null}
|
||||||
|
</p>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div className={styles.search_text}>
|
||||||
|
<p>{item.about}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
|
||||||
|
)
|
||||||
|
} catch (error) {
|
||||||
|
return (
|
||||||
|
<center>
|
||||||
|
<h2>Render Error</h2>
|
||||||
|
</center>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
render(){
|
||||||
|
return(
|
||||||
|
<div className={styles.search_wrapper}>
|
||||||
|
{this.renderResult(this.props.payload)}
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
@import '~themes/vars.less';
|
@import '~themes/index.less';
|
||||||
|
|
||||||
.SecondaryBody {
|
.SecondaryBody {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
@ -130,6 +130,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.comments_body {
|
.comments_body {
|
||||||
|
height: 100%;
|
||||||
font-family: "Poppins", sans-serif;
|
font-family: "Poppins", sans-serif;
|
||||||
padding: 75px 10px 10px 20px;
|
padding: 75px 10px 10px 20px;
|
||||||
|
|
||||||
@ -145,7 +146,7 @@
|
|||||||
.comments_cards_wrapper {
|
.comments_cards_wrapper {
|
||||||
z-index: 50;
|
z-index: 50;
|
||||||
overflow: scroll;
|
overflow: scroll;
|
||||||
|
height: 84%;
|
||||||
:global {
|
:global {
|
||||||
overflow: scroll;
|
overflow: scroll;
|
||||||
}
|
}
|
||||||
@ -221,3 +222,51 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.search_wrapper{
|
||||||
|
color: #ffffff;
|
||||||
|
height: 100%;
|
||||||
|
width: 82%;
|
||||||
|
margin: auto;
|
||||||
|
:global{
|
||||||
|
.ant-list-items{
|
||||||
|
height: 82vh;
|
||||||
|
overflow: scroll;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.search_card {
|
||||||
|
position: relative;
|
||||||
|
background-color: rgba(255, 255, 255, 0.034);
|
||||||
|
margin: 10px 0 10px 0;
|
||||||
|
border-radius: 8px;
|
||||||
|
padding: 10px;
|
||||||
|
word-break: break-all;
|
||||||
|
color: #ffffff;
|
||||||
|
cursor: pointer;
|
||||||
|
|
||||||
|
.search_title {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
img {
|
||||||
|
float: left;
|
||||||
|
width: 30px;
|
||||||
|
height: 30px;
|
||||||
|
border-radius: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search_user_username {
|
||||||
|
margin: 0 5px 0 8px;
|
||||||
|
vertical-align: middle;
|
||||||
|
height: 100%;
|
||||||
|
color: #ffffff;
|
||||||
|
line-height: 25px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.search_text {
|
||||||
|
margin: 10px 0 0 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
@ -6,135 +6,119 @@ import * as Icons from '@ant-design/icons'
|
|||||||
import Icon from '@ant-design/icons'
|
import Icon from '@ant-design/icons'
|
||||||
|
|
||||||
import { withI18n, Trans } from '@lingui/react'
|
import { withI18n, Trans } from '@lingui/react'
|
||||||
import ScrollBar from '../ScrollBar'
|
|
||||||
import { config } from 'utils'
|
import { config } from 'utils'
|
||||||
import styles from './Sider.less'
|
import styles from './Sider.less'
|
||||||
import * as ycore from 'ycore'
|
import * as ycore from 'ycore'
|
||||||
import router from 'umi/router'
|
import router from 'umi/router'
|
||||||
import { CustomIcons } from 'components'
|
import CustomIcons from '../CustomIcons'
|
||||||
|
|
||||||
@withI18n()
|
@withI18n()
|
||||||
class Sider extends PureComponent {
|
class Sider extends PureComponent {
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
super(props)
|
super(props)
|
||||||
this.state = {
|
this.state = {
|
||||||
|
selectedKey: '',
|
||||||
isHover: false,
|
isHover: false,
|
||||||
collapsedWidth: '30',
|
collapsedWidth: '70',
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
StrictMode = () => {
|
isSelected(key){
|
||||||
const { theme } = this.props
|
if (this.state.selectedKey == (key)) {
|
||||||
if (ycore.AppSettings.StrictLightMode == false) {
|
|
||||||
return 'dark'
|
|
||||||
}
|
|
||||||
return theme
|
|
||||||
}
|
|
||||||
|
|
||||||
handleClickMenu = e => {
|
|
||||||
e.key === 'SignOut' && ycore.app_session.logout()
|
|
||||||
e.key === 'general_settings' && ycore.crouter.native('settings')
|
|
||||||
e.key === 'accountpage' && router.push('/account')
|
|
||||||
e.key === 'explore' && router.push('main')
|
|
||||||
e.key === 'admin_area' && router.push('__m')
|
|
||||||
}
|
|
||||||
|
|
||||||
isDarkMode() {
|
|
||||||
const { theme } = this.props
|
|
||||||
if (theme == 'dark') {
|
|
||||||
return true
|
return true
|
||||||
}
|
}
|
||||||
return false
|
return false
|
||||||
}
|
}
|
||||||
|
|
||||||
|
onClickFunctions = {
|
||||||
|
saves: (e) => {
|
||||||
|
this.setState({selectedKey: e})
|
||||||
|
ycore.router.go('saves')
|
||||||
|
},
|
||||||
|
events: (e) => {
|
||||||
|
this.setState({selectedKey: e})
|
||||||
|
ycore.router.go('events')
|
||||||
|
},
|
||||||
|
marketplace: (e) => {
|
||||||
|
this.setState({selectedKey: e})
|
||||||
|
ycore.router.go('marketplace')
|
||||||
|
},
|
||||||
|
explore: (e) => {
|
||||||
|
this.setState({selectedKey: e})
|
||||||
|
ycore.router.go('main')
|
||||||
|
},
|
||||||
|
}
|
||||||
|
|
||||||
|
handleClickMenu = e => {
|
||||||
|
e.key === 'SignOut' && ycore.app_session.logout()
|
||||||
|
e.key === 'general_settings' && ycore.router.go('settings')
|
||||||
|
e.key === 'saves' && this.onClickFunctions.saves(e.key)
|
||||||
|
e.key === 'events' && this.onClickFunctions.events(e.key)
|
||||||
|
e.key === 'marketplace' && this.onClickFunctions.marketplace(e.key)
|
||||||
|
e.key === 'explore' && this.onClickFunctions.explore(e.key)
|
||||||
|
e.key === 'debug_area' && ycore.router.go('__m')
|
||||||
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
const {
|
|
||||||
theme,
|
|
||||||
userData,
|
|
||||||
collapsed,
|
|
||||||
onThemeChange,
|
|
||||||
onCollapseChange,
|
|
||||||
} = this.props
|
|
||||||
return (
|
return (
|
||||||
<div className={styles.siderwrapper}>
|
<div className={styles.left_sider_wrapper}>
|
||||||
<antd.Layout.Sider
|
<antd.Layout.Sider
|
||||||
breakpoint="lg"
|
|
||||||
trigger={null}
|
trigger={null}
|
||||||
collapsible
|
collapsed
|
||||||
defaultCollapsed="true"
|
width="90"
|
||||||
collapsedWidth={this.state.collapsedWidth}
|
className={styles.left_sider_container}
|
||||||
theme={this.StrictMode()}
|
|
||||||
width="180"
|
|
||||||
collapsed={collapsed}
|
|
||||||
className={classnames(styles.sider, {
|
|
||||||
[styles.darkmd]: this.isDarkMode(),
|
|
||||||
[styles.desktop_mode]: this.props.desktop_mode,
|
|
||||||
})}
|
|
||||||
onMouseEnter={() => this.setState({ collapsedWidth: '90' })}
|
|
||||||
onMouseLeave={() => this.setState({ collapsedWidth: '35' })}
|
|
||||||
>
|
>
|
||||||
<div className={styles.brand}>
|
<div className={styles.left_sider_brandholder}>
|
||||||
<img
|
<img
|
||||||
onClick={() => ycore.crouter.native('main')}
|
onClick={() => ycore.router.go('main')}
|
||||||
src={collapsed ? config.LogoPath : config.FullLogoPath}
|
src={config.LogoPath}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div
|
|
||||||
className={
|
<div className={styles.left_sider_menuContainer}>
|
||||||
this.StrictMode()
|
|
||||||
? styles.CollapserWrapperLight
|
|
||||||
: styles.CollapserWrapperDark
|
|
||||||
}
|
|
||||||
>
|
|
||||||
<antd.Button
|
|
||||||
width={'20px'}
|
|
||||||
onClick={() => onCollapseChange(!collapsed)}
|
|
||||||
icon={
|
|
||||||
collapsed ? (
|
|
||||||
<Icons.RightOutlined />
|
|
||||||
) : (
|
|
||||||
<Icons.DoubleLeftOutlined />
|
|
||||||
)
|
|
||||||
}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div className={styles.menuContainer}>
|
|
||||||
<ScrollBar options={{ suppressScrollX: true }}>
|
|
||||||
<antd.Menu
|
<antd.Menu
|
||||||
className={
|
selectable={false}
|
||||||
collapsed ? styles.menuItemsCollapsed : styles.menuItems
|
className={styles.left_sider_menuItems}
|
||||||
}
|
|
||||||
mode="vertical"
|
mode="vertical"
|
||||||
onClick={this.handleClickMenu}
|
onClick={this.handleClickMenu}
|
||||||
>
|
>
|
||||||
<antd.Menu.Item key="explore">
|
<antd.Menu.Item key="explore">
|
||||||
<Icons.CompassOutlined />
|
<Icons.CompassTwoTone twoToneColor={this.isSelected('explore')? "#28c35d" : "#85858570"} />
|
||||||
<Trans>
|
<Trans>
|
||||||
<span>Explore</span>
|
<span>Explore</span>
|
||||||
</Trans>
|
</Trans>
|
||||||
</antd.Menu.Item>
|
</antd.Menu.Item>
|
||||||
|
|
||||||
<antd.Menu.Item key="journal_page">
|
<antd.Menu.Item key="saves">
|
||||||
<Icons.ReadOutlined />
|
<Icon component={this.isSelected('saves')? CustomIcons.SavedPostColor : CustomIcons.SavedPostGrey} />
|
||||||
<Trans>
|
<Trans>
|
||||||
<span>Journal</span>
|
<span>Saves</span>
|
||||||
</Trans>
|
</Trans>
|
||||||
</antd.Menu.Item>
|
</antd.Menu.Item>
|
||||||
|
|
||||||
<antd.Menu.Item key="marketplace_page">
|
|
||||||
<Icons.ReconciliationOutlined />
|
<antd.Menu.Item key="marketplace">
|
||||||
|
<Icons.ShoppingTwoTone twoToneColor={this.isSelected('marketplace')? "#ff7a45" : "#85858570" }/>
|
||||||
<Trans>
|
<Trans>
|
||||||
<span>Marketplace</span>
|
<span>Marketplace</span>
|
||||||
</Trans>
|
</Trans>
|
||||||
</antd.Menu.Item>
|
</antd.Menu.Item>
|
||||||
|
|
||||||
|
|
||||||
|
<antd.Menu.Item key="events">
|
||||||
|
<Icons.CarryOutTwoTone twoToneColor={this.isSelected('events')? "#ff4d4f" : "#85858570"}/>
|
||||||
|
<Trans>
|
||||||
|
<span>Events</span>
|
||||||
|
</Trans>
|
||||||
|
</antd.Menu.Item>
|
||||||
|
|
||||||
</antd.Menu>
|
</antd.Menu>
|
||||||
|
|
||||||
<div className={styles.something_thats_pulling_me_down}>
|
<div className={styles.something_thats_pulling_me_down}>
|
||||||
<antd.Menu
|
<antd.Menu
|
||||||
selectable={false}
|
selectable={false}
|
||||||
className={
|
className={styles.left_sider_menuItems}
|
||||||
collapsed ? styles.menuItemsCollapsed : styles.menuItems
|
|
||||||
}
|
|
||||||
mode="vertical"
|
mode="vertical"
|
||||||
onClick={this.handleClickMenu}
|
onClick={this.handleClickMenu}
|
||||||
>
|
>
|
||||||
@ -144,52 +128,25 @@ class Sider extends PureComponent {
|
|||||||
<span>Settings</span>
|
<span>Settings</span>
|
||||||
</Trans>
|
</Trans>
|
||||||
</antd.Menu.Item>
|
</antd.Menu.Item>
|
||||||
{ycore.booleanFix(userData.admin) ? (
|
{ycore.IsThisUser.dev() ? (
|
||||||
<antd.Menu.Item key="admin_area">
|
<antd.Menu.Item key="debug_area">
|
||||||
<Icons.ThunderboltOutlined />
|
<Icons.ThunderboltOutlined />
|
||||||
<Trans>
|
<span>Debug</span>
|
||||||
<span>{userData.username}</span>
|
|
||||||
</Trans>
|
|
||||||
</antd.Menu.Item>
|
</antd.Menu.Item>
|
||||||
) : (
|
) : (
|
||||||
undefined
|
undefined
|
||||||
)}
|
)}
|
||||||
<antd.Menu.Item
|
|
||||||
style={{ fontSize: '15px' }}
|
|
||||||
key="LightMode"
|
|
||||||
disabled={false}
|
|
||||||
>
|
|
||||||
{collapsed ? (
|
|
||||||
<Icons.BulbOutlined />
|
|
||||||
) : (
|
|
||||||
<div className={styles.themeSwitcher}>
|
|
||||||
<antd.Switch
|
|
||||||
onChange={onThemeChange.bind(
|
|
||||||
this,
|
|
||||||
theme === 'light' ? 'dark' : 'light'
|
|
||||||
)}
|
|
||||||
checkedChildren={
|
|
||||||
<CustomIcons.MoonSVG
|
|
||||||
style={{ vertialAlign: 'middle' }}
|
|
||||||
/>
|
|
||||||
}
|
|
||||||
unCheckedChildren={
|
|
||||||
<CustomIcons.SunSVG
|
|
||||||
style={{ vertialAlign: 'middle' }}
|
|
||||||
/>
|
|
||||||
}
|
|
||||||
defaultChecked={theme === 'dark'}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</antd.Menu.Item>
|
|
||||||
<antd.Menu.Item key="SignOut">
|
<antd.Menu.Item key="SignOut">
|
||||||
<Icons.LogoutOutlined style={{ color: 'red' }} />
|
<Icons.LogoutOutlined style={{ color: 'red' }} />
|
||||||
{collapsed ? null : <Trans>Logout</Trans>}
|
<Trans>
|
||||||
|
<span>Logout</span>
|
||||||
|
</Trans>
|
||||||
</antd.Menu.Item>
|
</antd.Menu.Item>
|
||||||
|
|
||||||
</antd.Menu>
|
</antd.Menu>
|
||||||
</div>
|
</div>
|
||||||
</ScrollBar>
|
|
||||||
</div>
|
</div>
|
||||||
</antd.Layout.Sider>
|
</antd.Layout.Sider>
|
||||||
</div>
|
</div>
|
||||||
|
@ -1,73 +1,48 @@
|
|||||||
@import '~themes/vars.less';
|
@import '~themes/index.less';
|
||||||
|
|
||||||
@LDarkMode-backgroud: rgba(47, 46, 48, 0.74);
|
|
||||||
@LLightMode-backgroud: #fff;
|
|
||||||
|
|
||||||
@LDarkMode-color: #fff;
|
.left_sider_wrapper {
|
||||||
@LLightMode-color: #2F2E30;
|
border-color: transparent;
|
||||||
|
font-size: 13px;
|
||||||
.CollapserWrapperLight {
|
font-family: @__Global_general_font_family;
|
||||||
height: 100%;
|
height: 100vh;
|
||||||
position: absolute;
|
z-index: 40;
|
||||||
float: left;
|
float: left;
|
||||||
top: 0;
|
position: relative;
|
||||||
left: 0;
|
|
||||||
z-index: 200;
|
|
||||||
vertical-align: middle;
|
|
||||||
|
|
||||||
:global {
|
:global {
|
||||||
|
.ant-layout-sider {
|
||||||
|
background-color: @left_sider_backgroud;
|
||||||
|
|
||||||
.ant-btn {
|
.ant-menu {
|
||||||
border: none;
|
|
||||||
border-radius: unset;
|
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
height: 100%;
|
margin: 0 0 0 5px;
|
||||||
color: white;
|
|
||||||
background-color: transparent;
|
|
||||||
border-color: transparent;
|
|
||||||
box-shadow: none;
|
|
||||||
transition: all 1s ease-in;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.ant-btn:hover {
|
.ant-menu-item {
|
||||||
background: rgba(121, 121, 121, 0.247);
|
color: @left_sider_color;
|
||||||
background: linear-gradient(270deg, rgba(121, 121, 121, 0) 0%, rgba(252, 252, 252, 0.13) 95%);
|
}
|
||||||
transition: all 1s ease-in;
|
|
||||||
|
.anticon {
|
||||||
|
font-size: @left_sider_sizeIcons;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-menu-inline-collapsed,
|
||||||
|
.antd-menu-vertical-left,
|
||||||
|
.ant-menu-vertical {
|
||||||
|
:hover {
|
||||||
|
background-color: @left_sider_menu__onhover_backgroud;
|
||||||
|
color: @left_sider_menu__onhover_color;
|
||||||
|
}
|
||||||
|
|
||||||
|
border-right: 0 solid transparent;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.CollapserWrapperDark {
|
|
||||||
height: 100%;
|
|
||||||
position: absolute;
|
|
||||||
float: left;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
z-index: 200;
|
|
||||||
vertical-align: middle;
|
|
||||||
|
|
||||||
:global {
|
.left_sider_brandholder {
|
||||||
.ant-btn {
|
|
||||||
border: none;
|
|
||||||
border-radius: unset;
|
|
||||||
vertical-align: middle;
|
|
||||||
height: 100%;
|
|
||||||
color: white;
|
|
||||||
background-color: transparent;
|
|
||||||
border-color: transparent;
|
|
||||||
box-shadow: none;
|
|
||||||
transition: all 1s ease-in;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-btn:hover {
|
|
||||||
background: rgba(121, 121, 121, 0.247);
|
|
||||||
background: linear-gradient(270deg, rgba(121, 121, 121, 0) 0%, rgba(121, 121, 121, 0.13) 95%);
|
|
||||||
transition: all 1s ease-in;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.brand {
|
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
|
||||||
img {
|
img {
|
||||||
@ -77,199 +52,42 @@
|
|||||||
margin: 7px auto 15px auto;
|
margin: 7px auto 15px auto;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
max-height: 58px;
|
max-height: 58px;
|
||||||
|
transform: translate(2px, 0);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.avatarFull {
|
|
||||||
width: 120px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.avatar {
|
|
||||||
margin: 0 0 15px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.something_thats_pulling_me_down {
|
.something_thats_pulling_me_down {
|
||||||
|
margin: 0 0 12px 0;
|
||||||
:global {
|
:global {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
.anticon{
|
||||||
|
font-size: 15px!important;
|
||||||
}
|
}
|
||||||
}
|
.ant-menu-item{
|
||||||
|
height: 35px!important;
|
||||||
.siderhead {
|
line-height: 0px!important;
|
||||||
cursor: pointer;
|
padding: 0!important;
|
||||||
font-family: 'Source Sans Pro', sans-serif;
|
margin: 0!important;
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
|
|
||||||
::first-letter {
|
|
||||||
margin-left: 7px;
|
|
||||||
}
|
|
||||||
|
|
||||||
height: 60px;
|
|
||||||
font-size: 17px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.siderwrapper {
|
|
||||||
border-color: transparent;
|
|
||||||
font-size: 13px;
|
|
||||||
font-family: "Poppins", sans-serif;
|
|
||||||
height: 100vh;
|
|
||||||
z-index: 100;
|
|
||||||
float: left;
|
|
||||||
position: relative;
|
|
||||||
|
|
||||||
:global {
|
|
||||||
.ant-layout-sider-dark {
|
|
||||||
background-color: @LDarkMode-backgroud;
|
|
||||||
color: @DarkMode-color;
|
|
||||||
|
|
||||||
h2 {
|
|
||||||
color: @Theme-SiderDeco-Color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-menu-item {
|
|
||||||
color: @DarkMode-color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-menu-inline,
|
|
||||||
.ant-menu-vertical,
|
|
||||||
.ant-menu-vertical-left {
|
|
||||||
:hover {
|
|
||||||
background-color: rgb(80, 80, 80);
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
|
|
||||||
border-right: 1px solid transparent;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-layout-sider-light {
|
|
||||||
background-color: @Theme-SiderDeco-Backgroud;
|
|
||||||
color: @Theme-SiderDeco-Color;
|
|
||||||
|
|
||||||
h2 {
|
|
||||||
color: @Theme-SiderDeco-Color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-menu-item {
|
|
||||||
color: @Theme-SiderDeco-Color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-menu-inline,
|
|
||||||
.ant-menu-vertical,
|
|
||||||
.ant-menu-vertical-left {
|
|
||||||
:hover {
|
|
||||||
background-color: @Theme-Hover-Backgroud;
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
|
|
||||||
border-right: 1px solid transparent;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.sider {
|
.left_sider_container {
|
||||||
border-right: transparent;
|
border-right: transparent;
|
||||||
|
|
||||||
&.desktop_mode {
|
|
||||||
border-radius: 12px 0 0 12px;
|
|
||||||
}
|
|
||||||
|
|
||||||
height: 100%;
|
height: 100%;
|
||||||
z-index: 50;
|
z-index: 50;
|
||||||
|
}
|
||||||
|
|
||||||
:global {
|
.left_sider_menuContainer {
|
||||||
.ant-menu-sub {
|
|
||||||
font-size: 14px;
|
|
||||||
-webkit-box-shadow: 13px 4px 34px 0px rgba(0, 0, 0, 0.005);
|
|
||||||
-moz-box-shadow: 13px 4px 34px 0px rgba(0, 0, 0, 0.005);
|
|
||||||
box-shadow: 13px 4px 34px 0px rgba(0, 0, 0, 0.005);
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-menu-dark {
|
|
||||||
background-color: @LDarkMode-backgroud;
|
|
||||||
color: @LDarkMode-color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-menu-light {
|
|
||||||
background-color: @LLightMode-backgroud;
|
|
||||||
color: @LLightMode-color;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.menuItems {
|
|
||||||
background-color: transparent;
|
|
||||||
margin-bottom: 8px;
|
|
||||||
width: 100%;
|
|
||||||
font-weight: 500;
|
|
||||||
|
|
||||||
animation: fadein 0.5s;
|
|
||||||
|
|
||||||
:global {
|
|
||||||
.ant-menu-item-selected {
|
|
||||||
background-color: transparent;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-menu-item .anticon,
|
|
||||||
.ant-menu-submenu-title .anticon {
|
|
||||||
font-weight: 500;
|
|
||||||
min-width: 14px;
|
|
||||||
margin: 0 10px 0 10px;
|
|
||||||
font-size: 16px;
|
|
||||||
line-height: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.menuItemsCollapsed {
|
|
||||||
background-color: transparent;
|
|
||||||
margin-bottom: 8px;
|
|
||||||
width: 100%;
|
|
||||||
font-weight: 500;
|
|
||||||
|
|
||||||
animation: fadein 0.5s;
|
|
||||||
|
|
||||||
:global {
|
|
||||||
.ant-menu-item-selected {
|
|
||||||
background-color: transparent;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-menu-item {
|
|
||||||
padding: 0 !important;
|
|
||||||
margin: 2px 0 2px 0;
|
|
||||||
width: 100%;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.menuContainer {
|
|
||||||
height: 100%;
|
height: 100%;
|
||||||
margin: 18px 0 8px 0;
|
margin: 18px 0 8px 0;
|
||||||
|
|
||||||
.scrollbar-container {
|
|
||||||
position: initial;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
overflow-x: hidden;
|
overflow-x: hidden;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
|
|
||||||
&::-webkit-scrollbar-thumb {
|
|
||||||
background-color: transparent;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
&::-webkit-scrollbar-thumb {
|
|
||||||
background-color: rgba(59, 59, 59, 0.2);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
:global {
|
:global {
|
||||||
.ant-layout-sider-children {
|
.ant-layout-sider-children {
|
||||||
display: flex;
|
display: flex;
|
||||||
@ -290,53 +108,30 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.scrollbar-container {
|
|
||||||
position: initial;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-menu-inline .ant-menu-item {
|
.ant-menu-inline .ant-menu-item {
|
||||||
font-size: 14px;
|
font-family: @__Global_general_font_family;
|
||||||
font-family: 'Source Sans Pro', sans-serif;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.ant-menu-dark .ant-menu-item a {
|
.ant-menu-dark .ant-menu-item a {
|
||||||
color: rgb(197, 197, 197);
|
color: rgb(197, 197, 197);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.scrollbar-container {
|
.left_sider_menuItems {
|
||||||
position: initial;
|
background-color: transparent;
|
||||||
height: 100%;
|
margin-bottom: 8px;
|
||||||
}
|
width: 100%;
|
||||||
|
font-weight: 500;
|
||||||
|
|
||||||
@keyframes fadeLeftIn {
|
animation: fadein 0.5s;
|
||||||
0% {
|
|
||||||
transform: translateX(5px);
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
100% {
|
|
||||||
transform: translateX(0);
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.themeSwitcher {
|
|
||||||
:global {
|
:global {
|
||||||
.ant-switch-checked {
|
.ant-menu-item {
|
||||||
background-color: #2F2E30;
|
padding: 0 !important;
|
||||||
|
margin: 2px auto 2px auto;
|
||||||
|
width: 100%;
|
||||||
|
text-align: center;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
svg {
|
|
||||||
height: 100%;
|
|
||||||
vertical-align: middle;
|
|
||||||
}
|
|
||||||
|
|
||||||
span {
|
|
||||||
line-height: 10px;
|
|
||||||
}
|
|
||||||
}
|
}
|
@ -1,39 +1,13 @@
|
|||||||
import React from 'react'
|
import React from 'react'
|
||||||
import { CoreLoader } from 'components'
|
|
||||||
import { AppSettings } from 'ycore'
|
|
||||||
import PropTypes from 'prop-types'
|
|
||||||
import classNames from 'classnames'
|
import classNames from 'classnames'
|
||||||
import styles from './Loader.less'
|
import styles from './Loader.less'
|
||||||
|
|
||||||
const Loader = ({ spinning = true, fullScreen }) => {
|
const Loader = (loading) => {
|
||||||
if (AppSettings.InfiniteLoading == true) {
|
|
||||||
return (
|
|
||||||
<div className={styles.loader}>
|
|
||||||
<div className={styles.warpper}>
|
|
||||||
<div className={styles.newloader}>
|
|
||||||
<div></div>
|
|
||||||
<div></div>
|
|
||||||
<div></div>
|
|
||||||
<div></div>
|
|
||||||
<div></div>
|
|
||||||
<div></div>
|
|
||||||
<div></div>
|
|
||||||
<div></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
return (
|
return (
|
||||||
|
<div className={classNames(styles.wrapper, {[styles.end]: !loading.spinning })}>
|
||||||
|
<span>Loading... </span>
|
||||||
<div
|
<div
|
||||||
className={classNames(styles.loader, {
|
className={styles.newloader}
|
||||||
[styles.hidden]: !spinning,
|
|
||||||
[styles.fullScreen]: fullScreen,
|
|
||||||
})}
|
|
||||||
>
|
|
||||||
<div className={styles.warpper}>
|
|
||||||
<div
|
|
||||||
className={classNames(styles.newloader, { [styles.end]: !spinning })}
|
|
||||||
>
|
>
|
||||||
<div></div>
|
<div></div>
|
||||||
<div></div>
|
<div></div>
|
||||||
@ -44,13 +18,11 @@ const Loader = ({ spinning = true, fullScreen }) => {
|
|||||||
<div></div>
|
<div></div>
|
||||||
<div></div>
|
<div></div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
Loader.propTypes = {
|
|
||||||
spinning: PropTypes.bool,
|
|
||||||
fullScreen: PropTypes.bool,
|
|
||||||
}
|
|
||||||
|
|
||||||
export default Loader
|
export default Loader
|
||||||
|
@ -1,60 +1,44 @@
|
|||||||
@import '~themes/vars.less';
|
@import '~themes/index.less';
|
||||||
|
|
||||||
.loader {
|
.wrapper {
|
||||||
background-color: transparent; //rgba(44, 44, 44, 0.74);
|
font-family: @__Global_general_font_family;
|
||||||
width: 100%;
|
color: white;
|
||||||
position: absolute;
|
line-height: 55px;
|
||||||
top: 0;
|
span{
|
||||||
bottom: 0;
|
margin: 0 10px 0 auto;
|
||||||
z-index: 100000;
|
|
||||||
display: flex;
|
|
||||||
justify-content: right;
|
|
||||||
float: right;
|
|
||||||
opacity: 1;
|
|
||||||
text-align: center;
|
|
||||||
|
|
||||||
&.fullScreen {
|
|
||||||
position: fixed;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
&.hidden {
|
|
||||||
z-index: -1;
|
|
||||||
opacity: 0;
|
|
||||||
transition: opacity 3s ease 0.5s, z-index 0.1s ease 1.5s;
|
|
||||||
}
|
|
||||||
|
|
||||||
.warpper {
|
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
z-index: 1000;
|
||||||
right: 0;
|
right: 0;
|
||||||
width: 100px;
|
bottom: 0;
|
||||||
height: 100px;
|
width: 140px;
|
||||||
display: inline-flex;
|
height: 55px;
|
||||||
flex-direction: column;
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
justify-content: space-around;
|
justify-content: space-around;
|
||||||
}
|
background-color: #2d2d2dc2;
|
||||||
|
border-radius: 28px;
|
||||||
|
margin: 10px;
|
||||||
|
|
||||||
|
|
||||||
.newloader {
|
|
||||||
transform: scale(0.4);
|
|
||||||
width: 0px;
|
|
||||||
height: 0px;
|
|
||||||
margin: 0 auto;
|
|
||||||
position: relative;
|
|
||||||
|
|
||||||
&.end {
|
&.end {
|
||||||
.loader {
|
animation: unshow 0.8s linear;
|
||||||
z-index: -1;
|
.newloader>div {
|
||||||
|
animation: loader 0.8s linear;
|
||||||
|
}
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
>div {
|
.newloader {
|
||||||
animation: newloader 0.8s linear;
|
transform: translate(21px,27px) scale(0.3);
|
||||||
}
|
width: 0px;
|
||||||
}
|
height: 0px;
|
||||||
|
margin: 0 45px 0 0;
|
||||||
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
.newloader>div {
|
.newloader>div {
|
||||||
background-color: rgb(34, 34, 34);
|
|
||||||
width: 6px;
|
width: 6px;
|
||||||
height: 20px;
|
height: 20px;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
@ -63,7 +47,7 @@
|
|||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
transform-origin: 10px 35px;
|
transform-origin: 10px 35px;
|
||||||
transform: rotate(0deg);
|
transform: rotate(0deg);
|
||||||
animation: newloader 0.8s infinite;
|
animation: loader 0.8s infinite;
|
||||||
}
|
}
|
||||||
|
|
||||||
.newloader>div:nth-child(2) {
|
.newloader>div:nth-child(2) {
|
||||||
@ -100,19 +84,9 @@
|
|||||||
transform: rotate(315deg);
|
transform: rotate(315deg);
|
||||||
animation-delay: 0.7s;
|
animation-delay: 0.7s;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
@keyframes unshow {
|
@keyframes loader {
|
||||||
0% {
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
100% {
|
|
||||||
opacity: 0;
|
|
||||||
z-index: -1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes newloader {
|
|
||||||
0% {
|
0% {
|
||||||
background: transparent;
|
background: transparent;
|
||||||
left: -10px;
|
left: -10px;
|
||||||
@ -128,5 +102,15 @@
|
|||||||
left: 10px;
|
left: 10px;
|
||||||
transform-origin: -10px 35px;
|
transform-origin: -10px 35px;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes unshow {
|
||||||
|
0% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
opacity: 0;
|
||||||
|
display: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
@ -18,6 +18,9 @@ export const RenderFeed = {
|
|||||||
window.MainFeedComponent.addToRend(payload)
|
window.MainFeedComponent.addToRend(payload)
|
||||||
return
|
return
|
||||||
},
|
},
|
||||||
|
disableMenu: () => {
|
||||||
|
|
||||||
|
},
|
||||||
}
|
}
|
||||||
class MainFeed extends React.Component {
|
class MainFeed extends React.Component {
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
|
@ -78,7 +78,7 @@ class PostCard extends React.PureComponent {
|
|||||||
|
|
||||||
render() {
|
render() {
|
||||||
const { payload, customActions } = this.props
|
const { payload, customActions } = this.props
|
||||||
const ActShowMode = ycore.AppSettings.force_show_postactions
|
const ActShowMode = ycore.AppSettings.auto_hide_postbar
|
||||||
const {
|
const {
|
||||||
id,
|
id,
|
||||||
post_time,
|
post_time,
|
||||||
@ -196,15 +196,15 @@ class PostCard extends React.PureComponent {
|
|||||||
)
|
)
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={styles.cardWrapper}>
|
<div className={styles.post_card_wrapper}>
|
||||||
<antd.Card
|
<antd.Card
|
||||||
onDoubleClick={() => this.goToPost(id)}
|
onDoubleClick={() => this.goToPost(id)}
|
||||||
hoverable
|
hoverable
|
||||||
className={ActShowMode ? styles.showMode : null}
|
className={ActShowMode ? null : styles.showMode}
|
||||||
actions={actions}
|
actions={actions}
|
||||||
>
|
>
|
||||||
{this.state.ReportIgnore ? null : this.state.postReported ? (
|
{this.state.ReportIgnore ? null : this.state.postReported ? (
|
||||||
<div className={styles.flaggedWarning}>
|
<div className={styles.post_card_flaggedWarning}>
|
||||||
<Icons.FlagOutlined />
|
<Icons.FlagOutlined />
|
||||||
<h3>It seems that this post has been reported</h3>
|
<h3>It seems that this post has been reported</h3>
|
||||||
<p>The content may be inappropriate or compromising</p>
|
<p>The content may be inappropriate or compromising</p>
|
||||||
@ -235,14 +235,14 @@ class PostCard extends React.PureComponent {
|
|||||||
</div>
|
</div>
|
||||||
}
|
}
|
||||||
title={
|
title={
|
||||||
<div className={styles.titleWrapper}>
|
<div className={styles.post_card_title}>
|
||||||
<h4
|
<h4
|
||||||
onClick={() =>
|
onClick={() =>
|
||||||
ycore.crouter.native(`@${publisher.username}`)
|
ycore.router.go(`@${publisher.username}`)
|
||||||
}
|
}
|
||||||
className={styles.titleUser}
|
className={styles.titleUser}
|
||||||
>
|
>
|
||||||
@{publisher.username}{' '}
|
@{publisher.username}
|
||||||
{ycore.booleanFix(publisher.verified) ? (
|
{ycore.booleanFix(publisher.verified) ? (
|
||||||
<Icon
|
<Icon
|
||||||
style={{ color: 'blue' }}
|
style={{ color: 'blue' }}
|
||||||
@ -274,13 +274,13 @@ class PostCard extends React.PureComponent {
|
|||||||
bordered="false"
|
bordered="false"
|
||||||
/>
|
/>
|
||||||
{postText ? (
|
{postText ? (
|
||||||
<div className={styles.postContent}>
|
<div className={styles.post_card_content}>
|
||||||
{' '}
|
{' '}
|
||||||
<h3 dangerouslySetInnerHTML={{ __html: postText }} />{' '}
|
<h3 dangerouslySetInnerHTML={{ __html: postText }} />{' '}
|
||||||
</div>
|
</div>
|
||||||
) : null}
|
) : null}
|
||||||
{postFile ? (
|
{postFile ? (
|
||||||
<div className={styles.postContentFILE}>
|
<div className={styles.post_card_file}>
|
||||||
{this.renderPostPlayer(postFile)}
|
{this.renderPostPlayer(postFile)}
|
||||||
</div>
|
</div>
|
||||||
) : null}
|
) : null}
|
||||||
|
@ -1,25 +1,25 @@
|
|||||||
@import '~themes/vars.less';
|
@import '~themes/index.less';
|
||||||
|
|
||||||
.flaggedWarning {
|
.post_card_flaggedWarning {
|
||||||
border-radius: 7px;
|
border-radius: @post_card_general_border-rd;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
z-index: 20;
|
z-index: 20;
|
||||||
background: #ffffff60;
|
background: @post_card_flaggedWarning_backgroud;
|
||||||
font-family: "Poppins", sans-serif;
|
font-family: @__Global_general_font_family;
|
||||||
padding: 20px 15px 25px 15px;
|
padding: @post_card_flaggedWarning_padding;
|
||||||
|
|
||||||
:global {
|
:global {
|
||||||
.anticon {
|
.anticon {
|
||||||
font-size: 40px;
|
font-size: @post_card_flaggedWarning_iconSize;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.cardWrapper {
|
.post_card_wrapper {
|
||||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
|
box-shadow: @post_card_wrapper_shadow;
|
||||||
border-radius: 7px;
|
border-radius: @post_card_general_border-rd;
|
||||||
max-width: 510px;
|
max-width: 510px;
|
||||||
min-width: 265px;
|
min-width: 265px;
|
||||||
width: auto;
|
width: auto;
|
||||||
@ -31,7 +31,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.ant-card {
|
.ant-card {
|
||||||
border-radius: 7px;
|
border-radius: @post_card_general_border-rd;
|
||||||
border: 0;
|
border: 0;
|
||||||
border-top: 1px solid #4646460c;
|
border-top: 1px solid #4646460c;
|
||||||
}
|
}
|
||||||
@ -42,10 +42,10 @@
|
|||||||
|
|
||||||
.ant-card-actions {
|
.ant-card-actions {
|
||||||
border-top: 0;
|
border-top: 0;
|
||||||
background: #EBEBEB;
|
background: @post_card_wrapper_actions_backgroud;
|
||||||
height: 30px;
|
height: 30px;
|
||||||
position: relative;
|
position: relative;
|
||||||
transition: opacity 150ms linear, position 150ms linear, transform 150ms linear;
|
transition: opacity @__Global_Components_transitions_dur linear, position @__Global_Components_transitions_dur linear, transform @__Global_Components_transitions_dur linear;
|
||||||
border-radius: 0 0 10px 10px;
|
border-radius: 0 0 10px 10px;
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
|
|
||||||
@ -58,7 +58,7 @@
|
|||||||
.ant-card-actions:hover {
|
.ant-card-actions:hover {
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
transform: translate(0, 15px);
|
transform: translate(0, 15px);
|
||||||
transition: opacity 150ms linear, position 150ms linear, transform 150ms linear;
|
transition: opacity @__Global_Components_transitions_dur linear, position @__Global_Components_transitions_dur linear, transform @__Global_Components_transitions_dur linear;
|
||||||
}
|
}
|
||||||
|
|
||||||
.ant-card-actions>li>.anticon {
|
.ant-card-actions>li>.anticon {
|
||||||
@ -66,9 +66,8 @@
|
|||||||
line-height: 22px;
|
line-height: 22px;
|
||||||
width: 40px;
|
width: 40px;
|
||||||
height: 40px;
|
height: 40px;
|
||||||
background: white;
|
background: @post_card_wrapper_actions_icon_backgroud;
|
||||||
border-radius: 23px;
|
border-radius: 23px;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.ant-card-actions>li {
|
.ant-card-actions>li {
|
||||||
@ -97,7 +96,7 @@
|
|||||||
line-height: 22px;
|
line-height: 22px;
|
||||||
width: 40px;
|
width: 40px;
|
||||||
height: 40px;
|
height: 40px;
|
||||||
background: white;
|
background: @post_card_wrapper_actions_icon_backgroud;
|
||||||
border-radius: 23px;
|
border-radius: 23px;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
}
|
}
|
||||||
@ -130,6 +129,16 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.post_card_title {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
h4 {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
.postAvatar {
|
.postAvatar {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: -8px;
|
left: -8px;
|
||||||
@ -139,7 +148,7 @@
|
|||||||
|
|
||||||
.titleUser {
|
.titleUser {
|
||||||
display: flex;
|
display: flex;
|
||||||
font-family: 'Poppins', sans-serif;
|
font-family: @__Global_general_font_family;
|
||||||
margin: 0 0 0 50px;
|
margin: 0 0 0 50px;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -156,43 +165,31 @@
|
|||||||
|
|
||||||
:global {
|
:global {
|
||||||
.anticon {
|
.anticon {
|
||||||
color: rgb(249, 179, 64);
|
color: @post_card_wrapper_tags_color_default;
|
||||||
float: right;
|
float: right;
|
||||||
margin: -0 6px 0 0;
|
margin: -0 6px 0 0;
|
||||||
;
|
|
||||||
font-size: 17px;
|
font-size: 17px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.MoreMenu {
|
|
||||||
color: #2d2d2d !important;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.titleWrapper {
|
.post_card_content {
|
||||||
display: flex;
|
|
||||||
|
|
||||||
h4 {
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.postContent {
|
|
||||||
word-break: break-all;
|
word-break: break-all;
|
||||||
display: flex;
|
display: flex;
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
margin: 23px 24px 23px 24px;
|
margin: 23px 24px 23px 24px;
|
||||||
|
|
||||||
h3 {
|
h3 {
|
||||||
font-family: "Poppins", sans-serif;
|
font-family: @__Global_general_font_family;
|
||||||
color: #555555;
|
color: @post_card_wrapper_post_content_color;
|
||||||
font-weight: 400;
|
font-weight: @post_card_wrapper_post_content_weight;
|
||||||
font-size: 15px;
|
font-size: @post_card_wrapper_post_content_fontSize;
|
||||||
letter-spacing: -0.3px;
|
letter-spacing: @post_card_wrapper_post_content_letterSpacing;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.postContentFILE {
|
.post_card_file {
|
||||||
display: flex;
|
display: flex;
|
||||||
margin: 23px 0 5px 0;
|
margin: 23px 0 5px 0;
|
||||||
max-height: 600px;
|
max-height: 600px;
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
@import '~themes/vars.less';
|
@import '~themes/index.less';
|
||||||
|
|
||||||
.cardWrapper {
|
.cardWrapper {
|
||||||
// box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
|
// box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
|
||||||
|
@ -26,7 +26,7 @@ export default class Post_options extends React.Component {
|
|||||||
}
|
}
|
||||||
|
|
||||||
onChangeOption(checked, id) {
|
onChangeOption(checked, id) {
|
||||||
console.log(`${id} to ${checked}`)
|
ycore.yconsole.log(`${id} to ${checked}`)
|
||||||
}
|
}
|
||||||
|
|
||||||
handleToggleToolbox = () => {
|
handleToggleToolbox = () => {
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
@import '~themes/vars.less';
|
@import '~themes/index.less';
|
||||||
|
|
||||||
.optionsWrapper {
|
.optionsWrapper {
|
||||||
font-family: "Poppins", sans-serif;
|
font-family: "Poppins", sans-serif;
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
@import '~themes/vars.less';
|
@import '~themes/index.less';
|
||||||
|
|
||||||
:global {
|
:global {
|
||||||
|
|
||||||
|
@ -52,7 +52,7 @@ class SearchCard extends React.PureComponent {
|
|||||||
title={
|
title={
|
||||||
<div className={styles.titleWrapper}>
|
<div className={styles.titleWrapper}>
|
||||||
<h4
|
<h4
|
||||||
onClick={() => ycore.crouter.native(`@${username}`)}
|
onClick={() => ycore.router.go(`@${username}`)}
|
||||||
className={styles.titleUser}
|
className={styles.titleUser}
|
||||||
>
|
>
|
||||||
{DataStrip.title()}
|
{DataStrip.title()}
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
@import '~themes/vars.less';
|
@import '~themes/index.less';
|
||||||
|
|
||||||
.cardWrapper {
|
.cardWrapper {
|
||||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
|
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
|
||||||
|
@ -53,7 +53,7 @@ class UserProfile extends React.Component {
|
|||||||
ycore.yconsole.log('Bad response / User not found')
|
ycore.yconsole.log('Bad response / User not found')
|
||||||
const val = { id: null, username: 'User not found!' }
|
const val = { id: null, username: 'User not found!' }
|
||||||
this.setState({ invalid: true, RenderValue: val, loading: false })
|
this.setState({ invalid: true, RenderValue: val, loading: false })
|
||||||
ycore.crouter.native(`main`)
|
ycore.router.go(`main`)
|
||||||
antd.message.warning(`Its seams like @${string} not exist`)
|
antd.message.warning(`Its seams like @${string} not exist`)
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
@ -61,7 +61,7 @@ class UserProfile extends React.Component {
|
|||||||
const c2 = string.toLowerCase()
|
const c2 = string.toLowerCase()
|
||||||
if (c1 !== c2) {
|
if (c1 !== c2) {
|
||||||
ycore.yconsole.log(`Using aproximate user! => ${c1} / ${c2}`)
|
ycore.yconsole.log(`Using aproximate user! => ${c1} / ${c2}`)
|
||||||
ycore.crouter.native(`@${c1}`)
|
ycore.router.go(`@${c1}`)
|
||||||
}
|
}
|
||||||
|
|
||||||
const payload = { id: rp['0'].user_id }
|
const payload = { id: rp['0'].user_id }
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
@import '~themes/vars.less';
|
@import '~themes/index.less';
|
||||||
|
|
||||||
.textOverflow() {
|
.textOverflow() {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
@import '~themes/vars.less';
|
@import '~themes/index.less';
|
||||||
|
|
||||||
.loginWrapper {
|
.loginWrapper {
|
||||||
:global {
|
:global {
|
||||||
|
@ -7,6 +7,7 @@ import { queryLayout } from 'utils'
|
|||||||
import NProgress from 'nprogress'
|
import NProgress from 'nprogress'
|
||||||
import config from 'config'
|
import config from 'config'
|
||||||
import withRouter from 'umi/withRouter'
|
import withRouter from 'umi/withRouter'
|
||||||
|
import {AppSettings} from 'ycore'
|
||||||
|
|
||||||
import PublicLayout from './PublicLayout'
|
import PublicLayout from './PublicLayout'
|
||||||
import PrimaryLayout from './PrimaryLayout'
|
import PrimaryLayout from './PrimaryLayout'
|
||||||
@ -41,6 +42,8 @@ class BaseLayout extends PureComponent {
|
|||||||
<Helmet>
|
<Helmet>
|
||||||
<title>{config.siteName}</title>
|
<title>{config.siteName}</title>
|
||||||
</Helmet>
|
</Helmet>
|
||||||
|
{Loader( AppSettings.InfiniteLoading? {spinning: true} : loading )}
|
||||||
|
|
||||||
<Container>{children}</Container>
|
<Container>{children}</Container>
|
||||||
</Fragment>
|
</Fragment>
|
||||||
)
|
)
|
||||||
|
@ -1,11 +1,6 @@
|
|||||||
@import '~themes/vars.less';
|
|
||||||
@import '~themes/index.less';
|
@import '~themes/index.less';
|
||||||
|
|
||||||
:global {
|
:global {
|
||||||
#root {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
#nprogress {
|
#nprogress {
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
|
|
||||||
|
@ -94,41 +94,27 @@ class PrimaryLayout extends React.Component {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const SecondaryProps = {
|
const SecondaryProps = {
|
||||||
desktop_mode: desktop_mode,
|
|
||||||
userData,
|
userData,
|
||||||
isMobile,
|
isMobile,
|
||||||
theme,
|
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<React.Fragment>
|
<React.Fragment>
|
||||||
<div
|
|
||||||
className={classnames(styles.AppWrapper, {
|
|
||||||
[styles.desktop_mode]: desktop_mode,
|
|
||||||
})}
|
|
||||||
>
|
|
||||||
{isMobile ? <MobileWarning /> : null}
|
{isMobile ? <MobileWarning /> : null}
|
||||||
<div className={styles.BarControlWrapper}>
|
<div className={styles.__ControlBar}>
|
||||||
<Control />
|
<Control />
|
||||||
</div>
|
</div>
|
||||||
<antd.Layout
|
<antd.Layout id="primaryLayout" className={styles.primary_layout}>
|
||||||
className={classnames(styles.layout, {
|
|
||||||
[styles.md_dark]: this.isDarkMode(),
|
|
||||||
[styles.desktop_mode]: desktop_mode,
|
|
||||||
})}
|
|
||||||
>
|
|
||||||
<Sider {...SiderProps} />
|
<Sider {...SiderProps} />
|
||||||
|
|
||||||
<div id="primaryLayout" className={styles.leftContainer}>
|
<div className={styles.primary_layout_container}>
|
||||||
<PageTransition
|
<PageTransition
|
||||||
preset="moveToRightScaleUp"
|
preset="moveToRightScaleUp"
|
||||||
id="scroller"
|
|
||||||
transitionKey={location.pathname}
|
transitionKey={location.pathname}
|
||||||
>
|
>
|
||||||
<Content
|
<Content
|
||||||
className={classnames(styles.content, {
|
id="primaryContent"
|
||||||
[styles.collapsed]: !collapsed,
|
className={styles.primary_layout_content}
|
||||||
})}
|
|
||||||
>
|
>
|
||||||
<HeaderSearch />
|
<HeaderSearch />
|
||||||
{children}
|
{children}
|
||||||
@ -138,7 +124,6 @@ class PrimaryLayout extends React.Component {
|
|||||||
|
|
||||||
<Secondary {...SecondaryProps} />
|
<Secondary {...SecondaryProps} />
|
||||||
</antd.Layout>
|
</antd.Layout>
|
||||||
</div>
|
|
||||||
</React.Fragment>
|
</React.Fragment>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
@ -1,141 +1,40 @@
|
|||||||
@import '~themes/vars.less';
|
@import '~themes/index.less';
|
||||||
|
|
||||||
.AppWrapper {
|
.__ControlBar {
|
||||||
&.desktop_mode {
|
|
||||||
padding: 0 30px 0 30px;
|
|
||||||
border-radius: 10px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.content {
|
|
||||||
vertical-align: middle;
|
|
||||||
width: 100%;
|
|
||||||
float: right;
|
|
||||||
padding: 35px 25px 15px 60px;
|
|
||||||
transition: all 0.2s ease;
|
|
||||||
|
|
||||||
&.collapsed {
|
|
||||||
width: ~'calc(100% - 180px)';
|
|
||||||
transition: all 0.2s ease;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.layout {
|
|
||||||
|
|
||||||
background-color: @Theme-Layout-Backgroud; //#E2E6E9;
|
|
||||||
transition: background-color 200ms linear;
|
|
||||||
|
|
||||||
&.desktop_mode {
|
|
||||||
border-radius: 12px;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.md_radius {
|
|
||||||
width: 95%;
|
|
||||||
margin: auto;
|
|
||||||
position: relative;
|
|
||||||
border-radius: 15px;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.md_dark {
|
|
||||||
background-color: @DarkMode-backgroud_container;
|
|
||||||
color: @DarkMode-color_container;
|
|
||||||
transition: background-color 200ms linear;
|
|
||||||
|
|
||||||
:global {
|
|
||||||
h1 {
|
|
||||||
color: @DarkMode-color_container;
|
|
||||||
}
|
|
||||||
|
|
||||||
h2 {
|
|
||||||
color: @DarkMode-color_container;
|
|
||||||
}
|
|
||||||
|
|
||||||
h3 {
|
|
||||||
color: @DarkMode-color_container;
|
|
||||||
}
|
|
||||||
|
|
||||||
h4 {
|
|
||||||
color: @DarkMode-color_container;
|
|
||||||
}
|
|
||||||
|
|
||||||
h5 {
|
|
||||||
color: @DarkMode-color_container;
|
|
||||||
}
|
|
||||||
|
|
||||||
h6 {
|
|
||||||
color: @DarkMode-color_container;
|
|
||||||
}
|
|
||||||
|
|
||||||
p {
|
|
||||||
color: @DarkMode-color_container;
|
|
||||||
}
|
|
||||||
|
|
||||||
span {
|
|
||||||
color: @DarkMode-color_container;
|
|
||||||
}
|
|
||||||
|
|
||||||
pre {
|
|
||||||
color: @DarkMode-color_container;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-pro-page-header-wrap-page-header-warp {
|
|
||||||
color: @DarkMode-color_container;
|
|
||||||
background-color: @DarkMode-backgroud_container;
|
|
||||||
transition: background-color 200ms linear;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-card {
|
|
||||||
background-color: @DarkMode-backgroud;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-input {
|
|
||||||
color: @DarkMode-color_container;
|
|
||||||
background-color: @DarkMode-backgroud;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-btn-primary[disabled] {
|
|
||||||
color: @DarkMode-color_container;
|
|
||||||
background-color: @DarkMode-backgroud;
|
|
||||||
}
|
|
||||||
|
|
||||||
transition: background-color 200ms linear;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.BarControlWrapper {
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
z-index: 30;
|
z-index: 30;
|
||||||
}
|
}
|
||||||
|
|
||||||
.leftContainer {
|
.primary_layout {
|
||||||
align-self: center;
|
overflow-x: hidden!important;
|
||||||
width: 100vw;
|
overflow-y: hidden!important;
|
||||||
position: relative;
|
background-color: @primary_layout_backgroud;
|
||||||
float: left;
|
margin: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
// PRIMARY LAYOUT
|
||||||
|
.primary_layout_container {
|
||||||
|
transition: background-color @__Global_layout_transitions-dur linear;
|
||||||
|
background-color: @primary_layout_container_backgroud;
|
||||||
|
border-radius: @primary_layout_container_border-rd;
|
||||||
|
|
||||||
overflow-x: hidden;
|
overflow-x: hidden;
|
||||||
|
margin: 0 0 0 10px;
|
||||||
|
width: 100vw;
|
||||||
height: 100vh;
|
height: 100vh;
|
||||||
|
|
||||||
|
position: relative;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
|
align-self: center;
|
||||||
:global {
|
float: left;
|
||||||
#scroller {
|
|
||||||
overflow-y: scroll !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.primary_layout_content {
|
||||||
|
vertical-align: middle;
|
||||||
@media (max-width: 767px) {
|
width: 100%;
|
||||||
.content {
|
float: right;
|
||||||
padding: 12px;
|
padding: @primary_layout_content_padding;
|
||||||
}
|
transition: all @__Global_layout_transitions-dur ease;
|
||||||
|
|
||||||
.layout {
|
|
||||||
height: 100vh;
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
}
|
@ -21,15 +21,12 @@ export default class __m extends React.Component {
|
|||||||
}
|
}
|
||||||
|
|
||||||
componentDidMount() {
|
componentDidMount() {
|
||||||
if (ycore.IsThisUser.dev() == false || ycore.IsThisUser.admin() == false) {
|
|
||||||
return ycore.crouter.native('main')
|
|
||||||
}
|
|
||||||
this.handleSID()
|
this.handleSID()
|
||||||
this.handleToken()
|
this.handleToken()
|
||||||
}
|
}
|
||||||
|
|
||||||
handleSID() {
|
handleSID() {
|
||||||
ycore.get_app_session.get_id((err, response) => {
|
ycore.comty_get.session_id((err, response) => {
|
||||||
if (err) {
|
if (err) {
|
||||||
return ycore.notify.error(err)
|
return ycore.notify.error(err)
|
||||||
}
|
}
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
@import '~themes/vars.less';
|
@import '~themes/index.less';
|
||||||
|
|
||||||
.Wrapper {
|
.Wrapper {
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
|
10
src/pages/events/index.js
Normal file
10
src/pages/events/index.js
Normal file
@ -0,0 +1,10 @@
|
|||||||
|
import React from 'react'
|
||||||
|
import * as antd from 'antd'
|
||||||
|
|
||||||
|
export default class Events extends React.PureComponent{
|
||||||
|
render(){
|
||||||
|
return(
|
||||||
|
<antd.Result status="404" title="Hey!" subTitle="It seems that this version of the app is not yet available this function" />
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
1
src/pages/events/index.less
Normal file
1
src/pages/events/index.less
Normal file
@ -0,0 +1 @@
|
|||||||
|
@import '~themes/index.less';
|
@ -55,7 +55,6 @@ class GroupIndexer extends PureComponent {
|
|||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.log(error)
|
|
||||||
return (
|
return (
|
||||||
<center>
|
<center>
|
||||||
<h2>Render Error</h2>
|
<h2>Render Error</h2>
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
@import '~themes/vars.less';
|
@import '~themes/index.less';
|
||||||
|
|
||||||
.searchHeader {
|
.searchHeader {
|
||||||
font-family: "Nunito", sans-serif;
|
font-family: "Nunito", sans-serif;
|
||||||
|
@ -3,7 +3,7 @@ import * as ycore from 'ycore'
|
|||||||
|
|
||||||
class Index extends PureComponent {
|
class Index extends PureComponent {
|
||||||
render() {
|
render() {
|
||||||
ycore.crouter.native(`login`)
|
ycore.router.go(`login`)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
@import '~themes/vars.less';
|
@import '~themes/index.less';
|
||||||
|
|
||||||
|
|
||||||
.login_wrapper{
|
.login_wrapper{
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
@import '~themes/vars.less';
|
@import '~themes/index.less';
|
||||||
|
|
||||||
.mainWrapper {
|
.mainWrapper {
|
||||||
position: relative;
|
position: relative;
|
||||||
|
10
src/pages/marketplace/index.js
Normal file
10
src/pages/marketplace/index.js
Normal file
@ -0,0 +1,10 @@
|
|||||||
|
import React from 'react'
|
||||||
|
import * as antd from 'antd'
|
||||||
|
|
||||||
|
export default class Marketplace extends React.PureComponent{
|
||||||
|
render(){
|
||||||
|
return(
|
||||||
|
<antd.Result status="404" title="Hey!" subTitle="It seems that this version of the app is not yet available this function" />
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
1
src/pages/marketplace/index.less
Normal file
1
src/pages/marketplace/index.less
Normal file
@ -0,0 +1 @@
|
|||||||
|
@import '~themes/index.less';
|
@ -41,7 +41,7 @@ export default class Indexer_Post extends React.Component {
|
|||||||
}
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
ycore.crouter.native('main')
|
ycore.router.go('main')
|
||||||
return null
|
return null
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -59,19 +59,19 @@ class SearchPageIndexer extends PureComponent {
|
|||||||
|
|
||||||
const users = () => {
|
const users = () => {
|
||||||
if (usersParsed.length >= 1) {
|
if (usersParsed.length >= 1) {
|
||||||
console.log('Users => ', usersParsed)
|
ycore.yconsole.log('Users => ', usersParsed)
|
||||||
return this.EntryComponent('Users', usersParsed)
|
return this.EntryComponent('Users', usersParsed)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
const groups = () => {
|
const groups = () => {
|
||||||
if (groupsParsed.length >= 1) {
|
if (groupsParsed.length >= 1) {
|
||||||
console.log('Groups => ', groupsParsed)
|
ycore.yconsole.log('Groups => ', groupsParsed)
|
||||||
return this.EntryComponent('Groups', groupsParsed)
|
return this.EntryComponent('Groups', groupsParsed)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
const pages = () => {
|
const pages = () => {
|
||||||
if (pagesParsed.length >= 1) {
|
if (pagesParsed.length >= 1) {
|
||||||
console.log('Pages => ', pagesParsed)
|
ycore.yconsole.log('Pages => ', pagesParsed)
|
||||||
return this.EntryComponent('Pages', pagesParsed)
|
return this.EntryComponent('Pages', pagesParsed)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -86,7 +86,6 @@ class SearchPageIndexer extends PureComponent {
|
|||||||
|
|
||||||
return [users(), groups(), pages()]
|
return [users(), groups(), pages()]
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.log(error)
|
|
||||||
return (
|
return (
|
||||||
<center>
|
<center>
|
||||||
<h2>Render Error</h2>
|
<h2>Render Error</h2>
|
||||||
@ -119,7 +118,6 @@ class SearchPageIndexer extends PureComponent {
|
|||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.log(error)
|
|
||||||
return (
|
return (
|
||||||
<center>
|
<center>
|
||||||
<h2>Render Error</h2>
|
<h2>Render Error</h2>
|
||||||
@ -137,7 +135,7 @@ class SearchPageIndexer extends PureComponent {
|
|||||||
const string = raw.replace('/s/', '')
|
const string = raw.replace('/s/', '')
|
||||||
|
|
||||||
if (matchSearch) {
|
if (matchSearch) {
|
||||||
console.log(`Search matched! ${location.pathname}`)
|
ycore.yconsole.log(`Search matched! ${location.pathname}`)
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
<h1 className={styles.searchHeader}>
|
<h1 className={styles.searchHeader}>
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
@import '~themes/vars.less';
|
@import '~themes/index.less';
|
||||||
|
|
||||||
.searchHeader {
|
.searchHeader {
|
||||||
font-family: "Nunito", sans-serif;
|
font-family: "Nunito", sans-serif;
|
||||||
|
47
src/pages/saves/index.js
Normal file
47
src/pages/saves/index.js
Normal file
@ -0,0 +1,47 @@
|
|||||||
|
import React from 'react'
|
||||||
|
import * as ycore from 'ycore'
|
||||||
|
import * as antd from 'antd'
|
||||||
|
import * as Icons from '@ant-design/icons'
|
||||||
|
import { MainFeed } from 'components'
|
||||||
|
import styles from './index.less'
|
||||||
|
|
||||||
|
export default class PostSaved extends React.PureComponent{
|
||||||
|
state = {
|
||||||
|
loading: true,
|
||||||
|
data: null,
|
||||||
|
}
|
||||||
|
componentDidMount(){
|
||||||
|
ycore.comty_post.getSaved((err,res) => {
|
||||||
|
if (err) return false
|
||||||
|
try {
|
||||||
|
const a = JSON.parse(res)['data']
|
||||||
|
this.setState({ data: a, loading: false })
|
||||||
|
} catch (error) {
|
||||||
|
ycore.notify.exception('Error cathing saved posts... ', error)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
renderSavedPost(){
|
||||||
|
const { data } = this.state
|
||||||
|
try {
|
||||||
|
if (data.length < 1) {
|
||||||
|
return <antd.Result title={`You don't have any saved posts`} />
|
||||||
|
}
|
||||||
|
return <MainFeed custompayload={data} />
|
||||||
|
} catch (err) {
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
render(){
|
||||||
|
return(
|
||||||
|
<div className={styles.saved_post_wrapper}>
|
||||||
|
<div className={styles.saved_post_title}>
|
||||||
|
<h2><Icons.BookOutlined /> Saved Post</h2>
|
||||||
|
</div>
|
||||||
|
<div className={styles.saved_post_content}>
|
||||||
|
{this.renderSavedPost()}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
14
src/pages/saves/index.less
Normal file
14
src/pages/saves/index.less
Normal file
@ -0,0 +1,14 @@
|
|||||||
|
@import '~themes/index.less';
|
||||||
|
|
||||||
|
.saved_post_wrapper{
|
||||||
|
|
||||||
|
}
|
||||||
|
.saved_post_title{
|
||||||
|
font-family: @__Global_general_font_family;
|
||||||
|
}
|
||||||
|
.saved_post_content{
|
||||||
|
margin-top: 10px;
|
||||||
|
padding: 10px;
|
||||||
|
background-color: #ffffff8e;
|
||||||
|
border-radius: 12px;
|
||||||
|
}
|
@ -1,4 +1,4 @@
|
|||||||
@import '~themes/vars.less';
|
@import '~themes/index.less';
|
||||||
|
|
||||||
.main {
|
.main {
|
||||||
|
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
@import '~themes/vars.less';
|
@import '~themes/index.less';
|
||||||
|
|
||||||
.main {
|
.main {
|
||||||
|
|
||||||
|
@ -7,7 +7,7 @@ export default class Sessions_Manager extends React.Component {
|
|||||||
sessions_data: '',
|
sessions_data: '',
|
||||||
}
|
}
|
||||||
componentDidMount() {
|
componentDidMount() {
|
||||||
ycore.get_app_session.get_id((err, res) => {
|
ycore.comty_get.session_id((err, res) => {
|
||||||
this.setState({ sid: res })
|
this.setState({ sid: res })
|
||||||
})
|
})
|
||||||
ycore.comty_get.sessions((err, res) => {
|
ycore.comty_get.sessions((err, res) => {
|
||||||
|
@ -17,6 +17,11 @@ const menuMap = {
|
|||||||
<Icons.ControlOutlined /> General
|
<Icons.ControlOutlined /> General
|
||||||
</span>
|
</span>
|
||||||
),
|
),
|
||||||
|
sync: (
|
||||||
|
<span>
|
||||||
|
<Icons.SyncOutlined /> Sync™
|
||||||
|
</span>
|
||||||
|
),
|
||||||
security: (
|
security: (
|
||||||
<span>
|
<span>
|
||||||
<Icons.SafetyCertificateOutlined /> Security & Privacity
|
<Icons.SafetyCertificateOutlined /> Security & Privacity
|
||||||
|
@ -1,6 +1,4 @@
|
|||||||
@import '~themes/vars.less';
|
@import '~themes/index.less';
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
.main {
|
.main {
|
||||||
font-family: "Nunito", sans-serif;
|
font-family: "Nunito", sans-serif;
|
||||||
@ -9,7 +7,7 @@
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
color: @DarkMode-color_container;
|
color: @__Global_layout_color;
|
||||||
background-color: #ffffff;
|
background-color: #ffffff;
|
||||||
padding: 15px;
|
padding: 15px;
|
||||||
border-radius: 10px;
|
border-radius: 10px;
|
||||||
@ -19,7 +17,7 @@
|
|||||||
|
|
||||||
:global {
|
:global {
|
||||||
.ant-menu-inline {
|
.ant-menu-inline {
|
||||||
color: @DarkMode-color_container;
|
color: @__Global_layout_color;
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
border: none;
|
border: none;
|
||||||
}
|
}
|
||||||
@ -39,7 +37,7 @@
|
|||||||
|
|
||||||
.title {
|
.title {
|
||||||
margin-bottom: 12px;
|
margin-bottom: 12px;
|
||||||
color: @heading-color;
|
color: @__Global_layout_color;
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
line-height: 28px;
|
line-height: 28px;
|
||||||
|
7
src/themes/default.less → src/themes/antd-design.less
Executable file → Normal file
7
src/themes/default.less → src/themes/antd-design.less
Executable file → Normal file
@ -1,13 +1,6 @@
|
|||||||
// 本文件是对 ant-design:
|
|
||||||
// https://github.com/ant-design/ant-design/blob/master/components/style/themes/default.less
|
|
||||||
// 相应变量值的覆盖
|
|
||||||
// 注意:只需写出要覆盖的变量即可(不需要覆盖的变量不要写)
|
|
||||||
|
|
||||||
|
|
||||||
/* stylelint-disable at-rule-empty-line-before,at-rule-name-space-after,at-rule-no-unknown */
|
/* stylelint-disable at-rule-empty-line-before,at-rule-name-space-after,at-rule-no-unknown */
|
||||||
@import '../../node_modules/antd/lib/style/themes/default.less';
|
@import '../../node_modules/antd/lib/style/themes/default.less';
|
||||||
|
|
||||||
|
|
||||||
// -------- Colors -----------
|
// -------- Colors -----------
|
||||||
@primary-color: @blue-6;
|
@primary-color: @blue-6;
|
||||||
@info-color: @blue-6;
|
@info-color: @blue-6;
|
182
src/themes/base/index.less
Normal file
182
src/themes/base/index.less
Normal file
@ -0,0 +1,182 @@
|
|||||||
|
|
||||||
|
// FOR LAYOUTS
|
||||||
|
@__Global_general_font_family: "Poppins", sans-serif;
|
||||||
|
@__Global_layout_backgroud: #F8F6F8;
|
||||||
|
@__Global_layout_color: #2d2d2d;
|
||||||
|
@__Global_layout_border-rd: 27px 0 0 0;
|
||||||
|
@__Global_layout_transitions-dur: 200ms;
|
||||||
|
@__Global_Components_transitions_dur: 150ms;
|
||||||
|
|
||||||
|
@mamamia: #85858570;
|
||||||
|
// FOR SECONDARY
|
||||||
|
@__Global_SwapAnimDuration: 170ms;
|
||||||
|
|
||||||
|
@transition-ease-in: all 0.3s ease-out;
|
||||||
|
@transition-ease-out: all 0.3s ease-out;
|
||||||
|
@ease-in: ease-in;
|
||||||
|
|
||||||
|
::-webkit-scrollbar {
|
||||||
|
width: 14px;
|
||||||
|
height: 18px;
|
||||||
|
}
|
||||||
|
::-webkit-scrollbar-thumb {
|
||||||
|
height: 6px;
|
||||||
|
border: 4px solid rgba(0, 0, 0, 0);
|
||||||
|
background-clip: padding-box;
|
||||||
|
margin: 0 10px 0 0;
|
||||||
|
-webkit-border-radius: 7px;
|
||||||
|
background-color: rgba(0, 0, 0, 0.15);
|
||||||
|
-webkit-box-shadow: inset -1px -1px 0px rgba(0, 0, 0, 0.05), inset 1px 1px 0px rgba(0, 0, 0, 0.05);
|
||||||
|
}
|
||||||
|
::-webkit-scrollbar-button {
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
::-webkit-scrollbar-corner {
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Global Documents
|
||||||
|
body {
|
||||||
|
height: 100%;
|
||||||
|
overflow-y: hidden;
|
||||||
|
background-color: transparent; // rgb(249, 249, 249);
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (min-width: 1600px) {
|
||||||
|
:global {
|
||||||
|
.ant-col-xl-48 {
|
||||||
|
width: 20%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-col-xl-96 {
|
||||||
|
width: 40%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 767px) {
|
||||||
|
:global {
|
||||||
|
.ant-card {
|
||||||
|
.ant-card-head {
|
||||||
|
padding: 0 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-card-body {
|
||||||
|
padding: 12px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// PrimaryLayout
|
||||||
|
@media (max-width: 767px) {
|
||||||
|
.primary_layout_content {
|
||||||
|
padding: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.primary_layout {
|
||||||
|
height: 100vh;
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// .primary_layout_*
|
||||||
|
@primary_layout_backgroud: #2d2d2d;
|
||||||
|
|
||||||
|
@primary_layout_container_backgroud: @__Global_layout_backgroud;
|
||||||
|
@primary_layout_container_border-rd: @__Global_layout_border-rd;
|
||||||
|
|
||||||
|
@primary_layout_content_padding: 35px 25px 15px 40px;
|
||||||
|
|
||||||
|
// .secondary_*
|
||||||
|
@__secondary_colider_width: 31.2vw;
|
||||||
|
@secondary_wrapper_hidden_width: 22vw;
|
||||||
|
@secondary_wrapper_showFull_width: 94.2vw;
|
||||||
|
@secondary_wrapper_showHalf_width: 35vw;
|
||||||
|
@secondary_container_bg_background: #201F23;
|
||||||
|
@secondary_container_1_color: #fff;
|
||||||
|
@secondary_container_2_color: #201F23;
|
||||||
|
@secondary_container_2_backgroud: #fff;
|
||||||
|
@secondary_container_1_btn_backgroud: #4c4c4c;
|
||||||
|
@secondary_container_1_btn_color: #fff;
|
||||||
|
@secondary_container_1_btn_shadow: 0px 0px 10px 0px rgba(255, 255, 255, 0.205);
|
||||||
|
|
||||||
|
@secondary_container_1_padding: 30px 70px 30px 75px;
|
||||||
|
@secondaty_container_2_padding: 20px 15px 15px 15px;
|
||||||
|
|
||||||
|
// .left_sider*
|
||||||
|
@left_sider_backgroud: #2d2d2d;
|
||||||
|
@left_sider_color: #fff;
|
||||||
|
@left_sider_sizeIcons: 19px;
|
||||||
|
@left_sider_menu__onhover_backgroud: rgb(80, 80, 80);
|
||||||
|
@left_sider_menu__onhover_color: #fff;
|
||||||
|
|
||||||
|
// .post_card*
|
||||||
|
@post_card_general_border-rd: 7px;
|
||||||
|
@post_card_wrapper_shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
|
||||||
|
@post_card_wrapper_actions_backgroud: rgba(235, 235, 235, 0.815);
|
||||||
|
@post_card_wrapper_actions_icon_backgroud: #fff;
|
||||||
|
|
||||||
|
@post_card_wrapper_tags_color_default: rgb(249, 179, 64);
|
||||||
|
@post_card_wrapper_tags_color_nsfw: #111;
|
||||||
|
@post_card_wrapper_tags_color_flag: #111;
|
||||||
|
|
||||||
|
@post_card_wrapper_post_content_color: #555555;
|
||||||
|
@post_card_wrapper_post_content_weight: 400;
|
||||||
|
@post_card_wrapper_post_content_fontSize: 15px;
|
||||||
|
@post_card_wrapper_post_content_letterSpacing: -0.3px;
|
||||||
|
|
||||||
|
@post_card_flaggedWarning_backgroud: #ffffff60;
|
||||||
|
@post_card_flaggedWarning_padding: 20px 15px 25px 15px;
|
||||||
|
@post_card_flaggedWarning_iconSize: 40px;
|
||||||
|
|
||||||
|
// YulioID
|
||||||
|
@canvasColor: #f9f9f9;
|
||||||
|
@backgroundColor: #fff;
|
||||||
|
@foregroundColor: #111;
|
||||||
|
@primaryColor: #373F51;
|
||||||
|
@primaryShade1: #ffe2d1;
|
||||||
|
@primaryShade2: #ffceb2;
|
||||||
|
@primaryShade3: #ffb184;
|
||||||
|
@primaryShade4: #e88850;
|
||||||
|
@primaryShade5: #d17a48;
|
||||||
|
@secondaryColor: #ffcc67;
|
||||||
|
@secondaryShade1: #fff1d5;
|
||||||
|
@secondaryShade2: #ffde9e;
|
||||||
|
@secondaryShade3: #ffd074;
|
||||||
|
@secondaryShade4: #e8ba5e;
|
||||||
|
@secondaryShade5: #ba954b;
|
||||||
|
@accentColor: #4e5166;
|
||||||
|
@accentShade1: #cecfd5;
|
||||||
|
@accentShade2: #aeafb9;
|
||||||
|
@accentShade3: #8e909d;
|
||||||
|
@accentShade4: #6e7081;
|
||||||
|
@accentShade5: #404354;
|
||||||
|
@accent2Color: #588b8b;
|
||||||
|
@accent2Shade1: #c2d4d4;
|
||||||
|
@accent2Shade2: #a3bfbf;
|
||||||
|
@accent2Shade3: #85aaaa;
|
||||||
|
@accent2Shade4: #507f7f;
|
||||||
|
@accent2Shade5: #497272;
|
||||||
|
@accent3Color: #fe5f55;
|
||||||
|
@accent3Shade1: #fec4c1;
|
||||||
|
@accent3Shade2: #fea7a2;
|
||||||
|
@accent3Shade3: #fe7c73;
|
||||||
|
@accent3Shade4: #e7574e;
|
||||||
|
@accent3Shade5: #b9463e;
|
||||||
|
|
||||||
|
@neutralShade0: #f8f8f8;
|
||||||
|
@neutralShade1: #f2f2f2;
|
||||||
|
@neutralShade2: #e8e9e9;
|
||||||
|
@neutralShade3: #d1d3d4;
|
||||||
|
@neutralShade4: #babdbf;
|
||||||
|
@neutralShade5: #808488;
|
||||||
|
@neutralShade6: #666a6d;
|
||||||
|
@neutralShade7: #4d5052;
|
||||||
|
@neutralShade8: #212122;
|
||||||
|
@grayColor: #999;
|
||||||
|
@lightGrayColor: #ddd;
|
||||||
|
@borderRadius: 6px;
|
||||||
|
@boxShadow: 0 2px 5px rgba(#333, 0.2);
|
0
src/themes/fonty.css → src/themes/fonts-imports.css
Executable file → Normal file
0
src/themes/fonty.css → src/themes/fonts-imports.css
Executable file → Normal file
@ -1,130 +1,3 @@
|
|||||||
@import '~themes/vars.less';
|
@import '~themes/antd-design.less';
|
||||||
|
@import '~themes/base/index.less';
|
||||||
body {
|
@import (inline) './fonts-imports.css';
|
||||||
height: 100%;
|
|
||||||
overflow-y: hidden;
|
|
||||||
background-color: transparent; // rgb(249, 249, 249);
|
|
||||||
}
|
|
||||||
|
|
||||||
::-webkit-scrollbar-thumb {
|
|
||||||
background-color: #fff;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
::-webkit-scrollbar {
|
|
||||||
width: 8px;
|
|
||||||
height: 8px;
|
|
||||||
}
|
|
||||||
|
|
||||||
:global {
|
|
||||||
|
|
||||||
.ant-breadcrumb {
|
|
||||||
&>span {
|
|
||||||
&:last-child {
|
|
||||||
color: #999;
|
|
||||||
font-weight: normal;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-breadcrumb-link {
|
|
||||||
.anticon+span {
|
|
||||||
margin-left: 4px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-table {
|
|
||||||
.ant-table-thead>tr>th {
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-table-tbody>tr>td {
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.ant-table-small {
|
|
||||||
.ant-table-thead>tr>th {
|
|
||||||
background: #f7f7f7;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-table-body>table {
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
.ant-table-pagination {
|
|
||||||
float: none !important;
|
|
||||||
display: table;
|
|
||||||
margin: 16px auto !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-popover-inner {
|
|
||||||
border: none;
|
|
||||||
border-radius: 0;
|
|
||||||
box-shadow: 0 0 20px rgba(100, 100, 100, 0.2);
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-form-item-control {
|
|
||||||
vertical-align: middle;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-modal-mask {
|
|
||||||
background-color: rgba(55, 55, 55, 0.2);
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-modal-content {
|
|
||||||
box-shadow: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-select-dropdown-menu-item {
|
|
||||||
padding: 12px 16px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.margin-right {
|
|
||||||
margin-right: 16px;
|
|
||||||
}
|
|
||||||
|
|
||||||
a:focus {
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-table-layout-fixed table {
|
|
||||||
table-layout: auto;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (min-width: 1600px) {
|
|
||||||
:global {
|
|
||||||
.ant-col-xl-48 {
|
|
||||||
width: 20%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-col-xl-96 {
|
|
||||||
width: 40%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 767px) {
|
|
||||||
:global {
|
|
||||||
|
|
||||||
.ant-pagination-item,
|
|
||||||
.ant-pagination-next,
|
|
||||||
.ant-pagination-options,
|
|
||||||
.ant-pagination-prev {
|
|
||||||
margin-bottom: 8px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-card {
|
|
||||||
.ant-card-head {
|
|
||||||
padding: 0 12px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-card-body {
|
|
||||||
padding: 12px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,64 +0,0 @@
|
|||||||
@Theme-Shade-1: #ff971d;
|
|
||||||
@Theme-Shade-2: #ffe8d6;
|
|
||||||
@Theme-Shade-3: #f9f6f7;
|
|
||||||
@Theme-Shade-4: #ffffff;
|
|
||||||
|
|
||||||
@Theme-Shade-Color: #f9f6f7;
|
|
||||||
@Theme-Layout-Backgroud: #F8F6F8;
|
|
||||||
@Theme-2Layout-Baackgroud: #201F23;
|
|
||||||
@Theme-SiderDeco-Backgroud: #4D91EA;
|
|
||||||
@Theme-SiderDeco-Color: #f9f6f7;
|
|
||||||
|
|
||||||
@Theme-Hover-Backgroud: rgba(107, 162, 235, 0.507);
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// YulioID
|
|
||||||
|
|
||||||
@canvasColor: #f9f9f9;
|
|
||||||
@backgroundColor: #fff;
|
|
||||||
@foregroundColor: #111;
|
|
||||||
@primaryColor: #373F51;
|
|
||||||
@primaryShade1: #ffe2d1;
|
|
||||||
@primaryShade2: #ffceb2;
|
|
||||||
@primaryShade3: #ffb184;
|
|
||||||
@primaryShade4: #e88850;
|
|
||||||
@primaryShade5: #d17a48;
|
|
||||||
@secondaryColor: #ffcc67;
|
|
||||||
@secondaryShade1: #fff1d5;
|
|
||||||
@secondaryShade2: #ffde9e;
|
|
||||||
@secondaryShade3: #ffd074;
|
|
||||||
@secondaryShade4: #e8ba5e;
|
|
||||||
@secondaryShade5: #ba954b;
|
|
||||||
@accentColor: #4e5166;
|
|
||||||
@accentShade1: #cecfd5;
|
|
||||||
@accentShade2: #aeafb9;
|
|
||||||
@accentShade3: #8e909d;
|
|
||||||
@accentShade4: #6e7081;
|
|
||||||
@accentShade5: #404354;
|
|
||||||
@accent2Color: #588b8b;
|
|
||||||
@accent2Shade1: #c2d4d4;
|
|
||||||
@accent2Shade2: #a3bfbf;
|
|
||||||
@accent2Shade3: #85aaaa;
|
|
||||||
@accent2Shade4: #507f7f;
|
|
||||||
@accent2Shade5: #497272;
|
|
||||||
@accent3Color: #fe5f55;
|
|
||||||
@accent3Shade1: #fec4c1;
|
|
||||||
@accent3Shade2: #fea7a2;
|
|
||||||
@accent3Shade3: #fe7c73;
|
|
||||||
@accent3Shade4: #e7574e;
|
|
||||||
@accent3Shade5: #b9463e;
|
|
||||||
|
|
||||||
@neutralShade0: #f8f8f8;
|
|
||||||
@neutralShade1: #f2f2f2;
|
|
||||||
@neutralShade2: #e8e9e9;
|
|
||||||
@neutralShade3: #d1d3d4;
|
|
||||||
@neutralShade4: #babdbf;
|
|
||||||
@neutralShade5: #808488;
|
|
||||||
@neutralShade6: #666a6d;
|
|
||||||
@neutralShade7: #4d5052;
|
|
||||||
@neutralShade8: #212122;
|
|
||||||
@grayColor: #999;
|
|
||||||
@lightGrayColor: #ddd;
|
|
||||||
@borderRadius: 6px;
|
|
||||||
@boxShadow: 0 2px 5px rgba(#333, 0.2);
|
|
@ -1,36 +0,0 @@
|
|||||||
@import '~themes/default';
|
|
||||||
@import (inline) './fonty.css';
|
|
||||||
@import (inline) './plyr.css';
|
|
||||||
|
|
||||||
@dark-half: #494949;
|
|
||||||
@purple: #d897eb;
|
|
||||||
@shadow-1: 4px 4px 20px 0 rgba(0, 0, 0, 0.01);
|
|
||||||
@shadow-2: 4px 4px 40px 0 rgba(0, 0, 0, 0.05);
|
|
||||||
@transition-ease-in: all 0.3s ease-out;
|
|
||||||
@transition-ease-out: all 0.3s ease-out;
|
|
||||||
@ease-in: ease-in;
|
|
||||||
|
|
||||||
.text-overflow {
|
|
||||||
white-space: nowrap;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
.text-gradient {
|
|
||||||
background-image: -webkit-gradient(linear,
|
|
||||||
37.219838% 34.532506%,
|
|
||||||
36.425669% 93.178216%,
|
|
||||||
from(#29cdff),
|
|
||||||
to(#0a60ff),
|
|
||||||
color-stop(0.37, #148eff));
|
|
||||||
-webkit-background-clip: text;
|
|
||||||
-webkit-text-fill-color: transparent;
|
|
||||||
}
|
|
||||||
|
|
||||||
.background-hover {
|
|
||||||
transition: @transition-ease-in;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background-color: @hover-color;
|
|
||||||
}
|
|
||||||
}
|
|
File diff suppressed because one or more lines are too long
@ -1,11 +0,0 @@
|
|||||||
@import '~themes/default.less';
|
|
||||||
@import '~themes/mixin.less';
|
|
||||||
@import '~themes/light_ng/index.less';
|
|
||||||
|
|
||||||
@DarkMode-backgroud_container: rgb(24, 26, 27);
|
|
||||||
@DarkMode-backgroud: #212121;
|
|
||||||
@LightMode-backgroud: #fff;
|
|
||||||
|
|
||||||
@DarkMode-color_container: rgb(195, 191, 182);
|
|
||||||
@DarkMode-color: #fff;
|
|
||||||
@LightMode-color: #2F2E30;
|
|
@ -1,7 +0,0 @@
|
|||||||
module.exports = {
|
|
||||||
resolve: {
|
|
||||||
alias: {
|
|
||||||
'@': require('path').resolve(__dirname, 'src'),
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
Loading…
x
Reference in New Issue
Block a user