Lomanic
/
bibliogram
mirror of https://git.sr.ht/~cadence/bibliogram
1
0
Fork 0
Code Issues Releases Wiki Activity
bibliogram/src/site/sass/main.sass

636 lines
11 KiB
Sass
Raw Normal View History

First release
2020-01-12 12:50:21 +00:00
$layout-a-max: 820px
$layout-b-min: 821px
Remove incorrect semicolon? Hi Cadence, I'm not sure if this semicolon is supposed to be at the end of line 3. I think it might be incorrect so I propose removing it.
2020-04-17 10:26:19 +00:00
$layout-c-max: 680px
Add homepage
2020-01-28 10:37:19 +00:00
$layout-home-a-max: 520px
$layout-home-b-min: 521px
Clickable usernames and hashtags Should work well enough. Report edge cases.
2020-02-03 14:30:19 +00:00
$main-theme-link-color: #085cae
Redesign disabled feed system
2020-04-22 11:59:45 +00:00
$medium-red-bg: #6a2222
First release
2020-01-12 12:50:21 +00:00
Add fonts
2020-02-16 05:28:17 +00:00
@font-face
font-family: "Bariol"
Actually use the font
2020-02-16 05:38:52 +00:00
font-display: swap
Add fonts
2020-02-16 05:28:17 +00:00
src: url(/static/fonts/bariol.woff2) format("woff2"), url(/static/fonts/bariol.ttf) format("truetype")
Actually use the font
2020-02-16 05:38:52 +00:00
body, input, button, textarea
font-family: "Bariol", sans-serif
First release
2020-01-12 12:50:21 +00:00
body
margin: 0
padding: 0
font-size: 18px
.main-divider
Private profile notice
2020-01-27 12:06:44 +00:00
display: flex
flex-direction: column
min-height: 100vh
First release
2020-01-12 12:50:21 +00:00
@media screen and (min-width: $layout-b-min)
display: grid
grid-template-columns: 235px 1fr
.pfp
border-radius: 50%
@mixin link-button
color: hsl(107, 100%, 21.8%)
background: hsl(87, 78.4%, 80%)
padding: 12px
border-radius: 10px
border: 1px solid hsl(106.9, 49.8%, 46.9%)
line-height: 1
text-decoration: none
Add homepage
2020-01-28 10:37:19 +00:00
&.disabled
cursor: default
&:hover:not(.disabled), &:active, &.clicked
First release
2020-01-12 12:50:21 +00:00
color: hsl(106.4, 100%, 12.9%)
background: hsl(102.1, 77.2%, 67.3%)
border-color: hsl(104, 51.4%, 43.5%)
.profile-overview
text-align: center
position: relative
line-height: 1
@media screen and (max-width: $layout-a-max)
border-bottom: 1px solid #333
box-shadow: 0px -2px 4px 4px rgba(0, 0, 0, 0.4)
padding-bottom: 25px
@media screen and (min-width: $layout-b-min)
border-right: 1px solid #333
box-shadow: -2px 0px 4px 4px rgba(0, 0, 0, 0.4)
.profile-sticky
position: sticky
top: 0
Create post viewer
2020-01-18 15:38:14 +00:00
height: 100vh
box-sizing: border-box
overflow-y: auto
First release
2020-01-12 12:50:21 +00:00
padding: 10px
Fix line breaks in profile Closes #10, closes #13
2020-01-28 11:52:56 +00:00
white-space: pre-line
overflow-wrap: break-word
First release
2020-01-12 12:50:21 +00:00
Create post viewer
2020-01-18 15:38:14 +00:00
@media screen and (max-width: $layout-a-max)
height: unset
First release
2020-01-12 12:50:21 +00:00
Create post viewer
2020-01-18 15:38:14 +00:00
.pfp
margin: 25px 0
First release
2020-01-12 12:50:21 +00:00
Create post viewer
2020-01-18 15:38:14 +00:00
.full-name
margin: 0 0 8px
font-size: 30px
First release
2020-01-12 12:50:21 +00:00
Create post viewer
2020-01-18 15:38:14 +00:00
.username
margin: 0
font-size: 20px
font-weight: normal
First release
2020-01-12 12:50:21 +00:00
add bidi support to bio and description
2020-02-23 19:07:23 +00:00
.bio
Show followers not available message instead of 0
2020-04-20 07:51:53 +00:00
margin: 20px 0px
add bidi support to bio and description
2020-02-23 19:07:23 +00:00
unicode-bidi: plaintext
Create post viewer
2020-01-18 15:38:14 +00:00
.profile-counter
line-height: 1.3
First release
2020-01-12 12:50:21 +00:00
Show followers not available message instead of 0
2020-04-20 07:51:53 +00:00
&.not-available
font-style: italic
Create post viewer
2020-01-18 15:38:14 +00:00
.count
font-weight: bold
Fix profile link colour
2020-02-03 14:51:11 +00:00
.website
Show followers not available message instead of 0
2020-04-20 07:51:53 +00:00
margin: 20px 0px
Fix profile link colour
2020-02-03 14:51:11 +00:00
a, a:visited
color: $main-theme-link-color
Create post viewer
2020-01-18 15:38:14 +00:00
.links
Show followers not available message instead of 0
2020-04-20 07:51:53 +00:00
margin: 15px 0px
Create post viewer
2020-01-18 15:38:14 +00:00
display: flex
flex-wrap: wrap
justify-content: center
Rewrite feeds
2020-02-18 00:39:20 +00:00
.validate-feed
margin-left: 2px
Clickable usernames and hashtags Should work well enough. Report edge cases.
2020-02-03 14:30:19 +00:00
a, a:visited
color: $main-theme-link-color
> *
Create post viewer
2020-01-18 15:38:14 +00:00
margin: 5px
First release
2020-01-12 12:50:21 +00:00
.timeline
--image-size: 260px
$image-size: var(--image-size)
$background: #fff4e8
@media screen and (max-width: $layout-a-max)
Force 3 columns on mobile
2020-01-29 10:08:52 +00:00
--image-size: 150px
Private profile notice
2020-01-27 12:06:44 +00:00
flex: 1
First release
2020-01-12 12:50:21 +00:00
Force 3 columns on mobile
2020-01-29 10:08:52 +00:00
@media screen and (max-width: $layout-c-max)
--image-size: calc(33vw - 10px)
First release
2020-01-12 12:50:21 +00:00
background-color: $background
Write full types and fix related bugs Also fixes #4.
2020-01-26 14:56:59 +00:00
padding: 15px 15px 40px
First release
2020-01-12 12:50:21 +00:00
Private profile notice
2020-01-27 12:06:44 +00:00
&.no-posts
display: flex
flex-direction: column
justify-content: center
First release
2020-01-12 12:50:21 +00:00
.page-number
color: #444
line-height: 1
max-width: 600px
margin: 0px auto
padding: 20px 0px // separate margin and padding for better page hash jump locations
text-align: center
position: relative
&::before
position: absolute
display: block
content: ""
left: 0
right: 0
top: 50%
border-top: 1px solid
Private profile notice
2020-01-27 12:06:44 +00:00
&:no-posts
.number
position: relative
z-index: 1
padding: 10px
background-color: $background
First release
2020-01-12 12:50:21 +00:00
.next-page-container
margin: 20px 0px
display: flex
justify-content: center
.next-page
@include link-button
font-size: 18px
Infinite scroll
2020-01-12 15:39:50 +00:00
text-align: center
First release
2020-01-12 12:50:21 +00:00
.timeline-inner
display: flex
justify-content: center
flex-wrap: wrap
margin: 0 auto
Force 3 columns on mobile
2020-01-29 10:08:52 +00:00
@media screen and (max-width: $layout-c-max)
display: grid
grid-template-columns: repeat(3, 1fr)
justify-content: center
justify-items: center
Create post viewer
2020-01-18 15:38:14 +00:00
@mixin sized()
width: $image-size
height: $image-size
.sized-link
First release
2020-01-12 12:50:21 +00:00
$margin: 5px
margin: $margin
Create post viewer
2020-01-18 15:38:14 +00:00
color: #111
background-color: rgba(40, 40, 40, 0.25)
text-decoration: none
Optional Tor support
2020-02-02 11:43:56 +00:00
overflow: hidden
Create post viewer
2020-01-18 15:38:14 +00:00
@include sized
First release
2020-01-12 12:50:21 +00:00
&:hover
$border-width: 3px
margin: $margin - $border-width
border: $border-width solid #111
Create post viewer
2020-01-18 15:38:14 +00:00
Force 3 columns on mobile
2020-01-29 10:08:52 +00:00
@media screen and (max-width: $layout-c-max)
$margin: 2px
margin: $margin
&:hover
$border-width: 2px
margin: $margin - $border-width
border: $border-width solid #111
Create post viewer
2020-01-18 15:38:14 +00:00
.sized-image
@include sized
.post-page
Add SPA post overlay
2020-02-21 12:35:19 +00:00
background-color: #505156
Create post viewer
2020-01-18 15:38:14 +00:00
Add SPA post overlay
2020-02-21 12:35:19 +00:00
.post-page-divider
display: grid
grid-template-columns: 360px auto
max-width: 1200px
margin: 0 auto
min-height: 100vh
Create post viewer
2020-01-18 15:38:14 +00:00
Add SPA post overlay
2020-02-21 12:35:19 +00:00
@media screen and (max-width: $layout-a-max)
display: flex
flex-direction: column
Write full types and fix related bugs Also fixes #4.
2020-01-26 14:56:59 +00:00
Add SPA post overlay
2020-02-21 12:35:19 +00:00
.description-section
display: grid
Stick user header to stop
2020-03-01 03:43:43 +00:00
align-items: stretch
align-content: stretch
grid-template-rows: auto 1fr
Add SPA post overlay
2020-02-21 12:35:19 +00:00
position: sticky
top: 0
height: 100vh
box-sizing: border-box
Create post viewer
2020-01-18 15:38:14 +00:00
Add SPA post overlay
2020-02-21 12:35:19 +00:00
@media screen and (max-width: $layout-a-max)
Stick user header to stop
2020-03-01 03:43:43 +00:00
display: contents // this is absolutely disgusting
Add SPA post overlay
2020-02-21 12:35:19 +00:00
position: inherit
top: inherit
height: inherit
Create post viewer
2020-01-18 15:38:14 +00:00
Add SPA post overlay
2020-02-21 12:35:19 +00:00
.user-header
Add buttons to go through posts Closes #8
2020-02-26 07:12:48 +00:00
display: grid
Add SPA post overlay
2020-02-21 12:35:19 +00:00
align-items: center
Add buttons to go through posts Closes #8
2020-02-26 07:12:48 +00:00
grid-template-columns: auto 1fr auto
Add SPA post overlay
2020-02-21 12:35:19 +00:00
justify-content: center
background-color: #b3b3b3
padding: 10px
Stick user header to stop
2020-03-01 03:43:43 +00:00
position: sticky
top: 0
Create post viewer
2020-01-18 15:38:14 +00:00
Add buttons to go through posts Closes #8
2020-02-26 07:12:48 +00:00
.navigate-posts
-webkit-appearance: none
-moz-appearance: none
border: none
margin: 0
padding: 0
cursor: pointer
background: none
Create post viewer
2020-01-18 15:38:14 +00:00
Add buttons to go through posts Closes #8
2020-02-26 07:12:48 +00:00
.icon
display: block
Create post viewer
2020-01-18 15:38:14 +00:00
Remove post navigation arrow inline style
2020-03-11 10:17:40 +00:00
&.previous
transform: rotate(180deg)
Add buttons to go through posts Closes #8
2020-02-26 07:12:48 +00:00
.user-header-inner
Fix name on post when no full_name
2020-03-01 02:35:45 +00:00
grid-row: 1
grid-column: 2
Add buttons to go through posts Closes #8
2020-02-26 07:12:48 +00:00
display: flex
align-items: center
justify-content: center
Fix name on post when no full_name
2020-03-01 02:35:45 +00:00
margin: 0px 10px
Create post viewer
2020-01-18 15:38:14 +00:00
Add buttons to go through posts Closes #8
2020-02-26 07:12:48 +00:00
.pfp
$size: 40px
width: $size
height: $size
margin-right: 10px
background-color: rgba(40, 40, 40, 0.25)
.name
font-size: 20px
color: black
text-decoration: none
&:hover
text-decoration: underline
Write full types and fix related bugs Also fixes #4.
2020-01-26 14:56:59 +00:00
Stick user header to stop
2020-03-01 03:43:43 +00:00
.relative-box
background-color: #eee
@media screen and (min-width: $layout-b-min)
.relative-box
position: relative
.scrolling-box
position: absolute
top: 0
bottom: 0
overflow-y: auto
display: grid
align-items: center
Add SPA post overlay
2020-02-21 12:35:19 +00:00
.description
margin: 12px
white-space: pre-line
overflow-wrap: anywhere
font-size: 20px
line-height: 1.4
add bidi support to bio and description
2020-02-23 19:07:23 +00:00
unicode-bidi: plaintext
Stick user header to stop
2020-03-01 03:43:43 +00:00
@media screen and (min-width: $layout-b-min)
padding-bottom: 20px
Fix name on post when no full_name
2020-03-01 02:35:45 +00:00
Write full types and fix related bugs Also fixes #4.
2020-01-26 14:56:59 +00:00
@media screen and (max-width: $layout-a-max)
Add SPA post overlay
2020-02-21 12:35:19 +00:00
font-size: 18px
.images-gallery
display: flex
flex-direction: column
align-items: center
justify-content: center
background-color: #262728
padding: 10px
Write full types and fix related bugs Also fixes #4.
2020-01-26 14:56:59 +00:00
Add SPA post overlay
2020-02-21 12:35:19 +00:00
@media screen and (max-width: $layout-a-max)
flex: 1
Stick user header to stop
2020-03-01 03:43:43 +00:00
position: relative
Create post viewer
2020-01-18 15:38:14 +00:00
Add SPA post overlay
2020-02-21 12:35:19 +00:00
.sized-image, .sized-video
color: #eee
background-color: #3b3c3d
max-height: 94vh
max-width: 100%
Basic error checking
2020-01-27 06:03:28 +00:00
Add SPA post overlay
2020-02-21 12:35:19 +00:00
&:not(:last-child)
margin-bottom: 10px
Add video support (experimental!)
2020-01-29 15:20:20 +00:00
Add SPA post overlay
2020-02-21 12:35:19 +00:00
.sized-image
width: auto
height: auto
.sized-video
Fix video sizing?
2020-04-16 13:14:36 +00:00
width: auto
height: auto
Add video support (experimental!)
2020-01-29 15:20:20 +00:00
Basic error checking
2020-01-27 06:03:28 +00:00
.error-page
Fix #15
2020-01-28 12:17:32 +00:00
box-sizing: border-box
Basic error checking
2020-01-27 06:03:28 +00:00
min-height: 100vh
background: #191919
padding: 10px
text-align: center
display: flex
flex-direction: column
justify-content: center
align-items: center
Blocked by Instagram.
2020-01-30 03:05:43 +00:00
a, a:visited
color: #4a93d2
Fix #15
2020-01-28 12:17:32 +00:00
.code, .message, .explanation, .back-link
Basic error checking
2020-01-27 06:03:28 +00:00
line-height: 1.2
margin: 0px
.code
font-size: 80px
color: #fff
margin-bottom: 25px
.message
font-size: 35px
color: #ccc
Fix #15
2020-01-28 12:17:32 +00:00
.explanation
Blocked by Instagram.
2020-01-30 03:05:43 +00:00
line-height: 1.3
Fix #15
2020-01-28 12:17:32 +00:00
margin-top: 10px
font-size: 20px
color: #bbb
Blocked by Instagram.
2020-01-30 03:05:43 +00:00
white-space: pre-line
Basic error checking
2020-01-27 06:03:28 +00:00
.back
Fix #15
2020-01-28 12:17:32 +00:00
margin-top: 15vh
Basic error checking
2020-01-27 06:03:28 +00:00
font-size: 25px
Add homepage
2020-01-28 10:37:19 +00:00
.homepage
$link-color: #ffb8b8
display: flex
flex-direction: column
min-height: 100vh
background-color: #bd4444
color: #fff
h1
font-size: 48px
margin: 0px
h2
font-size: 32px
margin: 0px
a, a:visited
color: $link-color
.banner
padding: 0px 5px
height: 60vh
display: flex
justify-content: center
align-items: center
.banner-image
max-width: 100%
@media screen and (max-width: $layout-home-a-max)
height: 30vh
.go-sections-container
padding: 0px 10px 50px
.go-sections
max-width: 900px
margin: 0px auto
display: grid
grid-gap: 10px
grid-template-columns: repeat(2, 1fr)
justify-items: center
@media screen and (max-width: $layout-home-a-max)
grid-template-columns: 1fr
.title
text-align: center
margin-bottom: 20px
.pair-entry
display: flex
.text, .button
Add buttons to go through posts Closes #8
2020-02-26 07:12:48 +00:00
-webkit-appearance: none
Add homepage
2020-01-28 10:37:19 +00:00
-moz-appearance: none
display: flex
Adjust buttons on front page
2020-04-15 22:36:08 +00:00
padding: 8px
Add homepage
2020-01-28 10:37:19 +00:00
line-height: 1
box-sizing: content-box
font-size: 20px
height: 20px
border: 1px solid #333
.text
border-radius: 6px 0px 0px 6px
border-right: none
max-width: 230px
width: 30vw
@media screen and (max-width: 520px)
width: 80vw
.button
border-radius: 0px 6px 6px 0px
padding-left: 12px
padding-right: 12px
cursor: pointer
background-color: #ffbebe
color: #111
&:hover
background-color: #ff7c7c
.about-container
Redesign disabled feed system
2020-04-22 11:59:45 +00:00
background-color: $medium-red-bg
Add homepage
2020-01-28 10:37:19 +00:00
color: #eee
padding: 50px 20px
flex: 1
min-height: 60vh
.about
max-width: 700px
margin: 0px auto
line-height: 1.4
font-size: 20px
Revise about section on homepage
2020-01-28 11:37:08 +00:00
.example-link
white-space: nowrap
Add homepage
2020-01-28 10:37:19 +00:00
.link-list
color: $link-color
Clickable usernames and hashtags Should work well enough. Report edge cases.
2020-02-03 14:30:19 +00:00
.structured-text
a, a:visited
color: $main-theme-link-color
text-decoration: none
a:link, a:link:visited
text-decoration: underline
.link-to-hashtag
color: #127722
Add privacy policy template
2020-02-05 10:11:00 +00:00
.privacy-policy
max-width: 700px
min-height: 100vh
margin: 0px auto
padding: 0px 10px 80px
font-size: 20px
line-height: 1.4
background-color: #481717
color: #e2e2e2
h1, h2, h3
color: #f4f4f4
h1
margin: 40px 0px
font-size: 48px
a, a:visited
color: #ffb8b8
Update privacy policy template
2020-02-05 12:14:26 +00:00
code
font-size: 0.8em
background-color: #141414
padding: 3px 5px
border-radius: 5px
color: #eee
Add privacy policy template
2020-02-05 10:11:00 +00:00
.return-home
line-height: 1
margin-top: 45px
padding-top: 15px
border-top: 1px solid #714141
Add SPA post overlay
2020-02-21 12:35:19 +00:00
.post-overlay
position: fixed
top: 0
left: 0
right: 0
bottom: 0
background: rgba(0, 0, 0, 0.7)
z-index: 10
Stick user header to stop
2020-03-01 03:43:43 +00:00
overflow-y: scroll
Add SPA post overlay
2020-02-21 12:35:19 +00:00
&:not(.loading) > *
min-height: 100vh
&.loading
display: flex
justify-content: center
align-items: center
.loading-inner
color: white
font-size: 30px
line-height: 1
padding: 26px
border-radius: 20px
border: 2px solid #aaa
font-weight: bold
background-color: #282828
Add updater page, disabled by default
2020-02-22 10:44:17 +00:00
Redesign disabled feed system
2020-04-22 11:59:45 +00:00
@mixin article-code
Add updater page, disabled by default
2020-02-22 10:44:17 +00:00
code
Redesign disabled feed system
2020-04-22 11:59:45 +00:00
font-size: 0.8em
letter-spacing: -0.2px
Add updater page, disabled by default
2020-02-22 10:44:17 +00:00
background: #ccc
color: #000
padding: 0px 4px
border-radius: 2px
Redesign disabled feed system
2020-04-22 11:59:45 +00:00
.updater-page
@include article-code
font-size: 20px
max-width: 800px
margin: 0 auto
color: #222
Add updater page, disabled by default
2020-02-22 10:44:17 +00:00
.commits
border-left: 2px solid #555
margin: 10px 0px
padding-left: 10px
.hash
margin-right: 6px
.attention
border-left: 2px solid
padding-left: 8px
color: #700
Redesign disabled feed system
2020-04-22 11:59:45 +00:00
.article-page
@include article-code
background-color: #fff4e8
font-size: 22px
line-height: 1.4
color: #222
min-height: 100vh
header
background-color: $medium-red-bg
color: #fff
padding: 40px 10px
line-height: 1.2
h1, h2
text-align: center
margin: 0
h1
font-size: 50px
h2
font-size: 30px
.article-main
max-width: 800px
margin: 0 auto
padding: 20px 20px 100px
a, a:visited
color: $main-theme-link-color