fix broken dns tree and port connector, full-bleed handshake and dns-lookup slides, siezen in all demos, first-letter sizing
This commit is contained in:
@@ -10,43 +10,48 @@
|
||||
font-family: ui-monospace, "SF Mono", monospace;
|
||||
font-size: 2.2rem;
|
||||
color: #1a1a2e;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.port-wrap {
|
||||
display: inline-flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin-left: 4px;
|
||||
}
|
||||
.port {
|
||||
background: #fde68a;
|
||||
color: #7c2d12;
|
||||
padding: 2px 8px;
|
||||
padding: 2px 10px;
|
||||
border-radius: 4px;
|
||||
font-weight: 700;
|
||||
}
|
||||
.caption {
|
||||
margin-top: 14px;
|
||||
font-size: 1rem;
|
||||
color: #4a4a6a;
|
||||
padding-left: 210px;
|
||||
position: relative;
|
||||
}
|
||||
.caption::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: -8px;
|
||||
left: 210px;
|
||||
.connector {
|
||||
width: 2px;
|
||||
height: 10px;
|
||||
height: 18px;
|
||||
background: #c2410c;
|
||||
margin-top: 4px;
|
||||
}
|
||||
.caption-text {
|
||||
background: #fed7aa;
|
||||
padding: 4px 10px;
|
||||
padding: 6px 12px;
|
||||
border-radius: 4px;
|
||||
border-left: 3px solid #c2410c;
|
||||
display: inline-block;
|
||||
border: 2px solid #c2410c;
|
||||
color: #7c2d12;
|
||||
font-weight: 600;
|
||||
font-size: 1rem;
|
||||
font-family: system-ui, sans-serif;
|
||||
margin-top: 2px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="line">212.132.79.37:<span class="port">443</span></div>
|
||||
<div class="caption"><span class="caption-text">Port 443 = HTTPS</span></div>
|
||||
<div class="line">
|
||||
212.132.79.37:<div class="port-wrap">
|
||||
<span class="port">443</span>
|
||||
<div class="connector"></div>
|
||||
<div class="caption-text">Port 443 = HTTPS</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user