Add Fishbowl archive #41
|
|
@ -2,9 +2,8 @@
|
|||
background-color: #36393e;
|
||||
color: #dcddde;
|
||||
font-family: Whitney, "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
font-size: 17px;
|
||||
font-size: 1rem;
|
||||
font-weight: 400;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.fishbowl a {
|
||||
|
|
@ -115,7 +114,8 @@
|
|||
.fishbowl .chatlog__short-timestamp {
|
||||
display: none;
|
||||
color: #a3a6aa;
|
||||
font-size: 0.75rem;
|
||||
font-size: 0.7em;
|
||||
line-height: 1.4em;
|
||||
font-weight: 500;
|
||||
direction: ltr;
|
||||
unicode-bidi: bidi-override;
|
||||
|
|
@ -0,0 +1,625 @@
|
|||
.fishbowl {
|
||||
background-color: #ffffff;
|
||||
color: #23262a;
|
||||
font-family: Whitney, "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
font-size: 1rem;
|
||||
font-weight: 500;
|
||||
border: 1px solid #ddd;
|
||||
}
|
||||
|
||||
.fishbowl a {
|
||||
color: #0068e0;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.fishbowl a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.fishbowl img {
|
||||
object-fit: contain;
|
||||
image-rendering: high-quality;
|
||||
image-rendering: -webkit-optimize-contrast;
|
||||
}
|
||||
|
||||
.fishbowl .preamble {
|
||||
display: grid;
|
||||
grid-template-columns: auto 1fr;
|
||||
max-width: 100%;
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.fishbowl .preamble__guild-icon-container {
|
||||
grid-column: 1;
|
||||
}
|
||||
|
||||
.fishbowl .preamble__guild-icon {
|
||||
max-width: 88px;
|
||||
max-height: 88px;
|
||||
}
|
||||
|
||||
.fishbowl .preamble__entries-container {
|
||||
grid-column: 2;
|
||||
margin-left: 1rem;
|
||||
}
|
||||
|
||||
.fishbowl .preamble__entry {
|
||||
margin-bottom: 0.15rem;
|
||||
color: #2f3136;
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
|
||||
.fishbowl .preamble__entry--small {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog {
|
||||
padding: 1rem 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__message-group {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__message-container {
|
||||
background-color: transparent;
|
||||
transition: background-color 1s ease;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__message-container--highlighted {
|
||||
background-color: rgba(114, 137, 218, 0.2);
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__message-container--pinned {
|
||||
background-color: rgba(249, 168, 37, 0.05);
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__message {
|
||||
display: grid;
|
||||
grid-template-columns: auto 1fr;
|
||||
padding: 0.15rem 0;
|
||||
direction: ltr;
|
||||
unicode-bidi: bidi-override;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__message:hover {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__message:hover .chatlog__short-timestamp {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__message-aside {
|
||||
grid-column: 1;
|
||||
width: 72px;
|
||||
padding: 0.15rem 0.15rem 0 0.15rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__reference-symbol {
|
||||
height: 10px;
|
||||
margin: 6px 4px 4px 36px;
|
||||
border-left: 2px solid #c7ccd1;
|
||||
border-top: 2px solid #c7ccd1;
|
||||
border-radius: 8px 0 0 0;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__avatar {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__short-timestamp {
|
||||
display: none;
|
||||
color: #5e6772;
|
||||
font-size: 0.7em;
|
||||
line-height: 1.4em;
|
||||
font-weight: 500;
|
||||
direction: ltr;
|
||||
unicode-bidi: bidi-override;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__message-primary {
|
||||
grid-column: 2;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__reference {
|
||||
display: flex;
|
||||
margin-bottom: 0.15rem;
|
||||
align-items: center;
|
||||
color: #5f5f60;
|
||||
font-size: 0.875rem;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__reference-avatar {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
margin-right: 0.25rem;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__reference-author {
|
||||
margin-right: 0.3rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__reference-content {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__reference-link {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__reference-link * {
|
||||
display: inline;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__reference-link .hljs {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__reference-link:hover {
|
||||
color: #2f3136;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__reference-link:hover *:not(.chatlog__markdown-spoiler) {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__reference-edited-timestamp {
|
||||
margin-left: 0.25rem;
|
||||
color: #5e6772;
|
||||
font-size: 0.75rem;
|
||||
font-weight: 500;
|
||||
direction: ltr;
|
||||
unicode-bidi: bidi-override;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__header {
|
||||
margin-bottom: 0.1rem;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__author {
|
||||
font-weight: 600;
|
||||
color: #2f3136;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__bot-label {
|
||||
position: relative;
|
||||
top: -0.1rem;
|
||||
margin-left: 0.3rem;
|
||||
padding: 0.05rem 0.3rem;
|
||||
border-radius: 3px;
|
||||
background-color: #5865F2;
|
||||
color: #ffffff;
|
||||
font-size: 0.625rem;
|
||||
font-weight: 500;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__timestamp {
|
||||
margin-left: 0.3rem;
|
||||
color: #5e6772;
|
||||
font-size: 0.75rem;
|
||||
font-weight: 500;
|
||||
direction: ltr;
|
||||
unicode-bidi: bidi-override;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__content {
|
||||
padding-right: 1rem;
|
||||
font-size: 0.95rem;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__edited-timestamp {
|
||||
margin-left: 0.15rem;
|
||||
color: #5e6772;
|
||||
font-size: 0.75rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__attachment {
|
||||
position: relative;
|
||||
width: fit-content;
|
||||
margin-top: 0.3rem;
|
||||
border-radius: 3px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__attachment--hidden {
|
||||
cursor: pointer;
|
||||
box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__attachment--hidden * {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__attachment-spoiler-caption {
|
||||
display: none;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
z-index: 999;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 20px;
|
||||
transform: translate(-50%, -50%);
|
||||
background-color: rgba(0, 0, 0, 0.9);
|
||||
color: #dcddde;
|
||||
font-size: 0.9rem;
|
||||
font-weight: 600;
|
||||
letter-spacing: 0.05rem;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__attachment--hidden .chatlog__attachment-spoiler-caption {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__attachment--hidden:hover .chatlog__attachment-spoiler-caption {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__attachment-media {
|
||||
max-width: 45vw;
|
||||
max-height: 500px;
|
||||
vertical-align: top;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__attachment--hidden .chatlog__attachment-media {
|
||||
filter: blur(44px);
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__attachment-generic {
|
||||
max-width: 520px;
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
padding: 10px;
|
||||
border: 1px solid #ebedef;
|
||||
border-radius: 3px;
|
||||
background-color: #f2f3f5;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__attachment--hidden .chatlog__attachment-generic {
|
||||
filter: blur(44px);
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__attachment-generic-icon {
|
||||
float: left;
|
||||
width: 30px;
|
||||
height: 100%;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__attachment-generic-size {
|
||||
color: #72767d;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__attachment-generic-name {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__embed {
|
||||
display: flex;
|
||||
margin-top: 0.3rem;
|
||||
max-width: 520px;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__embed-color-pill {
|
||||
flex-shrink: 0;
|
||||
width: 0.25rem;
|
||||
border-top-left-radius: 3px;
|
||||
border-bottom-left-radius: 3px;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__embed-color-pill--default {
|
||||
background-color: rgba(227, 229, 232, 1);
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__embed-content-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 0.5rem 0.6rem;
|
||||
border: 1px solid rgba(204, 204, 204, 0.3);
|
||||
border-top-right-radius: 3px;
|
||||
border-bottom-right-radius: 3px;
|
||||
background-color: rgba(249, 249, 249, 0.3);
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__embed-content {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__embed-text {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__embed-author-container {
|
||||
display: flex;
|
||||
margin-bottom: 0.5rem;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__embed-author-icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 0.5rem;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__embed-author {
|
||||
color: #4f545c;
|
||||
font-size: 0.875rem;
|
||||
font-weight: 600;
|
||||
direction: ltr;
|
||||
unicode-bidi: bidi-override;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__embed-author-link {
|
||||
color: #4f545c;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__embed-title {
|
||||
margin-bottom: 0.5rem;
|
||||
color: #4f545c;
|
||||
font-size: 0.875rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__embed-description {
|
||||
color: #2e3338;
|
||||
font-weight: 500;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__embed-fields {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 0 0.5rem;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__embed-field {
|
||||
flex: 0;
|
||||
min-width: 100%;
|
||||
max-width: 506px;
|
||||
padding-top: 0.6rem;
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__embed-field--inline {
|
||||
flex: 1;
|
||||
flex-basis: auto;
|
||||
min-width: 50px;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__embed-field-name {
|
||||
margin-bottom: 0.2rem;
|
||||
color: #36393e;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__embed-field-value {
|
||||
color: #2e3338;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__embed-thumbnail {
|
||||
flex: 0;
|
||||
max-width: 80px;
|
||||
max-height: 80px;
|
||||
margin-left: 1.2rem;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__embed-image-container {
|
||||
margin-top: 0.6rem;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__embed-image {
|
||||
max-width: 500px;
|
||||
max-height: 400px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__embed-footer {
|
||||
margin-top: 0.6rem;
|
||||
color: #2e3338;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__embed-footer-icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 0.2rem;
|
||||
border-radius: 50%;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__embed-footer-text {
|
||||
vertical-align: middle;
|
||||
font-size: 0.75rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__embed-plainimage {
|
||||
max-width: 45vw;
|
||||
max-height: 500px;
|
||||
vertical-align: top;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__embed-spotify {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__embed-youtube-container {
|
||||
margin-top: 0.6rem;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__embed-youtube {
|
||||
border: 0;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__sticker {
|
||||
width: 180px;
|
||||
height: 180px;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__sticker--media {
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__reactions {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__reaction {
|
||||
display: flex;
|
||||
margin: 0.35rem 0.1rem 0.1rem 0;
|
||||
padding: 0.125rem 0.375rem;
|
||||
border: 1px solid transparent;
|
||||
border-radius: 8px;
|
||||
background-color: #f2f3f5;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__reaction:hover {
|
||||
border: 1px solid rgba(0, 0, 0, 0.2);
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__reaction-count {
|
||||
min-width: 9px;
|
||||
margin-left: 0.35rem;
|
||||
color: #4f5660;
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__reaction:hover .chatlog__reaction-count {
|
||||
color: #2e3338;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__markdown {
|
||||
max-width: 100%;
|
||||
line-height: 1.3;
|
||||
overflow-wrap: break-word;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__markdown-preserve {
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__markdown-spoiler {
|
||||
background-color: rgba(0, 0, 0, 0.1);
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__markdown-spoiler--hidden {
|
||||
cursor: pointer;
|
||||
background-color: #b9bbbe;
|
||||
color: rgba(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__markdown-spoiler--hidden:hover {
|
||||
background-color: rgba(185, 187, 190, 0.8);
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__markdown-spoiler--hidden::selection {
|
||||
color: rgba(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__markdown-quote {
|
||||
display: flex;
|
||||
margin: 0.05rem 0;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__markdown-quote-border {
|
||||
margin-right: 0.5rem;
|
||||
border: 2px solid #c7ccd1;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__markdown-pre {
|
||||
background-color: #f9f9f9;
|
||||
font-family: "Consolas", "Courier New", Courier, monospace;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__markdown-pre--multiline {
|
||||
margin-top: 0.25rem;
|
||||
padding: 0.5rem;
|
||||
border: 2px solid #f3f3f3;
|
||||
border-radius: 5px;
|
||||
color: #657b83;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__markdown-pre--multiline.hljs {
|
||||
background-color: inherit;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__markdown-pre--inline {
|
||||
padding: 2px;
|
||||
border-radius: 3px;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__markdown-mention {
|
||||
border-radius: 3px;
|
||||
padding: 0 2px;
|
||||
background-color: rgba(88, 101, 242, .15);
|
||||
color: #505cdc;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__markdown-mention:hover {
|
||||
background-color: #5865f2;
|
||||
color: #ffffff
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__markdown-timestamp {
|
||||
border-radius: 3px;
|
||||
padding: 0 2px;
|
||||
color: #5e6772;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__emoji {
|
||||
width: 1.325rem;
|
||||
height: 1.325rem;
|
||||
margin: 0 0.06rem;
|
||||
vertical-align: -0.4rem;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__emoji--small {
|
||||
width: 1rem;
|
||||
height: 1rem;
|
||||
}
|
||||
|
||||
.fishbowl .chatlog__emoji--large {
|
||||
width: 2.8rem;
|
||||
height: 2.8rem;
|
||||
}
|
||||
|
||||
.fishbowl .postamble {
|
||||
padding: 1.25rem;
|
||||
}
|
||||
|
||||
.fishbowl .postamble__entry {
|
||||
color: #2f3136;
|
||||
}
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||
<svg width="100%" height="100%" viewBox="0 0 734 30" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
|
||||
<g transform="matrix(0.412851,0,0,0.412851,-164.727,-144.911)">
|
||||
<path d="M399,404C477.667,404 563.667,422.167 640,421C712.766,419.888 784.237,398.26 857,397C934,395.667 1021,413.167 1102,413C1182.53,412.834 1262.47,395.225 1343,396C1482.5,397.343 1719.83,418.976 1861,421.056C1915.68,421.862 2097.72,404.026 2176.88,404.026L2176.88,351.026L399,351L399,404Z" style="fill:rgb(255,0,0);"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 859 B |
|
|
@ -376,14 +376,14 @@ func BuildFishbowlIndex() string {
|
|||
return Url("/fishbowl", nil)
|
||||
}
|
||||
|
||||
var RegexFishbowl = regexp.MustCompile(`^/fishbowl/(?P<name>[^/]+)$`)
|
||||
var RegexFishbowl = regexp.MustCompile(`^/fishbowl/(?P<slug>[^/]+)/?$`)
|
||||
|
||||
func BuildFishbowl(name string) string {
|
||||
func BuildFishbowl(slug string) string {
|
||||
defer CatchPanic()
|
||||
return Url(fmt.Sprintf("/fishbowl/%s", name), nil)
|
||||
return Url(fmt.Sprintf("/fishbowl/%s/", slug), nil)
|
||||
}
|
||||
|
||||
var RegexFishbowlFiles = regexp.MustCompile(`^/fishbowl/(?P<name>[^/]+)(?P<path>/.+)$`)
|
||||
var RegexFishbowlFiles = regexp.MustCompile(`^/fishbowl/(?P<slug>[^/]+)(?P<path>/.+)$`)
|
||||
|
||||
/*
|
||||
* Forums
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
|
||||
{{ define "extrahead" }}
|
||||
<link rel="stylesheet" href="{{ static "fonts/whitney/whitney.css" }}">
|
||||
<link rel="stylesheet" href="{{ static "fishbowl.css" }}">
|
||||
<link rel="stylesheet" href="{{ static (eq .Theme "dark" | ternary "fishbowl-dark.css" "fishbowl-light.css") }}">
|
||||
|
||||
<script>
|
||||
function scrollToMessage(event, id) {
|
||||
|
|
@ -38,10 +38,48 @@
|
|||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.fishbowl-banner {
|
||||
background-color: {{ eq .Theme "dark" | ternary "#254464" "#a0c8f2" }};
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
padding-top: 30px;
|
||||
}
|
||||
|
||||
.fishbowl-banner::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0; left: 0; right: 0; bottom: 0;
|
||||
pointer-events: none;
|
||||
background-image: url({{ static "waterline.svg" }});
|
||||
background-size: 734px 30px;
|
||||
background-repeat: repeat-x;
|
||||
{{ if eq .Theme "dark" }}
|
||||
filter: hue-rotate(210deg) saturate(0.3) brightness(1.1);
|
||||
{{ else }}
|
||||
filter: hue-rotate(210deg) saturate(0.15) brightness(2.9);
|
||||
{{ end }}
|
||||
}
|
||||
|
||||
.fishbowl-banner a {
|
||||
color: {{ eq .Theme "dark" | ternary "#9ad0ff" "#1f4f99" }};
|
||||
}
|
||||
</style>
|
||||
{{ end }}
|
||||
|
||||
{{ define "content" }}
|
||||
<div class="fishbowl">
|
||||
{{- .Contents -}}
|
||||
<div class="ph3 ph0-ns">
|
||||
<h2 class="mt3">{{ .Info.Title }}</h2>
|
||||
|
||||
<div class="fishbowl-banner br3 mb3">
|
||||
<div class="pa3">
|
||||
This is a <b>fishbowl</b>: a panel conversation held on the Handmade Network Discord where a select few participants discuss a topic with depth and nuance. We host them every two months, so if you want to catch the next one, <a href="https://discord.gg/hmn" target="_blank">join the Discord!</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="fishbowl br3">
|
||||
|
bvisness marked this conversation as resolved
|
||||
{{- .Contents -}}
|
||||
</div>
|
||||
</div>
|
||||
{{ end }}
|
||||
|
|
|
|||
|
|
@ -1,5 +1 @@
|
|||
# Folder structure
|
||||
|
||||
One folder per fishbowl. It will look for an index.html file to be dumped directly into the page. All other files / directories are to be served as static files.
|
||||
|
||||
The fishbowl folder name will be used as the URL slug. This is important because the folder name is used for routing to static files.
|
||||
Make sure to name these folders according to the URL slugs of the fishbowls. Otherwise, static files for fishbowls will not work.
|
||||
|
|
|
|||
|
|
@ -1,756 +1,3 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en"><head>
|
||||
<title>Handmade Network - What, if anything, is OOP?</title>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width">
|
||||
|
||||
<style>
|
||||
@font-face {
|
||||
src: url(OOP_down.html_Files/whitney-300-1FE35.woff);
|
||||
font-family: Whitney;
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
src: url(OOP_down.html_Files/whitney-400-83E7B.woff);
|
||||
font-family: Whitney;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
src: url(OOP_down.html_Files/whitney-500-47E37.woff);
|
||||
font-family: Whitney;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
src: url(OOP_down.html_Files/whitney-600-9EC09.woff);
|
||||
font-family: Whitney;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
src: url(OOP_down.html_Files/whitney-700-A7A71.woff);
|
||||
font-family: Whitney;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
html, body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background-color: #36393e;
|
||||
color: #dcddde;
|
||||
font-family: Whitney, "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
font-size: 17px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #00aff4;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
img {
|
||||
object-fit: contain;
|
||||
image-rendering: high-quality;
|
||||
image-rendering: -webkit-optimize-contrast;
|
||||
}
|
||||
|
||||
.preamble {
|
||||
display: grid;
|
||||
grid-template-columns: auto 1fr;
|
||||
max-width: 100%;
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.preamble__guild-icon-container {
|
||||
grid-column: 1;
|
||||
}
|
||||
|
||||
.preamble__guild-icon {
|
||||
max-width: 88px;
|
||||
max-height: 88px;
|
||||
}
|
||||
|
||||
.preamble__entries-container {
|
||||
grid-column: 2;
|
||||
margin-left: 1rem;
|
||||
}
|
||||
|
||||
.preamble__entry {
|
||||
margin-bottom: 0.15rem;
|
||||
color: #ffffff;
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
|
||||
.preamble__entry--small {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.chatlog {
|
||||
padding: 1rem 0;
|
||||
width: 100%;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.1);
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.chatlog__message-group {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.chatlog__message-container {
|
||||
background-color: transparent;
|
||||
transition: background-color 1s ease;
|
||||
}
|
||||
|
||||
.chatlog__message-container--highlighted {
|
||||
background-color: rgba(114, 137, 218, 0.2);
|
||||
}
|
||||
|
||||
.chatlog__message-container--pinned {
|
||||
background-color: rgba(249, 168, 37, 0.05);
|
||||
}
|
||||
|
||||
.chatlog__message {
|
||||
display: grid;
|
||||
grid-template-columns: auto 1fr;
|
||||
padding: 0.15rem 0;
|
||||
direction: ltr;
|
||||
unicode-bidi: bidi-override;
|
||||
}
|
||||
|
||||
.chatlog__message:hover {
|
||||
background-color: #32353b;
|
||||
}
|
||||
|
||||
.chatlog__message:hover .chatlog__short-timestamp {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.chatlog__message-aside {
|
||||
grid-column: 1;
|
||||
width: 72px;
|
||||
padding: 0.15rem 0.15rem 0 0.15rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.chatlog__reference-symbol {
|
||||
height: 10px;
|
||||
margin: 6px 4px 4px 36px;
|
||||
border-left: 2px solid #4f545c;
|
||||
border-top: 2px solid #4f545c;
|
||||
border-radius: 8px 0 0 0;
|
||||
}
|
||||
|
||||
.chatlog__avatar {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.chatlog__short-timestamp {
|
||||
display: none;
|
||||
color: #a3a6aa;
|
||||
font-size: 0.75rem;
|
||||
font-weight: 500;
|
||||
direction: ltr;
|
||||
unicode-bidi: bidi-override;
|
||||
}
|
||||
|
||||
.chatlog__message-primary {
|
||||
grid-column: 2;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.chatlog__reference {
|
||||
display: flex;
|
||||
margin-bottom: 0.15rem;
|
||||
align-items: center;
|
||||
color: #b5b6b8;
|
||||
font-size: 0.875rem;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.chatlog__reference-avatar {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
margin-right: 0.25rem;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.chatlog__reference-author {
|
||||
margin-right: 0.3rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.chatlog__reference-content {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.chatlog__reference-link {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.chatlog__reference-link * {
|
||||
display: inline;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.chatlog__reference-link .hljs {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.chatlog__reference-link:hover {
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.chatlog__reference-link:hover *:not(.chatlog__markdown-spoiler) {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.chatlog__reference-edited-timestamp {
|
||||
margin-left: 0.25rem;
|
||||
color: #a3a6aa;
|
||||
font-size: 0.75rem;
|
||||
font-weight: 500;
|
||||
direction: ltr;
|
||||
unicode-bidi: bidi-override;
|
||||
}
|
||||
|
||||
.chatlog__header {
|
||||
margin-bottom: 0.1rem;
|
||||
}
|
||||
|
||||
.chatlog__author {
|
||||
font-weight: 500;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.chatlog__bot-label {
|
||||
position: relative;
|
||||
top: -0.1rem;
|
||||
margin-left: 0.3rem;
|
||||
padding: 0.05rem 0.3rem;
|
||||
border-radius: 3px;
|
||||
background-color: #5865F2;
|
||||
color: #ffffff;
|
||||
font-size: 0.625rem;
|
||||
font-weight: 500;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
.chatlog__timestamp {
|
||||
margin-left: 0.3rem;
|
||||
color: #a3a6aa;
|
||||
font-size: 0.75rem;
|
||||
font-weight: 500;
|
||||
direction: ltr;
|
||||
unicode-bidi: bidi-override;
|
||||
}
|
||||
|
||||
.chatlog__content {
|
||||
padding-right: 1rem;
|
||||
font-size: 0.95rem;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
.chatlog__edited-timestamp {
|
||||
margin-left: 0.15rem;
|
||||
color: #a3a6aa;
|
||||
font-size: 0.75rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.chatlog__attachment {
|
||||
position: relative;
|
||||
width: fit-content;
|
||||
margin-top: 0.3rem;
|
||||
border-radius: 3px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.chatlog__attachment--hidden {
|
||||
cursor: pointer;
|
||||
box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.chatlog__attachment--hidden * {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.chatlog__attachment-spoiler-caption {
|
||||
display: none;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
z-index: 999;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 20px;
|
||||
transform: translate(-50%, -50%);
|
||||
background-color: rgba(0, 0, 0, 0.9);
|
||||
color: #dcddde;
|
||||
font-size: 0.9rem;
|
||||
font-weight: 600;
|
||||
letter-spacing: 0.05rem;
|
||||
}
|
||||
|
||||
.chatlog__attachment--hidden .chatlog__attachment-spoiler-caption {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.chatlog__attachment--hidden:hover .chatlog__attachment-spoiler-caption {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.chatlog__attachment-media {
|
||||
max-width: 45vw;
|
||||
max-height: 500px;
|
||||
vertical-align: top;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.chatlog__attachment--hidden .chatlog__attachment-media {
|
||||
filter: blur(44px);
|
||||
}
|
||||
|
||||
.chatlog__attachment-generic {
|
||||
max-width: 520px;
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
padding: 10px;
|
||||
border: 1px solid #292b2f;
|
||||
border-radius: 3px;
|
||||
background-color: #2f3136;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.chatlog__attachment--hidden .chatlog__attachment-generic {
|
||||
filter: blur(44px);
|
||||
}
|
||||
|
||||
.chatlog__attachment-generic-icon {
|
||||
float: left;
|
||||
width: 30px;
|
||||
height: 100%;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.chatlog__attachment-generic-size {
|
||||
color: #72767d;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.chatlog__attachment-generic-name {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.chatlog__embed {
|
||||
display: flex;
|
||||
margin-top: 0.3rem;
|
||||
max-width: 520px;
|
||||
}
|
||||
|
||||
.chatlog__embed-color-pill {
|
||||
flex-shrink: 0;
|
||||
width: 0.25rem;
|
||||
border-top-left-radius: 3px;
|
||||
border-bottom-left-radius: 3px;
|
||||
}
|
||||
|
||||
.chatlog__embed-color-pill--default {
|
||||
background-color: #202225;
|
||||
}
|
||||
|
||||
.chatlog__embed-content-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 0.5rem 0.6rem;
|
||||
border: 1px solid rgba(46, 48, 54, 0.6);
|
||||
border-top-right-radius: 3px;
|
||||
border-bottom-right-radius: 3px;
|
||||
background-color: rgba(46, 48, 54, 0.3);
|
||||
}
|
||||
|
||||
.chatlog__embed-content {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.chatlog__embed-text {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.chatlog__embed-author-container {
|
||||
display: flex;
|
||||
margin-bottom: 0.5rem;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.chatlog__embed-author-icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 0.5rem;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.chatlog__embed-author {
|
||||
color: #ffffff;
|
||||
font-size: 0.875rem;
|
||||
font-weight: 600;
|
||||
direction: ltr;
|
||||
unicode-bidi: bidi-override;
|
||||
}
|
||||
|
||||
.chatlog__embed-author-link {
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.chatlog__embed-title {
|
||||
margin-bottom: 0.5rem;
|
||||
color: #ffffff;
|
||||
font-size: 0.875rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.chatlog__embed-description {
|
||||
color: #dcddde;
|
||||
font-weight: 500;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
|
||||
.chatlog__embed-fields {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 0 0.5rem;
|
||||
}
|
||||
|
||||
.chatlog__embed-field {
|
||||
flex: 0;
|
||||
min-width: 100%;
|
||||
max-width: 506px;
|
||||
padding-top: 0.6rem;
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
|
||||
.chatlog__embed-field--inline {
|
||||
flex: 1;
|
||||
flex-basis: auto;
|
||||
min-width: 50px;
|
||||
}
|
||||
|
||||
.chatlog__embed-field-name {
|
||||
margin-bottom: 0.2rem;
|
||||
color: #ffffff;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.chatlog__embed-field-value {
|
||||
color: #dcddde;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.chatlog__embed-thumbnail {
|
||||
flex: 0;
|
||||
max-width: 80px;
|
||||
max-height: 80px;
|
||||
margin-left: 1.2rem;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.chatlog__embed-image-container {
|
||||
margin-top: 0.6rem;
|
||||
}
|
||||
|
||||
.chatlog__embed-image {
|
||||
max-width: 500px;
|
||||
max-height: 400px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.chatlog__embed-footer {
|
||||
margin-top: 0.6rem;
|
||||
color: #dcddde;
|
||||
}
|
||||
|
||||
.chatlog__embed-footer-icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 0.2rem;
|
||||
border-radius: 50%;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.chatlog__embed-footer-text {
|
||||
vertical-align: middle;
|
||||
font-size: 0.75rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.chatlog__embed-plainimage {
|
||||
max-width: 45vw;
|
||||
max-height: 500px;
|
||||
vertical-align: top;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.chatlog__embed-spotify {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.chatlog__embed-youtube-container {
|
||||
margin-top: 0.6rem;
|
||||
}
|
||||
|
||||
.chatlog__embed-youtube {
|
||||
border: 0;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.chatlog__sticker {
|
||||
width: 180px;
|
||||
height: 180px;
|
||||
}
|
||||
|
||||
.chatlog__sticker--media {
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
}
|
||||
|
||||
.chatlog__reactions {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.chatlog__reaction {
|
||||
display: flex;
|
||||
margin: 0.35rem 0.1rem 0.1rem 0;
|
||||
padding: 0.125rem 0.375rem;
|
||||
border: 1px solid transparent;
|
||||
border-radius: 8px;
|
||||
background-color: #2f3136;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.chatlog__reaction:hover {
|
||||
border: 1px solid hsla(0,0%,100%,.2);
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.chatlog__reaction-count {
|
||||
min-width: 9px;
|
||||
margin-left: 0.35rem;
|
||||
color: #b9bbbe;
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
|
||||
.chatlog__reaction:hover .chatlog__reaction-count {
|
||||
color: #dcddde;
|
||||
}
|
||||
|
||||
.chatlog__markdown {
|
||||
max-width: 100%;
|
||||
line-height: 1.3;
|
||||
overflow-wrap: break-word;
|
||||
}
|
||||
|
||||
.chatlog__markdown-preserve {
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
.chatlog__markdown-spoiler {
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.chatlog__markdown-spoiler--hidden {
|
||||
cursor: pointer;
|
||||
background-color: #202225;
|
||||
color: rgba(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
.chatlog__markdown-spoiler--hidden:hover {
|
||||
background-color: rgba(32, 34, 37, 0.8);
|
||||
}
|
||||
|
||||
.chatlog__markdown-spoiler--hidden::selection {
|
||||
color: rgba(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
.chatlog__markdown-quote {
|
||||
display: flex;
|
||||
margin: 0.05rem 0;
|
||||
}
|
||||
|
||||
.chatlog__markdown-quote-border {
|
||||
margin-right: 0.5rem;
|
||||
border: 2px solid #4f545c;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.chatlog__markdown-pre {
|
||||
background-color: #2f3136;
|
||||
font-family: "Consolas", "Courier New", Courier, monospace;
|
||||
}
|
||||
|
||||
.chatlog__markdown-pre--multiline {
|
||||
margin-top: 0.25rem;
|
||||
padding: 0.5rem;
|
||||
border: 2px solid #282b30;
|
||||
border-radius: 5px;
|
||||
color: #b9bbbe;
|
||||
}
|
||||
|
||||
.chatlog__markdown-pre--multiline.hljs {
|
||||
background-color: inherit;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.chatlog__markdown-pre--inline {
|
||||
padding: 2px;
|
||||
border-radius: 3px;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
|
||||
.chatlog__markdown-mention {
|
||||
border-radius: 3px;
|
||||
padding: 0 2px;
|
||||
background-color: rgba(88, 101, 242, .3);
|
||||
color: #dee0fc;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.chatlog__markdown-mention:hover {
|
||||
background-color: #5865f2;
|
||||
color: #ffffff
|
||||
}
|
||||
|
||||
.chatlog__markdown-timestamp {
|
||||
border-radius: 3px;
|
||||
padding: 0 2px;
|
||||
color: #a3a6aa;
|
||||
}
|
||||
|
||||
.chatlog__emoji {
|
||||
width: 1.325rem;
|
||||
height: 1.325rem;
|
||||
margin: 0 0.06rem;
|
||||
vertical-align: -0.4rem;
|
||||
}
|
||||
|
||||
.chatlog__emoji--small {
|
||||
width: 1rem;
|
||||
height: 1rem;
|
||||
}
|
||||
|
||||
.chatlog__emoji--large {
|
||||
width: 2.8rem;
|
||||
height: 2.8rem;
|
||||
}
|
||||
|
||||
.postamble {
|
||||
padding: 1.25rem;
|
||||
}
|
||||
|
||||
.postamble__entry {
|
||||
color: #ffffff;
|
||||
}
|
||||
</style>
|
||||
|
||||
<link rel="stylesheet" href="OOP_down.html_Files/solarized-dark.min-BA98F.css">
|
||||
<script src="OOP_down.html_Files/highlight.min-D8D27.js"></script>
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
document.querySelectorAll('.chatlog__markdown-pre--multiline').forEach(e => hljs.highlightBlock(e));
|
||||
});
|
||||
</script>
|
||||
|
||||
<script src="OOP_down.html_Files/lottie.min-99657.js"></script>
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
document.querySelectorAll('.chatlog__sticker--media[data-source]').forEach(e => {
|
||||
const imageDataUrl = e.getAttribute('data-source');
|
||||
|
||||
const anim = lottie.loadAnimation({
|
||||
container: e,
|
||||
renderer: 'svg',
|
||||
loop: true,
|
||||
autoplay: true,
|
||||
path: imageDataUrl
|
||||
});
|
||||
|
||||
anim.addEventListener('data_failed', () =>
|
||||
e.innerHTML = '<strong>[Sticker cannot be rendered]</strong>'
|
||||
);
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
<script>
|
||||
function scrollToMessage(event, id) {
|
||||
var element = document.getElementById('chatlog__message-container-' + id);
|
||||
if (!element)
|
||||
return;
|
||||
|
||||
event.preventDefault();
|
||||
element.classList.add('chatlog__message-container--highlighted');
|
||||
|
||||
window.scrollTo({
|
||||
top: element.getBoundingClientRect().top - document.body.getBoundingClientRect().top - (window.innerHeight / 2),
|
||||
behavior: 'smooth'
|
||||
});
|
||||
|
||||
window.setTimeout(function() {
|
||||
element.classList.remove('chatlog__message-container--highlighted');
|
||||
}, 2000);
|
||||
}
|
||||
|
||||
function showSpoiler(event, element) {
|
||||
if (!element)
|
||||
return;
|
||||
|
||||
if (element.classList.contains('chatlog__attachment--hidden')) {
|
||||
event.preventDefault();
|
||||
element.classList.remove('chatlog__attachment--hidden');
|
||||
}
|
||||
|
||||
if (element.classList.contains('chatlog__markdown-spoiler--hidden')) {
|
||||
event.preventDefault();
|
||||
element.classList.remove('chatlog__markdown-spoiler--hidden');
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
</head><body><svg style="display: none">
|
||||
<symbol id="attachment-icon" viewBox="0 0 720 960">
|
||||
<path fill="#f4f5fb" d="M50,935a25,25,0,0,1-25-25V50A25,25,0,0,1,50,25H519.6L695,201.32V910a25,25,0,0,1-25,25Z"></path>
|
||||
<path fill="#7789c4" d="M509.21,50,670,211.63V910H50V50H509.21M530,0H50A50,50,0,0,0,0,50V910a50,50,0,0,0,50,50H670a50,50,0,0,0,50-50h0V191Z"></path>
|
||||
<path fill="#f4f5fb" d="M530,215a25,25,0,0,1-25-25V50a25,25,0,0,1,16.23-23.41L693.41,198.77A25,25,0,0,1,670,215Z"></path>
|
||||
<path fill="#7789c4" d="M530,70.71,649.29,190H530V70.71M530,0a50,50,0,0,0-50,50V190a50,50,0,0,0,50,50H670a50,50,0,0,0,50-50Z"></path>
|
||||
</symbol>
|
||||
</svg>
|
||||
|
||||
|
||||
|
||||
<div class="preamble">
|
||||
<div class="preamble__guild-icon-container">
|
||||
<img class="preamble__guild-icon" src="OOP_down.html_Files/62e486caf24d352ab938701a8d972730-5ADCF.png" alt="Guild icon" loading="lazy">
|
||||
</div>
|
||||
<div class="preamble__entries-container">
|
||||
<div class="preamble__entry">Handmade Network</div>
|
||||
<div class="preamble__entry">fishbowl / What, if anything, is OOP?</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="chatlog">
|
||||
|
||||
|
||||
|
|
@ -780,21 +27,6 @@
|
|||
<span class="chatlog__timestamp">28-May-22 09:58 AM</span>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="chatlog__message-container-980153085320130630" class="chatlog__message-container " data-message-id="980153085320130630">
|
||||
<div class="chatlog__message">
|
||||
<div class="chatlog__message-aside">
|
||||
<div class="chatlog__short-timestamp" title="28-May-22 09:58 AM">09:58</div>
|
||||
</div>
|
||||
|
||||
<div class="chatlog__message-primary">
|
||||
|
||||
<div class="chatlog__content chatlog__markdown">
|
||||
<span class="chatlog__markdown-preserve">Welcome to yet another <a class="inserted-after" href="https://en.wikipedia.org/wiki/Fishbowl_(conversation)" target="_blank">fishbowl</a>, everyone! Just setting things up here. The main conversation is here in this thread, and the <span class="chatlog__markdown-mention">#fishbowl-audience</span> conversation starts here: <a href="https://discord.com/channels/239737791225790464/708458209131757598/980155512412864552" onclick="scrollToMessage(event, '980155512412864552')">https://discord.com/channels/239737791225790464/708458209131757598/980155512412864552</a>
|
||||
|
||||
|
|
@ -805,7 +37,6 @@ The pinned messages are some "checkpoints" in the discussion; chapter markers of
|
|||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -13038,12 +12269,3 @@ Are the same as mine</span>
|
|||
|
||||
|
||||
</div>
|
||||
|
||||
<div class="postamble">
|
||||
<div class="postamble__entry">Exported 463 message(s)</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
</body></html>
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -91,7 +91,7 @@
|
|||
</div>
|
||||
<div class="dn flex-ns items-center f3">
|
||||
<a class="svgicon svgicon-nofix" href="https://twitter.com/handmade_net/" target="_blank">{{ svg "twitter" }}</a>
|
||||
<a class="svgicon svgicon-nofix ml2" href="https://discord.gg/hxWxDee" target="_blank">{{ svg "discord" }}</a>
|
||||
<a class="svgicon svgicon-nofix ml2" href="https://discord.gg/hmn" target="_blank">{{ svg "discord" }}</a>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
|
|
|||
|
|
@ -169,7 +169,7 @@
|
|||
<div id="welcome-actions" class="flex flex-column flex-row-ns justify-center">
|
||||
<a class="ba b--white br2 pa3 ph4-ns" href="{{ .ManifestoUrl }}">Read our manifesto</a>
|
||||
<a class="ba b--white br2 pa3 ph4-ns mt3 mt0-ns ml3-ns" href="{{ .Header.ProjectIndexUrl }}">View Handmade projects</a>
|
||||
<a class="ba b--white br2 pa3 ph4-ns mt3 mt0-ns ml3-ns" target="_blank" href="https://discord.gg/hxWxDee">Join our Discord</a>
|
||||
<a class="ba b--white br2 pa3 ph4-ns mt3 mt0-ns ml3-ns" target="_blank" href="https://discord.gg/hmn">Join our Discord</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -220,7 +220,7 @@
|
|||
<h2>Community Showcase</h2>
|
||||
<div class="bg--card pa3 br3">
|
||||
<div class="mb3">
|
||||
This is a selection of recent work done by community members. Want to participate? <a href="https://discord.gg/hxWxDee" target="_blank">Join us on Discord.</a>
|
||||
This is a selection of recent work done by community members. Want to participate? <a href="https://discord.gg/hmn" target="_blank">Join us on Discord.</a>
|
||||
</div>
|
||||
<div id="showcase-container"></div>
|
||||
<div>
|
||||
|
|
|
|||
|
|
@ -243,7 +243,7 @@
|
|||
</div>
|
||||
<div id="actions" class="flex justify-center">
|
||||
<a class="ba b--white br2 pv2 pv3-ns ph3 ph4-ns" target="_blank" href="https://handmade.network/forums/jam">See the submissions</a>
|
||||
<a class="ba b--white br2 pv2 pv3-ns ph3 ph4-ns ml3" target="_blank" href="https://discord.gg/hxWxDee">Join the Discord</a>
|
||||
<a class="ba b--white br2 pv2 pv3-ns ph3 ph4-ns ml3" target="_blank" href="https://discord.gg/hmn">Join the Discord</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -263,7 +263,7 @@
|
|||
<div class="section mw8 margin-center ph3 ph4-l">
|
||||
<h2>Showcase</h2>
|
||||
<p>
|
||||
These screenshots and videos were shared in #jam-showcase on our <a href="https://discord.gg/hxWxDee" target="_blank">Discord</a>. Join us!
|
||||
These screenshots and videos were shared in #jam-showcase on our <a href="https://discord.gg/hmn" target="_blank">Discord</a>. Join us!
|
||||
</p>
|
||||
<div id="showcase-container" class="mw8 center-layout mh2 mh0-ns"></div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -338,7 +338,6 @@ type ImageSelectorData struct {
|
|||
|
||||
type Breadcrumb struct {
|
||||
Name, Url string
|
||||
Current bool
|
||||
}
|
||||
|
||||
type Pagination struct {
|
||||
|
|
|
|||
|
|
@ -1,20 +1,104 @@
|
|||
package website
|
||||
|
||||
import (
|
||||
"errors"
|
||||
"fmt"
|
||||
"html/template"
|
||||
"io"
|
||||
"io/fs"
|
||||
"net/http"
|
||||
"path"
|
||||
"strings"
|
||||
"time"
|
||||
|
||||
"git.handmade.network/hmn/hmn/src/hmnurl"
|
||||
"git.handmade.network/hmn/hmn/src/oops"
|
||||
"git.handmade.network/hmn/hmn/src/templates"
|
||||
"git.handmade.network/hmn/hmn/src/utils"
|
||||
)
|
||||
|
||||
// This will skip the common path prefix for fishbowl files.
|
||||
// We unfortunately need to do this because we want to use http.FileServer,
|
||||
// but _that_ needs an http.FS, but _that_ needs an fs.FS...
|
||||
var fishbowlFS = utils.Must1(fs.Sub(templates.FishbowlFS, "src/fishbowls"))
|
||||
var fishbowlHTTPFS = http.StripPrefix("/fishbowl", http.FileServer(http.FS(fishbowlFS)))
|
||||
|
||||
type fishbowlInfo struct {
|
||||
Slug string
|
||||
Title string
|
||||
Month time.Month
|
||||
Year int
|
||||
ContentsPath string
|
||||
}
|
||||
|
||||
var fishbowls = [...]fishbowlInfo{
|
||||
{
|
||||
Slug: "internet-os",
|
||||
Title: "The future of operating systems in an Internet world",
|
||||
Month: time.May, Year: 2020,
|
||||
},
|
||||
{
|
||||
Slug: "metaprogramming",
|
||||
Title: "Compile-time introspection and metaprogramming",
|
||||
Month: time.June, Year: 2020,
|
||||
},
|
||||
{
|
||||
Slug: "lisp-jam",
|
||||
Title: "Lessons from the LISP Jam",
|
||||
Month: time.August, Year: 2020,
|
||||
},
|
||||
{
|
||||
Slug: "parallel-programming",
|
||||
Title: "Approaches to parallel programming",
|
||||
Month: time.November, Year: 2020,
|
||||
},
|
||||
{
|
||||
Slug: "skimming",
|
||||
Title: "Code skimmability as the root cause for bad code structure decisions", // real snappy, this one
|
||||
Month: time.January, Year: 2021,
|
||||
},
|
||||
{
|
||||
Slug: "config",
|
||||
Title: "How to design to avoid configuration",
|
||||
Month: time.March, Year: 2021,
|
||||
},
|
||||
{
|
||||
Slug: "simplicity-performance",
|
||||
Title: "The relationship of simplicity and performance",
|
||||
Month: time.May, Year: 2021,
|
||||
},
|
||||
{
|
||||
Slug: "teaching-software",
|
||||
Title: "How software development is taught",
|
||||
Month: time.June, Year: 2021,
|
||||
},
|
||||
{
|
||||
Slug: "flexible-software",
|
||||
Title: "How to design flexible software",
|
||||
Month: time.December, Year: 2021,
|
||||
},
|
||||
{
|
||||
Slug: "oop",
|
||||
Title: "What, if anything, is OOP?",
|
||||
Month: time.May, Year: 2022,
|
||||
ContentsPath: "oop/OOP.html",
|
||||
},
|
||||
}
|
||||
|
||||
func FishbowlIndex(c *RequestContext) ResponseData {
|
||||
type fishbowlTmpl struct {
|
||||
Date string
|
||||
Title string
|
||||
Url string
|
||||
}
|
||||
|
||||
var fishbowlTmpls []fishbowlTmpl
|
||||
for _, f := range fishbowls {
|
||||
fishbowlTmpls = append(fishbowlTmpls, fishbowlTmpl{
|
||||
Date: fmt.Sprintf("%s %d", f.Month.String(), f.Year),
|
||||
Title: f.Title,
|
||||
Url: hmnurl.BuildFishbowl(f.Slug),
|
||||
})
|
||||
}
|
||||
|
||||
var res ResponseData
|
||||
err := res.WriteTemplate("fishbowl_index.html", getBaseData(c, "Fishbowls", nil), c.Perf)
|
||||
if err != nil {
|
||||
|
|
@ -24,8 +108,18 @@ func FishbowlIndex(c *RequestContext) ResponseData {
|
|||
}
|
||||
|
||||
func Fishbowl(c *RequestContext) ResponseData {
|
||||
// Only serve up valid fishbowls
|
||||
if _, err := fs.Stat(fishbowlFS, c.PathParams["name"]); errors.Is(err, fs.ErrNotExist) {
|
||||
slug := c.PathParams["slug"]
|
||||
var info fishbowlInfo
|
||||
|
||||
// Only serve up valid fishbowls (with content)
|
||||
exists := false
|
||||
for _, fishbowl := range fishbowls {
|
||||
if fishbowl.Slug == slug && fishbowl.ContentsPath != "" {
|
||||
exists = true
|
||||
info = fishbowl
|
||||
}
|
||||
}
|
||||
if !exists {
|
||||
return FourOhFour(c)
|
||||
}
|
||||
|
||||
|
|
@ -36,14 +130,21 @@ func Fishbowl(c *RequestContext) ResponseData {
|
|||
|
||||
type FishbowlData struct {
|
||||
templates.BaseData
|
||||
Slug string
|
||||
Info fishbowlInfo
|
||||
Contents template.HTML
|
||||
}
|
||||
|
||||
indexFile := utils.Must1(fishbowlFS.Open(path.Join(c.PathParams["name"], "index.html")))
|
||||
contentsFile := utils.Must1(fishbowlFS.Open(info.ContentsPath))
|
||||
|
||||
tmpl := FishbowlData{
|
||||
BaseData: getBaseData(c, "TODOOP", nil),
|
||||
Contents: template.HTML(utils.Must1(io.ReadAll(indexFile))),
|
||||
BaseData: getBaseData(c, info.Title, []templates.Breadcrumb{
|
||||
{Name: "Fishbowls", Url: hmnurl.BuildFishbowlIndex()},
|
||||
{Name: info.Title, Url: hmnurl.BuildFishbowl(slug)},
|
||||
}),
|
||||
Slug: slug,
|
||||
Info: info,
|
||||
Contents: template.HTML(utils.Must1(io.ReadAll(contentsFile))),
|
||||
}
|
||||
|
||||
var res ResponseData
|
||||
|
|
@ -54,13 +155,6 @@ func Fishbowl(c *RequestContext) ResponseData {
|
|||
return res
|
||||
}
|
||||
|
||||
// This will skip the common path prefix for fishbowl files.
|
||||
// We unfortunately need to do this because we want to use http.FileServer,
|
||||
// but _that_ needs an http.FS, but _that_ needs an fs.FS, and embed.FS
|
||||
// doesn't import fs.SubFS, which _would_ do what we want, so here we are. >:(
|
||||
var fishbowlFS = utils.Must1(fs.Sub(templates.FishbowlFS, "src/fishbowls"))
|
||||
var fishbowlHTTPFS = http.StripPrefix("/fishbowl", http.FileServer(http.FS(fishbowlFS)))
|
||||
|
||||
func FishbowlFiles(c *RequestContext) ResponseData {
|
||||
var res ResponseData
|
||||
fishbowlHTTPFS.ServeHTTP(&res, c.Req)
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Don't we have the discord link in the BaseData?
No, but I suppose we could. That said, I don't mind it being hardcoded for now.