poanetwork
/
poa-dapps-voting
mirror of https://github.com/poanetwork/poa-dapps-voting.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

(feat) Header & Footer styles.

This commit is contained in:
Gabriel Rodríguez Alsina 2018-07-31 15:07:04 -03:00
parent 84b3a6f29b
commit 20917158b9
11 changed files with 33 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/App.js
View File

@ -18,25 +18,25 @@ class App extends Component {
showMobileMenu: false,
navigationData: [
{
icon: '',
icon: 'link-icon-all',
title: 'All',
url: commonStore.rootPath,
class: ''
},
{
icon: '',
icon: 'link-icon-active',
title: 'Active',
url: `${commonStore.rootPath}/active`,
class: ''
},
{
icon: '',
icon: 'link-icon-to-finalize',
title: 'To Finalize',
url: `${commonStore.rootPath}/tofinalize`,
class: ''
},
{
icon: '',
icon: 'link-icon-add',
title: 'New Ballot',
url: `${commonStore.rootPath}/new`,
class: 'btn btn-new-ballot btn-success btn-new'

2
src/assets/App.css
View File

File diff suppressed because one or more lines are too long

3
src/assets/images/icons/icon-active.svg Normal file
View File

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18">
<path fill="#60DB97" fill-rule="evenodd" d="M17 18a1 1 0 0 1-1-1v-1H2v1a1 1 0 0 1-2 0v-2a1 1 0 0 1 1-1h16a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1zm0-5H1a1 1 0 0 1-1-1V6a1 1 0 0 1 1-1h16a1 1 0 0 1 1 1v6a1 1 0 0 1-1 1zm-1-6H2v4h14V7zM4 8h1a1 1 0 0 1 0 2H4a1 1 0 0 1 0-2zm4 0h6a1 1 0 0 1 0 2H8a1 1 0 0 1 0-2zm9-4H1a1 1 0 0 1-1-1V1a1 1 0 0 1 2 0v1h14V1a1 1 0 0 1 2 0v2a1 1 0 0 1-1 1z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 448 B

3
src/assets/images/icons/icon-add.svg Normal file
View File

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14">
<path fill="#FFF" fill-rule="evenodd" d="M13 8H8v5a1 1 0 0 1-2 0V8H1a1 1 0 0 1 0-2h5V1a1 1 0 0 1 2 0v5h5a1 1 0 0 1 0 2z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 198 B

3
src/assets/images/icons/icon-all.svg Normal file
View File

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="17">
<path fill="#60DB97" fill-rule="evenodd" d="M16 10.95V11H2v-.05a2.502 2.502 0 0 1 0-4.9V6h14v.05a2.502 2.502 0 0 1 0 4.9zM16 8H2v1h14V8zm0-3.05V5H2v-.05a2.502 2.502 0 0 1 0-4.9V0h14v.05a2.502 2.502 0 0 1 0 4.9zM16 2H2v1h14V2zM2 12.05V12h14v.05a2.502 2.502 0 0 1 0 4.9V17H2v-.05a2.502 2.502 0 0 1 0-4.9zM2 15h14v-1H2v1z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 397 B

3
src/assets/images/icons/icon-to-finalize.svg Normal file
View File

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="18">
<path fill="#60DB97" fill-rule="evenodd" d="M15 15h-5a1 1 0 0 1-1-1v-3H2v6a1 1 0 0 1-2 0V1a1 1 0 0 1 1-1h9a1 1 0 0 1 1 1v3h4a1 1 0 0 1 1 1v9a1 1 0 0 1-1 1zM9 2H2v7h7V2zm2 11h3V6h-3v7z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 262 B

6
src/assets/stylesheets/application/_buttons.scss
View File

@ -44,9 +44,9 @@ textarea {
}
}
&.btn-new {
background-image: url('#{ $base-images-path }/icons/icon-add.svg');
background-size: 14px 14px;
padding-right: 45px;
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACsAAAArCAYAAADhXXHAAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA/JJREFUeNrcmUtME1EUhv8ppVDegpaHgFTAN7FYRHwQ0agRFWNc6sIY3bjXsDO4VBMX6lpdaMTEBTFujK+Fr/AG4wutLxQxihGLwNCWGc8tt8mo2N6ZtlA8yZ8QMvfeb07PvefcM5KqqpgpZgpzfD3pEWmA5CEpJFUjhf9/gD9XH9ZqzLM6VUtqJsmqMZP5+Fq9a+t52EHqJPnUyJiPz+eINOw50ogaHRvh84fkkAQ2WCvJSZKiuHcYRDtpZbCHQsG6SMVTuOFfk0qMnAZTDQq+nksvbOs0gGqBW0Vhz/EYnU5zco6gMesgPSRZYyBhjZLWkLr+BdvJgWPFGGj5ZGFQSyoTmUEe8eJs/QNcPtWBvjdueGQfolRjlHGuvzzbTKoUmeFF+xecOHQbHo+CWTYrquvmw1lTgFx7KqzJFkiRPZFbSKv+hJVJCSKjW2/14vSR+1CVibES0eUUpaBy8zyUVeWiaHEmEpPMkYIdIyWyP+IaGhoC1dNW0dHvnn1D292PE3mH289BD152fMXb5wMY/Cr7vZuelQhzfLiFHczckQ8Cr79Lz2ivV2FFxaQV3IeXP9DncuPxwz4scuagYkM+SpbPhiUhLhxgxnc8AFuqZ6TiUxBsPykUHr09g+h/O4SnLf0EnY3qHXZ/eBj0dGnAxczSdMEqYjvf6xknL//Al96f6L7XB8e6PGzZuwi589L0bkI/n+nKmS6TBlqsRFL0HVMMeuDTMO5cdeHonhu4eLIN7u+y3riFKdEan6a3/FNVY2cT+0XkYQ9uXOrB4bpruH7+GcbHhV7cv6CJJlhh5CoUrkkmCa4n3/wJRti98rC3w1CpbNBSMywoWDALjup8VG0tRHKqRRx2eMjj5stL0WRNSbf4j7Cy1XkoX58H29xU3e4xHzy6il2XfaT4aHiWZbKFThul43wsrsiGrSAFcXG6jy+f9uhi3s0SZw1Na6KYZJDVO+1Y4LAhKycJ8RbDicGthX2lB1YKcUjal2Zi+74llAxs9PMnRCLlvtLCNpGqwj0N5hanoe7AMlRuKiQvmkK+lA5r0sIeJx0TrbrYTzzhYQr0BDOyC1NQs7sYa7fZ/Z6MsI1xvt8yV7doPZuVm4zMHCsy5iShYmMBQRZRTCZH67bQPVmvq1a0NTQ26lNbbr5XP/cOqVE2n7YnNmPvYMz281tlLNgo5/ln34C9SWN4CTViva9G7TU8WK+LdUQqphG2bbImXbDG3HT0uoI254KllhI+MCZAQ8EGgNumIIZVvk5J0GQkMBGLnQtRPCVG+fwrhfL8//ZNISa+1khh3qfqeQOilF+XzX/cOFReOLt5mdcUKEoM3dtm0hfGXwIMAC+6tL4wp5PYAAAAAElFTkSuQmCC');
background-size: 18px 18px;
}
&[disabled],
&.disabled {
@ -57,4 +57,4 @@ textarea {
background-color: #dde2e8;
}
}
}
}

36
src/assets/stylesheets/application/_header.scss
View File

@ -70,9 +70,10 @@
.link {
color: #fff;
font-size: 14px;
font-weight: 700;
line-height: 16px;
margin-left: 30px;
line-height: 18px;
margin-left: 34px;
opacity: 0.8;
text-decoration: none;
transition: opacity linear 0.1s;
@ -97,27 +98,13 @@
background-repeat: no-repeat;
&-all {
background-image: url('#{ $base-images-path }/icons/icon-events.svg');
background-image: url('#{ $base-images-path }/icons/icon-all.svg');
}
&-set-metadata {
background-image: url('#{ $base-images-path }/icons/icon-status.svg');
&-active {
background-image: url('#{ $base-images-path }/icons/icon-active.svg');
}
&-pending-changes {
background-image: url('#{ $base-images-path }/icons/icon-statistics.svg');
}
}
&.sokol {
.link-icon {
&-all {
background-image: url('#{ $base-images-path }/icons/icon-events-sokol.svg');
}
&-set-metadata {
background-image: url('#{ $base-images-path }/icons/icon-status-sokol.svg');
}
&-pending-changes {
background-image: url('#{ $base-images-path }/icons/icon-statistics-sokol.svg');
}
&-to-finalize {
background-image: url('#{ $base-images-path }/icons/icon-to-finalize.svg');
}
}
@ -169,9 +156,8 @@
}
.btn.btn-new-ballot {
background-image: url('#{ $base-images-path }/btn-new-success.png');
height: 40px;
line-height: 40px;
height: 36px;
line-height: 36px;
opacity: 1;
.link-icon {
display: none;
@ -183,4 +169,4 @@
.select-network-id {
background: #fff;
width: 40px;
}
}

2
src/assets/stylesheets/helpers/_vars.scss
View File

@ -6,7 +6,7 @@ $primary-color-darker: #45277a;
$secondary-color: #6ac9b9;
$secondary-color-darker: darken(#6ac9b9, 10%);
$danger-color: #ff4949;
$success-color: #13ce66;
$success-color: #60db97;
$gray-text-color: #778f9b;
// buttons

2
src/components/MobileMenuLinks.jsx
View File

@ -5,7 +5,7 @@ const MobileMenuLinks = ({ onMenuToggle, navigationData }) => {
return (
<div className="links-container-mobile" onClick={onMenuToggle}>
{navigationData.map(item => (
<NavLink activeClassName="active" className="link" exact to={item.url}>
<NavLink activeClassName="active" className={`link ${item.class}`} exact to={item.url}>
<i className={`link-icon ${item.icon}`} />
<span className="link-text">{item.title}</span>
</NavLink>

5
src/components/Socials.jsx
View File

@ -7,11 +7,6 @@ let Socials = () => {
title: 'Twitter',
url: 'https://twitter.com/poanetwork'
},
{
icon: 'socials-i_poa',
title: 'POA Network',
url: 'https://poa.network'
},
{
icon: 'socials-i_telegram',
title: 'Telegram',