QT/bigcapital
1
0
Fork 0
mirror of https://github.com/bigcapitalhq/bigcapital.git synced 2026-02-19 06:10:31 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: fix items list datatable.

Browse Source
This commit is contained in:
a.bouhuolia
2021-02-08 13:17:11 +02:00
parent adac2386bb
commit 304f0c9ae5
43 changed files with 777 additions and 835 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
client/src/style/App.scss
View File

@@ -44,14 +44,7 @@ body.hide-scrollbar .Pane2{
}
.select-list--fill-popover {
position: relative;
.bp3-transition-container,
.bp3-popover {
min-width: 100%;
}
}
.bp3-fill{
.bp3-popover-wrapper,
@@ -91,12 +84,6 @@ body.hide-scrollbar .Pane2{
max-width: 300px;
}
.form-group--select-list{
button{
justify-content: start;
}
}
.bp3-timezone-picker{
.bp3-button{
@@ -105,4 +92,6 @@ body.hide-scrollbar .Pane2{
display: none;
}
}
}
}

4
client/src/style/components/DataTable/DataTable.scss
View File

@@ -64,6 +64,10 @@
border-bottom: 0;
}
}
.bp3-context-menu-popover-target{
z-index: 100;
}
}
.th,

23
client/src/style/components/DataTable/Pagination.scss
View File

@@ -1,12 +1,12 @@
.pagination{
display: flex;
padding: 25px 14px;
padding: 28px 14px;
font-size: 13px;
.bp3-button{
background: transparent;
padding: 4px 4px;
padding: 5px;
}
&__item{
@@ -15,7 +15,7 @@
&:not([class*="bp3-intent-"]){
color: #666666;
border-radius: 3px;
border-radius: 5px;
&:hover{
background-color: #E6EFFB;
@@ -28,14 +28,14 @@
}
.pagination .pagination__buttons-group .bp3-button-group &{
border-radius: 3px;
border-radius: 5px;
}
&--next,
&--previous{
&.bp3-button{
padding-left: 6px;
padding-right: 6px;
padding-left: 10px;
padding-right: 10px;
}
}
@@ -63,20 +63,22 @@
}
&__info{
padding-top: 6px;
color: #999;
color: #888;
margin-left: 12px;
display: flex;
align-items: center;
}
&__controls{
display: flex;
align-items: center;
margin-left: auto;
.bp3-html-select{
margin-left: 6px;
select{
height: 20px;
height: 24px;
width: auto;
padding: 0;
padding-right: 0px;
@@ -103,7 +105,6 @@
&__pagesize-control{
margin-left: 12px;
padding-top: 4px;
color: #777;
color: #888;
}
}

101
client/src/style/components/MaterialProgressBar.scss Normal file
View File

@@ -0,0 +1,101 @@
// IONIC DEFAULT THEME COLORS
$colors: (
primary: #387ef5,
secondary: #32db64,
danger: #f53d3d,
light: #f4f4f4,
dark: #222
);
// https://css-tricks.com/html5-progress-element/
.progress, progress[value] {
width: 100%;
border: none;
margin: 5px 0;
height: 5px;
display: block;
appearance: none;
-webkit-appearance: none;
&::-webkit-progress-bar {
background-color: lighten( map-get($colors, primary), 35% );
}
&::-webkit-progress-value {
background-color: map-get($colors, primary);
}
}
// http://materializecss.com/preloader.html
// https://github.com/Dogfalo/materialize/blob/master/dist/css/materialize.css
.progress-materializecss {
position: absolute;
top: -1px;
height: 2px;
display: block;
width: 100%;
background-color: transparent;
margin: 0;
overflow: hidden;
.indeterminate {
background-color: #002fff;
&:before{
content: '';
position: absolute;
background-color: inherit;
top: 0;
left: 0;
bottom: 0;
will-change: left, right;
animation: indeterminate 3.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;
}
&:after {
content: '';
position: absolute;
background-color: inherit;
top: 0;
left: 0;
bottom: 0;
will-change: left, right;
animation: indeterminate-short 3.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
animation-delay: 2.15s;
}
}
}
@keyframes indeterminate {
0% {
left: -35%;
right: 100%;
}
60% {
left: 100%;
right: -90%;
}
100% {
left: 100%;
right: -90%;
}
}
@keyframes indeterminate-short {
0% {
left: -200%;
right: 100%;
}
60% {
left: 107%;
right: -8%;
}
100% {
left: 107%;
right: -8%;
}
}
.progress-container{
width: 100%;
position: relative;
}
// IRRELEVANTS STYLES //
/////////////////////////

44
client/src/style/objects/buttons.scss
View File

@@ -1,30 +1,4 @@
.form-group--select-list {
.bp3-popover-target {
.bp3-icon {
position: absolute;
top: 0;
left: 0;
margin: 7px;
+ .bp3-button-text {
padding-left: 20px;
}
}
.bp3-button {
padding-left: 10px;
color: #333;
}
}
}
.form-group--select-list {
.bp3-popover-open {
.bp3-button {
border-color: #80bdff;
}
}
}
.bp3-button {
min-width: 32px;
@@ -41,24 +15,6 @@
font-size: 13px;
min-height: 29px;
}
.form-group--select-list & {
border-radius: 2px;
&,
&:hover {
box-shadow: 0 0 0 transparent;
border: 1px solid #ced4da;
&:not(:disabled) {
background: #fff;
}
}
}
.form-group--select-list.bp3-intent-danger & {
& {
border-color: #db3737;
}
}
}
.bp3-button-group.bp3-minimal .bp3-button {

63
client/src/style/objects/form.scss
View File

@@ -167,16 +167,70 @@ label.bp3-label {
}
.form-group--select-list {
.form-group--select-list.bp3-intent-danger & {
& {
border-color: #db3737;
}
}
.#{$ns}-button {
color: #8d8d8d;
position: relative;
padding-right: 25px;
justify-content: start;
&:not([class*="bp3-intent-"]):not(.bp3-minimal){
&,
&:hover {
outline: none;
box-shadow: 0 0 0 transparent;
border: 1px solid #ced4da;
&:not(:disabled) {
background: #fff;
}
}
&:focus{
box-shadow: 0 0 0 1px #116cd0;
border-color: #116cd0;
}
}
}
&.bp3-fill {
width: 100%;
}
.bp3-popover-target.bp3-popover-open{
.#{$ns}-button {
&:not([class*="bp3-intent-"]):not(.bp3-minimal):not(:disabled),
&:not([class*="bp3-intent-"]):not(.bp3-minimal):hover:not(:disabled){
background-color: #fafafa;
}
}
}
.bp3-popover-target {
.bp3-icon {
position: absolute;
top: 0;
left: 0;
margin: 7px;
+ .bp3-button-text {
padding-left: 20px;
}
}
.bp3-button {
padding-left: 10px;
color: #333;
}
}
&.bp3-intent-danger {
.bp3-button:not(.bp3-minimal) {
border-color: #db3737;
@@ -184,6 +238,15 @@ label.bp3-label {
}
}
.select-list--fill-popover {
position: relative;
.bp3-transition-container,
.bp3-popover {
min-width: 100%;
}
}
.select-list--tooltip-items .bp3-popover-target {
display: block;
}

29
client/src/style/pages/Dashboard/Dashboard.scss
View File

@@ -79,19 +79,18 @@ $dashboard-views-bar-height: 45px;
.bp3-button:not([class*='bp3-intent-']):not(.bp3-minimal) {
padding: 0;
background-size: contain;
background-color: #eed1f2;
border-radius: 50%;
height: 35px;
width: 35px;
height: 32px;
width: 32px;
.user-text {
font-size: 12px;
color: #804F87;
color: #fff;
}
&,
&:hover,
&:focus {
background-color: #EEB1F7;
background-color: #cb20e5;
border: 0;
box-shadow: none;
}
@@ -120,7 +119,7 @@ $dashboard-views-bar-height: 45px;
}
&__back-link {
margin-left: 24px;
margin-left: 20px;
display: flex;
a {
@@ -128,6 +127,15 @@ $dashboard-views-bar-height: 45px;
}
}
&__organization-name{
font-size: 14px;
font-weight: 400;
color: #818ca9;
margin: 0 0 0 15px;
display: flex;
align-items: center;
}
&__actions-bar {
border-bottom: 2px solid #eaeaea;
@@ -224,14 +232,7 @@ $dashboard-views-bar-height: 45px;
margin: 0;
}
h3 {
border-left: 1px solid #d9d9d9;
padding-left: 10px;
font-size: 16px;
font-weight: 400;
color: #76768b;
margin: 0 0 0 12px;
padding-top: 4px;
padding-bottom: 4px;
}
.button--view-edit {

8
client/src/style/pages/Preferences/Topbar.scss
View File

@@ -32,17 +32,17 @@
background-size: contain;
background-color: #eed1f2;
border-radius: 50%;
height: 35px;
width: 35px;
height: 32px;
width: 32px;
.user-text {
font-size: 12px;
color: #804f87;
color: #fff;
}
&,
&:hover,
&:focus {
background-color: #eed1f2;
background-color: #cb20e5;
border: 0;
box-shadow: none;
}