-
Notifications
You must be signed in to change notification settings - Fork 11
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Auto-merged main into refs/heads/revert/old_point on deployment.
- Loading branch information
Showing
13 changed files
with
159 additions
and
111 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,6 +1,6 @@ | ||
// Subscriber and current user flavor texts | ||
|
||
//.titlebox .number:before {content: ""} | ||
.titlebox .number:after {content: " traveling merchants"} | ||
.titlebox .number:after {content: " Trumpets"} | ||
//.titlebox .users-online span.number:before {content: ""} | ||
.titlebox .users-online span.number:after {content: " counting Trenni silver coins"} | ||
.titlebox .users-online span.number:after {content: " Auditioning Euphoniums"} |
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file not shown.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,95 +1,107 @@ | ||
// Sidebar images | ||
// TODO: some stuff is still hardcoded, also can 100% rewrite this to accept | ||
// an arbitrary number of images | ||
|
||
// Leave appropriate room at the top of the sidebar for the | ||
// image + the absolutely-positioned search bar | ||
.side { | ||
@if $sidebar-image-other-height == 0 { | ||
padding-top: | ||
$sidebar-section-margin-vertical + | ||
$sidebar-search-height + | ||
$sidebar-section-margin-vertical + | ||
$sidebar-image-height; | ||
} @else { | ||
padding-top: | ||
$sidebar-section-margin-vertical + | ||
$sidebar-search-height + | ||
$sidebar-section-margin-vertical + | ||
$sidebar-image-height + | ||
$sidebar-section-margin-vertical + | ||
$sidebar-image-other-height; | ||
} | ||
} | ||
/* | ||
$sidebar-images: ( | ||
// Map keys are identifiers used at the end of links in the sidebar markdown | ||
// e.g. this image would use the markdown [](https://example.com#some_img) | ||
"some_img": ( | ||
// The height of the image, in CSS pixels - all images are 300 CSS | ||
// pixels wide. Actual image file dimensions should be doubled for HiDPI | ||
// support, i.e. 600px wide and (2x this value) tall | ||
"height": 300px, | ||
// Reference to the image - make sure you put it in the images folder! | ||
"image": url("images/sidebar.png"), | ||
), | ||
// Search bar isn't there on search pages, it's moved to #content. Also, on | ||
// search pages, the submit buttons are the first `.spacer`s which means they | ||
// don't have the normal top margin, which means we need to add that back. | ||
.search-page .side { | ||
@if $sidebar-image-other-height == 0 { | ||
padding-top: | ||
$sidebar-section-margin-vertical + | ||
$sidebar-image-height + | ||
$sidebar-section-margin-vertical; | ||
} @else { | ||
padding-top: | ||
$sidebar-section-margin-vertical + | ||
$sidebar-image-height + | ||
$sidebar-section-margin-vertical + | ||
$sidebar-image-other-height + | ||
$sidebar-section-margin-vertical; | ||
} | ||
} | ||
// ... etc for more images | ||
); | ||
*/ | ||
|
||
// Position the first image and also set some stuff for both images | ||
.side [href*='#sidebarimg'] { | ||
position: absolute; | ||
top: $header-height + $sidebar-section-margin-vertical + $sidebar-search-height + $sidebar-section-margin-vertical; | ||
right: $sidebar-padding; | ||
width: 300px; | ||
height: $sidebar-image-height; | ||
border-radius: $sidebar-section-border-radius; | ||
background: url("images/sidebar.png") center/contain; | ||
$sidebar-images: ( | ||
"sidebarimg": ( | ||
"height": 300px, | ||
"image": url("images/sidebar.png"), | ||
), | ||
"sidebarimg2": ( | ||
"height": 300px, | ||
"image": url("images/sidebar2.png"), | ||
), | ||
"sidebarimg3": ( | ||
"height": 200px, | ||
"image": url("images/sidebar3.png"), | ||
), | ||
); | ||
|
||
// Again, search bar isn't there on search pages | ||
.search-page & { | ||
top: $header-height + $sidebar-section-margin-vertical; | ||
} | ||
// The distance from the top of the page sidebar images need to be positioned - | ||
// this accounts for the height of the header as well as the height of the | ||
// search box and additional margins | ||
$sidebar-content-top: | ||
$header-height | ||
+ $sidebar-section-margin-vertical; | ||
|
||
// On most pages, the search bar is displayed above the images, so we need to | ||
// move them down further to accomodate | ||
$sidebar-content-top-with-search: | ||
$sidebar-search-height | ||
+ $sidebar-section-margin-vertical | ||
+ $sidebar-content-top; | ||
|
||
// Move the search bar to the very top of the sidebar, if it's here | ||
.side #search { | ||
position: absolute; | ||
top: $sidebar-content-top; | ||
} | ||
|
||
// Position the second image | ||
.side [href*="#sidebarimg2"] { | ||
top: | ||
$header-height + | ||
$sidebar-padding + | ||
$sidebar-search-height + | ||
$sidebar-section-margin-vertical + | ||
$sidebar-image-height + | ||
$sidebar-section-margin-vertical; | ||
height: $sidebar-image-other-height; | ||
background-image: url("images/sidebar2.png"); | ||
background-size: cover; | ||
// Total padding left at the top of the sidebar to make room for the absolutely | ||
// positioned sidebar images - the extra height of each image is added each | ||
// iteration | ||
$images-height-cumulative: 0px; | ||
|
||
// rotating sidebar - wouldn't go under 40 seconds since it gets annoying to look at | ||
animation: sidb 33s steps(2, end) infinite; | ||
// Iterate over all images and position them progressively | ||
@each $anchor, $details in $sidebar-images { | ||
// The height of this image | ||
$height: map-get($details, "height"); | ||
// The source of this image | ||
$image: map-get($details, "image"); | ||
|
||
// you get the idea | ||
.search-page & { | ||
top: | ||
$header-height + | ||
$sidebar-section-margin-vertical + | ||
$sidebar-image-height + | ||
$sidebar-section-margin-vertical; | ||
// Render this image in the correct location | ||
.side [href*="##{$anchor}"] { | ||
position: absolute; | ||
top: $sidebar-content-top-with-search + $images-height-cumulative; | ||
right: $sidebar-padding; | ||
width: 300px; | ||
height: $height; | ||
border-radius: $sidebar-section-border-radius; | ||
background: $image center/contain; | ||
|
||
// Again, search bar isn't there on search pages | ||
.search-page & { | ||
top: $sidebar-content-top + $images-height-cumulative; | ||
} | ||
} | ||
} | ||
|
||
// Move the search bar above the images | ||
.side #search { | ||
position: absolute; | ||
top: $header-height + $sidebar-section-margin-vertical; | ||
// Add this image to the cumulative height | ||
$images-height-cumulative: | ||
$images-height-cumulative + $height + $sidebar-section-margin-vertical; | ||
} | ||
|
||
@keyframes sidb { | ||
from { background-position: 0 0px; } | ||
to { background-position: -600px 0px;} | ||
// Leave appropriate room at the top of the sidebar for all the | ||
// absolutely-positioned images + the search bar | ||
.side { | ||
padding-top: | ||
$sidebar-section-margin-vertical | ||
+ $sidebar-search-height | ||
+ $images-height-cumulative; | ||
|
||
// no sidebar search bar on search pages - move up | ||
.search-page & { | ||
padding-top: | ||
$images-height-cumulative; | ||
} | ||
} | ||
|
||
// old and unused - previously used for a carousel effect with two images | ||
// @keyframes sidb { | ||
// from { background-position: 0 0px; } | ||
// to { background-position: -600px 0px;} | ||
// } |