Skip to content

Commit 3112449

Browse files
Preeti9764Preeti9764
committed
html changes
1 parent 6082a6e commit 3112449

File tree

1 file changed

+111
-76
lines changed

1 file changed

+111
-76
lines changed

‎src/popup.html

Lines changed: 111 additions & 76 deletions
Original file line numberDiff line numberDiff line change
@@ -46,96 +46,131 @@ <h3 class="text-3xl font-semibold ">Scrum Helper</h3>
4646

4747
<div class="rounded-2xl">
4848
<div class=" border-gray-100 border-2 bg-white rounded-3xl px-4 py-4 mx-2 my-2">
49-
<div>
50-
<h4>Your Project Name</h4>
51-
<input id="projectName" type="text"
52-
class="w-full border-2 border-gray-200 bg-gray-200 rounded-xl text-gray-800 p-2 my-2"
53-
placeholder="Enter your project name">
54-
</div>
55-
<div class="mb-4">
56-
<h4>Platform</h4>
57-
<div class="flex gap-4">
58-
<label class="flex items-center gap-2">
59-
<input type="radio" name="platform" value="github" checked class="form-radio">
60-
GitHub
61-
</label>
62-
<label class="flex items-center gap-2">
63-
<input type="radio" name="platform" value="gitlab" class="form-radio">
64-
GitLab
65-
</label>
49+
<div id="reportSection" class="tab-content">
50+
<div>
51+
<h4>Your Project Name</h4>
52+
<input id="projectName" type="text"
53+
class="w-full border-2 border-gray-200 bg-gray-200 rounded-xl text-gray-800 p-2 my-2"
54+
placeholder="Enter your project name">
55+
</div>
56+
<div class="mb-4">
57+
<h4>Platform</h4>
58+
<div class="flex gap-4">
59+
<label class="flex items-center gap-2">
60+
<input type="radio" name="platform" value="github" checked class="form-radio">
61+
GitHub
62+
</label>
63+
<label class="flex items-center gap-2">
64+
<input type="radio" name="platform" value="gitlab" class="form-radio">
65+
GitLab
66+
</label>
67+
</div>
68+
</div>
69+
<div id="githubUsernameContainer">
70+
<h4>Your Github Username</h4>
71+
<input id="githubUsername" type="text"
72+
class="w-full border-2 border-gray-200 bg-gray-200 rounded-xl text-gray-800 p-2 my-2"
73+
placeholder="Required for fetching your contributions">
74+
</div>
75+
<div id="gitlabUsernameContainer" class="hidden">
76+
<h4>Your GitLab Username</h4>
77+
<input id="gitlabUsername" type="text"
78+
class="w-full border-2 border-gray-200 bg-gray-200 rounded-xl text-gray-800 p-2 my-2"
79+
placeholder="Required for fetching your contributions">
6680
</div>
67-
</div>
68-
<div id="githubUsernameContainer">
69-
<h4>Your Github Username</h4>
70-
<input id="githubUsername" type="text"
71-
class="w-full border-2 border-gray-200 bg-gray-200 rounded-xl text-gray-800 p-2 my-2"
72-
placeholder="Required for fetching your contributions">
73-
</div>
74-
<div id="gitlabUsernameContainer" class="hidden">
75-
<h4>Your GitLab Username</h4>
76-
<input id="gitlabUsername" type="text"
77-
class="w-full border-2 border-gray-200 bg-gray-200 rounded-xl text-gray-800 p-2 my-2"
78-
placeholder="Required for fetching your contributions">
79-
</div>
8081

81-
<div>
82-
<p class="text-sm">Fetch your contributions between:</p>
83-
<div class="flex justify-between items-center my-2 mx-4">
84-
<div class="flex items-center gap-2">
85-
<input type="radio" id="lastWeekContribution" name="timeframe" class="form-radio"
86-
onclick="toggleRadio(this)">
87-
<label for="lastWeekContribution">Last 7 days</label>
82+
<div>
83+
<p class="text-sm">Fetch your contributions between:</p>
84+
<div class="flex justify-between items-center my-2 mx-4">
85+
<div class="flex items-center gap-2">
86+
<input type="radio" id="lastWeekContribution" name="timeframe" class="form-radio"
87+
onclick="toggleRadio(this)">
88+
<label for="lastWeekContribution">Last 7 days</label>
89+
</div>
90+
<div class="flex items-center gap-2">
91+
<input type="radio" id="yesterdayContribution" name="timeframe" class="form-radio"
92+
onclick="toggleRadio(this)">
93+
<label for="yesterdayContribution">Last 1 day</label>
94+
</div>
8895
</div>
89-
<div class="flex items-center gap-2">
90-
<input type="radio" id="yesterdayContribution" name="timeframe" class="form-radio"
91-
onclick="toggleRadio(this)">
92-
<label for="yesterdayContribution">Last 1 day</label>
96+
97+
<div id="customDateContainer" class="flex justify-between items-center mt-2">
98+
<div>
99+
<label for="startingDate">Start Date:</label>
100+
<input type="date" id="startingDate" class="border-2 border-gray-200 bg-gray-200 rounded-xl p-1">
101+
</div>
102+
<div>
103+
<label for="endingDate">End Date:</label>
104+
<input type="date" id="endingDate" class="border-2 border-gray-200 bg-gray-200 rounded-xl p-1">
105+
</div>
93106
</div>
94107
</div>
95108

96-
<div id="customDateContainer" class="flex justify-between items-center mt-2">
109+
<div class="col s12">
110+
<br />
111+
<input type="checkbox" id="showOpenLabel" class="form-checkbox h-4 w-4 text-blue-600">
112+
<label id="checkboxLabel" for="showOpenLabel" class="text-gray-700 font-medium text-sm">Show Open/Closed
113+
Label</label>
114+
</div>
115+
<div class="my-4">
116+
<p class="text-sm font-medium">What is blocking you from making progress?</p>
117+
<input id="userReason" type="text" class="w-full text-gray-800 mt-3 rounded-xl px-4 py-1"
118+
placeholder="Enter your reason">
119+
<hr class="border-t-2 border-gray-700 mt-1">
120+
</div>
121+
122+
<!-- Report Section -->
123+
<div>
97124
<div>
98-
<label for="startingDate">Start Date:</label>
99-
<input type="date" id="startingDate" class="border-2 border-gray-200 bg-gray-200 rounded-xl p-1">
125+
<h6 class="text-base font-semibold">Scrum Report</h6>
126+
<div id="scrumReport" contenteditable="true"
127+
class="min-h-[200px] overflow-y-auto whitespace-pre-wrap border-2 border-gray-200 bg-gray-100 rounded-xl text-gray-800 p-2 my-2">
128+
</div>
100129
</div>
101-
<div>
102-
<label for="endingDate">End Date:</label>
103-
<input type="date" id="endingDate" class="border-2 border-gray-200 bg-gray-200 rounded-xl p-1">
130+
<div class="flex justify-between gap-2">
131+
<button id="generateReport"
132+
class="flex items-center gap-2 bg-blue-600 hover:bg-blue-700 text-white font-medium py-2 px-4 rounded">
133+
<i class="fa fa-refresh"></i> Generate Report
134+
</button>
135+
<button id="copyReport"
136+
class="flex items-center gap-2 bg-blue-600 hover:bg-blue-700 text-white font-medium py-2 px-4 rounded">
137+
<i class="fa fa-copy"></i> Copy Report
138+
</button>
104139
</div>
105140
</div>
106-
</div>
107141

108-
<div class="col s12">
109-
<br />
110-
<input type="checkbox" id="showOpenLabel" class="form-checkbox h-4 w-4 text-blue-600">
111-
<label id="checkboxLabel" for="showOpenLabel" class="text-gray-700 font-medium text-sm">Show Open/Closed
112-
Label</label>
113-
</div>
114-
<div class="my-4">
115-
<p class="text-sm font-medium">What is blocking you from making progress?</p>
116-
<input id="userReason" type="text" class="w-full text-gray-800 mt-3 rounded-xl px-4 py-1"
117-
placeholder="Enter your reason">
118-
<hr class="border-t-2 border-gray-700 mt-1 ">
119-
</div>
120-
<div>
121-
<div>
122-
<h6 class="text-base font-semibold">Scrum Report</h6>
123-
<div id="scrumReport" contenteditable="true"
124-
class="min-h-[200px] overflow-y-auto whitespace-pre-wrap border-2 border-gray-200 bg-gray-100 rounded-xl text-gray-800 p-2 my-2">
142+
<!-- Settings Section -->
143+
<div id="settingsSection" class="tab-content hidden">
144+
<div class="">
145+
<p class="text-sm font-medium">Enter cache TTL <span class="text-sm text-gray-800 font-normal">(in
146+
minutes)</span>
147+
<span class="tooltip-container">
148+
<i class="fa fa-question-circle question-icon"></i>
149+
<span class="tooltip-bubble">
150+
We are caching the data to avoid redundant calls. By default the cache expires after 10 minutes, you
151+
can change it here to your desired time. We have given a refresh cache button in case you want to
152+
fetch fresh data right now.
153+
</span>
154+
</span>
155+
</p>
156+
<input type="text" id="cacheInput"
157+
class="w-full border-2 border-gray-200 bg-gray-200 rounded-xl text-gray-800 p-2 my-2"
158+
placeholder="Write Cache TTL in minutes (Default 10 minutes)">
159+
</div>
160+
<div class="">
161+
<button id="refreshCache"
162+
class="w-full mt-3 bg-blue-600 hover:bg-blue-700 text-white font-medium py-2 px-4 rounded flex items-center justify-center gap-2 transition-colors duration-200">
163+
<i class="fa fa-refresh"></i>
164+
<span>Refresh Data (bypass cache)</span>
165+
</button>
166+
<p class="cache-info">
167+
<i class="fa fa-info-circle"></i>
168+
Use this button to fetch fresh data immediately.
169+
</p>
125170
</div>
126171
</div>
127-
<div class="flex justify-between gap-2">
128-
<button id="generateReport"
129-
class="flex items-center gap-2 bg-blue-600 hover:bg-blue-700 text-white font-medium py-2 px-4 rounded">
130-
<i class="fa fa-refresh"></i> Generate Report
131-
</button>
132-
<button id="copyReport"
133-
class="flex items-center gap-2 bg-blue-600 hover:bg-blue-700 text-white font-medium py-2 px-4 rounded">
134-
<i class="fa fa-copy"></i> Copy Report
135-
</button>
136-
</div>
137-
138172

173+
<!-- Note Section -->
139174
<div class="border-gray-100 border-2 bg-white rounded-3xl px-4 py-2 mx-2 my-2">
140175
<div>
141176
<h4 class="font-semibold text-xl">Note:</h4>

0 commit comments

Comments
 (0)