Skip to content

/ ghostery-extension

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Step Progress Bar Bug #661

Merged
merged 3 commits into from Jan 20, 2021
+32 −13
Merged

Step Progress Bar Bug #661

Changes from 1 commit
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
34b4513
Fix cross browser progress bar lines and reduce size of progress bar …
benstrumeyer Jan 19, 2021
6216f42
Keep ghosty steps in place and fix the line lengths
benstrumeyer Jan 19, 2021
489ebb7
Fix navigation
benstrumeyer Jan 20, 2021
File filter
Filter file types
Clear filters
Jump to
Jump to file
Failed to load files.

Always

Just for now

Prev Next
Loading status checks…

Keep ghosty steps in place and fix the line lengths

  • Loading branch information
@benstrumeyer
benstrumeyer committed Jan 19, 2021
commit 6216f42f412c72e67fcc64615df0f39814790812
7 app/ghostery-browser-hub/Views/OnboardingViews/StepProgressBar/StepProgressBar.scss
View file
Open in desktop
@@ -45,6 +45,8 @@
&.incomplete {
background: url('/app/images/hub/step-progress-bar/step-2-incomplete.svg');
background-repeat: no-repeat;
margin: 0 2px 3px 0;
height: 32px;
}
}
&.step-3 {
@@ -55,6 +57,8 @@
&.incomplete {
background: url('/app/images/hub/step-progress-bar/step-3-incomplete.svg');
background-repeat: no-repeat;
margin: 0 2px 3px 0;
height: 32px;
}
}
&.step-4 {
@@ -65,6 +69,8 @@
&.incomplete {
background: url('/app/images/hub/step-progress-bar/step-4-incomplete.svg');
background-repeat: no-repeat;
margin: 0 2px 3px 0;
height: 32px;
}
}
&.step-completed {
@@ -94,6 +100,7 @@
width: 100%;
&.completed {
border: solid 2px $ghosty-blue;
width: 110%;
}
&.incompleted {
padding: 13px;
2 app/images/hub/step-progress-bar/step-1-current.svg
View file
Open in desktop
@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="29" height="31"><g fill="none" fill-rule="evenodd"><path fill="#00AEF0" d="M26.117 19.298V11.2c0-6.186-5.202-11.2-11.619-11.2C8.08 0 2.878 5.014 2.878 11.2v8.215c-.05 1.059-.31 3.487-1.586 6.328-1.715 3.818-.296 3.363.975 3.049 1.271-.313 4.11-1.54 4.997-.029.886 1.51 1.626 2.821 3.695 1.966 2.07-.854 3.045-1.139 3.34-1.139h.402c.295 0 1.27.285 3.34 1.14 2.07.854 2.81-.457 3.696-1.967.886-1.51 3.725-.284 4.996.029 1.271.314 2.69.769.975-3.049-1.327-2.956-1.555-5.46-1.59-6.445z"/><text fill="#4A4A4A" font-family="Roboto-Medium, Roboto" font-size="12.6" font-weight="400" transform="translate(.5)"><tspan x="10" y="20">1</tspan></text></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 33 35"><g fill="none" fill-rule="evenodd"><path fill="#00AEF0" d="M26.117 19.298V11.2c0-6.186-5.202-11.2-11.619-11.2C8.08 0 2.878 5.014 2.878 11.2v8.215c-.05 1.059-.31 3.487-1.586 6.328-1.715 3.818-.296 3.363.975 3.049 1.271-.313 4.11-1.54 4.997-.029.886 1.51 1.626 2.821 3.695 1.966 2.07-.854 3.045-1.139 3.34-1.139h.402c.295 0 1.27.285 3.34 1.14 2.07.854 2.81-.457 3.696-1.967.886-1.51 3.725-.284 4.996.029 1.271.314 2.69.769.975-3.049-1.327-2.956-1.555-5.46-1.59-6.445z"/><text fill="#4A4A4A" font-family="Roboto-Medium, Roboto" font-size="12.6" font-weight="400" transform="translate(.5)"><tspan x="10" y="20">1</tspan></text></g></svg>
2 app/images/hub/step-progress-bar/step-2-current.svg
View file
Open in desktop
@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="31"><g fill="none" fill-rule="evenodd"><path fill="#00AEF0" d="M25.617 19.298V11.2c0-6.186-5.202-11.2-11.619-11.2C7.58 0 2.378 5.014 2.378 11.2v8.215c-.05 1.059-.31 3.487-1.586 6.328-1.715 3.818-.296 3.363.975 3.049 1.271-.313 4.11-1.54 4.997-.029.886 1.51 1.626 2.821 3.695 1.966 2.07-.854 3.045-1.139 3.34-1.139h.402c.295 0 1.27.285 3.34 1.14 2.07.854 2.81-.457 3.696-1.967.886-1.51 3.725-.284 4.996.029 1.271.314 2.69.769.975-3.049-1.327-2.956-1.555-5.46-1.59-6.445z"/><text fill="#4A4A4A" font-family="Roboto-Medium, Roboto" font-size="12.6" font-weight="400"><tspan x="10" y="20">2</tspan></text></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 33 35"><g fill="none" fill-rule="evenodd"><path fill="#00AEF0" d="M25.617 19.298V11.2c0-6.186-5.202-11.2-11.619-11.2C7.58 0 2.378 5.014 2.378 11.2v8.215c-.05 1.059-.31 3.487-1.586 6.328-1.715 3.818-.296 3.363.975 3.049 1.271-.313 4.11-1.54 4.997-.029.886 1.51 1.626 2.821 3.695 1.966 2.07-.854 3.045-1.139 3.34-1.139h.402c.295 0 1.27.285 3.34 1.14 2.07.854 2.81-.457 3.696-1.967.886-1.51 3.725-.284 4.996.029 1.271.314 2.69.769.975-3.049-1.327-2.956-1.555-5.46-1.59-6.445z"/><text fill="#4A4A4A" font-family="Roboto-Medium, Roboto" font-size="12.6" font-weight="400"><tspan x="10" y="20">2</tspan></text></g></svg>
2 app/images/hub/step-progress-bar/step-2-incomplete.svg
View file
Open in desktop
@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="33" height="35"><g fill="none" fill-rule="evenodd"><path fill="#FFF" stroke="#00AEF0" stroke-width="2.1" d="M28.117 21.298V13.2c0-6.186-5.202-11.2-11.619-11.2-6.418 0-11.62 5.014-11.62 11.2v8.215c-.05 1.059-.31 3.487-1.586 6.328-1.715 3.818-.296 3.363.975 3.049 1.271-.313 4.11-1.54 4.997-.029.886 1.51 1.626 2.821 3.695 1.966 2.07-.854 3.045-1.139 3.34-1.139h.402c.295 0 1.27.285 3.34 1.14 2.07.854 2.81-.457 3.696-1.967.886-1.51 3.725-.284 4.996.029 1.271.314 2.69.769.975-3.049-1.327-2.956-1.555-5.46-1.59-6.445z"/><text fill="#4A4A4A" font-family="Roboto-Medium, Roboto" font-size="12.6" font-weight="400" transform="translate(2.5 2)"><tspan x="10" y="20">2</tspan></text></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 33 35"><g fill="none" fill-rule="evenodd"><path fill="#FFF" stroke="#00AEF0" stroke-width="2.1" d="M28.117 21.298V13.2c0-6.186-5.202-11.2-11.619-11.2-6.418 0-11.62 5.014-11.62 11.2v8.215c-.05 1.059-.31 3.487-1.586 6.328-1.715 3.818-.296 3.363.975 3.049 1.271-.313 4.11-1.54 4.997-.029.886 1.51 1.626 2.821 3.695 1.966 2.07-.854 3.045-1.139 3.34-1.139h.402c.295 0 1.27.285 3.34 1.14 2.07.854 2.81-.457 3.696-1.967.886-1.51 3.725-.284 4.996.029 1.271.314 2.69.769.975-3.049-1.327-2.956-1.555-5.46-1.59-6.445z"/><text fill="#4A4A4A" font-family="Roboto-Medium, Roboto" font-size="12.6" font-weight="400" transform="translate(2.5 2)"><tspan x="10" y="20">2</tspan></text></g></svg>
2 app/images/hub/step-progress-bar/step-3-current.svg
View file
Open in desktop
@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="31"><g fill="none" fill-rule="evenodd"><path fill="#00AEF0" d="M25.617 19.298V11.2c0-6.186-5.202-11.2-11.619-11.2C7.58 0 2.378 5.014 2.378 11.2v8.215c-.05 1.059-.31 3.487-1.586 6.328-1.715 3.818-.296 3.363.975 3.049 1.271-.313 4.11-1.54 4.997-.029.886 1.51 1.626 2.821 3.695 1.966 2.07-.854 3.045-1.139 3.34-1.139h.402c.295 0 1.27.285 3.34 1.14 2.07.854 2.81-.457 3.696-1.967.886-1.51 3.725-.284 4.996.029 1.271.314 2.69.769.975-3.049-1.327-2.956-1.555-5.46-1.59-6.445z"/><text fill="#4A4A4A" font-family="Roboto-Medium, Roboto" font-size="12.6" font-weight="400"><tspan x="10" y="20">3</tspan></text></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 33 35"><g fill="none" fill-rule="evenodd"><path fill="#00AEF0" d="M25.617 19.298V11.2c0-6.186-5.202-11.2-11.619-11.2C7.58 0 2.378 5.014 2.378 11.2v8.215c-.05 1.059-.31 3.487-1.586 6.328-1.715 3.818-.296 3.363.975 3.049 1.271-.313 4.11-1.54 4.997-.029.886 1.51 1.626 2.821 3.695 1.966 2.07-.854 3.045-1.139 3.34-1.139h.402c.295 0 1.27.285 3.34 1.14 2.07.854 2.81-.457 3.696-1.967.886-1.51 3.725-.284 4.996.029 1.271.314 2.69.769.975-3.049-1.327-2.956-1.555-5.46-1.59-6.445z"/><text fill="#4A4A4A" font-family="Roboto-Medium, Roboto" font-size="12.6" font-weight="400"><tspan x="10" y="20">3</tspan></text></g></svg>
2 app/images/hub/step-progress-bar/step-3-incomplete.svg
View file
Open in desktop
@@ -1,4 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" width="33" height="35" viewBox="0 0 33 35">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 33 35">
<g fill="none" fill-rule="evenodd">
<g>
<g>
2 app/images/hub/step-progress-bar/step-4-current.svg
View file
Open in desktop
@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="31"><g fill="none" fill-rule="evenodd"><path fill="#00AEF0" d="M25.617 19.298V11.2c0-6.186-5.202-11.2-11.619-11.2C7.58 0 2.378 5.014 2.378 11.2v8.215c-.05 1.059-.31 3.487-1.586 6.328-1.715 3.818-.296 3.363.975 3.049 1.271-.313 4.11-1.54 4.997-.029.886 1.51 1.626 2.821 3.695 1.966 2.07-.854 3.045-1.139 3.34-1.139h.402c.295 0 1.27.285 3.34 1.14 2.07.854 2.81-.457 3.696-1.967.886-1.51 3.725-.284 4.996.029 1.271.314 2.69.769.975-3.049-1.327-2.956-1.555-5.46-1.59-6.445z"/><text fill="#4A4A4A" font-family="Roboto-Medium, Roboto" font-size="12.6" font-weight="400"><tspan x="10" y="20">4</tspan></text></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 33 35"><g fill="none" fill-rule="evenodd"><path fill="#00AEF0" d="M25.617 19.298V11.2c0-6.186-5.202-11.2-11.619-11.2C7.58 0 2.378 5.014 2.378 11.2v8.215c-.05 1.059-.31 3.487-1.586 6.328-1.715 3.818-.296 3.363.975 3.049 1.271-.313 4.11-1.54 4.997-.029.886 1.51 1.626 2.821 3.695 1.966 2.07-.854 3.045-1.139 3.34-1.139h.402c.295 0 1.27.285 3.34 1.14 2.07.854 2.81-.457 3.696-1.967.886-1.51 3.725-.284 4.996.029 1.271.314 2.69.769.975-3.049-1.327-2.956-1.555-5.46-1.59-6.445z"/><text fill="#4A4A4A" font-family="Roboto-Medium, Roboto" font-size="12.6" font-weight="400"><tspan x="10" y="20">4</tspan></text></g></svg>
2 app/images/hub/step-progress-bar/step-4-incomplete.svg
View file
Open in desktop
@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="33" height="35"><g fill="none" fill-rule="evenodd"><path fill="#FFF" stroke="#00AEF0" stroke-width="2.1" d="M28.117 21.298V13.2c0-6.186-5.202-11.2-11.619-11.2-6.418 0-11.62 5.014-11.62 11.2v8.215c-.05 1.059-.31 3.487-1.586 6.328-1.715 3.818-.296 3.363.975 3.049 1.271-.313 4.11-1.54 4.997-.029.886 1.51 1.626 2.821 3.695 1.966 2.07-.854 3.045-1.139 3.34-1.139h.402c.295 0 1.27.285 3.34 1.14 2.07.854 2.81-.457 3.696-1.967.886-1.51 3.725-.284 4.996.029 1.271.314 2.69.769.975-3.049-1.327-2.956-1.555-5.46-1.59-6.445z"/><text fill="#4A4A4A" font-family="Roboto-Medium, Roboto" font-size="12.6" font-weight="400" transform="translate(2.5 2)"><tspan x="10" y="20">4</tspan></text></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 33 35"><g fill="none" fill-rule="evenodd"><path fill="#FFF" stroke="#00AEF0" stroke-width="2.1" d="M28.117 21.298V13.2c0-6.186-5.202-11.2-11.619-11.2-6.418 0-11.62 5.014-11.62 11.2v8.215c-.05 1.059-.31 3.487-1.586 6.328-1.715 3.818-.296 3.363.975 3.049 1.271-.313 4.11-1.54 4.997-.029.886 1.51 1.626 2.821 3.695 1.966 2.07-.854 3.045-1.139 3.34-1.139h.402c.295 0 1.27.285 3.34 1.14 2.07.854 2.81-.457 3.696-1.967.886-1.51 3.725-.284 4.996.029 1.271.314 2.69.769.975-3.049-1.327-2.956-1.555-5.46-1.59-6.445z"/><text fill="#4A4A4A" font-family="Roboto-Medium, Roboto" font-size="12.6" font-weight="400" transform="translate(2.5 2)"><tspan x="10" y="20">4</tspan></text></g></svg>
2 app/images/hub/step-progress-bar/step-completed.svg
View file
Open in desktop
@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="28" height="31"><defs><path id="a" d="M16.387 6.096L7.68 14.804a.717.717 0 01-.554.238.72.72 0 01-.554-.238l-3.958-3.958a.764.764 0 010-1.108.764.764 0 011.108 0l3.404 3.404 8.154-8.155a.766.766 0 011.108 0 .766.766 0 010 1.109z"/></defs><g fill="none" fill-rule="evenodd"><path fill="#00AEF0" d="M25.617 19.298V11.2c0-6.186-5.202-11.2-11.619-11.2C7.58 0 2.378 5.014 2.378 11.2v8.215c-.05 1.059-.31 3.487-1.586 6.328-1.715 3.818-.296 3.363.975 3.049 1.271-.313 4.11-1.54 4.997-.029.886 1.51 1.626 2.821 3.695 1.966 2.07-.854 3.045-1.139 3.34-1.139h.402c.295 0 1.27.285 3.34 1.14 2.07.854 2.81-.457 3.696-1.967.886-1.51 3.725-.284 4.996.029 1.271.314 2.69.769.975-3.049-1.327-2.956-1.555-5.46-1.59-6.445z"/><g transform="translate(5 8)"><mask id="b" fill="#fff"><use xlink:href="#a"/></mask><use fill="#000" fill-rule="nonzero" xlink:href="#a"/><g fill="#4A4A4A" mask="url(#b)"><path d="M0 0h19v19H0z"/></g></g></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 33 35"><defs><path id="a" d="M16.387 6.096L7.68 14.804a.717.717 0 01-.554.238.72.72 0 01-.554-.238l-3.958-3.958a.764.764 0 010-1.108.764.764 0 011.108 0l3.404 3.404 8.154-8.155a.766.766 0 011.108 0 .766.766 0 010 1.109z"/></defs><g fill="none" fill-rule="evenodd"><path fill="#00AEF0" d="M25.617 19.298V11.2c0-6.186-5.202-11.2-11.619-11.2C7.58 0 2.378 5.014 2.378 11.2v8.215c-.05 1.059-.31 3.487-1.586 6.328-1.715 3.818-.296 3.363.975 3.049 1.271-.313 4.11-1.54 4.997-.029.886 1.51 1.626 2.821 3.695 1.966 2.07-.854 3.045-1.139 3.34-1.139h.402c.295 0 1.27.285 3.34 1.14 2.07.854 2.81-.457 3.696-1.967.886-1.51 3.725-.284 4.996.029 1.271.314 2.69.769.975-3.049-1.327-2.956-1.555-5.46-1.59-6.445z"/><g transform="translate(5 8)"><mask id="b" fill="#fff"><use xlink:href="#a"/></mask><use fill="#000" fill-rule="nonzero" xlink:href="#a"/><g fill="#4A4A4A" mask="url(#b)"><path d="M0 0h19v19H0z"/></g></g></g></svg>
ProTip! Use n and p to navigate between commits in a pull request.