mirror of
https://github.com/tdurieux/anonymous_github.git
synced 2026-11-12 07:30:19 +01:00
claude/fix-page-width-layout-SY7c5 (#679)
* Fix horizontal overflow causing page content to be cut off on mobile - Add overflow-x: hidden to html/body and ng-view to prevent horizontal scrolling across all pages - Restore .container.page mobile padding to 15px to match Bootstrap .row negative margins (-15px), which previously caused 5px overflow per side - Add max-width: 100% constraints to prevent content from exceeding viewport https://claude.ai/code/session_01L2xhJCKkjghMDBuwXpSHzi * Fix Ko-fi widget overlapping hamburger menu and simplify desktop layout - Move Ko-fi "Support me" button from top-right (where it hid the navbar hamburger) to bottom-right corner - Remove card styling (border, background, border-radius) from dashboard quota section for a flatter, cleaner look - Remove fixed max-width: 960px from dashboard-page so it uses Bootstrap's standard container widths, consistent with other pages like admin https://claude.ai/code/session_01L2xhJCKkjghMDBuwXpSHzi * Redesign anonymize page: centered landing, reorganized form layout - No URL state: centered input in the middle of the page for a clean initial experience - URL provided state: preview on the left, form settings on the right in a fixed-width sidebar panel (380px on desktop) - Reorganized form sections into logical groups: Source (branch/commit) → Identity (ID/conference) → Anonymization (terms) → Display (checkboxes, no longer hidden in accordion) → Expiration - Removed card/accordion wrappers for a flatter, more scannable form - Mobile: form stacks below preview with sticky submit bar https://claude.ai/code/session_01L2xhJCKkjghMDBuwXpSHzi * Reduce navbar height on desktop - Reduce navbar padding from default .5rem to 4px vertical - Shrink nav icons from 30px/40px to 20px/28px - Reduce nav-link font size to 0.9rem with tighter padding - Shrink navbar-brand font size to 1rem https://claude.ai/code/session_01L2xhJCKkjghMDBuwXpSHzi --------- Co-authored-by: Claude <noreply@anthropic.com>
This commit is contained in:
1 parent
12d72bdc1a
commit
3f32ec5ca1
3 files changed
+305
-293
No files matched your search
Vendored
+1
-1
@@ -6,4 +6,4 @@
|
||||
*/:root{--blue:#007bff;--indigo:#6610f2;--purple:#6f42c1;--pink:#e83e8c;--red:#dc3545;--orange:#fd7e14;--yellow:#ffc107;--green:#28a745;--teal:#20c997;--cyan:#17a2b8;--white:#fff;--gray:#6c757d;--gray-dark:#343a40;--primary:#007bff;--secondary:#6c757d;--success:#28a745;--info:#17a2b8;--warning:#ffc107;--danger:#dc3545;--light:#f8f9fa;--dark:#343a40;--breakpoint-xs:0;--breakpoint-sm:576px;--breakpoint-md:768px;--breakpoint-lg:992px;--breakpoint-xl:1200px;--font-family-sans-serif:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-family-monospace:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace}*,::after,::before{box-sizing:border-box}html{font-family:sans-serif;line-height:1.15;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}article,aside,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";font-size:1rem;font-weight:400;line-height:1.5;color:#212529;text-align:left;background-color:#fff}[tabindex="-1"]:focus:not(:focus-visible){outline:0!important}hr{box-sizing:content-box;height:0;overflow:visible}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:.5rem}p{margin-top:0;margin-bottom:1rem}abbr[data-original-title],abbr[title]{text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;cursor:help;border-bottom:0;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none}address{margin-bottom:1rem;font-style:normal;line-height:inherit}dl,ol,ul{margin-top:0;margin-bottom:1rem}ol ol,ol ul,ul ol,ul ul{margin-bottom:0}dt{font-weight:700}dd{margin-bottom:.5rem;margin-left:0}blockquote{margin:0 0 1rem}b,strong{font-weight:bolder}small{font-size:80%}sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}a{color:#007bff;text-decoration:none;background-color:transparent}a:hover{color:#0056b3;text-decoration:underline}a:not([href]){color:inherit;text-decoration:none}a:not([href]):hover{color:inherit;text-decoration:none}code,kbd,pre,samp{font-family:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;font-size:1em}pre{margin-top:0;margin-bottom:1rem;overflow:auto}figure{margin:0 0 1rem}img{vertical-align:middle;border-style:none}svg{overflow:hidden;vertical-align:middle}table{border-collapse:collapse}caption{padding-top:.75rem;padding-bottom:.75rem;color:#6c757d;text-align:left;caption-side:bottom}th{text-align:inherit}label{display:inline-block;margin-bottom:.5rem}button{border-radius:0}button:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}button,input,optgroup,select,textarea{margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button,input{overflow:visible}button,select{text-transform:none}select{word-wrap:normal}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled),button:not(:disabled){cursor:pointer}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{padding:0;border-style:none}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=date],input[type=datetime-local],input[type=month],input[type=time]{-webkit-appearance:listbox}textarea{overflow:auto;resize:vertical}fieldset{min-width:0;padding:0;margin:0;border:0}legend{display:block;width:100%;max-width:100%;padding:0;margin-bottom:.5rem;font-size:1.5rem;line-height:inherit;color:inherit;white-space:normal}progress{vertical-align:baseline}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{outline-offset:-2px;-webkit-appearance:none}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{font:inherit;-webkit-appearance:button}output{display:inline-block}summary{display:list-item;cursor:pointer}template{display:none}[hidden]{display:none!important}.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6{margin-bottom:.5rem;font-weight:500;line-height:1.2}.h1,h1{font-size:2.5rem}.h2,h2{font-size:2rem}.h3,h3{font-size:1.75rem}.h4,h4{font-size:1.5rem}.h5,h5{font-size:1.25rem}.h6,h6{font-size:1rem}.lead{font-size:1.25rem;font-weight:300}.display-1{font-size:6rem;font-weight:300;line-height:1.2}.display-2{font-size:5.5rem;font-weight:300;line-height:1.2}.display-3{font-size:4.5rem;font-weight:300;line-height:1.2}.display-4{font-size:3.5rem;font-weight:300;line-height:1.2}hr{margin-top:1rem;margin-bottom:1rem;border:0;border-top:1px solid rgba(0,0,0,.1)}.small,small{font-size:80%;font-weight:400}.mark,mark{padding:.2em;background-color:#fcf8e3}.list-unsLine truncated
|
||||
* Font Awesome Free 5.15.4 by @fontawesome - https://fontawesome.com
|
||||
* License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
|
||||
*/.fa,.fab,.fad,.fal,.far,.fas{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:inline-block;font-style:normal;font-variant:normal;text-rendering:auto;line-height:1}.fa-lg{font-size:1.33333em;line-height:.75em;vertical-align:-.0667em}.fa-xs{font-size:.75em}.fa-sm{font-size:.875em}.fa-1x{font-size:1em}.fa-2x{font-size:2em}.fa-3x{font-size:3em}.fa-4x{font-size:4em}.fa-5x{font-size:5em}.fa-6x{font-size:6em}.fa-7x{font-size:7em}.fa-8x{font-size:8em}.fa-9x{font-size:9em}.fa-10x{font-size:10em}.fa-fw{text-align:center;width:1.25em}.fa-ul{list-style-type:none;margin-left:2.5em;padding-left:0}.fa-ul>li{position:relative}.fa-li{left:-2em;position:absolute;text-align:center;width:2em;line-height:inherit}.fa-border{border:solid .08em #eee;border-radius:.1em;padding:.2em .25em .15em}.fa-pull-left{float:left}.fa-pull-right{float:right}.fa.fa-pull-left,.fab.fa-pull-left,.fal.fa-pull-left,.far.fa-pull-left,.fas.fa-pull-left{margin-right:.3em}.fa.fa-pull-right,.fab.fa-pull-right,.fal.fa-pull-right,.far.fa-pull-right,.fas.fa-pull-right{margin-left:.3em}.fa-spin{-webkit-animation:fa-spin 2s infinite linear;animation:fa-spin 2s infinite linear}.fa-pulse{-webkit-animation:fa-spin 1s infinite steps(8);animation:fa-spin 1s infinite steps(8)}@-webkit-keyframes fa-spin{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes fa-spin{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.fa-rotate-90{-webkit-transform:rotate(90deg);transform:rotate(90deg)}.fa-rotate-180{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.fa-rotate-270{-webkit-transform:rotate(270deg);transform:rotate(270deg)}.fa-flip-horizontal{-webkit-transform:scale(-1,1);transform:scale(-1,1)}.fa-flip-vertical{-webkit-transform:scale(1,-1);transform:scale(1,-1)}.fa-flip-both,.fa-flip-horizontal.fa-flip-vertical{-webkit-transform:scale(-1,-1);transform:scale(-1,-1)}:root .fa-flip-both,:root .fa-flip-horizontal,:root .fa-flip-vertical,:root .fa-rotate-180,:root .fa-rotate-270,:root .fa-rotate-90{-webkit-filter:none;filter:none}.fa-stack{display:inline-block;height:2em;line-height:2em;position:relative;vertical-align:middle;width:2.5em}.fa-stack-1x,.fa-stack-2x{left:0;position:absolute;text-align:center;width:100%}.fa-stack-1x{line-height:inherit}.fa-stack-2x{font-size:2em}.fa-inverse{color:#fff}.fa-500px:before{content:"\f26e"}.fa-accessible-icon:before{content:"\f368"}.fa-accusoft:before{content:"\f369"}.fa-acquisitions-incorporated:before{content:"\f6af"}.fa-ad:before{content:"\f641"}.fa-address-book:before{content:"\f2b9"}.fa-address-card:before{content:"\f2bb"}.fa-adjust:before{content:"\f042"}.fa-adn:before{content:"\f170"}.fa-adversal:before{content:"\f36a"}.fa-affiliatetheme:before{content:"\f36b"}.fa-air-freshener:before{content:"\f5d0"}.fa-airbnb:before{content:"\f834"}.fa-algolia:before{content:"\f36c"}.fa-align-center:before{content:"\f037"}.fa-align-justify:before{content:"\f039"}.fa-align-left:before{content:"\f036"}.fa-align-right:before{content:"\f038"}.fa-alipay:before{content:"\f642"}.fa-allergies:before{content:"\f461"}.fa-amazon:before{content:"\f270"}.fa-amazon-pay:before{content:"\f42c"}.fa-ambulance:before{content:"\f0f9"}.fa-american-sign-language-interpreting:before{content:"\f2a3"}.fa-amilia:before{content:"\f36d"}.fa-anchor:before{content:"\f13d"}.fa-android:before{content:"\f17b"}.fa-angellist:before{content:"\f209"}.fa-angle-double-down:before{content:"\f103"}.fa-angle-double-left:before{content:"\f100"}.fa-angle-double-right:before{content:"\f101"}.fa-angle-double-up:before{content:"\f102"}.fa-angle-down:before{content:"\f107"}.fa-angle-left:before{content:"\f104"}.fa-angle-right:before{content:"\f105"}.fa-angle-up:before{content:"\f106"}.fa-angry:before{content:"\f556"}.fa-angrycreative:before{content:"\f36e"}.fa-angular:before{content:"\f420"}.fa-ankh:before{content:"\f644"}.fa-app-store:before{content:"\f36f"}.fa-app-store-ios:before{content:"\f370"}.fa-apper:before{content:"\f371"}.fa-apple:before{content:"\f179"}.fa-apple-alt:before{content:"\f5d1"}.fa-apple-pay:before{content:"\f415"}.fa-archive:before{content:"\f187"}.fa-archway:before{content:"\f557"}.fa-arrow-alt-circle-down:before{content:"\f358"}.fa-arrow-alt-circle-left:before{content:"\f359"}.fa-arrow-alt-circle-right:before{content:"\f35a"}.fa-arrow-alt-circle-up:before{content:"\f35b"}.fa-arrow-circle-down:before{content:"\f0ab"}.fa-arrow-circle-left:before{content:"\f0a8"}.fa-arrow-circle-right:before{content:"\f0a9"}.fa-arrow-circle-up:before{content:"\f0aa"}.fa-arrow-down:before{content:"\f063"}.fa-arrow-left:before{content:"\f060"}.fa-arrow-right:before{content:"\f061"}.fa-arrow-up:before{content:"\f062"}.fa-arrows-alt:before{content:"\f0b2"}.fa-arrows-alt-h:before{content:"\f337"}.fa-arrows-alt-v:before{content:"\f338"}.fa-artstation:before{content:"\f77a"}.fa-assistive-listening-systems:before{contentLine truncated
|
||||
*/.fa,.fab,.fad,.fal,.far,.fas{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:inline-block;font-style:normal;font-variant:normal;text-rendering:auto;line-height:1}.fa-lg{font-size:1.33333em;line-height:.75em;vertical-align:-.0667em}.fa-xs{font-size:.75em}.fa-sm{font-size:.875em}.fa-1x{font-size:1em}.fa-2x{font-size:2em}.fa-3x{font-size:3em}.fa-4x{font-size:4em}.fa-5x{font-size:5em}.fa-6x{font-size:6em}.fa-7x{font-size:7em}.fa-8x{font-size:8em}.fa-9x{font-size:9em}.fa-10x{font-size:10em}.fa-fw{text-align:center;width:1.25em}.fa-ul{list-style-type:none;margin-left:2.5em;padding-left:0}.fa-ul>li{position:relative}.fa-li{left:-2em;position:absolute;text-align:center;width:2em;line-height:inherit}.fa-border{border:solid .08em #eee;border-radius:.1em;padding:.2em .25em .15em}.fa-pull-left{float:left}.fa-pull-right{float:right}.fa.fa-pull-left,.fab.fa-pull-left,.fal.fa-pull-left,.far.fa-pull-left,.fas.fa-pull-left{margin-right:.3em}.fa.fa-pull-right,.fab.fa-pull-right,.fal.fa-pull-right,.far.fa-pull-right,.fas.fa-pull-right{margin-left:.3em}.fa-spin{-webkit-animation:fa-spin 2s infinite linear;animation:fa-spin 2s infinite linear}.fa-pulse{-webkit-animation:fa-spin 1s infinite steps(8);animation:fa-spin 1s infinite steps(8)}@-webkit-keyframes fa-spin{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes fa-spin{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.fa-rotate-90{-webkit-transform:rotate(90deg);transform:rotate(90deg)}.fa-rotate-180{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.fa-rotate-270{-webkit-transform:rotate(270deg);transform:rotate(270deg)}.fa-flip-horizontal{-webkit-transform:scale(-1,1);transform:scale(-1,1)}.fa-flip-vertical{-webkit-transform:scale(1,-1);transform:scale(1,-1)}.fa-flip-both,.fa-flip-horizontal.fa-flip-vertical{-webkit-transform:scale(-1,-1);transform:scale(-1,-1)}:root .fa-flip-both,:root .fa-flip-horizontal,:root .fa-flip-vertical,:root .fa-rotate-180,:root .fa-rotate-270,:root .fa-rotate-90{-webkit-filter:none;filter:none}.fa-stack{display:inline-block;height:2em;line-height:2em;position:relative;vertical-align:middle;width:2.5em}.fa-stack-1x,.fa-stack-2x{left:0;position:absolute;text-align:center;width:100%}.fa-stack-1x{line-height:inherit}.fa-stack-2x{font-size:2em}.fa-inverse{color:#fff}.fa-500px:before{content:"\f26e"}.fa-accessible-icon:before{content:"\f368"}.fa-accusoft:before{content:"\f369"}.fa-acquisitions-incorporated:before{content:"\f6af"}.fa-ad:before{content:"\f641"}.fa-address-book:before{content:"\f2b9"}.fa-address-card:before{content:"\f2bb"}.fa-adjust:before{content:"\f042"}.fa-adn:before{content:"\f170"}.fa-adversal:before{content:"\f36a"}.fa-affiliatetheme:before{content:"\f36b"}.fa-air-freshener:before{content:"\f5d0"}.fa-airbnb:before{content:"\f834"}.fa-algolia:before{content:"\f36c"}.fa-align-center:before{content:"\f037"}.fa-align-justify:before{content:"\f039"}.fa-align-left:before{content:"\f036"}.fa-align-right:before{content:"\f038"}.fa-alipay:before{content:"\f642"}.fa-allergies:before{content:"\f461"}.fa-amazon:before{content:"\f270"}.fa-amazon-pay:before{content:"\f42c"}.fa-ambulance:before{content:"\f0f9"}.fa-american-sign-language-interpreting:before{content:"\f2a3"}.fa-amilia:before{content:"\f36d"}.fa-anchor:before{content:"\f13d"}.fa-android:before{content:"\f17b"}.fa-angellist:before{content:"\f209"}.fa-angle-double-down:before{content:"\f103"}.fa-angle-double-left:before{content:"\f100"}.fa-angle-double-right:before{content:"\f101"}.fa-angle-double-up:before{content:"\f102"}.fa-angle-down:before{content:"\f107"}.fa-angle-left:before{content:"\f104"}.fa-angle-right:before{content:"\f105"}.fa-angle-up:before{content:"\f106"}.fa-angry:before{content:"\f556"}.fa-angrycreative:before{content:"\f36e"}.fa-angular:before{content:"\f420"}.fa-ankh:before{content:"\f644"}.fa-app-store:before{content:"\f36f"}.fa-app-store-ios:before{content:"\f370"}.fa-apper:before{content:"\f371"}.fa-apple:before{content:"\f179"}.fa-apple-alt:before{content:"\f5d1"}.fa-apple-pay:before{content:"\f415"}.fa-archive:before{content:"\f187"}.fa-archway:before{content:"\f557"}.fa-arrow-alt-circle-down:before{content:"\f358"}.fa-arrow-alt-circle-left:before{content:"\f359"}.fa-arrow-alt-circle-right:before{content:"\f35a"}.fa-arrow-alt-circle-up:before{content:"\f35b"}.fa-arrow-circle-down:before{content:"\f0ab"}.fa-arrow-circle-left:before{content:"\f0a8"}.fa-arrow-circle-right:before{content:"\f0a9"}.fa-arrow-circle-up:before{content:"\f0aa"}.fa-arrow-down:before{content:"\f063"}.fa-arrow-left:before{content:"\f060"}.fa-arrow-right:before{content:"\f061"}.fa-arrow-up:before{content:"\f062"}.fa-arrows-alt:before{content:"\f0b2"}.fa-arrows-alt-h:before{content:"\f337"}.fa-arrows-alt-v:before{content:"\f338"}.fa-artstation:before{content:"\f77a"}.fa-assistive-listening-systems:before{contentLine truncated
|
||||
+77
-70
@@ -126,6 +126,14 @@ html,
|
||||
body {
|
||||
position: relative;
|
||||
height: 100%;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
/* Prevent ng-view from scrolling horizontally */
|
||||
[ng-view] {
|
||||
overflow-x: hidden !important;
|
||||
overflow-y: auto !important;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.dropdown-menu a,
|
||||
@@ -149,11 +157,15 @@ a:hover {
|
||||
|
||||
.navbar {
|
||||
background: var(--header-bg-color) !important;
|
||||
}
|
||||
|
||||
.navbar {
|
||||
font-weight: 300;
|
||||
transition: background-color 0.5s ease;
|
||||
padding: 4px 1rem;
|
||||
}
|
||||
|
||||
.navbar .nav-link {
|
||||
font-size: 0.9rem;
|
||||
padding-top: 6px;
|
||||
padding-bottom: 6px;
|
||||
}
|
||||
|
||||
.navbar .nav-link.nav-icon {
|
||||
@@ -162,18 +174,14 @@ a:hover {
|
||||
|
||||
.navbar .nav-link .fa,
|
||||
.navbar .nav-link .fab {
|
||||
font-size: 30px;
|
||||
line-height: 40px;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.navbar-brand {
|
||||
width: 280px;
|
||||
}
|
||||
font-size: 20px;
|
||||
line-height: 28px;
|
||||
}
|
||||
|
||||
.navbar-brand {
|
||||
text-align: center;
|
||||
font-size: 1rem;
|
||||
padding: 4px 0;
|
||||
}
|
||||
|
||||
#navbarSupportedContent {
|
||||
@@ -542,17 +550,17 @@ notebook {
|
||||
}
|
||||
|
||||
.floatingchat-container-wrap {
|
||||
left: inherit !important;
|
||||
bottom: inherit !important;
|
||||
top: 3px !important;
|
||||
left: auto !important;
|
||||
top: auto !important;
|
||||
bottom: 3px !important;
|
||||
height: 47px !important;
|
||||
right: 3px !important;
|
||||
}
|
||||
|
||||
.floating-chat-kofi-popup-iframe {
|
||||
left: inherit !important;
|
||||
bottom: inherit !important;
|
||||
top: 55px !important;
|
||||
left: auto !important;
|
||||
top: auto !important;
|
||||
bottom: 55px !important;
|
||||
right: 10px !important;
|
||||
}
|
||||
|
||||
@@ -705,10 +713,6 @@ code {
|
||||
|
||||
/* ===== Dashboard & List Styles ===== */
|
||||
|
||||
.dashboard-page {
|
||||
max-width: 960px;
|
||||
}
|
||||
|
||||
.dashboard-title {
|
||||
font-size: 1.4rem;
|
||||
font-weight: 600;
|
||||
@@ -720,10 +724,7 @@ code {
|
||||
display: flex;
|
||||
gap: 16px;
|
||||
margin-bottom: 16px;
|
||||
padding: 12px 16px;
|
||||
background: var(--admin-stat-bg);
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: 8px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.quota-item {
|
||||
@@ -935,20 +936,45 @@ code {
|
||||
|
||||
/* ===== Anonymize Page Layout ===== */
|
||||
|
||||
.anonymize-page .sidePanel {
|
||||
/* Landing state: centered URL input */
|
||||
.anonymize-landing {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 100%;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.anonymize-landing-inner {
|
||||
width: 100%;
|
||||
max-width: 600px;
|
||||
}
|
||||
|
||||
.anonymize-landing-inner h2 {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
/* Form column (right side when URL is provided) */
|
||||
.anonymize-form-col {
|
||||
flex: 0 0 auto;
|
||||
width: 100%;
|
||||
min-width: 0;
|
||||
background: var(--sidebar-bg-color);
|
||||
border-left: 1px solid var(--border-color);
|
||||
}
|
||||
|
||||
.anonymize-section-title {
|
||||
font-size: 1rem;
|
||||
font-size: 0.85rem;
|
||||
font-weight: 600;
|
||||
margin: 16px 0 10px 0;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.3px;
|
||||
margin: 18px 0 8px 0;
|
||||
padding-bottom: 6px;
|
||||
border-bottom: 2px solid var(--primary-bg);
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
.anonymize-section-title i {
|
||||
color: var(--primary-bg);
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
@@ -971,18 +997,10 @@ code {
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.anonymize-page .accordion .card-header {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.anonymize-page .accordion .btn {
|
||||
font-weight: 600;
|
||||
font-size: 0.95rem;
|
||||
}
|
||||
|
||||
/* Preview column on desktop */
|
||||
.anonymize-preview-col {
|
||||
min-height: 0;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
/* PR diff overflow */
|
||||
@@ -994,11 +1012,13 @@ code {
|
||||
@media (min-width: 768px) {
|
||||
.anonymize-form-col {
|
||||
height: 100%;
|
||||
max-width: 50%;
|
||||
width: 380px;
|
||||
flex: 0 0 380px;
|
||||
}
|
||||
|
||||
.anonymize-preview-col {
|
||||
height: 100%;
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1028,8 +1048,9 @@ code {
|
||||
}
|
||||
|
||||
.container.page {
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
padding-left: 15px;
|
||||
padding-right: 15px;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
h1 { font-size: 1.6rem; }
|
||||
@@ -1143,40 +1164,30 @@ code {
|
||||
|
||||
/* ---- Anonymize page mobile ---- */
|
||||
|
||||
.anonymize-page > .row {
|
||||
.anonymize-landing {
|
||||
align-items: flex-start;
|
||||
padding-top: 60px;
|
||||
}
|
||||
|
||||
.anonymize-page .container-fluid > .row {
|
||||
height: auto !important;
|
||||
min-height: 100%;
|
||||
}
|
||||
|
||||
.anonymize-page .sidePanel {
|
||||
height: auto !important;
|
||||
overflow: visible !important;
|
||||
border-bottom: 2px solid var(--border-color);
|
||||
padding-bottom: 12px;
|
||||
}
|
||||
|
||||
.anonymize-page .sidePanel .card,
|
||||
.anonymize-page .sidePanel .container {
|
||||
max-width: 100%;
|
||||
padding-left: 8px;
|
||||
padding-right: 8px;
|
||||
}
|
||||
|
||||
.anonymize-form-col {
|
||||
max-width: 100% !important;
|
||||
flex: 0 0 100%;
|
||||
width: 100%;
|
||||
width: 100% !important;
|
||||
flex: 0 0 100% !important;
|
||||
border-left: none;
|
||||
border-top: 1px solid var(--border-color);
|
||||
}
|
||||
|
||||
.anonymize-preview-col {
|
||||
height: auto !important;
|
||||
max-height: none;
|
||||
border-top: 1px solid var(--border-color);
|
||||
padding-top: 12px !important;
|
||||
}
|
||||
|
||||
.anonymize-section-title {
|
||||
font-size: 0.95rem;
|
||||
font-size: 0.8rem;
|
||||
margin: 12px 0 8px 0;
|
||||
}
|
||||
|
||||
@@ -1185,9 +1196,9 @@ code {
|
||||
bottom: 0;
|
||||
background: var(--sidebar-bg-color);
|
||||
padding: 10px 0;
|
||||
margin: 0 -8px;
|
||||
padding-left: 8px;
|
||||
padding-right: 8px;
|
||||
margin: 0 -12px;
|
||||
padding-left: 12px;
|
||||
padding-right: 12px;
|
||||
border-top: 1px solid var(--border-color);
|
||||
z-index: 10;
|
||||
}
|
||||
@@ -1197,10 +1208,6 @@ code {
|
||||
padding: 12px 20px;
|
||||
}
|
||||
|
||||
.anonymize-page .card-title {
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
/* Compact checkboxes on mobile */
|
||||
.anonymize-page .form-check {
|
||||
padding-top: 6px;
|
||||
|
||||
+227
-222
@@ -1,11 +1,86 @@
|
||||
<div class="container-fluid h-100 anonymize-page">
|
||||
<div class="row h-100 flex-column flex-md-row">
|
||||
<div class="col-md sidePanel shadow overflow-auto anonymize-form-col">
|
||||
<div class="p-0 py-2 m-auto" ng-class="{'card': !sourceUrl, 'container': sourceUrl}">
|
||||
<form class="form needs-validation" ng-class="{'card-body': !sourceUrl}" name="anonymize" novalidate>
|
||||
<h3 class="card-title mb-3">Anonymize</h3>
|
||||
<div class="anonymize-page h-100">
|
||||
<!-- ===== STATE 1: No URL — centered input ===== -->
|
||||
<div class="anonymize-landing" ng-hide="sourceUrl">
|
||||
<div class="anonymize-landing-inner">
|
||||
<h2 class="mb-3">Anonymize</h2>
|
||||
<div class="form-group mb-2">
|
||||
<input
|
||||
type="text"
|
||||
class="form-control form-control-lg"
|
||||
ng-model="sourceUrl"
|
||||
placeholder="Paste a GitHub repo or pull request URL"
|
||||
ng-model-options="{ debounce: {default: 1000, blur: 0, click: 0}, updateOn: 'default blur click' }"
|
||||
ng-change="urlSelected()"
|
||||
/>
|
||||
</div>
|
||||
<small class="form-text text-muted">
|
||||
Paste a repository URL to anonymize a repo, or a pull request URL to anonymize a PR.
|
||||
</small>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Source URL (auto-detects repo vs PR) -->
|
||||
<!-- ===== STATE 2: URL provided — preview (left) + form (right) ===== -->
|
||||
<div class="container-fluid h-100" ng-show="sourceUrl">
|
||||
<div class="row h-100 flex-column flex-md-row">
|
||||
|
||||
<!-- Preview column (left on desktop) -->
|
||||
<div
|
||||
class="col-md p-2 overflow-auto markdown-body body anonymize-preview-col"
|
||||
ng-bind-html="html_readme"
|
||||
ng-if="detectedType === 'repo' && html_readme"
|
||||
></div>
|
||||
|
||||
<div class="col-md p-2 overflow-auto anonymize-preview-col" ng-if="detectedType === 'pr' && details">
|
||||
<div class="d-flex w-100 justify-content-between align-items-center flex-wrap">
|
||||
<h2 class="pr-title mb-1">
|
||||
<span ng-if="options.title">{{anonymizePrContent(details.pullRequest.title)}}</span>
|
||||
<span class="badge" ng-class="{'badge-success':details.pullRequest.merged, 'badge-warning':details.pullRequest.state=='open', 'badge-danger':details.pullRequest.state=='closed' && !details.pullRequest.merged}">
|
||||
{{details.pullRequest.merged ? "merged" : details.pullRequest.state | title}}
|
||||
</span>
|
||||
</h2>
|
||||
<small ng-bind="details.pullRequest.updatedDate | date" ng-if="options.date"></small>
|
||||
</div>
|
||||
<small ng-if="options.origin">Pull Request on {{details.pullRequest.baseRepositoryFullName}}</small>
|
||||
<div class="pr-body shadow-sm p-3 mb-4 rounded" style="background: var(--sidebar-bg-color)" ng-if="options.body">
|
||||
<markdown content="anonymizePrContent(details.pullRequest.body)" options="options" terms="terms"></markdown>
|
||||
</div>
|
||||
<ul class="nav nav-tabs" id="prTabs" role="tablist">
|
||||
<li class="nav-item" role="presentation" ng-if="options.diff">
|
||||
<button class="nav-link active" id="pills-diff-tab" data-toggle="pill" data-target="#pills-diff" type="button" role="tab">Diff</button>
|
||||
</li>
|
||||
<li class="nav-item" role="presentation" ng-if="options.comments">
|
||||
<button class="nav-link" ng-class="{'active':!options.diff}" id="pills-comments-tab" data-toggle="pill" data-target="#pills-comments" type="button" role="tab">
|
||||
<ng-pluralize count="details.pullRequest.comments.length" when="{'0': 'No comment', 'one': 'One Comment', 'other': '{} Comments'}"></ng-pluralize>
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="tab-content" id="pills-tabContent">
|
||||
<div class="tab-pane show active" id="pills-diff" role="tabpanel" ng-if="options.diff">
|
||||
<div class="pr-diff shadow-sm p-3 mb-4 rounded" style="background: var(--sidebar-bg-color)">
|
||||
<pre style="overflow-x: auto"><code ng-bind-html="anonymizePrContent(details.pullRequest.diff) | diff"></code></pre>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tab-pane" ng-class="{'show active':!options.diff}" id="pills-comments" role="tabpanel" ng-if="options.comments">
|
||||
<ul class="pr-comments list-group">
|
||||
<li class="pr-comment list-group-item" ng-repeat="comment in details.pullRequest.comments">
|
||||
<div class="d-flex w-100 justify-content-between flex-wrap">
|
||||
<h5 class="mb-1" ng-if="options.username">@{{anonymizePrContent(comment.author)}}</h5>
|
||||
<small ng-bind="comment.updatedDate | date" ng-if="options.date"></small>
|
||||
</div>
|
||||
<p class="mb-1">
|
||||
<markdown class="pr-comment-body" ng-if="options.body" content="anonymizePrContent(comment.body)" options="options" terms="terms"></markdown>
|
||||
</p>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Form column (right on desktop) -->
|
||||
<div class="anonymize-form-col overflow-auto">
|
||||
<form class="form needs-validation p-3" name="anonymize" novalidate>
|
||||
|
||||
<!-- Source URL -->
|
||||
<div class="form-group mb-2">
|
||||
<input
|
||||
type="text"
|
||||
@@ -19,7 +94,7 @@
|
||||
ng-change="urlSelected()"
|
||||
/>
|
||||
<div class="invalid-feedback" ng-show="anonymize.sourceUrl.$error.github">
|
||||
Please provide a valid GitHub URL, e.g., https://github.com/owner/repo or https://github.com/owner/repo/pull/123
|
||||
Please provide a valid GitHub URL.
|
||||
</div>
|
||||
<div class="invalid-feedback" ng-show="anonymize.sourceUrl.$error.access">
|
||||
Not accessible. The organization may restrict access.
|
||||
@@ -30,49 +105,36 @@
|
||||
<div class="invalid-feedback" ng-show="anonymize.sourceUrl.$error.used">
|
||||
Already anonymized.
|
||||
</div>
|
||||
<small class="form-text text-muted" ng-hide="sourceUrl">
|
||||
Paste a repository URL to anonymize a repo, or a pull request URL to anonymize a PR.
|
||||
</small>
|
||||
</div>
|
||||
|
||||
<!-- Type indicator -->
|
||||
<div class="mb-3" ng-show="detectedType && sourceUrl">
|
||||
<div class="mb-2" ng-show="detectedType">
|
||||
<span class="type-badge" ng-class="{'type-repo': detectedType === 'repo', 'type-pr': detectedType === 'pr'}">
|
||||
<i ng-class="{'fas fa-code-branch': detectedType === 'repo', 'fas fa-code-merge': detectedType === 'pr'}"></i>
|
||||
{{detectedType === 'repo' ? 'Repository' : 'Pull Request'}}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div ng-show="sourceUrl">
|
||||
<!-- ==== REPO-SPECIFIC FIELDS ==== -->
|
||||
<div ng-show="detectedType === 'repo'">
|
||||
<div class="form-group">
|
||||
<label for="branch">Branch</label>
|
||||
<div class="input-group mb-1">
|
||||
<select class="form-control" id="branch" name="branch" ng-model="source.branch">
|
||||
<option ng-repeat="b in branches" ng-bind="b.name" value="{{b.name}}"></option>
|
||||
</select>
|
||||
<div class="input-group-append">
|
||||
<button class="btn btn-outline-secondary" ng-click="getBranches(true)" title="Refresh" data-toggle="tooltip" data-placement="bottom">
|
||||
<i class="fa fa-undo"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<small class="form-text text-muted">The branch to anonymize</small>
|
||||
</div>
|
||||
</div>
|
||||
<!-- ── Source (repo only) ── -->
|
||||
<h6 class="anonymize-section-title" ng-show="detectedType === 'repo'">
|
||||
<i class="fas fa-code-branch"></i> Source
|
||||
</h6>
|
||||
|
||||
<!-- Auto update (both types) -->
|
||||
<div ng-show="detectedType === 'repo'">
|
||||
<div class="form-group">
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="update" name="update" ng-model="options.update" />
|
||||
<label class="form-check-label" for="update">Auto update</label>
|
||||
<small class="form-text text-muted">Automatically update with the latest changes.</small>
|
||||
<label for="branch">Branch</label>
|
||||
<div class="input-group mb-1">
|
||||
<select class="form-control" id="branch" name="branch" ng-model="source.branch">
|
||||
<option ng-repeat="b in branches" ng-bind="b.name" value="{{b.name}}"></option>
|
||||
</select>
|
||||
<div class="input-group-append">
|
||||
<button class="btn btn-outline-secondary" ng-click="getBranches(true)" title="Refresh" data-toggle="tooltip" data-placement="bottom">
|
||||
<i class="fa fa-undo"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Commit (repo only) -->
|
||||
<div class="form-group" ng-show="detectedType === 'repo'">
|
||||
<div class="form-group">
|
||||
<label for="commit">Commit</label>
|
||||
<input class="form-control" id="commit" name="commit" pattern="[a-fA-Z0-9]{6,}" ng-model="source.commit" required ng-class="{'is-invalid': anonymize.commit.$invalid}" />
|
||||
<small class="form-text text-muted">The SHA of the commit to anonymize.</small>
|
||||
@@ -80,157 +142,150 @@
|
||||
The commit SHA is not valid.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h5 class="anonymize-section-title">
|
||||
<i class="fas fa-chalkboard-teacher"></i> Conference ID
|
||||
</h5>
|
||||
<div class="form-group">
|
||||
<label for="conference">Conference ID <span class="text-muted">(Optional)</span></label>
|
||||
<input class="form-control" id="conference" name="conference" ng-model="conference" ng-class="{'is-invalid': anonymize.conference.$invalid}" />
|
||||
<small class="form-text text-muted" ng-show="conference_data">
|
||||
<a ng-href="{{conference_data.url}}" target="_blank">{{conference_data.name}}</a> will expire on {{conference_data.endDate | date}}.
|
||||
</small>
|
||||
<div class="invalid-feedback" ng-show="anonymize.conference.$error.activated">The conference is not activated.</div>
|
||||
<small class="form-text text-muted" ng-show="!conference_data">Conference ID updates anonymization options automatically.</small>
|
||||
<div class="form-group" ng-show="detectedType">
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="update" name="update" ng-model="options.update" />
|
||||
<label class="form-check-label" for="update">Auto update</label>
|
||||
<small class="form-text text-muted">Automatically update with the latest changes.</small>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ── Identity ── -->
|
||||
<h6 class="anonymize-section-title" ng-show="detectedType">
|
||||
<i class="fas fa-fingerprint"></i> Identity
|
||||
</h6>
|
||||
|
||||
<div class="form-group" ng-show="detectedType === 'repo'">
|
||||
<label for="repoId">Anonymized repository ID</label>
|
||||
<input type="text" class="form-control" name="repoId" id="repoId" ng-class="{'is-invalid': anonymize.repoId.$invalid}" ng-model="repoId" ng-model-options="{ debounce: {default: 1000, blur: 0, click: 0}, updateOn: 'default blur click' }" />
|
||||
<small class="form-text text-muted">https://anonymous.4open.science/r/{{repoId}}</small>
|
||||
<div class="invalid-feedback" ng-show="anonymize.repoId.$error.format">ID can only contain letters and numbers.</div>
|
||||
<div class="invalid-feedback" ng-show="anonymize.repoId.$error.used">{{repoId}} is already used.</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group" ng-show="detectedType === 'pr'">
|
||||
<label for="pullRequestId">Anonymized pull request ID</label>
|
||||
<input type="text" class="form-control" name="pullRequestId" id="pullRequestId" ng-class="{'is-invalid': anonymize.pullRequestId.$invalid}" ng-model="pullRequestId" ng-model-options="{ debounce: {default: 1000, blur: 0, click: 0}, updateOn: 'default blur click' }" />
|
||||
<small class="form-text text-muted">https://anonymous.4open.science/pr/{{pullRequestId}}</small>
|
||||
<div class="invalid-feedback" ng-show="anonymize.pullRequestId.$error.format">ID can only contain letters and numbers.</div>
|
||||
<div class="invalid-feedback" ng-show="anonymize.pullRequestId.$error.used">{{pullRequestId}} is already used.</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group" ng-show="detectedType">
|
||||
<label for="conference">Conference <span class="text-muted">(Optional)</span></label>
|
||||
<input class="form-control" id="conference" name="conference" ng-model="conference" ng-class="{'is-invalid': anonymize.conference.$invalid}" />
|
||||
<small class="form-text text-muted" ng-show="conference_data">
|
||||
<a ng-href="{{conference_data.url}}" target="_blank">{{conference_data.name}}</a> expires {{conference_data.endDate | date}}.
|
||||
</small>
|
||||
<div class="invalid-feedback" ng-show="anonymize.conference.$error.activated">The conference is not activated.</div>
|
||||
<small class="form-text text-muted" ng-show="!conference_data">Links to a conference for automatic settings.</small>
|
||||
</div>
|
||||
|
||||
<!-- ── Anonymization ── -->
|
||||
<h6 class="anonymize-section-title" ng-show="detectedType">
|
||||
<i class="fas fa-shield-alt"></i> Anonymization
|
||||
</h6>
|
||||
|
||||
<div class="form-group" ng-show="detectedType">
|
||||
<label for="terms">Terms to anonymize</label>
|
||||
<textarea class="form-control" id="terms" name="terms" rows="3" ng-model="terms" ng-model-options="{ debounce: 250 }" ng-class="{'is-invalid': anonymize.terms.$invalid}"></textarea>
|
||||
<small class="form-text text-muted">One term per line (regex). Replaced by {{site_options.ANONYMIZATION_MASK}}-[N].</small>
|
||||
<div class="warning-feedback" ng-show="anonymize.terms.$error.regex">Regex characters detected. Escape them if unintentional.</div>
|
||||
<div class="invalid-feedback" ng-show="anonymize.terms.$error.format">Terms are in an invalid format.</div>
|
||||
</div>
|
||||
|
||||
<!-- ── Display ── -->
|
||||
<h6 class="anonymize-section-title" ng-show="detectedType">
|
||||
<i class="fas fa-eye"></i> Display
|
||||
</h6>
|
||||
|
||||
<div ng-show="detectedType">
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="link" name="link" ng-model="options.link" />
|
||||
<label class="form-check-label" for="link">Keep links</label>
|
||||
</div>
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="image" name="image" ng-model="options.image" />
|
||||
<label class="form-check-label" for="image">Display images</label>
|
||||
</div>
|
||||
|
||||
<h5 class="anonymize-section-title">
|
||||
<i class="fas fa-shield-alt"></i> Anonymization Options
|
||||
</h5>
|
||||
|
||||
<!-- Anonymized ID: repo -->
|
||||
<div class="form-group" ng-show="detectedType === 'repo'">
|
||||
<label for="repoId">Anonymized repository ID</label>
|
||||
<input type="text" class="form-control" name="repoId" id="repoId" ng-class="{'is-invalid': anonymize.repoId.$invalid}" ng-model="repoId" ng-model-options="{ debounce: {default: 1000, blur: 0, click: 0}, updateOn: 'default blur click' }" />
|
||||
<small class="form-text text-muted">URL: https://anonymous.4open.science/r/{{repoId}}</small>
|
||||
<div class="invalid-feedback" ng-show="anonymize.repoId.$error.format">ID can only contain letters and numbers.</div>
|
||||
<div class="invalid-feedback" ng-show="anonymize.repoId.$error.used">{{repoId}} is already used.</div>
|
||||
<div ng-show="detectedType === 'repo'">
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="pdf" name="pdf" ng-model="options.pdf" />
|
||||
<label class="form-check-label" for="pdf">Display PDFs</label>
|
||||
</div>
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="notebook" name="notebook" ng-model="options.notebook" />
|
||||
<label class="form-check-label" for="notebook">Display Notebooks</label>
|
||||
</div>
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="page" name="page" ng-model="options.page" ng-disabled="!details.hasPage" />
|
||||
<label class="form-check-label" for="page">GitHub Pages</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Anonymized ID: PR -->
|
||||
<div class="form-group" ng-show="detectedType === 'pr'">
|
||||
<label for="pullRequestId">Anonymized pull request ID</label>
|
||||
<input type="text" class="form-control" name="pullRequestId" id="pullRequestId" ng-class="{'is-invalid': anonymize.pullRequestId.$invalid}" ng-model="pullRequestId" ng-model-options="{ debounce: {default: 1000, blur: 0, click: 0}, updateOn: 'default blur click' }" />
|
||||
<small class="form-text text-muted">URL: https://anonymous.4open.science/pr/{{pullRequestId}}</small>
|
||||
<div class="invalid-feedback" ng-show="anonymize.pullRequestId.$error.format">ID can only contain letters and numbers.</div>
|
||||
<div class="invalid-feedback" ng-show="anonymize.pullRequestId.$error.used">{{pullRequestId}} is already used.</div>
|
||||
</div>
|
||||
|
||||
<!-- Terms -->
|
||||
<div class="form-group">
|
||||
<label for="terms">Terms to anonymize</label>
|
||||
<textarea class="form-control" id="terms" name="terms" rows="3" ng-model="terms" ng-model-options="{ debounce: 250 }" ng-class="{'is-invalid': anonymize.terms.$invalid}"></textarea>
|
||||
<small class="form-text text-muted">One term per line (regex). Each term will be replaced by {{site_options.ANONYMIZATION_MASK}}-[N].</small>
|
||||
<div class="warning-feedback" ng-show="anonymize.terms.$error.regex">Regex characters detected. Escape them if unintentional.</div>
|
||||
<div class="invalid-feedback" ng-show="anonymize.terms.$error.format">Terms are in an invalid format.</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="expiration">Expiration strategy</label>
|
||||
<select class="form-control" id="expiration" name="expiration" ng-model="options.expirationMode">
|
||||
<option value="never" selected>Never expire</option>
|
||||
<option value="redirect">Redirect to GitHub when expired</option>
|
||||
<option value="remove">Remove when expired</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group" ng-hide="options.expirationMode=='never'">
|
||||
<label for="expirationDate">Expiration date</label>
|
||||
<input class="form-control" type="date" name="expirationDate" id="expirationDate" ng-model="options.expirationDate" />
|
||||
<small class="form-text text-muted" ng-show="options.expirationMode=='remove'">After {{options.expirationDate | date}}, the content will be removed.</small>
|
||||
<small class="form-text text-muted" ng-show="options.expirationMode=='redirect'">After {{options.expirationDate | date}}, visitors will be redirected to GitHub.</small>
|
||||
</div>
|
||||
|
||||
<!-- Advanced options -->
|
||||
<div class="accordion mb-3" id="advancedOptions">
|
||||
<div class="card">
|
||||
<div class="card-header" id="headingAdvanced">
|
||||
<h2 class="mb-0">
|
||||
<button class="btn btn-block text-left" type="button" data-toggle="collapse" data-target="#collapseAdvanced" aria-expanded="true" aria-controls="collapseAdvanced">
|
||||
<i class="fas fa-cog mr-1"></i> Advanced options
|
||||
</button>
|
||||
</h2>
|
||||
</div>
|
||||
<div id="collapseAdvanced" class="collapse show" aria-labelledby="headingAdvanced" data-parent="#advancedOptions">
|
||||
<div class="card-body">
|
||||
<!-- Shared options -->
|
||||
<div class="form-group mb-0">
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="link" name="link" ng-model="options.link" />
|
||||
<label class="form-check-label" for="link">Keep links</label>
|
||||
<small class="form-text text-muted">Keep or remove all the links.</small>
|
||||
</div>
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="image" name="image" ng-model="options.image" />
|
||||
<label class="form-check-label" for="image">Display images</label>
|
||||
<small class="form-text text-muted">Images are not anonymized.</small>
|
||||
</div>
|
||||
|
||||
<!-- Repo-specific options -->
|
||||
<div ng-show="detectedType === 'repo'">
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="pdf" name="pdf" ng-model="options.pdf" />
|
||||
<label class="form-check-label" for="pdf">Display PDFs</label>
|
||||
</div>
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="notebook" name="notebook" ng-model="options.notebook" />
|
||||
<label class="form-check-label" for="notebook">Display Notebooks</label>
|
||||
</div>
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="page" name="page" ng-model="options.page" ng-disabled="!details.hasPage" />
|
||||
<label class="form-check-label" for="page">GitHub Pages</label>
|
||||
<small class="form-text text-muted">Enable anonymized GitHub Pages at https://anonymous.4open.science/w/{{repoId}}</small>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- PR-specific options -->
|
||||
<div ng-show="detectedType === 'pr'">
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="date" name="date" ng-model="options.date" />
|
||||
<label class="form-check-label" for="date">Display dates</label>
|
||||
</div>
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="username" name="username" ng-model="options.username" />
|
||||
<label class="form-check-label" for="username">Display username</label>
|
||||
</div>
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="comments" name="comments" ng-model="options.comments" />
|
||||
<label class="form-check-label" for="comments">Display comments</label>
|
||||
</div>
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="diff" name="diff" ng-model="options.diff" />
|
||||
<label class="form-check-label" for="diff">Display diff</label>
|
||||
</div>
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="origin" name="origin" ng-model="options.origin" />
|
||||
<label class="form-check-label" for="origin">Display project name</label>
|
||||
</div>
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="title" name="title" ng-model="options.title" />
|
||||
<label class="form-check-label" for="title">Display PR title</label>
|
||||
</div>
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="body" name="body" ng-model="options.body" />
|
||||
<label class="form-check-label" for="body">Display PR body</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div ng-show="detectedType === 'pr'">
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="title" name="title" ng-model="options.title" />
|
||||
<label class="form-check-label" for="title">PR title</label>
|
||||
</div>
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="body" name="body" ng-model="options.body" />
|
||||
<label class="form-check-label" for="body">PR body</label>
|
||||
</div>
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="diff" name="diff" ng-model="options.diff" />
|
||||
<label class="form-check-label" for="diff">Diff</label>
|
||||
</div>
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="comments" name="comments" ng-model="options.comments" />
|
||||
<label class="form-check-label" for="comments">Comments</label>
|
||||
</div>
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="username" name="username" ng-model="options.username" />
|
||||
<label class="form-check-label" for="username">Usernames</label>
|
||||
</div>
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="date" name="date" ng-model="options.date" />
|
||||
<label class="form-check-label" for="date">Dates</label>
|
||||
</div>
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="origin" name="origin" ng-model="options.origin" />
|
||||
<label class="form-check-label" for="origin">Project name</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ── Expiration ── -->
|
||||
<h6 class="anonymize-section-title" ng-show="detectedType">
|
||||
<i class="far fa-clock"></i> Expiration
|
||||
</h6>
|
||||
|
||||
<div class="form-group" ng-show="detectedType">
|
||||
<select class="form-control" id="expiration" name="expiration" ng-model="options.expirationMode">
|
||||
<option value="never" selected>Never expire</option>
|
||||
<option value="redirect">Redirect to GitHub when expired</option>
|
||||
<option value="remove">Remove when expired</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group" ng-show="detectedType && options.expirationMode!='never'">
|
||||
<label for="expirationDate">Expiration date</label>
|
||||
<input class="form-control" type="date" name="expirationDate" id="expirationDate" ng-model="options.expirationDate" />
|
||||
<small class="form-text text-muted" ng-show="options.expirationMode=='remove'">After {{options.expirationDate | date}}, the content will be removed.</small>
|
||||
<small class="form-text text-muted" ng-show="options.expirationMode=='redirect'">After {{options.expirationDate | date}}, visitors will be redirected to GitHub.</small>
|
||||
</div>
|
||||
|
||||
<div class="alert alert-danger" role="alert" ng-if="error" ng-bind="error"></div>
|
||||
|
||||
<div class="anonymize-submit-bar" ng-show="sourceUrl && detectedType">
|
||||
<!-- Repo submit -->
|
||||
<div class="anonymize-submit-bar" ng-show="detectedType">
|
||||
<button type="submit" class="btn btn-primary btn-block" ng-click="anonymizeRepo($event)" ng-if="detectedType === 'repo' && !isUpdate">
|
||||
<i class="fas fa-user-secret mr-1"></i> Anonymize Repository
|
||||
</button>
|
||||
<button type="submit" class="btn btn-primary btn-block" ng-click="anonymizeRepo($event)" ng-if="detectedType === 'repo' && isUpdate">
|
||||
<i class="fas fa-save mr-1"></i> Update Repository
|
||||
</button>
|
||||
<!-- PR submit -->
|
||||
<button type="submit" class="btn btn-primary btn-block" ng-click="anonymizePullRequest($event)" ng-if="detectedType === 'pr' && !isUpdate">
|
||||
<i class="fas fa-user-secret mr-1"></i> Anonymize Pull Request
|
||||
</button>
|
||||
@@ -241,55 +296,5 @@
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Preview: repo README -->
|
||||
<div class="col-md-8 p-2 overflow-auto markdown-body body anonymize-preview-col" ng-bind-html="html_readme" ng-if="detectedType === 'repo' && html_readme"></div>
|
||||
|
||||
<!-- Preview: PR content -->
|
||||
<div class="col-md-8 p-2 overflow-auto anonymize-preview-col" ng-if="detectedType === 'pr' && details">
|
||||
<div class="d-flex w-100 justify-content-between align-items-center flex-wrap">
|
||||
<h2 class="pr-title mb-1">
|
||||
<span ng-if="options.title">{{anonymizePrContent(details.pullRequest.title)}}</span>
|
||||
<span class="badge" ng-class="{'badge-success':details.pullRequest.merged, 'badge-warning':details.pullRequest.state=='open', 'badge-danger':details.pullRequest.state=='closed' && !details.pullRequest.merged}">
|
||||
{{details.pullRequest.merged ? "merged" : details.pullRequest.state | title}}
|
||||
</span>
|
||||
</h2>
|
||||
<small ng-bind="details.pullRequest.updatedDate | date" ng-if="options.date"></small>
|
||||
</div>
|
||||
<small ng-if="options.origin">Pull Request on {{details.pullRequest.baseRepositoryFullName}}</small>
|
||||
<div class="pr-body shadow-sm p-3 mb-4 rounded" style="background: var(--sidebar-bg-color)" ng-if="options.body">
|
||||
<markdown content="anonymizePrContent(details.pullRequest.body)" options="options" terms="terms"></markdown>
|
||||
</div>
|
||||
<ul class="nav nav-tabs" id="prTabs" role="tablist">
|
||||
<li class="nav-item" role="presentation" ng-if="options.diff">
|
||||
<button class="nav-link active" id="pills-diff-tab" data-toggle="pill" data-target="#pills-diff" type="button" role="tab">Diff</button>
|
||||
</li>
|
||||
<li class="nav-item" role="presentation" ng-if="options.comments">
|
||||
<button class="nav-link" ng-class="{'active':!options.diff}" id="pills-comments-tab" data-toggle="pill" data-target="#pills-comments" type="button" role="tab">
|
||||
<ng-pluralize count="details.pullRequest.comments.length" when="{'0': 'No comment', 'one': 'One Comment', 'other': '{} Comments'}"></ng-pluralize>
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="tab-content" id="pills-tabContent">
|
||||
<div class="tab-pane show active" id="pills-diff" role="tabpanel" ng-if="options.diff">
|
||||
<div class="pr-diff shadow-sm p-3 mb-4 rounded" style="background: var(--sidebar-bg-color)">
|
||||
<pre style="overflow-x: auto"><code ng-bind-html="anonymizePrContent(details.pullRequest.diff) | diff"></code></pre>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tab-pane" ng-class="{'show active':!options.diff}" id="pills-comments" role="tabpanel" ng-if="options.comments">
|
||||
<ul class="pr-comments list-group">
|
||||
<li class="pr-comment list-group-item" ng-repeat="comment in details.pullRequest.comments">
|
||||
<div class="d-flex w-100 justify-content-between flex-wrap">
|
||||
<h5 class="mb-1" ng-if="options.username">@{{anonymizePrContent(comment.author)}}</h5>
|
||||
<small ng-bind="comment.updatedDate | date" ng-if="options.date"></small>
|
||||
</div>
|
||||
<p class="mb-1">
|
||||
<markdown class="pr-comment-body" ng-if="options.body" content="anonymizePrContent(comment.body)" options="options" terms="terms"></markdown>
|
||||
</p>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
Reference in new issue
Block a user