This commit is contained in:
lesleyjanenorton 2020-08-19 10:10:50 -05:00
Родитель 6c1669c009
Коммит f686d3f3e3
7 изменённых файлов: 186 добавлений и 91 удалений

Просмотреть файл

@ -137,20 +137,22 @@ li:last-of-type {
.nested-text-link {
padding: 2px 4px;
/* padding: 2px 4px;
margin-left: -4px;
margin-right: -4px;
color: var(--inherit);
background-color: var(--transparent);
margin-right: -4px; */
/* color: var(--inherit); */
/* background-color: var(--transparent);
border-radius: 4px;
text-underline-offset: 0px;
text-underline-position: under;
text-underline-position: under; */
border-radius: 4px;
}
.nested-text-link:hover {
/* .nested-text-link:hover {
background-color: var(--mozGrey);
transition: background-color 0.3s ease;
}
} */
.mobile-menu-z-index-hack {
width: 100%;
@ -202,7 +204,7 @@ li:last-of-type {
width: 100%;
}
section {
.content-section {
width: 100%;
align-items: center;
}
@ -252,6 +254,7 @@ section {
background-color: rgba(255, 255, 255, 0);
width: 6rem;
height: var(--slideInHeaderLogoHeight);
margin: 0 auto 0 0;
transition: background-color 0.3s ease;
}
@ -286,10 +289,7 @@ section {
max-width: 50%;
white-space: nowrap;
opacity: 0;
}
.fix-header .fixed-header-full-title {
opacity: 1;
display: none;
}
.desktop-nav {
@ -336,35 +336,40 @@ section {
transition: background-color 0.3s ease, height 0.2s ease;
}
.desktop-link:hover::before,
.desktop-link:focus::before {
background-color: #fff34f29;
height: 3px;
transition: background-color 0.3s ease, height 0.2s ease;
}
.desktop-link:focus {
outline: none;
}
.nav-link:hover::before,
.nav-link.active::before {
.desktop-link:hover::before,
.desktop-link.active:hover::before,
.desktop-link.active::before,
.desktop-link:focus::before {
height: 3px;
background-color: var(--mozLightYellow);
background-color: #fff34f29;
transition: background-color 0.3s ease, height 0.2s ease;
}
.nav-link.active::before,
.nav-link:hover::before,
.desktop-link.active:hover::before,
.fix-header .desktop-link:focus::before {
background-color: var(--mozLightYellow);
}
.mobile-link:hover::before {
background-color: #fff34f93;
}
.mobile-link::before,
.mobile-link.active::before,
.mobile-link.active:hover::before,
.mobile-link:hover::before,
.fix-header .active:hover::before,
.fix-header .active::before {
height: 100%;
transition: background-color 0.3s ease, height 0.2s ease;
}
.desktop-link.home-link.active::before,
.desktop-link.home-link.active:hover::before {
height: 3px !important;
}
.fix-header .twitter-icon {
fill: #202020;
}
@ -394,13 +399,11 @@ section {
fill: #000000;
}
.contact-link {
color: rgba(0, 0, 0, 0);
font-size: 1px;
width: 1.25rem;
height: 1rem;
margin-left: 1rem;
opacity: .9;
.contact-link:focus {
outline: none;
box-shadow: 0 0 0px 3px #ffff0038, 0 0 0 1px #ffffffa8;
/* padding: 2px; */
transition: padding 0.3s ease, box-shadow 0.3s ease;
}
header,
@ -569,17 +572,11 @@ h3 {
}
.fixed-contact-menu {
position: absolute;
right: 3.5rem;
top: 0;
bottom: 0;
margin: auto;
margin: auto auto auto var(--padding);
display: flex;
align-items: center;
width: 5rem;
justify-content: space-between;
visibility: hidden;
pointer-events: none;
border-left: 1px solid var(--mozDarkGrey);
}
.contact-link {
@ -587,8 +584,11 @@ h3 {
font-size: 1px;
width: 1.15rem;
height: 1rem;
margin: auto;
opacity: .9;
margin: auto 0 auto var(--padding);
padding: 0;
border-radius: 2px;
box-shadow: 0 0 0 0 transparent, 0 0 0 0 transparent;
transition: padding 0.3s ease, box-shadow 0.3s ease;
}
.mobile-menu-fixed {
@ -759,6 +759,32 @@ span.mm-4 {
opacity: .7;
}
.open-new-tab::after {
content: "";
display: inline-block;
height: .85rem;
width: .85rem;
background-repeat: no-repeat;
background-position: center;
background-size: .85rem;
margin: auto .15rem -1px .45rem;
opacity: .25;
transition: opacity 0.3s ease;
}
.open-new-tab:focus::after {
opacity: .9;
transition: opacity 0.3s ease;
}
a.pub-title::after {
background-image: url(/img/open-new-tab.svg);
}
a.talk-title::after {
background-image: url("/img/open-new-tab-light.svg");
}
.doc-1 {
background-image: url("/img/pub-3d-1.svg");
}
@ -887,18 +913,6 @@ span.mm-4 {
transition: background-color 0.3s ease, box-shadow 0.3s ease;
}
.talk-title-link:hover {
/* background-color: rgba(255, 255, 255, .1); */
/* box-shadow: 0 0 0 2px rgb(255, 255, 255, 0), 0 0 0 5px rgba(255, 255, 255, 0);
transition: background-color 0.3s ease, box-shadow 0.3s ease; */
}
/* .talk-title-link:focus {
box-shadow: 0 0 0 2px rgb(255, 255, 255), 0 0 0 5px rgba(255, 255, 255, .2);
outline: none;
transition: background-color 0.3s ease, box-shadow 0.3s ease;
} */
.talk-list-item {
margin-bottom: 1rem;
}
@ -1050,10 +1064,15 @@ span.mm-4 {
color: var(--mozDarkGrey);
}
.feed-list-item {
.feed-list-item,
.footer-col {
margin-bottom: 2rem;
}
.footer-li {
margin-bottom: .5rem;
}
.feed-list-link {
color: rgba(0, 0, 0, 1);
margin: 0 auto .15rem 0;
@ -1078,6 +1097,7 @@ span.mm-4 {
padding: 2px;
margin-left: -2px;
margin-right: -2px;
margin-top: -2px;
border-radius: 2px;
text-decoration-color: transparent;
box-shadow: 0 0 0 2px rgb(255, 255, 255, 0), 0 0 0 5px rgba(255, 255, 255, 0);
@ -1120,10 +1140,30 @@ span.mm-4 {
box-shadow: 0 0 0 1px rgb(32, 32, 32, .9), 0 0 0 5px rgba(32, 32, 32, .1);
}
.pseudos.nested-link {
padding-bottom: 4px;
}
footer {
background-color: var(--darkTextColor);
}
.footer-hl {
margin: 0 auto 1rem 0;
color: rgba(255, 255, 255, 1);
font-size: 1.5rem;
}
#Mozilla {
max-width: 10rem;
}
@media screen and (max-width: 1300px) {
.fixed-header-full-title {
margin-left: auto;
margin-right: auto;
display: block;
opacity: 1;
}
main::before {
@ -1145,14 +1185,13 @@ span.mm-4 {
display: flex;
}
.fixed-contact-menu {
margin-right: 3.5rem;
border-color: transparent;
}
.contact-link {
color: rgba(0, 0, 0, 0);
font-size: 1px;
width: 1.15rem;
height: 1rem;
margin: auto;
opacity: 1;
transition: opacity 0.3s ease;
margin-left: 1.5rem;
}
.mobile-menu-fixed {
@ -1163,8 +1202,7 @@ span.mm-4 {
@media screen and (max-width: 1100px) {
.fixed-header-full-title {
margin-left: var(--padding);
margin-right: auto;
display: none;
}
}
@ -1174,13 +1212,6 @@ span.mm-4 {
.hide-900 {
display: none !important;
}
.fixed-header-full-title {
margin-left: calc(var(--padding) / 2);
}
.fixed-contact-menu {
right: 2.25rem;
}
.desktop-nav {
display: none;
@ -1203,19 +1234,9 @@ span.mm-4 {
max-width: var(--maxBodyCopyWidth);
margin: var(--padding) auto;
}
/* .summit-image,
.bio-image {
margin-bottom: 0;
margin-top: 0;
} */
}
@media screen and (max-width: 860px) {
.fixed-header-icons {
width: 100%;
}
.fixed-header-full-title {
max-width: 400px;
display: none;

Просмотреть файл

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16"><path fill="#ffffff" d="M5 1H4a3 3 0 0 0-3 3v8a3 3 0 0 0 3 3h8a3 3 0 0 0 3-3v-1a1 1 0 0 0-2 0v1a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h1a1 1 0 1 0 0-2z"></path><path fill="#ffffff" d="M14.935 1.618A1 1 0 0 0 14.012 1h-5a1 1 0 1 0 0 2h2.586L8.305 6.293A1 1 0 1 0 9.72 7.707l3.293-3.293V7a1 1 0 1 0 2 0V2a1 1 0 0 0-.077-.382z"></path></svg>

После

Ширина:  |  Высота:  |  Размер: 429 B

Просмотреть файл

@ -2,6 +2,56 @@
const websiteCopy = require("./website-content");
function footerLinkGroup() {
return [
{
linkGroupTitle: "Mozilla",
links: [
{
linkHref: "https://www.mozilla.org/about/",
linkTitle: "About",
},
{
linkHref: "https://blog.mozilla.org/",
linkTitle: "Blog",
},
{
linkHref: "https://www.mozilla.org/contact/",
linkTitle: "Contact Us",
},
{
linkHref: "https://donate.mozilla.org/?presets=50,30,20,10&amount=30&utm_source=mozilla.org&utm_medium=referral&utm_content=footer&currency=usd",
linkTitle: "Donate",
},
{
linkHref: "https://www.mozilla.org/about/governance/policies/participation/",
linkTitle: "Code of Conduct",
},
],
},
{
linkGroupTitle: "Firefox",
links: [
{
linkHref: "https://www.mozilla.org/firefox/new/",
linkTitle: "Download Firefox",
},
{
linkHref: "https://www.mozilla.org/firefox/mobile/",
linkTitle: "Download Firefox Mobile",
},
{
linkHref: "https://www.mozilla.org/firefox/features/",
linkTitle: "Features",
},
{
linkHref: "https://www.mozilla.org/firefox/channel/desktop/",
linkTitle: "Beta, Nightly, Developer Edition",
},
],
},
];
}
function getString(args) {
return websiteCopy[args];
@ -249,6 +299,7 @@ function attackDefenseLinksAndFeed() {
}
module.exports = {
footerLinkGroup,
attackDefenseLinksAndFeed,
getString,
landingCopy,

Просмотреть файл

@ -1,10 +1,10 @@
"use strict";
module.exports = {
"site-title": "SURF // Mozilla Security Engineering University Relationship Framework",
"site-description": "The Mozilla Security Engineering University Relationship Framework (SURF)",
"site-title": "SURF // Mozilla Sec-Eng University Relationship Framework",
"site-description": "The Mozilla Sec-Eng University Relationship Framework (SURF)",
"title": "<span class='bold title-Mozilla'>Mozilla</span> Security Engineering University Relationship Framework",
"landing-1": "The Mozilla Security Engineering University Relationship Framework (SURF) initiative aims to increase collaboration between Mozilla and the academic community. We would like to leverage academic talent to help explore security and privacy research problems, and to strengthen Mozilla's ties to the academic community. Mozilla security engineers aim to actively participate in the research community through thesis supervision, collaborations, placements and Mozilla-hosted security summits",
"landing-2": "To date, the SURF team has planned two research summits, is actively participating in several research collaborations, and is serving on a number of conference program committees. We can offer real-world security and privacy research problems and we would love to collaborate with you! Please dont hesitate to <a href='mailto:surf@mozilla.com' class='nested-text-link'>get in touch.</a>",
"landing-3": "If you're involved in research that impacts the privacy and security of Firefox and would like to reach us, please send an email to: <a href='mailto:surf@mozilla.com' class='nested-text-link'>surf@mozilla.com.</a>",
"landing-1": "<span class='bold-intro'>The Mozilla Sec-Eng University Relationship Framework (SURF)</span> initiative aims to increase collaboration between Mozilla and the academic community. We would like to leverage academic talent to help explore security and privacy research problems, and to strengthen Mozilla's ties to the academic community. Mozilla security engineers aim to actively participate in the research community through thesis supervision, collaborations, placements and Mozilla-hosted security summits",
"landing-2": "To date, the SURF team has planned two research summits, is actively participating in several research collaborations, and is serving on a number of conference program committees. We can offer real-world security and privacy research problems and we would love to collaborate with you! Please dont hesitate to <a href='mailto:surf@mozilla.com' class='pseudos dark-link nested-text-link'>get in touch.</a>",
"landing-3": "If you're involved in research that impacts the privacy and security of Firefox and would like to reach us, please send an email to: <a href='mailto:surf@mozilla.com' class='nested-text-link pseudos white-link'>surf@mozilla.com.</a>",
};

Просмотреть файл

@ -82,7 +82,7 @@
{{#each (publication)}}
<li class="publication-list-item">
{{#if this.pubHref }}
<a href="{{ this.pubHref }}" target="_blank" rel="noopener noreferrer" class="pub-title pseudos dark-link">{{ this.title }}</a>
<a href="{{ this.pubHref }}" target="_blank" rel="noopener noreferrer" class="pub-title pseudos dark-link open-new-tab">{{ this.title }}</a>
{{else}}
<p class="pub-title">{{ this.title }}</p>
{{/if}}
@ -111,7 +111,7 @@
{{#each this.talks}}
<li class="talk-list-item">
{{#if this.talkHref}}
<a target="_blank" rel="noopener noreferrer" href="{{ this.talksHref }}" class="talk-title talk-title-link ff-Met pseudos white-link">{{ this.talkTitle }}</a>
<a target="_blank" rel="noopener noreferrer" href="{{ this.talksHref }}" class="talk-title talk-title-link ff-Met pseudos white-link open-new-tab">{{ this.talkTitle }}</a>
{{else}}
<p class="talk-title ff-Met">{{ this.talkTitle }}</p>
{{/if}}

Просмотреть файл

@ -0,0 +1,22 @@
<footer class="content-section flx-col">
<div class="max-content-width">
<div class="thirds flx-row">
<div class="flx-third footer-col">
<svg id="Mozilla" data-name="Mozilla" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2000 571.9"><title>Mozilla</title><rect width="2000" height="571.9" fill="#ffffff"/><path fill="#000000" d="M1910.2,410.5a38.17,38.17,0,0,1-10.5,1.7c-11.7,0-17.2-5-17.2-19.4V284.1c0-57.1-45.5-84.9-99.3-84.9-41.1,0-63.2,5-107.1,22.7l-9.8,57.6,57.1,6.1,8.1-28.2c11.7-6.1,23.3-7.2,38.3-7.2,40.5,0,41.1,30.5,41.1,56v8.3c-12.8-1.7-27.2-2.2-41.1-2.2-57.1,0-116.5,14.4-116.5,76,0,52.1,41,71.6,77.1,71.6,40.5,0,66-24.4,80.4-49.9,3.3,30.5,21.6,49.9,54.9,49.9a95.62,95.62,0,0,0,44.9-11.7Zm-153.6-1.6c-21.6,0-29.4-12.8-29.4-28.9,0-27.2,22.2-34.4,47.7-34.4,11.6,0,24.4,1.7,36.1,3.3C1809.3,390.6,1782.1,408.9,1756.6,408.9ZM1660.5,72.7,1552.3,454.4h-70.5L1590,72.7Zm-145.3,0L1407,454.4h-70.4L1444.8,72.7h70.4ZM1214.8,204.2h74.9V294h-74.9Zm0,160.3h74.9v89.9h-74.9Zm-109-3.3,56.6,5.5-15.5,87.7H928.3l-7.2-37.7,137.6-158.1H980.5l-11.1,38.8-51.6-5.6,8.9-87.7h219.7l5.6,37.7L1013.2,400h81Zm-358.5-162c-89.9,0-134.3,60.5-134.3,133.7,0,79.9,53.3,127,130.4,127,79.9,0,137.6-50.5,137.6-130.4C881,259.6,837.1,199.2,747.3,199.2ZM745.6,405c-38.8,0-58.8-33.3-58.8-76.6,0-47.2,22.7-74.3,59.4-74.3,33.8,0,61,22.7,61,73.2C807.2,375,782.8,405,745.6,405Zm-197-5h33.3v54.4H477V313.5c0-43.3-14.4-59.9-42.7-59.9C399.9,253.6,386,278,386,313v87h33.3v54.4H314.5V313.5c0-43.3-14.4-59.9-42.7-59.9-34.4,0-48.3,24.4-48.3,59.4v87h47.7v54.4H118.7V400H152V258.5H118.7V204.1H223.5v37.7c15-26.6,41.1-42.7,76-42.7,36.1,0,69.3,17.2,81.6,53.8,13.9-33.3,42.2-53.8,81.6-53.8,44.9,0,86,27.2,86,86.5V400Z"/></svg>
</div>
{{!-- </div> --}}
{{#each (footerLinkGroup)}}
<ul class="flx-third style-none footer-col">
<li class="link-list-title">
<h4 class="footer-hl ff-Met">{{ this.linkGroupTitle }}</h4>
</li>
{{#each this.links}}
<li class="footer-li">
<a href="{{this.linkHref}}" class="pseudos white-link" target="_blank" rel="noopener noreferrer">{{ this.linkTitle }}</a>
</li>
{{/each}}
</ul>
{{/each}}
</div>
</div>
</footer>

Просмотреть файл

@ -1,2 +1,2 @@
<a href="mailto:surf@mozilla.com" class="email-link contact-link bg-img">email<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1091.62 803.62"><path class="env-bottom env-path" d="M687.49,381.94,545.38,517.85,418.76,397.42l-10.15-9.63L392.43,405,22.88,780.74a77.61,77.61,0,0,0,55.06,22.88H1013a77.92,77.92,0,0,0,55-22.88L704.52,400.35Z" transform="translate(0)"/><path class="env-middle env-path" d="M408.61,388.48,22.37,23.23A82.19,82.19,0,0,0,0,77.59v649.3a77.6,77.6,0,0,0,22.88,55.05L392.43,406.2ZM1086,52.3a80.43,80.43,0,0,0-21.17-33.2L686.29,380.39l17.2,17.2,365.25,383.15a77.57,77.57,0,0,0,22.88-55.06V76.39A75.79,75.79,0,0,0,1086,52.3Z" transform="translate(0)" fill="#353535"/><path class="env-top env-path" d="M408.61,388.48l10.15,9.63L545.38,518.54,687.49,382.63,1066,21.33A75,75,0,0,0,1014.37,0H77.94A75.49,75.49,0,0,0,23.05,24.09Z" transform="translate(0)" fill="#9f9fa0"/></svg></a>
<a href="https://twitter.com/MozillaSurf" class="twitter contact-link bg-img">twitter<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 250 203.15"><path class="twitter-icon" d="M78.62,203.14C173,203.14,224.56,125,224.56,57.2c0-2.22,0-4.43-.15-6.63A104.27,104.27,0,0,0,250,24a102.24,102.24,0,0,1-29.46,8.07A51.46,51.46,0,0,0,243.09,3.72a103,103,0,0,1-32.57,12.45A51.34,51.34,0,0,0,123.11,63,145.63,145.63,0,0,1,17.4,9.36,51.33,51.33,0,0,0,33.28,77.83,51.08,51.08,0,0,1,10,71.41v.65a51.32,51.32,0,0,0,41.15,50.28,51.2,51.2,0,0,1-23.16.88,51.37,51.37,0,0,0,47.92,35.62,103,103,0,0,1-63.7,22A106,106,0,0,1,0,180.1a145.22,145.22,0,0,0,78.62,23" transform="translate(0 0.01)"/></svg></a>
<a href="https://twitter.com/MozillaSurf" target="_blank" class="twitter contact-link bg-img">twitter<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 250 203.15"><path class="twitter-icon" d="M78.62,203.14C173,203.14,224.56,125,224.56,57.2c0-2.22,0-4.43-.15-6.63A104.27,104.27,0,0,0,250,24a102.24,102.24,0,0,1-29.46,8.07A51.46,51.46,0,0,0,243.09,3.72a103,103,0,0,1-32.57,12.45A51.34,51.34,0,0,0,123.11,63,145.63,145.63,0,0,1,17.4,9.36,51.33,51.33,0,0,0,33.28,77.83,51.08,51.08,0,0,1,10,71.41v.65a51.32,51.32,0,0,0,41.15,50.28,51.2,51.2,0,0,1-23.16.88,51.37,51.37,0,0,0,47.92,35.62,103,103,0,0,1-63.7,22A106,106,0,0,1,0,180.1a145.22,145.22,0,0,0,78.62,23" transform="translate(0 0.01)"/></svg></a>