mirrors/CyberChef
1
0
Fork 0
mirror of https://github.com/gchq/CyberChef.git synced 2025-05-08 23:35:01 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix up banner links for consistency

Browse source
This commit is contained in:
Robin Scholtes 2023-04-18 21:05:01 +12:00
parent 475568cbfd
commit 4507d471bc
2 changed files with 24 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

5
src/web/html/index.html
View file

@ -149,11 +149,12 @@
<div id="banner" class="row"> <div id="banner" class="row">
<div> <div>
<a href="#" <a href="#"
class="banner-link"
data-toggle="modal" data-toggle="modal"
data-target="#download-modal" data-target="#download-modal"
data-help-title="Downloading CyberChef" data-help-title="Downloading CyberChef"
data-help="<p>CyberChef can be downloaded to run locally or hosted within your own network. It has no server-side component so all that is required is that the ZIP file is uncompressed and the files are accessible.</p><p>As a user, it is worth noting that unofficial versions of CyberChef could have been modified to introduce Input and/or Recipe exfiltration. We recommend always using the official, open source, up-to-date version of CyberChef hosted at <a href='https://gchq.github.io/CyberChef'>https://gchq.github.io/CyberChef</a> if accessible.</p><p>The Network tab in your browser's Developer console (F12) can be used to inspect the network requests made by a website. This can confirm that no data is uploaded when a CyberChef recipe is baked.</p>"> data-help="<p>CyberChef can be downloaded to run locally or hosted within your own network. It has no server-side component so all that is required is that the ZIP file is uncompressed and the files are accessible.</p><p>As a user, it is worth noting that unofficial versions of CyberChef could have been modified to introduce Input and/or Recipe exfiltration. We recommend always using the official, open source, up-to-date version of CyberChef hosted at <a href='https://gchq.github.io/CyberChef'>https://gchq.github.io/CyberChef</a> if accessible.</p><p>The Network tab in your browser's Developer console (F12) can be used to inspect the network requests made by a website. This can confirm that no data is uploaded when a CyberChef recipe is baked.</p>">
Download CyberChef <span>Download CyberChef</span>
<i class="material-icons">file_download</i> <i class="material-icons">file_download</i>
</a> </a>
</div> </div>
@ -172,6 +173,7 @@
<div> <div>
<a href="#" <a href="#"
id="options" id="options"
class="banner-link"
data-help-title="Options and Settings" data-help-title="Options and Settings"
data-help="Configurable options to change how CyberChef behaves. These settings are stored in your browser's local storage, meaning they will persist between sessions that use the same browser profile."> data-help="Configurable options to change how CyberChef behaves. These settings are stored in your browser's local storage, meaning they will persist between sessions that use the same browser profile.">
<span class="desktop-only">Options</span> <span class="desktop-only">Options</span>
@ -179,6 +181,7 @@
</a> </a>
<a href="#" <a href="#"
id="support" id="support"
class="banner-link"
data-toggle="modal" data-toggle="modal"
data-target="#support-modal" data-target="#support-modal"
data-help-title="About / Support" data-help-title="About / Support"

30
src/web/stylesheets/layout/_banner.css
View file

@ -8,17 +8,17 @@
#banner { #banner {
position: absolute; position: absolute;
height: var(--banner-height);
width: 100%;
line-height: var(--banner-height);
border-bottom: 1px solid var(--primary-border-colour);
color: var(--banner-font-colour);
background-color: var(--banner-bg-colour);
margin: 0;
/* flex is applied through .row on the banner element */
justify-content: space-between;
padding-left: 12px; padding-left: 12px;
padding-right: 4px; padding-right: 4px;
margin: 0;
width: 100%;
height: var(--banner-height);
line-height: var(--banner-height);
color: var(--banner-font-colour);
background-color: var(--banner-bg-colour);
border-bottom: 1px solid var(--primary-border-colour);
justify-content: space-between; /* flex is applied through .row on the banner element */
} }
#banner i { #banner i {
@ -26,10 +26,20 @@
padding-right: 10px; padding-right: 10px;
} }
#banner a { .banner-link {
color: var(--banner-url-colour); color: var(--banner-url-colour);
} }
.banner-link:hover {
text-decoration: none;
}
@media only screen and (min-width: 768px){
.banner-link:hover span {
text-decoration: underline;
}
}
#notice-wrapper { #notice-wrapper {
text-align: center; text-align: center;
overflow: hidden; overflow: hidden;