shaba/one
1
0
Fork 0
mirror of https://github.com/OpenNebula/one.git synced 2025-03-21 14:50:08 +03:00
Code Releases Wiki Activity

M #~: Fix logo in dark mode (#1031)

Browse Source
This commit is contained in:
Sergio Betanzos 2021-03-26 10:30:37 +01:00 committed by GitHub
parent 66151cc3e9
commit e0fd7582b8
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 18 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/fireedge/src/client/components/Sidebar/index.js
View File

@ -73,10 +73,7 @@ const Sidebar = memo(({ endpoints }) => {
withText
className={classes.svg}
/>
<IconButton
className={classes.hamburger}
onClick={handleSwapMenu}
>
<IconButton onClick={handleSwapMenu}>
{isUpLg ? <MenuIcon /> : <CloseIcon />}
</IconButton>
</Box>

9
src/fireedge/src/client/components/Sidebar/styles.js
View File

@ -70,12 +70,10 @@ export default makeStyles(theme => ({
// -------------------------------
header: {
userSelect: 'none',
backgroundColor: theme.palette.type === 'dark'
? theme.palette.background.paper
: theme.palette.primary.main,
color: theme.palette.primary.contrastText,
backgroundColor: theme.palette.background.paper,
display: 'flex',
alignItems: 'center',
justifyContent: 'space-between',
padding: '1rem',
overflow: 'hidden',
height: toolbar.regular,
@ -132,8 +130,5 @@ export default makeStyles(theme => ({
color: theme.palette.text.primary,
backgroundColor: theme.palette.primary.light,
'&:hover': { backgroundColor: theme.palette.primary.light }
},
hamburger: {
color: theme.palette.primary.contrastText
}
}))

26
src/fireedge/src/client/icons/logo.js
View File

@ -1,18 +1,22 @@
import React, { memo } from 'react'
import { number, string, bool, oneOfType } from 'prop-types'
import { useTheme } from '@material-ui/core'
const Logo = memo(({ width, height, spinner, withText, viewBox, ...props }) => {
const { palette: { type } } = useTheme()
const isDarkMode = type === 'dark'
const cloudColor = {
child1: { from: '#0098c3', to: '#ffffff' },
child2: { from: '#0098c3', to: '#ffffff' },
child3: { from: '#40b3d9', to: '#ffffff' },
child4: { from: '#80cde6', to: '#ffffff' },
child5: { from: '#bfe6f2', to: '#ffffff' }
child1: { from: '#bfe6f2', to: '#ffffff', static: isDarkMode ? '#ffffff' : '#bfe6f2' },
child2: { from: '#80cde6', to: '#ffffff', static: isDarkMode ? '#ffffff' : '#80cde6' },
child3: { from: '#40b3d9', to: '#ffffff', static: isDarkMode ? '#ffffff' : '#40b3d9' },
child4: { from: '#0098c3', to: '#ffffff', static: isDarkMode ? '#ffffff' : '#0098c3' },
child5: { from: '#0098c3', to: '#ffffff', static: isDarkMode ? '#ffffff' : '#0098c3' }
}
const textColor = {
top: 'currentColor',
bottom: '#0098c3'
bottom: isDarkMode ? 'currentColor' : '#0098c3'
}
return (
@ -40,23 +44,23 @@ const Logo = memo(({ width, height, spinner, withText, viewBox, ...props }) => {
)}
{/* --------------- CLOUD ------------------ */}
<path
fill={spinner ? 'url(#gradient__child1)' : cloudColor.child1.from}
fill={spinner ? 'url(#gradient__child1)' : cloudColor.child1.static}
d="M124.9,130.9c-4.6,1.1-9.1,2.2-13.7,3.2c-28,6-56.5,9.8-85.1,11.3c-1.8-0.2,0.7,1.1,1.1,1.5c7.6,5.5,17.5,6.5,26.9,6.6c22.9,0,45.7,0,68.6,0c0.8,0,1.3-0.2,1.7-0.7c0.5-0.5,0.5-1.7,0.5-1.7V130.9z"
/>
<path
fill={spinner ? 'url(#gradient__child2)' : cloudColor.child2.from}
fill={spinner ? 'url(#gradient__child2)' : cloudColor.child2.static}
d="M124.9,106.1c-14.4,6.8-29.5,12.3-44.8,16.9c-20.6,5.9-41.7,10.3-63,12.7c1.2,1.8,2.1,4.5,4.2,5.3c34.8-1.7,69.7-6.4,103.6-14.9V106.1z"
/>
<path
fill={spinner ? 'url(#gradient__child3)' : cloudColor.child3.from}
fill={spinner ? 'url(#gradient__child3)' : cloudColor.child3.static}
d="M124.9,81.6c-26,17.6-55.7,29.3-85.9,37.2c-8.5,2.1-17.1,4.4-25.7,5.8c0.4,2.3,0.9,4.4,1.8,6.6c36.5-4.3,72.7-13.2,106.2-28.6c1.2-0.6,2.5-1.2,3.7-1.8V81.6z"
/>
<path
fill={spinner ? 'url(#gradient__child4)' : cloudColor.child4.from}
fill={spinner ? 'url(#gradient__child4)' : cloudColor.child4.static}
d="M124.9,47.1c-13.1,15.6-29.7,28.1-47.4,38.2c-18.8,10.6-39,18.8-59.6,24.9c-1.5,0.8-4.4,0.5-4.3,2.8c-0.5,2.3-0.7,4.6-0.7,6.9c33.6-6.4,66.7-17,96.5-34.1c5.3-3.1,10.5-6.4,15.6-9.9V47.1z"
/>
<path
fill={spinner ? 'url(#gradient__child5)' : cloudColor.child5.from}
fill={spinner ? 'url(#gradient__child5)' : cloudColor.child5.static}
d="M124.9,12.9c-0.4-0.9-1.8-0.4-3.3,0.3c-5.7,2.4-28.8,13.7-32.3,28.7c-1.4,1.9-3.5-0.5-5.1-1c-13.1-6.4-29.7-4.3-40.9,5.1c-11.2,9-17.3,25.1-12.2,39c0.8,1.6,1.6,3.8-0.1,5.2c-2.1,1.4-4.4,2.5-6.2,4.3c-3.7,3.1-6.9,7.1-8.9,11.3c30.7-9.3,60.8-22.5,85.9-42.8c8.4-7,16.3-14.7,22.9-23.4V12.9z"
/>