Skip to content
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.

Sign up for GitHub

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

change px to em #631

Merged
merged 1 commit into from
Jun 30, 2022
Merged

change px to em #631

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
80 changes: 40 additions & 40 deletions assets/css/lesson.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,10 +32,10 @@ $color-testimonial: #fc8dc1 !default;

@mixin cdSetup($color) {
color: $color;
border: solid 1px $color;
border-left: solid 5px $color;
margin: 15px 5px 10px 0;
border-radius: 4px 0 0 4px;
border: solid 0.065em $color;
border-left: solid 0.325em $color;
margin: 0.975em 0.325em 0.65em 0;
border-radius: 0.26em 0 0 0.26em;
}

// Generic setup. Has to come before .error, .warning, and .output
Expand All @@ -54,7 +54,7 @@ div[class^='language-']::before {
background-color: #f2eff6;
display: block;
font-weight: bold;
padding: 5px 10px;
padding: 0.325em 0.65em;
}

div[class^='language-']::before,
Expand Down Expand Up @@ -93,20 +93,20 @@ div.language-vulkan::before { content: "Vulkan"; }

// Tab panels are used on Setup pages to show instructions for different Operating Systems
.tab-pane {
border: solid 1px #ddd; // #ddd == @nav-tabs-active-link-hover-border-color
border: solid 0.065em #ddd; // #ddd == @nav-tabs-active-link-hover-border-color
border-top: none;
padding: 20px 20px 10px 20px;
border-radius: 0 0 4px 4px; // 4px == @border-radius-base
padding: 1.3em 1.3em 0.65em 1.3em;
border-radius: 0 0 0.26em 0.26em; // 0.26em == @border-radius-base
}

// Stripe above tab panels where OS tabs are shown
ul.nav.nav-tabs {
background: #E1E1E1;
border-radius: 4px 4px 0 0; // 4px == @border-radius-base
border-radius: 0.26em 0.26em 0 0; // 0.26em == @border-radius-base
}

// adjust line height of links so that clickable area (of OS tabs) is 44px high
ul.nav.nav-tabs li a { line-height: 24px; } // or 1.714285716
// adjust line height of links so that clickable area (of OS tabs) is 2.86em high
ul.nav.nav-tabs li a { line-height: 1.56em; } // or 1.714285716

// This color provides better contrast ratio on most backgrounds used on Carpentries websites
// 9.24 on FFFFFF: https://webaim.org/resources/contrastchecker/?fcolor=204A6F&bcolor=FFFFFF&api (body)
Expand All @@ -118,11 +118,11 @@ a { color: #204A6F; }
.yt-wrapper2 { max-width: 100%; margin: 0 auto; }

// Use full width on small displays
@media only screen and (max-width: 600px) { .yt-wrapper2 { max-width: 100%; } }
@media only screen and (max-width: 39em) { .yt-wrapper2 { max-width: 100%; } }

.yt-wrapper {
height: 0;
margin-top: 10px;
margin-top: 0.65em;
padding-bottom: 56.25%;
position: relative;
width: 100%;
Expand All @@ -140,27 +140,27 @@ a { color: #204A6F; }
// Specialized blockquote environments for learning objectives, callouts, etc.
//----------------------------------------

$codeblock-padding: 5px !default;
$codeblock-padding: 0.325em !default;

@mixin bkSetup($color, $glyph) {

$gradientcolor1: $color;
$gradientcolor2: scale-color($color, $lightness: 10%);

padding: 0 0 $codeblock-padding $codeblock-padding;
border: 1px solid;
border: 0.065em solid;
border-color: $color;
border-radius: 4px;
border-radius: 0.26em;

margin: 15px 5px 10px 0;
margin: 0.975em 0.325em 0.65em 0;

h2 {
padding-top: $codeblock-padding;
padding-bottom: $codeblock-padding;
font-size: 20px;
font-size: 1.3em;
background: linear-gradient(to bottom, $gradientcolor1, $gradientcolor2);
border-color: $color;
margin-top: 0px;
margin-top: 0em;
margin-left: -$codeblock-padding; // to move back to the left margin of the enclosing blockquote
}
h2:before {
Expand Down Expand Up @@ -195,7 +195,7 @@ $codeblock-padding: 5px !default;
.prereq h3,
.solution h3,
.testimonial h3 {
font-size: 18px;
font-size: 1.17em;
}

.challenge { background-color: #eec27520; }
Expand All @@ -210,7 +210,7 @@ font-size: 18px;
.testimonial { background-color: #fc8dc120; }

blockquote p {
margin: 5px;
margin: 0.325em;
}
blockquote :not(h2) + p {
padding-top: 1em;
Expand Down Expand Up @@ -242,19 +242,19 @@ a:visited {

code {
white-space: nowrap;
padding: 2px 5px;
padding: 0.13em 0.325em;
color: #24292e;
background-color: #e7e7e7;
}

samp { hyphens: none; }

dt { margin-top: 20px; }
dt { margin-top: 1.3em; }
dd { margin-left: 2em; }

article img {
display: block;
margin: 20px auto;
margin: 1.3em auto;
max-width: 100%;
}

Expand All @@ -264,13 +264,13 @@ article img.inline {
}

article h2 {
margin: 48px 0 16px;
border-bottom: solid 1px #eaecef;
margin: 3.12em 0 1.04em;
border-bottom: solid 0.065em #eaecef;
padding-bottom: 0.3em;
line-height: 1.25;
}

article h3 { margin: 40px 0 16px; }
article h3 { margin: 2.6em 0 1.04em; }

article pre {
margin: 0;
Expand All @@ -281,7 +281,7 @@ article pre {
// Miscellaneous.
//----------------------------------------

.figures h2 { margin-top: 100px; }
.figures h2 { margin-top: 6.5em; }

.maintitle {
text-align: center;
Expand All @@ -295,16 +295,16 @@ footer .license,
footer .help-links
{
font-size: inherit;
margin-top: 10px;
margin-bottom: 10px;
margin-top: 0.65em;
margin-bottom: 0.65em;
font-weight: 500;
line-height: 1.1;
}

img.navbar-logo {
height: 40px; // synchronize with height of navbar
padding-top: 5px;
padding-right: 10px;
height: 2.6em; // synchronize with height of navbar
padding-top: 0.325em;
padding-right: 0.65em;
}

div.branding {
Expand All @@ -324,7 +324,7 @@ span.fold-unfold {

p.image-with-shadow img,
img.image-with-shadow {
box-shadow: 0 6px 24px 0 #888;
box-shadow: 0 0.39em 1.56em 0 #888;
}

//----------------------------------------
Expand All @@ -338,7 +338,7 @@ div.life-cycle {
z-index: 100;
font-size: 1.2em;
text-align: center;
margin-bottom: -1px;
margin-bottom: -0.065em;
border-radius: 0;
}

Expand Down Expand Up @@ -378,14 +378,14 @@ kbd {
margin: 0 .1em;
padding: .1em .6em;
font-family: Arial,"Helvetica Neue",Helvetica,sans-serif;
font-size: 11px;
font-size: 0.715em;
line-height: 1.4;
color: #242729;
text-shadow: 0 1px 0 #FFF;
text-shadow: 0 0.065em 0 #FFF;
background-color: #e1e3e5;
border: 1px solid #adb3b9;
border-radius: 3px;
box-shadow: 0 1px 0 rgba(12,13,14,0.2), 0 0 0 2px #FFF inset;
border: 0.065em solid #adb3b9;
border-radius: 0.195em;
box-shadow: 0 0.065em 0 rgba(12,13,14,0.2), 0 0 0 0.13em #FFF inset;
white-space: nowrap;
font-style: normal;
}
Expand Down