Skip to content

Commit

Permalink
Merge pull request #393 from safwansamsudeen/master
Browse files Browse the repository at this point in the history 
Rewrite Framework
  • Loading branch information
@netchampfaris
netchampfaris authored Apr 30, 2024
2 parents ea6259a + 1403f2e commit b7deffd
Show file tree
Hide file tree
Showing 14 changed files with 1,507 additions and 620 deletions.
215 changes: 145 additions & 70 deletions dist/frappe-gantt.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -66,124 +66,194 @@
border-top-color: #333;
}

.gantt-container {
line-height: 14.5px;
}
.gantt-container .grid-header {
background-color: #ffffff;
position: sticky;
top: 0;
left: 0;
z-index: 10;
}
.gantt-container .lower-text,
.gantt-container .upper-text {
text-anchor: middle;
color: #111;
}
.gantt-container .upper-header {
height: 40px;
}
.gantt-container .lower-header {
height: 30px;
}
.gantt-container .lower-text {
font-size: 14px;
position: absolute;
width: fit-content;
}
.gantt-container .upper-text {
position: absolute;
width: fit-content;
font-weight: 500;
font-size: 16px;
}
.gantt-container .current-upper {
position: fixed;
}
.gantt-container .side-header {
position: fixed;
padding: 0 10px;
margin-right: 10px;
background: white;
line-height: 20px;
font-weight: 400;
}
.gantt-container .today-button,
.gantt-container .viewmode-select {
background: #F4F5F6;
text-align: -webkit-center;
text-align: center;
height: 25px;
border-radius: 8px;
border: none;
color: #111;
padding: 4px 10px;
border-radius: 8px;
height: 25px;
}
.gantt-container .viewmode-select {
outline: none !important;
padding: 4px 8px;
margin-right: 4px;
-webkit-appearance: none;
-moz-appearance: none;
text-indent: 1px;
text-overflow: "";
}
.gantt-container .date-highlight {
background-color: #EBEEF0;
border-radius: 12px;
position: absolute;
display: none;
}
.gantt-container .current-highlight {
position: absolute;
background: #2c94ec;
width: 1px;
}
.gantt-container .current-date-highlight {
background: #2c94ec;
color: #fff;
padding: 4px 8px;
border-radius: 200px;
}

.gantt {
user-select: none;
-webkit-user-select: none;
position: absolute;
}
.gantt .grid-background {
fill: none;
}
.gantt .grid-header {
fill: #ffffff;
stroke: #e0e0e0;
stroke-width: 1.4;
}
.gantt .grid-row {
fill: #ffffff;
}
.gantt .grid-row:nth-child(even) {
fill: #f5f5f5;
}
.gantt .row-line {
stroke: #ebeff2;
}
.gantt .tick {
stroke: #e0e0e0;
stroke-width: 0.2;
}
.gantt .tick.thick {
stroke: #EBEEF0;
stroke-width: 0.4;
}
.gantt .today-highlight {
fill: #fcf8e3;
opacity: 0.5;
}
.gantt .week-highlight {
fill: #fcf8e3;
opacity: 0.5;
}
.gantt .month-highlight {
fill: #fcf8e3;
opacity: 0.5;
.gantt .tick.thick {
stroke: #e0e0e0;
stroke-width: 0.7;
}
.gantt .year-highlight {
fill: #fcf8e3;
opacity: 0.5;
.gantt .holiday-highlight {
fill: #F9FAFA;
}
.gantt .arrow {
fill: none;
stroke: #666;
stroke-width: 1.4;
stroke: #9FA9B1;
stroke-width: 1;
}
.gantt .bar {
fill: #b8c2cc;
stroke: #8d99a6;
.gantt .bar-wrapper .bar {
fill: #fff;
stroke: #fff;
stroke-width: 0;
transition: stroke-width 0.3s ease;
}
.gantt .bar-progress {
fill: #acacfa;
fill: #EBEEF0;
}
.gantt .bar-expected-progress {
fill: #c4c4e9;
}
.gantt .bar-invalid {
fill: transparent;
stroke: #8d99a6;
stroke: #fff;
stroke-width: 1;
stroke-dasharray: 5;
}
.gantt .bar-invalid ~ .bar-label {
fill: #555;
fill: #fff;
}
.gantt .bar-label {
fill: #fff;
fill: #111;
dominant-baseline: central;
text-anchor: middle;
font-size: 12px;
font-weight: lighter;
font-family: Helvetica;
font-size: 13px;
font-weight: 400;
}
.gantt .bar-label.big {
fill: #555;
fill: #111;
text-anchor: start;
}
.gantt .bar-wrapper.important .bar {
fill: #94c4f4;
}
.gantt .bar-wrapper.important .bar-progress {
fill: #2c94ec;
}
.gantt .bar-wrapper.important .bar-label {
fill: #fff;
}
.gantt .bar-wrapper.important .handle {
fill: #94c4f4;
}
.gantt .bar-wrapper.important .handle.progress {
fill: #fff;
}
.gantt .handle {
fill: #ddd;
fill: #dcdce4;
cursor: ew-resize;
opacity: 0;
visibility: hidden;
transition: opacity 0.3s ease;
}
.gantt .handle.progress {
fill: #666;
}
.gantt .bar-wrapper {
cursor: pointer;
outline: none;
}
.gantt .bar-wrapper:hover .bar {
fill: #a9b5c1;
}
.gantt .bar-wrapper:hover .bar-progress {
fill: #9494f9;
}
.gantt .bar-wrapper:hover .handle {
.gantt .bar-wrapper.active .handle {
visibility: visible;
opacity: 1;
}
.gantt .bar-wrapper.active .bar {
fill: #a9b5c1;
}
.gantt .bar-wrapper.active .bar-progress {
fill: #9494f9;
}
.gantt .lower-text,
.gantt .upper-text {
font-size: 12px;
text-anchor: middle;
.gantt .bar-wrapper .bar {
-webkit-filter: drop-shadow(3px 3px 2px rgba(0, 0, 0, 0.7));
filter: drop-shadow(0 0 2px rgba(17, 43, 66, 0.16));
border-radius: 3px;
}
.gantt .upper-text {
fill: #555;
.gantt .bar-wrapper:hover .bar {
transition: transform 0.3s ease;
}
.gantt .lower-text {
fill: #333;
.gantt .bar-wrapper:hover .date-highlight {
display: block;
}
.gantt .hide {
display: none;
Expand All @@ -193,28 +263,33 @@
position: relative;
overflow: auto;
font-size: 12px;
height: 500px;
}
.gantt-container .popup-wrapper {
position: absolute;
top: 0;
left: 0;
background: rgba(0, 0, 0, 0.8);
padding: 0;
color: #959da5;
border-radius: 3px;
background: #171B1F;
padding: 10px;
border-radius: 5px;
width: max-content;
}
.gantt-container .popup-wrapper.hidden {
opacity: 0 !important;
}
.gantt-container .popup-wrapper .title {
border-bottom: 3px solid #acacfa;
padding: 10px;
margin-bottom: 5px;
text-align: -webkit-center;
text-align: center;
color: #fff;
}
.gantt-container .popup-wrapper .subtitle {
padding: 10px;
color: #dfe2e5;
color: #98A1A9;
}
.gantt-container .popup-wrapper .pointer {
position: absolute;
height: 5px;
margin: 0 0 0 -5px;
border: 5px solid transparent;
border-top-color: rgba(0, 0, 0, 0.8);
border-bottom-color: rgba(0, 0, 0, 0.8);
}
Loading

1 comment on commit b7deffd

@Alex4Codes
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

When will it be possible to get the update?

Please sign in to comment.