Merge branch 'main' into production

.css-config-sample/_instance-settings.scss

@@ -0,0 +1,3 @@
+@charset "utf-8";
+
+// Copy this file to bookwyrm/static/css/ and set your instance custom styles.

.env.example

@@ -102,6 +102,9 @@ PREVIEW_DEFAULT_COVER_COLOR=#002549
 # for sending prod and dev metrics to the same place and
 # keeping them separate, for instance!
 
-OTEL_EXPORTER_OTLP_ENDPOINT=    # API endpoint for your provider
-OTEL_EXPORTER_OTLP_HEADERS=     # Any headers required, usually authentication info
-OTEL_SERVICE_NAME=              # Service name to identify your app
+# API endpoint for your provider
+OTEL_EXPORTER_OTLP_ENDPOINT=
+# Any headers required, usually authentication info
+OTEL_EXPORTER_OTLP_HEADERS=
+# Service name to identify your app
+OTEL_SERVICE_NAME=

.github/workflows/lint-frontend.yaml

@@ -27,7 +27,7 @@ jobs:
       # See .stylelintignore for files that are not linted.
       - name: Run stylelint
         run: >
-          npx stylelint bookwyrm/static/css/*.css \
+          npx stylelint bookwyrm/static/css/*.scss bookwyrm/static/css/bookwyrm/**/*.scss \
             --config dev-tools/.stylelintrc.js
 
       # See .eslintignore for files that are not linted.

.github/workflows/lint-global.yaml

@@ -1,21 +0,0 @@
-# @url https://docs.github.com/en/actions/reference/workflow-syntax-for-github-actions
-name: Lint project globally
-
-on:
-  push:
-    branches: [ main, ci ]
-  pull_request:
-    branches: [ main, ci ]
-
-jobs:
-  lint:
-    name: Lint with EditorConfig.
-    runs-on: ubuntu-20.04
-
-    # Steps represent a sequence of tasks that will be executed as part of the job
-    steps:
-      # Checks-out your repository under $GITHUB_WORKSPACE, so your job can access it
-      - uses: actions/checkout@v2
-
-      - name: EditorConfig
-        uses: greut/eclint-action@v0

.gitignore

@@ -16,6 +16,8 @@
 # BookWyrm
 .env
 /images/
+bookwyrm/static/css/bookwyrm.css
+bookwyrm/static/css/_instance-settings.scss
 
 # Testing
 .coverage

bookwyrm/forms.py

@@ -495,7 +495,7 @@ class GroupForm(CustomForm):
 class ReportForm(CustomForm):
     class Meta:
         model = models.Report
-        fields = ["user", "reporter", "statuses", "links", "note"]
+        fields = ["user", "reporter", "status", "links", "note"]
 
 
 class EmailBlocklistForm(CustomForm):
@@ -550,3 +550,9 @@ class ReadThroughForm(CustomForm):
     class Meta:
         model = models.ReadThrough
         fields = ["user", "book", "start_date", "finish_date"]
+
+
+class AutoModRuleForm(CustomForm):
+    class Meta:
+        model = models.AutoMod
+        fields = ["string_match", "flag_users", "flag_statuses", "created_by"]

bookwyrm/migrations/0138_automod.py

@@ -0,0 +1,39 @@
+# Generated by Django 3.2.12 on 2022-02-24 18:59
+
+from django.conf import settings
+from django.db import migrations, models
+import django.db.models.deletion
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ("bookwyrm", "0137_alter_sitesettings_allow_registration"),
+    ]
+
+    operations = [
+        migrations.CreateModel(
+            name="AutoMod",
+            fields=[
+                (
+                    "id",
+                    models.AutoField(
+                        auto_created=True,
+                        primary_key=True,
+                        serialize=False,
+                        verbose_name="ID",
+                    ),
+                ),
+                ("string_match", models.CharField(max_length=200, unique=True)),
+                ("flag_users", models.BooleanField(default=True)),
+                ("flag_statuses", models.BooleanField(default=True)),
+                (
+                    "created_by",
+                    models.ForeignKey(
+                        on_delete=django.db.models.deletion.PROTECT,
+                        to=settings.AUTH_USER_MODEL,
+                    ),
+                ),
+            ],
+        ),
+    ]

bookwyrm/migrations/0139_report_status.py

@@ -0,0 +1,45 @@
+# Generated by Django 3.2.12 on 2022-02-24 20:41
+
+from django.db import migrations, models
+import django.db.models.deletion
+
+
+def set_report_statuses(apps, schema_editor):
+    """copy over status fields"""
+    db_alias = schema_editor.connection.alias
+    report_model = apps.get_model("bookwyrm", "Report")
+    reports = report_model.objects.using(db_alias).filter(statuses__isnull=False)
+    for report in reports:
+        report.status = report.statuses.first()
+        report.save()
+
+
+def set_reverse(apps, schema_editor):
+    """copy over status fields"""
+    db_alias = schema_editor.connection.alias
+    report_model = apps.get_model("bookwyrm", "Report")
+    reports = report_model.objects.using(db_alias).filter(status__isnull=False)
+    for report in reports:
+        report.statuses.set(report.status)
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ("bookwyrm", "0138_automod"),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name="report",
+            name="status",
+            field=models.ForeignKey(
+                blank=True,
+                null=True,
+                on_delete=django.db.models.deletion.PROTECT,
+                related_name="reports",
+                to="bookwyrm.status",
+            ),
+        ),
+        migrations.RunPython(set_report_statuses, reverse_code=set_reverse),
+    ]

bookwyrm/migrations/0140_remove_report_statuses.py

@@ -0,0 +1,17 @@
+# Generated by Django 3.2.12 on 2022-02-24 20:43
+
+from django.db import migrations
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ("bookwyrm", "0139_report_status"),
+    ]
+
+    operations = [
+        migrations.RemoveField(
+            model_name="report",
+            name="statuses",
+        ),
+    ]

bookwyrm/migrations/0141_alter_report_status.py

@@ -0,0 +1,24 @@
+# Generated by Django 3.2.12 on 2022-02-24 20:50
+
+from django.db import migrations, models
+import django.db.models.deletion
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ("bookwyrm", "0140_remove_report_statuses"),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name="report",
+            name="status",
+            field=models.ForeignKey(
+                blank=True,
+                null=True,
+                on_delete=django.db.models.deletion.PROTECT,
+                to="bookwyrm.status",
+            ),
+        ),
+    ]

bookwyrm/models/__init__.py

@@ -29,7 +29,7 @@ from .import_job import ImportJob, ImportItem
 from .site import SiteSettings, SiteInvite
 from .site import PasswordReset, InviteRequest
 from .announcement import Announcement
-from .antispam import EmailBlocklist, IPBlocklist
+from .antispam import EmailBlocklist, IPBlocklist, AutoMod, automod_task
 
 from .notification import Notification
 

bookwyrm/models/antispam.py

@@ -1,6 +1,13 @@
 """ Lets try NOT to sell viagra """
-from django.db import models
+from functools import reduce
+import operator
 
+from django.apps import apps
+from django.db import models
+from django.db.models import Q
+from django.utils.translation import gettext_lazy as _
+
+from bookwyrm.tasks import app
 from .user import User
 
 
@@ -33,3 +40,107 @@ class IPBlocklist(models.Model):
         """default sorting"""
 
         ordering = ("-created_date",)
+
+
+class AutoMod(models.Model):
+    """rules to automatically flag suspicious activity"""
+
+    string_match = models.CharField(max_length=200, unique=True)
+    flag_users = models.BooleanField(default=True)
+    flag_statuses = models.BooleanField(default=True)
+    created_by = models.ForeignKey("User", on_delete=models.PROTECT)
+
+
+@app.task(queue="low_priority")
+def automod_task():
+    """Create reports"""
+    if not AutoMod.objects.exists():
+        return
+    reporter = AutoMod.objects.first().created_by
+    reports = automod_users(reporter) + automod_statuses(reporter)
+    if reports:
+        admins = User.objects.filter(
+            models.Q(user_permissions__name__in=["moderate_user", "moderate_post"])
+            | models.Q(is_superuser=True)
+        ).all()
+        notification_model = apps.get_model(
+            "bookwyrm", "Notification", require_ready=True
+        )
+        for admin in admins:
+            notification_model.objects.bulk_create(
+                [
+                    notification_model(
+                        user=admin,
+                        related_report=r,
+                        notification_type="REPORT",
+                    )
+                    for r in reports
+                ]
+            )
+
+
+def automod_users(reporter):
+    """check users for moderation flags"""
+    user_rules = AutoMod.objects.filter(flag_users=True).values_list(
+        "string_match", flat=True
+    )
+    if not user_rules:
+        return []
+
+    filters = []
+    for field in ["username", "summary", "name"]:
+        filters += [{f"{field}__icontains": r} for r in user_rules]
+    users = User.objects.filter(
+        reduce(operator.or_, (Q(**f) for f in filters)),
+        is_active=True,
+        local=True,
+        report__isnull=True,  # don't flag users that already have reports
+    ).distinct()
+
+    report_model = apps.get_model("bookwyrm", "Report", require_ready=True)
+
+    return report_model.objects.bulk_create(
+        [
+            report_model(
+                reporter=reporter,
+                note=_("Automatically generated report"),
+                user=u,
+            )
+            for u in users
+        ]
+    )
+
+
+def automod_statuses(reporter):
+    """check statues for moderation flags"""
+    status_rules = AutoMod.objects.filter(flag_statuses=True).values_list(
+        "string_match", flat=True
+    )
+
+    if not status_rules:
+        return []
+
+    filters = []
+    for field in ["content", "content_warning", "quotation__quote", "review__name"]:
+        filters += [{f"{field}__icontains": r} for r in status_rules]
+
+    status_model = apps.get_model("bookwyrm", "Status", require_ready=True)
+    statuses = status_model.objects.filter(
+        reduce(operator.or_, (Q(**f) for f in filters)),
+        deleted=False,
+        local=True,
+        report__isnull=True,  # don't flag statuses that already have reports
+    ).distinct()
+
+    report_model = apps.get_model("bookwyrm", "Report", require_ready=True)
+    return report_model.objects.bulk_create(
+        [
+            report_model(
+                reporter=reporter,
+                note=_("Automatically generated report"),
+                user=s.user,
+                status=s,
+            )
+            for s in statuses
+        ]
+    )

bookwyrm/models/report.py

@@ -12,7 +12,12 @@ class Report(BookWyrmModel):
     )
     note = models.TextField(null=True, blank=True)
     user = models.ForeignKey("User", on_delete=models.PROTECT)
-    statuses = models.ManyToManyField("Status", blank=True)
+    status = models.ForeignKey(
+        "Status",
+        null=True,
+        blank=True,
+        on_delete=models.PROTECT,
+    )
     links = models.ManyToManyField("Link", blank=True)
     resolved = models.BooleanField(default=False)
 

bookwyrm/settings.py

@@ -6,10 +6,12 @@ import requests
 from django.utils.translation import gettext_lazy as _
 
 
+# pylint: disable=line-too-long
+
 env = Env()
 env.read_env()
 DOMAIN = env("DOMAIN")
-VERSION = "0.3.0"
+VERSION = "0.3.1"
 
 RELEASE_API = env(
     "RELEASE_API",
@@ -19,7 +21,7 @@ RELEASE_API = env(
 PAGE_LENGTH = env("PAGE_LENGTH", 15)
 DEFAULT_LANGUAGE = env("DEFAULT_LANGUAGE", "English")
 
-JS_CACHE = "7b5303af"
+JS_CACHE = "a60e5a55"
 
 # email
 EMAIL_BACKEND = env("EMAIL_BACKEND", "django.core.mail.backends.smtp.EmailBackend")
@@ -55,7 +57,6 @@ PREVIEW_DEFAULT_COVER_COLOR = env.str("PREVIEW_DEFAULT_COVER_COLOR", "#002549")
 PREVIEW_DEFAULT_FONT = env.str("PREVIEW_DEFAULT_FONT", "Source Han Sans")
 
 FONTS = {
-    # pylint: disable=line-too-long
     "Source Han Sans": {
         "directory": "source_han_sans",
         "filename": "SourceHanSans-VF.ttf.ttc",
@@ -86,7 +87,7 @@ INSTALLED_APPS = [
     "django.contrib.messages",
     "django.contrib.staticfiles",
     "django.contrib.humanize",
-    "django_rename_app",
+    "sass_processor",
     "bookwyrm",
     "celery",
     "imagekit",
@@ -180,6 +181,21 @@ LOGGING = {
     },
 }
 
+STATICFILES_FINDERS = [
+    "django.contrib.staticfiles.finders.FileSystemFinder",
+    "django.contrib.staticfiles.finders.AppDirectoriesFinder",
+    "sass_processor.finders.CssFinder",
+]
+
+SASS_PROCESSOR_INCLUDE_FILE_PATTERN = r"^.+\.[s]{0,1}(?:a|c)ss$"
+
+SASS_PROCESSOR_INCLUDE_DIRS = [
+    os.path.join(BASE_DIR, ".css-config-sample"),
+]
+
+# minify css is production but not dev
+if not DEBUG:
+    SASS_OUTPUT_STYLE = "compressed"
 
 WSGI_APPLICATION = "bookwyrm.wsgi.application"
 
@@ -210,7 +226,6 @@ if env("USE_DUMMY_CACHE", False):
         }
     }
 else:
-    # pylint: disable=line-too-long
     CACHES = {
         "default": {
             "BACKEND": "django_redis.cache.RedisCache",
@@ -245,7 +260,6 @@ AUTH_USER_MODEL = "bookwyrm.User"
 # Password validation
 # https://docs.djangoproject.com/en/3.2/ref/settings/#auth-password-validators
 
-# pylint: disable=line-too-long
 AUTH_PASSWORD_VALIDATORS = [
     {
         "NAME": "django.contrib.auth.password_validation.UserAttributeSimilarityValidator",

bookwyrm/static/css/bookwyrm.scss

@@ -0,0 +1,7 @@
+@charset "utf-8";
+
+@import "instance-settings";
+@import "themes/light.scss";
+@import "vendor/bulma/bulma.sass";
+@import "vendor/icons.css";
+@import "bookwyrm/all.scss";

bookwyrm/static/css/bookwyrm/_all.scss

@@ -0,0 +1,159 @@
+/** Imports
+ ******************************************************************************/
+@import "components/avatar";
+@import "components/book_cover";
+@import "components/book_grid";
+@import "components/book_list";
+@import "components/book_preview_table";
+@import "components/breadcrumbs";
+@import "components/copy";
+@import "components/details";
+@import "components/file_input";
+@import "components/live_message";
+@import "components/shelving";
+@import "components/stars";
+@import "components/status";
+@import "components/tabs";
+@import "components/toggle";
+
+@import "overrides/bulma_overrides";
+
+@import "utilities/a11y";
+@import "utilities/alignments";
+@import "utilities/colors";
+@import "utilities/size";
+@import "utilities/spacings";
+@import "utilities/transitions";
+
+html {
+    scroll-behavior: smooth;
+}
+
+body {
+    min-height: 100vh;
+    display: flex;
+    flex-direction: column;
+}
+
+button {
+    border: none;
+    margin: 0;
+    padding: 0;
+    width: auto;
+    overflow: visible;
+    background: transparent;
+
+    /* inherit font, color & alignment from ancestor */
+    color: inherit;
+    font: inherit;
+    text-align: inherit;
+
+    /* Normalize `line-height`. Cannot be changed from `normal` in Firefox 4+. */
+    line-height: normal;
+
+    /* Corrects font smoothing for webkit */
+    -webkit-font-smoothing: inherit;
+    -moz-osx-font-smoothing: inherit;
+
+    /* Corrects inability to style clickable `input` types in iOS */
+    -webkit-appearance: none;
+
+    /* Generalizes pointer cursor */
+    cursor: pointer;
+}
+
+button::-moz-focus-inner {
+    /* Remove excess padding and border in Firefox 4+ */
+    border: 0;
+    padding: 0;
+}
+
+/* Better accessibility for keyboard users */
+*:focus-visible {
+    outline-style: auto !important;
+}
+
+/** Utilities not covered by Bulma
+ ******************************************************************************/
+
+
+.tag.is-small {
+    height: auto;
+}
+
+.button.is-transparent {
+    background-color: transparent;
+}
+
+.card.is-stretchable {
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+}
+
+.card.is-stretchable .card-content {
+    flex-grow: 1;
+}
+
+.preserve-whitespace p {
+    white-space: pre-wrap !important;
+}
+
+.display-inline p {
+    display: inline !important;
+}
+
+button .button-invisible-overlay {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    padding: 1rem;
+    box-sizing: border-box;
+    display: flex;
+    align-items: center;
+    flex-direction: column;
+    justify-content: center;
+    background: rgba($scheme-invert, 0.66);
+    color: white;
+    opacity: 0;
+    transition: opacity 0.2s ease;
+}
+
+button:hover .button-invisible-overlay,
+button:active .button-invisible-overlay,
+button:focus-visible .button-invisible-overlay {
+    opacity: 1;
+}
+
+
+
+/** Tooltips
+ ******************************************************************************/
+
+.tooltip {
+    width: 100%;
+}
+
+/** States
+ ******************************************************************************/
+
+/* "disabled" for non-buttons */
+
+.is-disabled {
+    background-color: $pagination-disabled-background-color;
+    border-color: $pagination-disabled-border-color;
+    box-shadow: none;
+    color: $pagination-disabled-color;
+    opacity: 0.5;
+    cursor: not-allowed;
+}
+
+
+/* Notifications page
+ ******************************************************************************/
+
+.notification a.icon {
+    text-decoration: none !important;
+}

bookwyrm/static/css/bookwyrm/components/_avatar.css

@@ -0,0 +1,7 @@
+/** Avatars
+ ******************************************************************************/
+
+.avatar {
+    vertical-align: middle;
+    display: inline;
+}

bookwyrm/static/css/bookwyrm/components/_book_cover.scss

@@ -0,0 +1,70 @@
+/** Book covers
+ *
+ * - .is-cover gives the behaviour of the cover and its surrounding. (optional)
+ * - .cover-container gives the dimensions and position (for borders, image and other elements).
+ * - .book-cover is positioned and sized based on its container.
+ *
+ * To have the cover within specific dimensions, specify a width or height for
+ * standard bulma’s named breapoints:
+ *
+ * `is-(w|h)-(auto|xs|s|m|l|xl|xxl)[-(mobile|tablet|desktop)]`
+ *
+ * The cover will be centered horizontally and vertically within those dimensions.
+ *
+ * When using `.column.is-N`, add `.is-w-auto` to the container so that the flex
+ * calculations are not biased by the default `max-content`.
+ ******************************************************************************/
+
+.column.is-cover {
+    flex-grow: 0 !important;
+}
+
+.column.is-cover,
+.column.is-cover + .column {
+    flex-basis: auto !important;
+}
+
+.cover-container {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    position: relative;
+    width: max-content;
+    max-width: 100%;
+    overflow: hidden;
+}
+
+/* Book cover
+ * -------------------------------------------------------------------------- */
+
+.book-cover {
+    display: block;
+    max-width: 100%;
+    max-height: 100%;
+
+    /* Useful when stretching under-sized images. */
+    image-rendering: optimizequality;
+    image-rendering: smooth;
+}
+
+/* Cover caption
+ * -------------------------------------------------------------------------- */
+
+.no-cover .cover-caption {
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    padding: 0.5em;
+    font-size: 0.75em;
+    color: white;
+    background-color: $no-cover-color;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-direction: column;
+    gap: 1em;
+    white-space: initial;
+    text-align: center;
+}

bookwyrm/static/css/bookwyrm/components/_book_grid.scss

@@ -0,0 +1,36 @@
+/* Books grid
+ ******************************************************************************/
+
+.books-grid {
+    display: grid;
+    grid-template-columns: repeat(2, 1fr);
+    gap: 1rem;
+    align-items: end;
+    justify-items: stretch;
+}
+
+.books-grid > .is-big {
+    grid-column: span 2;
+    grid-row: span 2;
+    justify-self: stretch;
+}
+
+.books-grid .book-cover {
+    width: 100%;
+}
+
+.books-grid .book-title {
+    --height-basis: 1.35rem;
+
+    display: block;
+    margin-top: 0.5rem;
+    line-height: var(--height-basis);
+    min-height: calc(2 * var(--height-basis));
+}
+
+@media only screen and (min-width: 769px) {
+    .books-grid {
+        gap: 1.5rem;
+        grid-template-columns: repeat(auto-fill, minmax(8em, 1fr));
+    }
+}

bookwyrm/static/css/bookwyrm/components/_book_list.scss

@@ -0,0 +1,47 @@
+/* Book list
+ ******************************************************************************/
+
+ol.ordered-list {
+    list-style: none;
+    counter-reset: list-counter;
+}
+
+ol.ordered-list li {
+    counter-increment: list-counter;
+}
+
+ol.ordered-list li::before {
+    content: counter(list-counter);
+    position: absolute;
+    left: -20px;
+    width: 20px;
+    height: 24px;
+    background-color: $scheme-main;
+    border: 1px solid $border;
+    border-right: 0;
+    border-top-left-radius: 2px;
+    border-top-right-radius: 2px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    color: $text-light;
+    font-size: 0.8em;
+    font-weight: bold;
+}
+
+@media only screen and (max-width: 768px) {
+    ol.ordered-list li::before {
+        left: 0;
+        z-index: 1;
+        border: 0;
+        border-right: 1px solid $border;
+        border-bottom: 1px solid $border;
+        border-radius: 0;
+        border-bottom-right-radius: 2px;
+    }
+}
+
+.overflow-wrap-anywhere {
+    overflow-wrap: anywhere;
+    min-width: 10em;
+}

bookwyrm/static/css/bookwyrm/components/_book_preview_table.scss

@@ -0,0 +1,49 @@
+/* Book preview table
+ ******************************************************************************/
+
+.book-preview td {
+    vertical-align: middle;
+}
+
+@media only screen and (max-width: 768px) {
+    table.is-mobile,
+    table.is-mobile tbody {
+        display: block;
+    }
+
+    table.is-mobile tr {
+        display: flex;
+        flex-wrap: wrap;
+        justify-content: space-between;
+        border-top: 1px solid $border;
+    }
+
+    table.is-mobile td {
+        display: block;
+        box-sizing: border-box;
+        flex: 1 0 100%;
+        order: 2;
+        border-bottom: 0;
+    }
+
+    table.is-mobile td.book-preview-top-row {
+        order: 1;
+        flex-basis: auto;
+    }
+
+    table.is-mobile td[data-title]:not(:empty)::before {
+        content: attr(data-title);
+        display: block;
+        font-size: 0.75em;
+        font-weight: bold;
+    }
+
+    table.is-mobile td:empty {
+        padding: 0;
+    }
+
+    table.is-mobile th,
+    table.is-mobile thead {
+        display: none;
+    }
+}

bookwyrm/static/css/bookwyrm/components/_breadcrumbs.scss

@@ -0,0 +1,13 @@
+/* Breadcrumbs
+ ******************************************************************************/
+
+.breadcrumb li:first-child * {
+    padding-left: 0;
+}
+
+.breadcrumb li > * {
+    align-items: center;
+    display: flex;
+    justify-content: center;
+    padding: 0 0.75em;
+}

bookwyrm/static/css/bookwyrm/components/_copy.scss

@@ -0,0 +1,30 @@
+/* Copy
+ ******************************************************************************/
+
+.horizontal-copy {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    gap: 0.75rem;
+}
+
+.horizontal-copy textarea {
+    min-width: initial;
+    white-space: nowrap;
+}
+
+.horizontal-copy button {
+    align-self: stretch;
+    height: unset;
+}
+
+.vertical-copy {
+    display: flex;
+    flex-direction: column;
+    align-items: stretch;
+    gap: 0.75rem;
+}
+
+.vertical-copy button {
+    width: 100%;
+}

bookwyrm/static/css/bookwyrm/components/_details.scss

@@ -0,0 +1,116 @@
+/** General `details` element styles
+ ******************************************************************************/
+
+details summary {
+    cursor: pointer;
+}
+
+summary::-webkit-details-marker {
+    display: none;
+}
+
+details summary::marker {
+    content: none;
+}
+
+details.detail-pinned-button summary {
+    position: absolute;
+    right: 0;
+}
+
+details.detail-pinned-button form {
+    float: left;
+    width: 100%;
+    margin-top: 1em;
+}
+
+/** Dropdown w/ Details element
+ ******************************************************************************/
+
+details.dropdown[open] summary.dropdown-trigger::before {
+    content: "";
+    position: fixed;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+}
+
+details.dropdown .dropdown-menu {
+    display: block !important;
+}
+
+details.dropdown .dropdown-menu button {
+    /* Fix weird Safari defaults */
+    box-sizing: border-box;
+}
+
+details.dropdown .dropdown-menu button:focus-visible,
+details.dropdown .dropdown-menu a:focus-visible {
+    outline-style: auto;
+    outline-offset: -2px;
+}
+
+@media only screen and (max-width: 768px) {
+    details.dropdown[open] summary.dropdown-trigger::before {
+        background-color: rgba($scheme-invert, 0.5);
+        z-index: 30;
+    }
+
+    details .dropdown-menu {
+        position: fixed;
+        top: 0;
+        left: 0;
+        width: 100%;
+        height: 100%;
+        display: flex !important;
+        align-items: center;
+        justify-content: center;
+        pointer-events: none;
+        z-index: 100;
+    }
+
+    details .dropdown-menu > * {
+        pointer-events: all;
+    }
+}
+
+/** Details panel
+ ******************************************************************************/
+
+details.details-panel {
+    box-shadow: 0 0 0 1px $border;
+    transition: box-shadow 0.2s ease;
+    padding: 0.75rem;
+}
+
+details[open].details-panel,
+details.details-panel:hover {
+    box-shadow: 0 0 0 1px $border;
+}
+
+details.details-panel summary {
+    position: relative;
+}
+
+details summary .details-close {
+    position: absolute;
+    right: 0;
+    top: 0;
+    transform: rotate(45deg);
+    transition: transform 0.2s ease;
+}
+
+details[open] summary .details-close {
+    transform: rotate(0deg);
+}
+
+@media only screen and (min-width: 769px) {
+    .details-panel .filters-field:not(:last-child) {
+        border-right: 1px solid $border;
+        margin-top: 0.75rem;
+        margin-bottom: 0.75rem;
+        padding-top: 0.25rem;
+        padding-bottom: 0.25rem;
+    }
+}

bookwyrm/static/css/bookwyrm/components/_file_input.scss

@@ -0,0 +1,28 @@
+/** File input styles
+ ******************************************************************************/
+
+input[type="file"]::file-selector-button {
+    -moz-appearance: none;
+    -webkit-appearance: none;
+    background-color: $scheme-main;
+    border-radius: 4px;
+    border: 1px solid $border;
+    box-shadow: none;
+    color: $text;
+    cursor: pointer;
+    font-size: 1rem;
+    height: 2.5em;
+    justify-content: center;
+    line-height: 1.5;
+    padding-bottom: calc(0.5em - 1px);
+    padding-left: 1em;
+    padding-right: 1em;
+    padding-top: calc(0.5em - 1px);
+    text-align: center;
+    white-space: nowrap;
+}
+
+input[type="file"]::file-selector-button:hover {
+    border-color: $border-hover;
+    color: text;
+}

bookwyrm/static/css/bookwyrm/components/_live_message.scss

@@ -0,0 +1,8 @@
+/** Transient notification
+ ******************************************************************************/
+
+#live-messages {
+    position: fixed;
+    bottom: 1em;
+    right: 1em;
+}

bookwyrm/static/css/bookwyrm/components/_shelving.scss

@@ -0,0 +1,10 @@
+/** Shelving
+ ******************************************************************************/
+
+/** @todo Replace icons with SVG symbols.
+    @see https://www.youtube.com/watch?v=9xXBYcWgCHA */
+.shelf-option:disabled > *::after {
+    font-family: icomoon; /* stylelint-disable font-family-no-missing-generic-family-keyword */
+    content: "\e919"; /* icon-check */
+    margin-left: 0.5em;
+}

bookwyrm/static/css/bookwyrm/components/_stars.scss

@@ -0,0 +1,52 @@
+/** Stars
+ ******************************************************************************/
+
+.stars {
+    white-space: nowrap;
+}
+
+/** Stars in a review form
+ *
+ * Specificity makes hovering taking over checked inputs.
+ *
+ * \e9d9: filled star
+ * \e9d7: empty star;
+ * -------------------------------------------------------------------------- */
+
+.form-rate-stars {
+    width: max-content;
+}
+
+/* All stars are visually filled by default. */
+.form-rate-stars .icon::before {
+    content: "\e9d9"; /* icon-star-full */
+}
+
+/* Icons directly following half star inputs are marked as half */
+.form-rate-stars input.half:checked ~ .icon::before {
+    content: "\e9d8"; /* icon-star-half */
+}
+
+/* stylelint-disable no-descending-specificity */
+.form-rate-stars input.half:checked + input + .icon:hover::before {
+    content: "\e9d8" !important; /* icon-star-half */
+}
+
+/* Icons directly following half check inputs that follow the checked input are emptied. */
+.form-rate-stars input.half:checked + input + .icon ~ .icon::before {
+    content: "\e9d7"; /* icon-star-empty */
+}
+
+/* Icons directly following inputs that follow the checked input are emptied. */
+.form-rate-stars input:checked ~ input + .icon::before {
+    content: "\e9d7"; /* icon-star-empty */
+}
+
+/* When a label is hovered, repeat the fill-all-then-empty-following pattern. */
+.form-rate-stars:hover .icon.icon::before {
+    content: "\e9d9" !important; /* icon-star-full */
+}
+
+.form-rate-stars .icon:hover ~ .icon::before {
+    content: "\e9d7" !important; /* icon-star-empty */
+}

bookwyrm/static/css/bookwyrm/components/_status.scss

@@ -0,0 +1,57 @@
+/** Statuses: Quotes
+ *
+ * \e906: icon-quote-open
+ * \e905: icon-quote-close
+ *
+ * The `content` class on the blockquote allows to apply styles to markdown
+ * generated HTML in the quote: https://bulma.io/documentation/elements/content/
+ *
+ * ```html
+ * <div class="quote block">
+ *     <blockquote dir="auto" class="content mb-2">
+ *         User generated quote in markdown…
+ *     </blockquote>
+ *
+ *     <p> — <a…>Book Title</a> by <a…class="author">Author</a></p>
+ * </div>
+ * ```
+ ******************************************************************************/
+
+.quote > blockquote {
+    position: relative;
+    padding-left: 2em;
+}
+
+.quote > blockquote::before,
+.quote > blockquote::after {
+    font-family: icomoon; /* stylelint-disable font-family-no-missing-generic-family-keyword */
+    position: absolute;
+}
+
+.quote > blockquote::before {
+    content: "\e907"; /* icon-quote-open */
+    top: 0;
+    left: 0;
+}
+
+.quote > blockquote::after {
+    content: "\e906"; /* icon-quote-close */
+    right: 0;
+}
+
+/* Threads
+ ******************************************************************************/
+
+.thread .is-main .card {
+    box-shadow: 0 0.5em 1em -0.125em rgba($link, 0.35), 0 0 0 1px rgba($link, 0.02);
+}
+
+.thread::after {
+    content: "";
+    position: absolute;
+    z-index: -1;
+    top: 0;
+    bottom: 0;
+    left: 2.5em;
+    border-left: 2px solid $border;
+}

bookwyrm/static/css/bookwyrm/components/_tabs.scss

@@ -0,0 +1,176 @@
+/** Bookwyrm Tabs
+ ******************************************************************************/
+
+.bw-tabs {
+    -webkit-overflow-scrolling: touch;
+    -webkit-touch-callout: none;
+    position: relative;
+    align-items: center;
+    display: flex;
+    font-size: 1rem;
+    justify-content: flex-start;
+    overflow-x: auto;
+    overflow-y: hidden;
+    user-select: none;
+    white-space: nowrap;
+}
+
+.bw-tabs::before {
+    border-bottom-color: $border;
+    border-bottom-style: solid;
+    border-bottom-width: 1px;
+    bottom: 0;
+    content: "";
+    position: absolute;
+    width: 100%;
+}
+
+.bw-tabs:not(:last-child) {
+    margin-bottom: 1.5rem;
+}
+
+.bw-tabs a {
+    align-items: center;
+    border-bottom-color: $border;
+    border-bottom-style: solid;
+    border-bottom-width: 1px;
+    color: $text;
+    display: flex;
+    justify-content: center;
+    margin-bottom: -1px;
+    padding: 0.5em 1em;
+    position: relative;
+}
+
+.bw-tabs a:hover {
+    border-bottom-color: transparent;
+    color: $text;
+}
+
+.bw-tabs a.is-active {
+    border-bottom-color: transparent;
+    color: $link;
+}
+
+.bw-tabs.is-left {
+    padding-right: 0.75em;
+}
+
+.bw-tabs.is-center {
+    flex: none;
+    justify-content: center;
+    padding-left: 0.75em;
+    padding-right: 0.75em;
+}
+
+.bw-tabs.is-right {
+    justify-content: flex-end;
+    padding-left: 0.75em;
+}
+
+.bw-tabs .icon:first-child {
+    margin-right: 0.5em;
+}
+
+.bw-tabs .icon:last-child {
+    margin-left: 0.5em;
+}
+
+.bw-tabs.is-centered {
+    justify-content: center;
+}
+
+.bw-tabs.is-boxed a {
+    border: 1px solid transparent;
+    border-radius: 4px 4px 0 0;
+}
+
+.bw-tabs.is-boxed a:hover {
+    background-color: $background-secondary;
+    border-bottom-color: $border-hover;
+}
+
+.bw-tabs.is-boxed a.is-active {
+    background-color: $background-body;
+    border-color: $border;
+    border-bottom-color: $border !important;
+}
+
+.bw-tabs.is-fullwidth a {
+    flex-grow: 1;
+    flex-shrink: 0;
+}
+
+.bw-tabs.is-toggle a {
+    border-color: $border;
+    border-style: solid;
+    border-width: 1px;
+    margin-bottom: 0;
+    position: relative;
+}
+
+.bw-tabs.is-toggle a:hover {
+    background-color: $background-secondary;
+    border-color: $border;
+    z-index: 2;
+}
+
+.bw-tabs.is-toggle a + a {
+    margin-left: -1px;
+}
+
+.bw-tabs.is-toggle a:first-child {
+    border-top-left-radius: 4px;
+    border-bottom-left-radius: 4px;
+}
+
+.bw-tabs.is-toggle a:last-child {
+    border-top-right-radius: 4px;
+    border-bottom-right-radius: 4px;
+}
+
+.bw-tabs.is-toggle a.is-active {
+    background-color: $link-background;
+    border-color: $link;
+    color: $text;
+    z-index: 1;
+}
+
+.bw-tabs.is-toggle {
+    border-bottom: none;
+}
+
+.bw-tabs.is-toggle.is-toggle-rounded a:first-child {
+    border-bottom-left-radius: 290486px;
+    border-top-left-radius: 290486px;
+    padding-left: 1.25em;
+}
+
+.bw-tabs.is-toggle.is-toggle-rounded a:last-child {
+    border-bottom-right-radius: 290486px;
+    border-top-right-radius: 290486px;
+    padding-right: 1.25em;
+}
+
+.bw-tabs.is-small {
+    font-size: 0.75rem;
+}
+
+.bw-tabs.is-medium {
+    font-size: 1.25rem;
+}
+
+.bw-tabs.is-large {
+    font-size: 1.5rem;
+}
+
+.bw-tabs.has-aside-text a {
+    margin-top: 1.5rem;
+}
+
+.bw-tabs a .aside-text {
+    position: absolute;
+    top: calc(-0.75rem - 0.75rem);
+    left: 0;
+    color: $text;
+}

bookwyrm/static/css/bookwyrm/components/_toggle.scss

@@ -0,0 +1,45 @@
+/** Toggles
+ ******************************************************************************/
+
+.toggle-button[aria-pressed="true"],
+.toggle-button[aria-pressed="true"]:hover {
+    background-color: hsl(171deg, 100%, 41%);
+    color: white;
+}
+
+.hide-active[aria-pressed="true"],
+.hide-inactive[aria-pressed="false"] {
+    display: none;
+}
+
+.transition-x.is-hidden,
+.transition-y.is-hidden {
+    display: block !important;
+    visibility: hidden !important;
+    height: 0 !important;
+    width: 0 !important;
+    margin: 0 !important;
+    padding: 0 !important;
+    overflow: auto;
+}
+
+.transition-x,
+.transition-y {
+    transition-duration: 0.5s;
+    transition-timing-function: ease;
+}
+
+.transition-x {
+    transition-property: width, margin-left, margin-right, padding-left, padding-right;
+}
+
+.transition-y {
+    transition-property: height, margin-top, margin-bottom, padding-top, padding-bottom;
+}
+
+@media (prefers-reduced-motion: reduce) {
+    .transition-x,
+    .transition-y {
+        transition-duration: 0.001ms !important;
+    }
+}

bookwyrm/static/css/bookwyrm/overrides/_bulma_overrides.scss

@@ -0,0 +1,61 @@
+.image {
+    overflow: hidden;
+}
+
+.navbar .logo {
+    max-height: 50px;
+}
+
+.card {
+    overflow: visible;
+}
+
+.card.has-border {
+    border: 1px solid $border;
+}
+
+.scroll-x {
+    overflow: hidden;
+    overflow-x: auto;
+}
+
+.modal-card {
+    pointer-events: none;
+}
+
+.modal-card > * {
+    pointer-events: all;
+}
+
+/* stylelint-disable no-descending-specificity */
+.modal-card:focus {
+    outline-style: auto;
+}
+
+.modal-card:focus:not(:focus-visible) {
+    outline-style: initial;
+}
+
+.modal-card:focus-visible {
+    outline-style: auto;
+}
+/* stylelint-enable no-descending-specificity */
+
+.modal-card.is-fullwidth {
+    min-width: 75% !important;
+}
+
+@media only screen and (min-width: 769px) {
+    .modal-card.is-thin {
+        width: 350px !important;
+    }
+}
+
+.modal-card-body {
+    max-height: 70vh;
+}
+
+.clip-text {
+    max-height: 35em;
+    overflow: hidden;
+}

bookwyrm/static/css/bookwyrm/utilities/_a11y.scss

@@ -0,0 +1,33 @@
+@media only screen and (max-width: 768px) {
+    .is-sr-only-mobile {
+        border: none !important;
+        clip: rect(0, 0, 0, 0) !important;
+        height: 0.01em !important;
+        overflow: hidden !important;
+        padding: 0 !important;
+        position: absolute !important;
+        white-space: nowrap !important;
+        width: 0.01em !important;
+    }
+
+    .m-0-mobile {
+        margin: 0 !important;
+    }
+
+    .card-footer.is-stacked-mobile {
+        flex-direction: column;
+    }
+
+    .card-footer.is-stacked-mobile .card-footer-item:not(:last-child) {
+        border-bottom: 1px solid $background-tertiary;
+        border-right: 0;
+    }
+
+    .is-flex-direction-row-mobile {
+        flex-direction: row !important;
+    }
+
+    .is-flex-direction-column-mobile {
+        flex-direction: column !important;
+    }
+}

bookwyrm/static/css/bookwyrm/utilities/_alignments.scss

@@ -0,0 +1,76 @@
+/* Alignments
+ *
+ * Use them with `.align.to-(c|t|r|b|l)[-(mobile|tablet)]`
+ ******************************************************************************/
+
+/* Flex item position
+ * -------------------------------------------------------------------------- */
+
+.align {
+    display: flex !important;
+    flex-direction: row !important;
+}
+
+.align.to-c {
+    justify-content: center !important;
+}
+
+.align.to-t {
+    align-items: flex-start !important;
+}
+
+.align.to-r {
+    justify-content: flex-end !important;
+}
+
+.align.to-b {
+    align-items: flex-end !important;
+}
+
+.align.to-l {
+    justify-content: flex-start !important;
+}
+
+@media screen and (max-width: 768px) {
+    .align.to-c-mobile {
+        justify-content: center !important;
+    }
+
+    .align.to-t-mobile {
+        align-items: flex-start !important;
+    }
+
+    .align.to-r-mobile {
+        justify-content: flex-end !important;
+    }
+
+    .align.to-b-mobile {
+        align-items: flex-end !important;
+    }
+
+    .align.to-l-mobile {
+        justify-content: flex-start !important;
+    }
+}
+
+@media screen and (min-width: 769px) {
+    .align.to-c-tablet {
+        justify-content: center !important;
+    }
+
+    .align.to-t-tablet {
+        align-items: flex-start !important;
+    }
+
+    .align.to-r-tablet {
+        justify-content: flex-end !important;
+    }
+
+    .align.to-b-tablet {
+        align-items: flex-end !important;
+    }
+
+    .align.to-l-tablet {
+        justify-content: flex-start !important;
+    }
+}

bookwyrm/static/css/bookwyrm/utilities/_colors.scss

@@ -0,0 +1,25 @@
+/* Semantic color classes */
+
+.has-background-primary-highlight {
+    background-color: $primary-highlight;
+}
+
+.has-background-info-highlight {
+    background-color: $info-highlight;
+}
+
+.has-background-success-highlight {
+    background-color: $success-highlight;
+}
+
+.has-background-body {
+    background-color: $background-body;
+}
+
+.has-background-secondary {
+    background-color: $background-secondary !important;
+}
+
+.has-background-tertiary {
+    background-color: $background-tertiary !important;
+}

bookwyrm/static/css/bookwyrm/utilities/_size.scss

@@ -0,0 +1,227 @@
+/* Dimensions
+ * @todo These could be in rem.
+ ******************************************************************************/
+
+.is-32x32 {
+    min-width: 32px !important;
+    min-height: 32px !important;
+}
+
+.is-96x96 {
+    min-width: 96px !important;
+    min-height: 96px !important;
+}
+
+.is-w-auto {
+    width: auto !important;
+}
+
+.is-w-xs {
+    width: 80px !important;
+}
+
+.is-w-s {
+    width: 100px !important;
+}
+
+.is-w-m {
+    width: 150px !important;
+}
+
+.is-w-l {
+    width: 200px !important;
+}
+
+.is-w-xl {
+    width: 250px !important;
+}
+
+.is-w-xxl {
+    width: 500px !important;
+}
+
+.is-h-xs {
+    height: 80px !important;
+}
+
+.is-h-s {
+    height: 100px !important;
+}
+
+.is-h-m {
+    height: 150px !important;
+}
+
+.is-h-l {
+    height: 200px !important;
+}
+
+.is-h-xl {
+    height: 250px !important;
+}
+
+.is-h-xxl {
+    height: 500px !important;
+}
+
+@media only screen and (max-width: 768px) {
+    .is-w-auto-mobile {
+        width: auto !important;
+    }
+
+    .is-w-xs-mobile {
+        width: 80px !important;
+    }
+
+    .is-w-s-mobile {
+        width: 100px !important;
+    }
+
+    .is-w-m-mobile {
+        width: 150px !important;
+    }
+
+    .is-w-l-mobile {
+        width: 200px !important;
+    }
+
+    .is-w-xl-mobile {
+        width: 250px !important;
+    }
+
+    .is-w-xxl-mobile {
+        width: 500px !important;
+    }
+
+    .is-h-xs-mobile {
+        height: 80px !important;
+    }
+
+    .is-h-s-mobile {
+        height: 100px !important;
+    }
+
+    .is-h-m-mobile {
+        height: 150px !important;
+    }
+
+    .is-h-l-mobile {
+        height: 200px !important;
+    }
+
+    .is-h-xl-mobile {
+        height: 250px !important;
+    }
+
+    .is-h-xxl-mobile {
+        height: 500px !important;
+    }
+}
+
+@media only screen and (min-width: 769px) {
+    .is-w-auto-tablet {
+        width: auto !important;
+    }
+
+    .is-w-xs-tablet {
+        width: 80px !important;
+    }
+
+    .is-w-s-tablet {
+        width: 100px !important;
+    }
+
+    .is-w-m-tablet {
+        width: 150px !important;
+    }
+
+    .is-w-l-tablet {
+        width: 200px !important;
+    }
+
+    .is-w-xl-tablet {
+        width: 250px !important;
+    }
+
+    .is-w-xxl-tablet {
+        width: 500px !important;
+    }
+
+    .is-h-xs-tablet {
+        height: 80px !important;
+    }
+
+    .is-h-s-tablet {
+        height: 100px !important;
+    }
+
+    .is-h-m-tablet {
+        height: 150px !important;
+    }
+
+    .is-h-l-tablet {
+        height: 200px !important;
+    }
+
+    .is-h-xl-tablet {
+        height: 250px !important;
+    }
+
+    .is-h-xxl-tablet {
+        height: 500px !important;
+    }
+}
+
+@media only screen and (min-width: 1024px) {
+    .is-w-auto-desktop {
+        width: auto !important;
+    }
+
+    .is-w-xs-desktop {
+        width: 80px !important;
+    }
+
+    .is-w-s-desktop {
+        width: 100px !important;
+    }
+
+    .is-w-m-desktop {
+        width: 150px !important;
+    }
+
+    .is-w-l-desktop {
+        width: 200px !important;
+    }
+
+    .is-w-xl-desktop {
+        width: 250px !important;
+    }
+
+    .is-w-xxl-desktop {
+        width: 500px !important;
+    }
+
+    .is-h-xs-desktop {
+        height: 80px !important;
+    }
+
+    .is-h-s-desktop {
+        height: 100px !important;
+    }
+
+    .is-h-m-desktop {
+        height: 150px !important;
+    }
+
+    .is-h-l-desktop {
+        height: 200px !important;
+    }
+
+    .is-h-xl-desktop {
+        height: 250px !important;
+    }
+
+    .is-h-xxl-desktop {
+        height: 500px !important;
+    }
+}

bookwyrm/static/css/bookwyrm/utilities/_spacings.scss

@@ -0,0 +1,167 @@
+/* Spacings
+ *
+ * Those are supplementary rules to Bulma’s. They follow the same conventions.
+ * Add those you’ll need.
+ ******************************************************************************/
+
+.mr-auto {
+    margin-right: auto !important;
+}
+
+.ml-auto {
+    margin-left: auto !important;
+}
+
+@media screen and (max-width: 768px) {
+    .m-0-mobile {
+        margin: 0 !important;
+    }
+
+    .mr-auto-mobile {
+        margin-right: auto !important;
+    }
+
+    .ml-auto-mobile {
+        margin-left: auto !important;
+    }
+
+    .mt-3-mobile {
+        margin-top: 0.75rem !important;
+    }
+
+    .ml-3-mobile {
+        margin-left: 0.75rem !important;
+    }
+
+    .mx-3-mobile {
+        margin-right: 0.75rem !important;
+        margin-left: 0.75rem !important;
+    }
+
+    .my-3-mobile {
+        margin-top: 0.75rem !important;
+        margin-bottom: 0.75rem !important;
+    }
+}
+
+@media screen and (min-width: 769px) {
+    .m-0-tablet {
+        margin: 0 !important;
+    }
+
+    .mr-auto-tablet {
+        margin-right: auto !important;
+    }
+
+    .ml-auto-tablet {
+        margin-left: auto !important;
+    }
+
+    .mt-3-tablet {
+        margin-top: 0.75rem !important;
+    }
+
+    .ml-3-tablet {
+        margin-left: 0.75rem !important;
+    }
+
+    .mx-3-tablet {
+        margin-right: 0.75rem !important;
+        margin-left: 0.75rem !important;
+    }
+
+    .my-3-tablet {
+        margin-top: 0.75rem !important;
+        margin-bottom: 0.75rem !important;
+    }
+}
+
+/* Gaps (for Flexbox and Grid)
+ *
+ * Those are supplementary rules to Bulma’s. They follow the same conventions.
+ * Add those you’ll need.
+ ******************************************************************************/
+
+.is-gap-0 {
+    gap: 0;
+}
+
+.is-gap-1 {
+    gap: 0.25rem;
+}
+
+.is-gap-2 {
+    gap: 0.5rem;
+}
+
+.is-gap-3 {
+    gap: 0.75rem;
+}
+
+.is-gap-4 {
+    gap: 1rem;
+}
+
+.is-gap-5 {
+    gap: 1.5rem;
+}
+
+.is-gap-6 {
+    gap: 3rem;
+}
+
+.is-row-gap-0 {
+    row-gap: 0;
+}
+
+.is-row-gap-1 {
+    row-gap: 0.25rem;
+}
+
+.is-row-gap-2 {
+    row-gap: 0.5rem;
+}
+
+.is-row-gap-3 {
+    row-gap: 0.75rem;
+}
+
+.is-row-gap-4 {
+    row-gap: 1rem;
+}
+
+.is-row-gap-5 {
+    row-gap: 1.5rem;
+}
+
+.is-row-gap-6 {
+    row-gap: 3rem;
+}
+
+.is-column-gap-0 {
+    column-gap: 0;
+}
+
+.is-column-gap-1 {
+    column-gap: 0.25rem;
+}
+
+.is-column-gap-2 {
+    column-gap: 0.5rem;
+}
+
+.is-column-gap-3 {
+    column-gap: 0.75rem;
+}
+
+.is-column-gap-4 {
+    column-gap: 1rem;
+}
+
+.is-column-gap-5 {
+    column-gap: 1.5rem;
+}
+
+.is-column-gap-6 {
+    column-gap: 3rem;
+}

bookwyrm/static/css/bookwyrm/utilities/_transitions.scss

@@ -0,0 +1,25 @@
+/** Animations and transitions
+ ******************************************************************************/
+
+@keyframes turning {
+    from { transform: rotateZ(0deg); }
+    to { transform: rotateZ(360deg); }
+}
+
+.is-processing .icon-spinner::before {
+    animation: turning 1.5s infinite linear;
+}
+
+.icon-spinner {
+    display: none;
+}
+
+.is-processing .icon-spinner {
+    display: flex;
+}
+
+@media (prefers-reduced-motion: reduce) {
+    .is-processing .icon::before {
+        transition-duration: 0.001ms !important;
+    }
+}

bookwyrm/static/css/themes/dark.scss

@@ -0,0 +1,55 @@
+@import "../vendor/bulma/sass/utilities/derived-variables.sass";
+
+/* Colors
+ ******************************************************************************/
+
+/* states */
+$primary: #016a5b;
+$info: #1f4666;
+$success: #246447;
+$warning: #8b6c15;
+$danger: #872538;
+
+/* book cover standins */
+$no-cover-color: #002549;
+
+/* background colors */
+$scheme-main: $grey-darker;
+$scheme-main-bis: $black-ter;
+$background-body: $grey-darker;
+$background-secondary: $grey-dark;
+$background-tertiary: #555;
+
+/* highlight colors */
+$primary-highlight: $primary;
+$info-highlight: $info;
+$success-highlight: $success;
+
+/* borders */
+$border: $grey;
+$border-hover: $grey-light;
+$border-light: $grey;
+$border-light-hover: $grey-light;
+
+/* text */
+$text: $grey-lightest;
+$text-light: $grey-lighter;
+$text-strong: $white-ter;
+
+/* links */
+$link: $white;
+$link-background: $background-tertiary;
+$link-hover: $white-bis;
+$link-focus: $white-bis;
+$link-active: $white-bis;
+
+/* misc */
+
+/* bulma overrides */
+$background: $background-secondary;
+$menu-item-active-background-color: $link-background;
+
+/* Fonts
+ ******************************************************************************/
+$family-primary: $family-sans-serif;
+$family-secondary: $family-sans-serif;

bookwyrm/static/css/themes/light.scss

@@ -0,0 +1,53 @@
+@import "../vendor/bulma/sass/utilities/derived-variables.sass";
+
+/* Colors
+ ******************************************************************************/
+
+/* states */
+$primary: $turquoise;
+$info: $cyan;
+$success: $green;
+$warning: $yellow;
+$danger: $red;
+
+/* book cover standins */
+$no-cover-color: #002549;
+
+/* background colors */
+$scheme-main: $white;
+$scheme-main: $white-bis;
+$background-body: $white;
+$background-secondary: $white-ter;
+$background-tertiary: $white-bis;
+
+/* highlight colors */
+$primary-highlight: $primary-light;
+$info-highlight: $info-light;
+$success-highlight: $success-light;
+
+/* borders */
+$border: $grey-lighter;
+$border-hover: $grey-light;
+$border-light: $grey-lightest;
+$border-light-hover: $grey-light;
+
+/* text */
+$text: $grey-dark;
+$text-light: $grey;
+$text-strong: $grey-darker;
+
+/* links */
+$link: #3273dc;
+$link-background: $link;
+$link-hover: $grey-darker;
+$link-focus: $grey-darker;
+$link-active: $grey-darker;
+
+/* bulma overrides */
+$background: $background-secondary;
+$menu-item-active-background-color: $link-background;
+
+/* Fonts
+ ******************************************************************************/
+$family-primary: $family-sans-serif;
+$family-secondary: $family-sans-serif;

bookwyrm/static/css/vendor/bulma/LICENSE

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2020 Jeremy Thomas
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

bookwyrm/static/css/vendor/bulma/bulma.sass

@@ -0,0 +1,10 @@
+@charset "utf-8"
+/*! bulma.io v0.9.3 | MIT License | github.com/jgthms/bulma */
+@import "sass/utilities/_all"
+@import "sass/base/_all"
+@import "sass/elements/_all"
+@import "sass/form/_all"
+@import "sass/components/_all"
+@import "sass/grid/_all"
+@import "sass/helpers/_all"
+@import "sass/layout/_all"

bookwyrm/static/css/vendor/bulma/package.json

@@ -0,0 +1,56 @@
+{
+  "name": "bulma",
+  "version": "0.9.3",
+  "homepage": "https://bulma.io",
+  "author": {
+    "name": "Jeremy Thomas",
+    "email": "bbxdesign@gmail.com",
+    "url": "https://jgthms.com"
+  },
+  "description": "Modern CSS framework based on Flexbox",
+  "main": "bulma.sass",
+  "unpkg": "css/bulma.css",
+  "style": "bulma/css/bulma.min.css",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/jgthms/bulma.git"
+  },
+  "license": "MIT",
+  "keywords": [
+    "css",
+    "sass",
+    "flexbox",
+    "responsive",
+    "framework"
+  ],
+  "bugs": {
+    "url": "https://github.com/jgthms/bulma/issues"
+  },
+  "devDependencies": {
+    "autoprefixer": "^9.8.6",
+    "clean-css-cli": "^4.3.0",
+    "node-sass": "^4.14.1",
+    "postcss-cli": "^7.1.2",
+    "rimraf": "^3.0.2"
+  },
+  "scripts": {
+    "build": "npm run build-sass && npm run build-autoprefix && npm run build-cleancss",
+    "build-autoprefix": "postcss --use autoprefixer --map false --output css/bulma.css css/bulma.css",
+    "build-cleancss": "cleancss -o css/bulma.min.css css/bulma.css",
+    "build-sass": "node-sass --output-style expanded --source-map true bulma.sass css/bulma.css",
+    "clean": "rimraf css",
+    "rtl": "npm run rtl-sass && npm run rtl-autoprefix && npm run rtl-cleancss",
+    "rtl-sass": "node-sass --output-style expanded --source-map true bulma-rtl.sass css/bulma-rtl.css",
+    "rtl-autoprefix": "postcss --use autoprefixer --map false --output css/bulma-rtl.css css/bulma-rtl.css",
+    "rtl-cleancss": "cleancss -o css/bulma-rtl.min.css css/bulma-rtl.css",
+    "deploy": "npm run clean && npm run build && npm run rtl",
+    "start": "npm run build-sass -- --watch"
+  },
+  "files": [
+    "css",
+    "sass",
+    "bulma.sass",
+    "LICENSE",
+    "README.md"
+  ]
+}

bookwyrm/static/css/vendor/bulma/sass/base/_all.sass

@@ -0,0 +1,6 @@
+/* Bulma Base */
+@charset "utf-8"
+
+@import "minireset"
+@import "generic"
+@import "animations"

bookwyrm/static/css/vendor/bulma/sass/base/animations.sass

@@ -0,0 +1,5 @@
+@keyframes spinAround
+  from
+    transform: rotate(0deg)
+  to
+    transform: rotate(359deg)

bookwyrm/static/css/vendor/bulma/sass/base/generic.sass

@@ -0,0 +1,145 @@
+@import "../utilities/mixins"
+
+$body-background-color: $scheme-main !default
+$body-size: 16px !default
+$body-min-width: 300px !default
+$body-rendering: optimizeLegibility !default
+$body-family: $family-primary !default
+$body-overflow-x: hidden !default
+$body-overflow-y: scroll !default
+
+$body-color: $text !default
+$body-font-size: 1em !default
+$body-weight: $weight-normal !default
+$body-line-height: 1.5 !default
+
+$code-family: $family-code !default
+$code-padding: 0.25em 0.5em 0.25em !default
+$code-weight: normal !default
+$code-size: 0.875em !default
+
+$small-font-size: 0.875em !default
+
+$hr-background-color: $background !default
+$hr-height: 2px !default
+$hr-margin: 1.5rem 0 !default
+
+$strong-color: $text-strong !default
+$strong-weight: $weight-bold !default
+
+$pre-font-size: 0.875em !default
+$pre-padding: 1.25rem 1.5rem !default
+$pre-code-font-size: 1em !default
+
+html
+  background-color: $body-background-color
+  font-size: $body-size
+  -moz-osx-font-smoothing: grayscale
+  -webkit-font-smoothing: antialiased
+  min-width: $body-min-width
+  overflow-x: $body-overflow-x
+  overflow-y: $body-overflow-y
+  text-rendering: $body-rendering
+  text-size-adjust: 100%
+
+article,
+aside,
+figure,
+footer,
+header,
+hgroup,
+section
+  display: block
+
+body,
+button,
+input,
+optgroup,
+select,
+textarea
+  font-family: $body-family
+
+code,
+pre
+  -moz-osx-font-smoothing: auto
+  -webkit-font-smoothing: auto
+  font-family: $code-family
+
+body
+  color: $body-color
+  font-size: $body-font-size
+  font-weight: $body-weight
+  line-height: $body-line-height
+
+// Inline
+
+a
+  color: $link
+  cursor: pointer
+  text-decoration: none
+  strong
+    color: currentColor
+  &:hover
+    color: $link-hover
+
+code
+  background-color: $code-background
+  color: $code
+  font-size: $code-size
+  font-weight: $code-weight
+  padding: $code-padding
+
+hr
+  background-color: $hr-background-color
+  border: none
+  display: block
+  height: $hr-height
+  margin: $hr-margin
+
+img
+  height: auto
+  max-width: 100%
+
+input[type="checkbox"],
+input[type="radio"]
+  vertical-align: baseline
+
+small
+  font-size: $small-font-size
+
+span
+  font-style: inherit
+  font-weight: inherit
+
+strong
+  color: $strong-color
+  font-weight: $strong-weight
+
+// Block
+
+fieldset
+  border: none
+
+pre
+  +overflow-touch
+  background-color: $pre-background
+  color: $pre
+  font-size: $pre-font-size
+  overflow-x: auto
+  padding: $pre-padding
+  white-space: pre
+  word-wrap: normal
+  code
+    background-color: transparent
+    color: currentColor
+    font-size: $pre-code-font-size
+    padding: 0
+
+table
+  td,
+  th
+    vertical-align: top
+    &:not([align])
+      text-align: inherit
+  th
+    color: $text-strong

bookwyrm/static/css/vendor/bulma/sass/base/helpers.sass

@@ -0,0 +1 @@
+@warn "The helpers.sass file is DEPRECATED. It has moved into its own /helpers folder. Please import sass/helpers/_all instead."

bookwyrm/static/css/vendor/bulma/sass/base/minireset.sass

@@ -0,0 +1,79 @@
+/*! minireset.css v0.0.6 | MIT License | github.com/jgthms/minireset.css */
+// Blocks
+html,
+body,
+p,
+ol,
+ul,
+li,
+dl,
+dt,
+dd,
+blockquote,
+figure,
+fieldset,
+legend,
+textarea,
+pre,
+iframe,
+hr,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6
+  margin: 0
+  padding: 0
+
+// Headings
+h1,
+h2,
+h3,
+h4,
+h5,
+h6
+  font-size: 100%
+  font-weight: normal
+
+// List
+ul
+  list-style: none
+
+// Form
+button,
+input,
+select,
+textarea
+  margin: 0
+
+// Box sizing
+html
+  box-sizing: border-box
+
+*
+  &,
+  &::before,
+  &::after
+    box-sizing: inherit
+
+// Media
+img,
+video
+  height: auto
+  max-width: 100%
+
+// Iframe
+iframe
+  border: 0
+
+// Table
+table
+  border-collapse: collapse
+  border-spacing: 0
+
+td,
+th
+  padding: 0
+  &:not([align])
+    text-align: inherit

bookwyrm/static/css/vendor/bulma/sass/components/_all.sass

@@ -0,0 +1,15 @@
+/* Bulma Components */
+@charset "utf-8"
+
+@import "breadcrumb"
+@import "card"
+@import "dropdown"
+@import "level"
+@import "media"
+@import "menu"
+@import "message"
+@import "modal"
+@import "navbar"
+@import "pagination"
+@import "panel"
+@import "tabs"

bookwyrm/static/css/vendor/bulma/sass/components/breadcrumb.sass

@@ -0,0 +1,77 @@
+@import "../utilities/mixins"
+
+$breadcrumb-item-color: $link !default
+$breadcrumb-item-hover-color: $link-hover !default
+$breadcrumb-item-active-color: $text-strong !default
+
+$breadcrumb-item-padding-vertical: 0 !default
+$breadcrumb-item-padding-horizontal: 0.75em !default
+
+$breadcrumb-item-separator-color: $border-hover !default
+
+.breadcrumb
+  @extend %block
+  @extend %unselectable
+  font-size: $size-normal
+  white-space: nowrap
+  a
+    align-items: center
+    color: $breadcrumb-item-color
+    display: flex
+    justify-content: center
+    padding: $breadcrumb-item-padding-vertical $breadcrumb-item-padding-horizontal
+    &:hover
+      color: $breadcrumb-item-hover-color
+  li
+    align-items: center
+    display: flex
+    &:first-child a
+      +ltr-property("padding", 0, false)
+    &.is-active
+      a
+        color: $breadcrumb-item-active-color
+        cursor: default
+        pointer-events: none
+    & + li::before
+      color: $breadcrumb-item-separator-color
+      content: "\0002f"
+  ul,
+  ol
+    align-items: flex-start
+    display: flex
+    flex-wrap: wrap
+    justify-content: flex-start
+  .icon
+    &:first-child
+      +ltr-property("margin", 0.5em)
+    &:last-child
+      +ltr-property("margin", 0.5em, false)
+  // Alignment
+  &.is-centered
+    ol,
+    ul
+      justify-content: center
+  &.is-right
+    ol,
+    ul
+      justify-content: flex-end
+  // Sizes
+  &.is-small
+    font-size: $size-small
+  &.is-medium
+    font-size: $size-medium
+  &.is-large
+    font-size: $size-large
+  // Styles
+  &.has-arrow-separator
+    li + li::before
+      content: "\02192"
+  &.has-bullet-separator
+    li + li::before
+      content: "\02022"
+  &.has-dot-separator
+    li + li::before
+      content: "\000b7"
+  &.has-succeeds-separator
+    li + li::before
+      content: "\0227B"

bookwyrm/static/css/vendor/bulma/sass/components/card.sass

@@ -0,0 +1,103 @@
+@import "../utilities/mixins"
+
+$card-color: $text !default
+$card-background-color: $scheme-main !default
+$card-shadow: $shadow !default
+$card-radius: 0.25rem !default
+
+$card-header-background-color: transparent !default
+$card-header-color: $text-strong !default
+$card-header-padding: 0.75rem 1rem !default
+$card-header-shadow: 0 0.125em 0.25em rgba($scheme-invert, 0.1) !default
+$card-header-weight: $weight-bold !default
+
+$card-content-background-color: transparent !default
+$card-content-padding: 1.5rem !default
+
+$card-footer-background-color: transparent !default
+$card-footer-border-top: 1px solid $border-light !default
+$card-footer-padding: 0.75rem !default
+
+$card-media-margin: $block-spacing !default
+
+.card
+  background-color: $card-background-color
+  border-radius: $card-radius
+  box-shadow: $card-shadow
+  color: $card-color
+  max-width: 100%
+  position: relative
+
+%card-item
+  &:first-child
+    border-top-left-radius: $card-radius
+    border-top-right-radius: $card-radius
+  &:last-child
+    border-bottom-left-radius: $card-radius
+    border-bottom-right-radius: $card-radius
+
+.card-header
+  @extend %card-item
+  background-color: $card-header-background-color
+  align-items: stretch
+  box-shadow: $card-header-shadow
+  display: flex
+
+.card-header-title
+  align-items: center
+  color: $card-header-color
+  display: flex
+  flex-grow: 1
+  font-weight: $card-header-weight
+  padding: $card-header-padding
+  &.is-centered
+    justify-content: center
+
+.card-header-icon
+  +reset
+  align-items: center
+  cursor: pointer
+  display: flex
+  justify-content: center
+  padding: $card-header-padding
+
+.card-image
+  display: block
+  position: relative
+  &:first-child
+    img
+      border-top-left-radius: $card-radius
+      border-top-right-radius: $card-radius
+  &:last-child
+    img
+      border-bottom-left-radius: $card-radius
+      border-bottom-right-radius: $card-radius
+
+.card-content
+  @extend %card-item
+  background-color: $card-content-background-color
+  padding: $card-content-padding
+
+.card-footer
+  @extend %card-item
+  background-color: $card-footer-background-color
+  border-top: $card-footer-border-top
+  align-items: stretch
+  display: flex
+
+.card-footer-item
+  align-items: center
+  display: flex
+  flex-basis: 0
+  flex-grow: 1
+  flex-shrink: 0
+  justify-content: center
+  padding: $card-footer-padding
+  &:not(:last-child)
+    +ltr-property("border", $card-footer-border-top)
+
+// Combinations
+
+.card
+  .media:not(:last-child)
+    margin-bottom: $card-media-margin

bookwyrm/static/css/vendor/bulma/sass/components/dropdown.sass

@@ -0,0 +1,83 @@
+@import "../utilities/mixins"
+
+$dropdown-menu-min-width: 12rem !default
+
+$dropdown-content-background-color: $scheme-main !default
+$dropdown-content-arrow: $link !default
+$dropdown-content-offset: 4px !default
+$dropdown-content-padding-bottom: 0.5rem !default
+$dropdown-content-padding-top: 0.5rem !default
+$dropdown-content-radius: $radius !default
+$dropdown-content-shadow: $shadow !default
+$dropdown-content-z: 20 !default
+
+$dropdown-item-color: $text !default
+$dropdown-item-hover-color: $scheme-invert !default
+$dropdown-item-hover-background-color: $background !default
+$dropdown-item-active-color: $link-invert !default
+$dropdown-item-active-background-color: $link !default
+
+$dropdown-divider-background-color: $border-light !default
+
+.dropdown
+  display: inline-flex
+  position: relative
+  vertical-align: top
+  &.is-active,
+  &.is-hoverable:hover
+    .dropdown-menu
+      display: block
+  &.is-right
+    .dropdown-menu
+      left: auto
+      right: 0
+  &.is-up
+    .dropdown-menu
+      bottom: 100%
+      padding-bottom: $dropdown-content-offset
+      padding-top: initial
+      top: auto
+
+.dropdown-menu
+  display: none
+  +ltr-position(0, false)
+  min-width: $dropdown-menu-min-width
+  padding-top: $dropdown-content-offset
+  position: absolute
+  top: 100%
+  z-index: $dropdown-content-z
+
+.dropdown-content
+  background-color: $dropdown-content-background-color
+  border-radius: $dropdown-content-radius
+  box-shadow: $dropdown-content-shadow
+  padding-bottom: $dropdown-content-padding-bottom
+  padding-top: $dropdown-content-padding-top
+
+.dropdown-item
+  color: $dropdown-item-color
+  display: block
+  font-size: 0.875rem
+  line-height: 1.5
+  padding: 0.375rem 1rem
+  position: relative
+
+a.dropdown-item,
+button.dropdown-item
+  +ltr-property("padding", 3rem)
+  text-align: inherit
+  white-space: nowrap
+  width: 100%
+  &:hover
+    background-color: $dropdown-item-hover-background-color
+    color: $dropdown-item-hover-color
+  &.is-active
+    background-color: $dropdown-item-active-background-color
+    color: $dropdown-item-active-color
+
+.dropdown-divider
+  background-color: $dropdown-divider-background-color
+  border: none
+  display: block
+  height: 1px
+  margin: 0.5rem 0

bookwyrm/static/css/vendor/bulma/sass/components/level.sass

@@ -0,0 +1,79 @@
+@import "../utilities/mixins"
+
+$level-item-spacing: ($block-spacing * 0.5) !default
+
+.level
+  @extend %block
+  align-items: center
+  justify-content: space-between
+  code
+    border-radius: $radius
+  img
+    display: inline-block
+    vertical-align: top
+  // Modifiers
+  &.is-mobile
+    display: flex
+    .level-left,
+    .level-right
+      display: flex
+    .level-left + .level-right
+      margin-top: 0
+    .level-item
+      &:not(:last-child)
+        margin-bottom: 0
+        +ltr-property("margin", $level-item-spacing)
+      &:not(.is-narrow)
+        flex-grow: 1
+  // Responsiveness
+  +tablet
+    display: flex
+    & > .level-item
+      &:not(.is-narrow)
+        flex-grow: 1
+
+.level-item
+  align-items: center
+  display: flex
+  flex-basis: auto
+  flex-grow: 0
+  flex-shrink: 0
+  justify-content: center
+  .title,
+  .subtitle
+    margin-bottom: 0
+  // Responsiveness
+  +mobile
+    &:not(:last-child)
+      margin-bottom: $level-item-spacing
+
+.level-left,
+.level-right
+  flex-basis: auto
+  flex-grow: 0
+  flex-shrink: 0
+  .level-item
+    // Modifiers
+    &.is-flexible
+      flex-grow: 1
+    // Responsiveness
+    +tablet
+      &:not(:last-child)
+        +ltr-property("margin", $level-item-spacing)
+
+.level-left
+  align-items: center
+  justify-content: flex-start
+  // Responsiveness
+  +mobile
+    & + .level-right
+      margin-top: 1.5rem
+  +tablet
+    display: flex
+
+.level-right
+  align-items: center
+  justify-content: flex-end
+  // Responsiveness
+  +tablet
+    display: flex

bookwyrm/static/css/vendor/bulma/sass/components/media.sass

@@ -0,0 +1,59 @@
+@import "../utilities/mixins"
+
+$media-border-color: bulmaRgba($border, 0.5) !default
+$media-border-size: 1px !default
+$media-spacing: 1rem !default
+$media-spacing-large: 1.5rem !default
+$media-content-spacing: 0.75rem !default
+$media-level-1-spacing: 0.75rem !default
+$media-level-1-content-spacing: 0.5rem !default
+$media-level-2-spacing: 0.5rem !default
+
+.media
+  align-items: flex-start
+  display: flex
+  text-align: inherit
+  .content:not(:last-child)
+    margin-bottom: $media-content-spacing
+  .media
+    border-top: $media-border-size solid $media-border-color
+    display: flex
+    padding-top: $media-level-1-spacing
+    .content:not(:last-child),
+    .control:not(:last-child)
+      margin-bottom: $media-level-1-content-spacing
+    .media
+      padding-top: $media-level-2-spacing
+      & + .media
+        margin-top: $media-level-2-spacing
+  & + .media
+    border-top: $media-border-size solid $media-border-color
+    margin-top: $media-spacing
+    padding-top: $media-spacing
+  // Sizes
+  &.is-large
+    & + .media
+      margin-top: $media-spacing-large
+      padding-top: $media-spacing-large
+
+.media-left,
+.media-right
+  flex-basis: auto
+  flex-grow: 0
+  flex-shrink: 0
+
+.media-left
+  +ltr-property("margin", $media-spacing)
+
+.media-right
+  +ltr-property("margin", $media-spacing, false)
+
+.media-content
+  flex-basis: auto
+  flex-grow: 1
+  flex-shrink: 1
+  text-align: inherit
+
++mobile
+  .media-content
+    overflow-x: auto

bookwyrm/static/css/vendor/bulma/sass/components/menu.sass

@@ -0,0 +1,59 @@
+@import "../utilities/mixins"
+
+$menu-item-color: $text !default
+$menu-item-radius: $radius-small !default
+$menu-item-hover-color: $text-strong !default
+$menu-item-hover-background-color: $background !default
+$menu-item-active-color: $link-invert !default
+$menu-item-active-background-color: $link !default
+
+$menu-list-border-left: 1px solid $border !default
+$menu-list-line-height: 1.25 !default
+$menu-list-link-padding: 0.5em 0.75em !default
+$menu-nested-list-margin: 0.75em !default
+$menu-nested-list-padding-left: 0.75em !default
+
+$menu-label-color: $text-light !default
+$menu-label-font-size: 0.75em !default
+$menu-label-letter-spacing: 0.1em !default
+$menu-label-spacing: 1em !default
+
+.menu
+  font-size: $size-normal
+  // Sizes
+  &.is-small
+    font-size: $size-small
+  &.is-medium
+    font-size: $size-medium
+  &.is-large
+    font-size: $size-large
+
+.menu-list
+  line-height: $menu-list-line-height
+  a
+    border-radius: $menu-item-radius
+    color: $menu-item-color
+    display: block
+    padding: $menu-list-link-padding
+    &:hover
+      background-color: $menu-item-hover-background-color
+      color: $menu-item-hover-color
+    // Modifiers
+    &.is-active
+      background-color: $menu-item-active-background-color
+      color: $menu-item-active-color
+  li
+    ul
+      +ltr-property("border", $menu-list-border-left, false)
+      margin: $menu-nested-list-margin
+      +ltr-property("padding", $menu-nested-list-padding-left, false)
+
+.menu-label
+  color: $menu-label-color
+  font-size: $menu-label-font-size
+  letter-spacing: $menu-label-letter-spacing
+  text-transform: uppercase
+  &:not(:first-child)
+    margin-top: $menu-label-spacing
+  &:not(:last-child)
+    margin-bottom: $menu-label-spacing

bookwyrm/static/css/vendor/bulma/sass/components/message.sass

@@ -0,0 +1,101 @@
+@import "../utilities/mixins"
+
+$message-background-color: $background !default
+$message-radius: $radius !default
+
+$message-header-background-color: $text !default
+$message-header-color: $text-invert !default
+$message-header-weight: $weight-bold !default
+$message-header-padding: 0.75em 1em !default
+$message-header-radius: $radius !default
+
+$message-body-border-color: $border !default
+$message-body-border-width: 0 0 0 4px !default
+$message-body-color: $text !default
+$message-body-padding: 1.25em 1.5em !default
+$message-body-radius: $radius !default
+
+$message-body-pre-background-color: $scheme-main !default
+$message-body-pre-code-background-color: transparent !default
+
+$message-header-body-border-width: 0 !default
+$message-colors: $colors !default
+
+.message
+  @extend %block
+  background-color: $message-background-color
+  border-radius: $message-radius
+  font-size: $size-normal
+  strong
+    color: currentColor
+  a:not(.button):not(.tag):not(.dropdown-item)
+    color: currentColor
+    text-decoration: underline
+  // Sizes
+  &.is-small
+    font-size: $size-small
+  &.is-medium
+    font-size: $size-medium
+  &.is-large
+    font-size: $size-large
+  // Colors
+  @each $name, $components in $message-colors
+    $color: nth($components, 1)
+    $color-invert: nth($components, 2)
+    $color-light: null
+    $color-dark: null
+
+    @if length($components) >= 3
+      $color-light: nth($components, 3)
+      @if length($components) >= 4
+        $color-dark: nth($components, 4)
+      @else
+        $color-luminance: colorLuminance($color)
+        $darken-percentage: $color-luminance * 70%
+        $desaturate-percentage: $color-luminance * 30%
+        $color-dark: desaturate(darken($color, $darken-percentage), $desaturate-percentage)
+    @else
+      $color-lightning: max((100% - lightness($color)) - 2%, 0%)
+      $color-light: lighten($color, $color-lightning)
+
+    &.is-#{$name}
+      background-color: $color-light
+      .message-header
+        background-color: $color
+        color: $color-invert
+      .message-body
+        border-color: $color
+        color: $color-dark
+
+.message-header
+  align-items: center
+  background-color: $message-header-background-color
+  border-radius: $message-header-radius $message-header-radius 0 0
+  color: $message-header-color
+  display: flex
+  font-weight: $message-header-weight
+  justify-content: space-between
+  line-height: 1.25
+  padding: $message-header-padding
+  position: relative
+  .delete
+    flex-grow: 0
+    flex-shrink: 0
+    +ltr-property("margin", 0.75em, false)
+  & + .message-body
+    border-width: $message-header-body-border-width
+    border-top-left-radius: 0
+    border-top-right-radius: 0
+
+.message-body
+  border-color: $message-body-border-color
+  border-radius: $message-body-radius
+  border-style: solid
+  border-width: $message-body-border-width
+  color: $message-body-color
+  padding: $message-body-padding
+  code,
+  pre
+    background-color: $message-body-pre-background-color
+  pre code
+    background-color: $message-body-pre-code-background-color

bookwyrm/static/css/vendor/bulma/sass/components/modal.sass

@@ -0,0 +1,117 @@
+@import "../utilities/mixins"
+
+$modal-z: 40 !default
+
+$modal-background-background-color: bulmaRgba($scheme-invert, 0.86) !default
+
+$modal-content-width: 640px !default
+$modal-content-margin-mobile: 20px !default
+$modal-content-spacing-mobile: 160px !default
+$modal-content-spacing-tablet: 40px !default
+
+$modal-close-dimensions: 40px !default
+$modal-close-right: 20px !default
+$modal-close-top: 20px !default
+
+$modal-card-spacing: 40px !default
+
+$modal-card-head-background-color: $background !default
+$modal-card-head-border-bottom: 1px solid $border !default
+$modal-card-head-padding: 20px !default
+$modal-card-head-radius: $radius-large !default
+
+$modal-card-title-color: $text-strong !default
+$modal-card-title-line-height: 1 !default
+$modal-card-title-size: $size-4 !default
+
+$modal-card-foot-radius: $radius-large !default
+$modal-card-foot-border-top: 1px solid $border !default
+
+$modal-card-body-background-color: $scheme-main !default
+$modal-card-body-padding: 20px !default
+
+$modal-breakpoint: $tablet !default
+
+.modal
+  @extend %overlay
+  align-items: center
+  display: none
+  flex-direction: column
+  justify-content: center
+  overflow: hidden
+  position: fixed
+  z-index: $modal-z
+  // Modifiers
+  &.is-active
+    display: flex
+
+.modal-background
+  @extend %overlay
+  background-color: $modal-background-background-color
+
+.modal-content,
+.modal-card
+  margin: 0 $modal-content-margin-mobile
+  max-height: calc(100vh - #{$modal-content-spacing-mobile})
+  overflow: auto
+  position: relative
+  width: 100%
+  // Responsiveness
+  +from($modal-breakpoint)
+    margin: 0 auto
+    max-height: calc(100vh - #{$modal-content-spacing-tablet})
+    width: $modal-content-width
+
+.modal-close
+  @extend %delete
+  background: none
+  height: $modal-close-dimensions
+  position: fixed
+  +ltr-position($modal-close-right)
+  top: $modal-close-top
+  width: $modal-close-dimensions
+
+.modal-card
+  display: flex
+  flex-direction: column
+  max-height: calc(100vh - #{$modal-card-spacing})
+  overflow: hidden
+  -ms-overflow-y: visible
+
+.modal-card-head,
+.modal-card-foot
+  align-items: center
+  background-color: $modal-card-head-background-color
+  display: flex
+  flex-shrink: 0
+  justify-content: flex-start
+  padding: $modal-card-head-padding
+  position: relative
+
+.modal-card-head
+  border-bottom: $modal-card-head-border-bottom
+  border-top-left-radius: $modal-card-head-radius
+  border-top-right-radius: $modal-card-head-radius
+
+.modal-card-title
+  color: $modal-card-title-color
+  flex-grow: 1
+  flex-shrink: 0
+  font-size: $modal-card-title-size
+  line-height: $modal-card-title-line-height
+
+.modal-card-foot
+  border-bottom-left-radius: $modal-card-foot-radius
+  border-bottom-right-radius: $modal-card-foot-radius
+  border-top: $modal-card-foot-border-top
+  .button
+    &:not(:last-child)
+      +ltr-property("margin", 0.5em)
+
+.modal-card-body
+  +overflow-touch
+  background-color: $modal-card-body-background-color
+  flex-grow: 1
+  flex-shrink: 1
+  overflow: auto
+  padding: $modal-card-body-padding

bookwyrm/static/css/vendor/bulma/sass/components/navbar.sass

@@ -0,0 +1,446 @@
+@import "../utilities/mixins"
+
+$navbar-background-color: $scheme-main !default
+$navbar-box-shadow-size: 0 2px 0 0 !default
+$navbar-box-shadow-color: $background !default
+$navbar-height: 3.25rem !default
+$navbar-padding-vertical: 1rem !default
+$navbar-padding-horizontal: 2rem !default
+$navbar-z: 30 !default
+$navbar-fixed-z: 30 !default
+
+$navbar-item-color: $text !default
+$navbar-item-hover-color: $link !default
+$navbar-item-hover-background-color: $scheme-main-bis !default
+$navbar-item-active-color: $scheme-invert !default
+$navbar-item-active-background-color: transparent !default
+$navbar-item-img-max-height: 1.75rem !default
+
+$navbar-burger-color: $navbar-item-color !default
+
+$navbar-tab-hover-background-color: transparent !default
+$navbar-tab-hover-border-bottom-color: $link !default
+$navbar-tab-active-color: $link !default
+$navbar-tab-active-background-color: transparent !default
+$navbar-tab-active-border-bottom-color: $link !default
+$navbar-tab-active-border-bottom-style: solid !default
+$navbar-tab-active-border-bottom-width: 3px !default
+
+$navbar-dropdown-background-color: $scheme-main !default
+$navbar-dropdown-border-top: 2px solid $border !default
+$navbar-dropdown-offset: -4px !default
+$navbar-dropdown-arrow: $link !default
+$navbar-dropdown-radius: $radius-large !default
+$navbar-dropdown-z: 20 !default
+
+$navbar-dropdown-boxed-radius: $radius-large !default
+$navbar-dropdown-boxed-shadow: 0 8px 8px bulmaRgba($scheme-invert, 0.1), 0 0 0 1px bulmaRgba($scheme-invert, 0.1) !default
+
+$navbar-dropdown-item-hover-color: $scheme-invert !default
+$navbar-dropdown-item-hover-background-color: $background !default
+$navbar-dropdown-item-active-color: $link !default
+$navbar-dropdown-item-active-background-color: $background !default
+
+$navbar-divider-background-color: $background !default
+$navbar-divider-height: 2px !default
+
+$navbar-bottom-box-shadow-size: 0 -2px 0 0 !default
+
+$navbar-breakpoint: $desktop !default
+
+$navbar-colors: $colors !default
+
+=navbar-fixed
+  left: 0
+  position: fixed
+  right: 0
+  z-index: $navbar-fixed-z
+
+.navbar
+  background-color: $navbar-background-color
+  min-height: $navbar-height
+  position: relative
+  z-index: $navbar-z
+  @each $name, $pair in $navbar-colors
+    $color: nth($pair, 1)
+    $color-invert: nth($pair, 2)
+    &.is-#{$name}
+      background-color: $color
+      color: $color-invert
+      .navbar-brand
+        & > .navbar-item,
+        .navbar-link
+          color: $color-invert
+        & > a.navbar-item,
+        .navbar-link
+          &:focus,
+          &:hover,
+          &.is-active
+            background-color: bulmaDarken($color, 5%)
+            color: $color-invert
+        .navbar-link
+          &::after
+            border-color: $color-invert
+      .navbar-burger
+        color: $color-invert
+      +from($navbar-breakpoint)
+        .navbar-start,
+        .navbar-end
+          & > .navbar-item,
+          .navbar-link
+            color: $color-invert
+          & > a.navbar-item,
+          .navbar-link
+            &:focus,
+            &:hover,
+            &.is-active
+              background-color: bulmaDarken($color, 5%)
+              color: $color-invert
+          .navbar-link
+            &::after
+              border-color: $color-invert
+        .navbar-item.has-dropdown:focus .navbar-link,
+        .navbar-item.has-dropdown:hover .navbar-link,
+        .navbar-item.has-dropdown.is-active .navbar-link
+          background-color: bulmaDarken($color, 5%)
+          color: $color-invert
+        .navbar-dropdown
+          a.navbar-item
+            &.is-active
+              background-color: $color
+              color: $color-invert
+  & > .container
+    align-items: stretch
+    display: flex
+    min-height: $navbar-height
+    width: 100%
+  &.has-shadow
+    box-shadow: $navbar-box-shadow-size $navbar-box-shadow-color
+  &.is-fixed-bottom,
+  &.is-fixed-top
+    +navbar-fixed
+  &.is-fixed-bottom
+    bottom: 0
+    &.has-shadow
+      box-shadow: $navbar-bottom-box-shadow-size $navbar-box-shadow-color
+  &.is-fixed-top
+    top: 0
+
+html,
+body
+  &.has-navbar-fixed-top
+    padding-top: $navbar-height
+  &.has-navbar-fixed-bottom
+    padding-bottom: $navbar-height
+
+.navbar-brand,
+.navbar-tabs
+  align-items: stretch
+  display: flex
+  flex-shrink: 0
+  min-height: $navbar-height
+
+.navbar-brand
+  a.navbar-item
+    &:focus,
+    &:hover
+      background-color: transparent
+
+.navbar-tabs
+  +overflow-touch
+  max-width: 100vw
+  overflow-x: auto
+  overflow-y: hidden
+
+.navbar-burger
+  @extend %reset
+  color: $navbar-burger-color
+  +hamburger($navbar-height)
+  +ltr-property("margin", auto, false)
+
+.navbar-menu
+  display: none
+
+.navbar-item,
+.navbar-link
+  color: $navbar-item-color
+  display: block
+  line-height: 1.5
+  padding: 0.5rem 0.75rem
+  position: relative
+  .icon
+    &:only-child
+      margin-left: -0.25rem
+      margin-right: -0.25rem
+
+a.navbar-item,
+.navbar-link
+  cursor: pointer
+  &:focus,
+  &:focus-within,
+  &:hover,
+  &.is-active
+    background-color: $navbar-item-hover-background-color
+    color: $navbar-item-hover-color
+
+.navbar-item
+  flex-grow: 0
+  flex-shrink: 0
+  img
+    max-height: $navbar-item-img-max-height
+  &.has-dropdown
+    padding: 0
+  &.is-expanded
+    flex-grow: 1
+    flex-shrink: 1
+  &.is-tab
+    border-bottom: 1px solid transparent
+    min-height: $navbar-height
+    padding-bottom: calc(0.5rem - 1px)
+    &:focus,
+    &:hover
+      background-color: $navbar-tab-hover-background-color
+      border-bottom-color: $navbar-tab-hover-border-bottom-color
+    &.is-active
+      background-color: $navbar-tab-active-background-color
+      border-bottom-color: $navbar-tab-active-border-bottom-color
+      border-bottom-style: $navbar-tab-active-border-bottom-style
+      border-bottom-width: $navbar-tab-active-border-bottom-width
+      color: $navbar-tab-active-color
+      padding-bottom: calc(0.5rem - #{$navbar-tab-active-border-bottom-width})
+
+.navbar-content
+  flex-grow: 1
+  flex-shrink: 1
+
+.navbar-link:not(.is-arrowless)
+  +ltr-property("padding", 2.5em)
+  &::after
+    @extend %arrow
+    border-color: $navbar-dropdown-arrow
+    margin-top: -0.375em
+    +ltr-position(1.125em)
+
+.navbar-dropdown
+  font-size: 0.875rem
+  padding-bottom: 0.5rem
+  padding-top: 0.5rem
+  .navbar-item
+    padding-left: 1.5rem
+    padding-right: 1.5rem
+
+.navbar-divider
+  background-color: $navbar-divider-background-color
+  border: none
+  display: none
+  height: $navbar-divider-height
+  margin: 0.5rem 0
+
++until($navbar-breakpoint)
+  .navbar > .container
+    display: block
+  .navbar-brand,
+  .navbar-tabs
+    .navbar-item
+      align-items: center
+      display: flex
+  .navbar-link
+    &::after
+      display: none
+  .navbar-menu
+    background-color: $navbar-background-color
+    box-shadow: 0 8px 16px bulmaRgba($scheme-invert, 0.1)
+    padding: 0.5rem 0
+    &.is-active
+      display: block
+  // Fixed navbar
+  .navbar
+    &.is-fixed-bottom-touch,
+    &.is-fixed-top-touch
+      +navbar-fixed
+    &.is-fixed-bottom-touch
+      bottom: 0
+      &.has-shadow
+        box-shadow: 0 -2px 3px bulmaRgba($scheme-invert, 0.1)
+    &.is-fixed-top-touch
+      top: 0
+    &.is-fixed-top,
+    &.is-fixed-top-touch
+      .navbar-menu
+        +overflow-touch
+        max-height: calc(100vh - #{$navbar-height})
+        overflow: auto
+  html,
+  body
+    &.has-navbar-fixed-top-touch
+      padding-top: $navbar-height
+    &.has-navbar-fixed-bottom-touch
+      padding-bottom: $navbar-height
+
++from($navbar-breakpoint)
+  .navbar,
+  .navbar-menu,
+  .navbar-start,
+  .navbar-end
+    align-items: stretch
+    display: flex
+  .navbar
+    min-height: $navbar-height
+    &.is-spaced
+      padding: $navbar-padding-vertical $navbar-padding-horizontal
+      .navbar-start,
+      .navbar-end
+        align-items: center
+      a.navbar-item,
+      .navbar-link
+        border-radius: $radius
+    &.is-transparent
+      a.navbar-item,
+      .navbar-link
+        &:focus,
+        &:hover,
+        &.is-active
+          background-color: transparent !important
+      .navbar-item.has-dropdown
+        &.is-active,
+        &.is-hoverable:focus,
+        &.is-hoverable:focus-within,
+        &.is-hoverable:hover
+          .navbar-link
+            background-color: transparent !important
+      .navbar-dropdown
+        a.navbar-item
+          &:focus,
+          &:hover
+            background-color: $navbar-dropdown-item-hover-background-color
+            color: $navbar-dropdown-item-hover-color
+          &.is-active
+            background-color: $navbar-dropdown-item-active-background-color
+            color: $navbar-dropdown-item-active-color
+  .navbar-burger
+    display: none
+  .navbar-item,
+  .navbar-link
+    align-items: center
+    display: flex
+  .navbar-item
+    &.has-dropdown
+      align-items: stretch
+    &.has-dropdown-up
+      .navbar-link::after
+        transform: rotate(135deg) translate(0.25em, -0.25em)
+      .navbar-dropdown
+        border-bottom: $navbar-dropdown-border-top
+        border-radius: $navbar-dropdown-radius $navbar-dropdown-radius 0 0
+        border-top: none
+        bottom: 100%
+        box-shadow: 0 -8px 8px bulmaRgba($scheme-invert, 0.1)
+        top: auto
+    &.is-active,
+    &.is-hoverable:focus,
+    &.is-hoverable:focus-within,
+    &.is-hoverable:hover
+      .navbar-dropdown
+        display: block
+        .navbar.is-spaced &,
+        &.is-boxed
+          opacity: 1
+          pointer-events: auto
+          transform: translateY(0)
+  .navbar-menu
+    flex-grow: 1
+    flex-shrink: 0
+  .navbar-start
+    justify-content: flex-start
+    +ltr-property("margin", auto)
+  .navbar-end
+    justify-content: flex-end
+    +ltr-property("margin", auto, false)
+  .navbar-dropdown
+    background-color: $navbar-dropdown-background-color
+    border-bottom-left-radius: $navbar-dropdown-radius
+    border-bottom-right-radius: $navbar-dropdown-radius
+    border-top: $navbar-dropdown-border-top
+    box-shadow: 0 8px 8px bulmaRgba($scheme-invert, 0.1)
+    display: none
+    font-size: 0.875rem
+    +ltr-position(0, false)
+    min-width: 100%
+    position: absolute
+    top: 100%
+    z-index: $navbar-dropdown-z
+    .navbar-item
+      padding: 0.375rem 1rem
+      white-space: nowrap
+    a.navbar-item
+      +ltr-property("padding", 3rem)
+      &:focus,
+      &:hover
+        background-color: $navbar-dropdown-item-hover-background-color
+        color: $navbar-dropdown-item-hover-color
+      &.is-active
+        background-color: $navbar-dropdown-item-active-background-color
+        color: $navbar-dropdown-item-active-color
+    .navbar.is-spaced &,
+    &.is-boxed
+      border-radius: $navbar-dropdown-boxed-radius
+      border-top: none
+      box-shadow: $navbar-dropdown-boxed-shadow
+      display: block
+      opacity: 0
+      pointer-events: none
+      top: calc(100% + (#{$navbar-dropdown-offset}))
+      transform: translateY(-5px)
+      transition-duration: $speed
+      transition-property: opacity, transform
+    &.is-right
+      left: auto
+      right: 0
+  .navbar-divider
+    display: block
+  .navbar > .container,
+  .container > .navbar
+    .navbar-brand
+      +ltr-property("margin", -.75rem, false)
+    .navbar-menu
+      +ltr-property("margin", -.75rem)
+  // Fixed navbar
+  .navbar
+    &.is-fixed-bottom-desktop,
+    &.is-fixed-top-desktop
+      +navbar-fixed
+    &.is-fixed-bottom-desktop
+      bottom: 0
+      &.has-shadow
+        box-shadow: 0 -2px 3px bulmaRgba($scheme-invert, 0.1)
+    &.is-fixed-top-desktop
+      top: 0
+  html,
+  body
+    &.has-navbar-fixed-top-desktop
+      padding-top: $navbar-height
+    &.has-navbar-fixed-bottom-desktop
+      padding-bottom: $navbar-height
+    &.has-spaced-navbar-fixed-top
+      padding-top: $navbar-height + ($navbar-padding-vertical * 2)
+    &.has-spaced-navbar-fixed-bottom
+      padding-bottom: $navbar-height + ($navbar-padding-vertical * 2)
+  // Hover/Active states
+  a.navbar-item,
+  .navbar-link
+    &.is-active
+      color: $navbar-item-active-color
+    &.is-active:not(:focus):not(:hover)
+      background-color: $navbar-item-active-background-color
+  .navbar-item.has-dropdown
+    &:focus,
+    &:hover,
+    &.is-active
+      .navbar-link
+        background-color: $navbar-item-hover-background-color
+
+// Combination
+
+.hero
+  &.is-fullheight-with-navbar
+    min-height: calc(100vh - #{$navbar-height})

bookwyrm/static/css/vendor/bulma/sass/components/pagination.sass

@@ -0,0 +1,166 @@
+@import "../utilities/controls"
+@import "../utilities/mixins"
+
+$pagination-color: $text-strong !default
+$pagination-border-color: $border !default
+$pagination-margin: -0.25rem !default
+$pagination-min-width: $control-height !default
+
+$pagination-item-font-size: 1em !default
+$pagination-item-margin: 0.25rem !default
+$pagination-item-padding-left: 0.5em !default
+$pagination-item-padding-right: 0.5em !default
+
+$pagination-nav-padding-left: 0.75em !default
+$pagination-nav-padding-right: 0.75em !default
+
+$pagination-hover-color: $link-hover !default
+$pagination-hover-border-color: $link-hover-border !default
+
+$pagination-focus-color: $link-focus !default
+$pagination-focus-border-color: $link-focus-border !default
+
+$pagination-active-color: $link-active !default
+$pagination-active-border-color: $link-active-border !default
+
+$pagination-disabled-color: $text-light !default
+$pagination-disabled-background-color: $border !default
+$pagination-disabled-border-color: $border !default
+
+$pagination-current-color: $link-invert !default
+$pagination-current-background-color: $link !default
+$pagination-current-border-color: $link !default
+
+$pagination-ellipsis-color: $grey-light !default
+
+$pagination-shadow-inset: inset 0 1px 2px rgba($scheme-invert, 0.2) !default
+
+.pagination
+  @extend %block
+  font-size: $size-normal
+  margin: $pagination-margin
+  // Sizes
+  &.is-small
+    font-size: $size-small
+  &.is-medium
+    font-size: $size-medium
+  &.is-large
+    font-size: $size-large
+  &.is-rounded
+    .pagination-previous,
+    .pagination-next
+      padding-left: 1em
+      padding-right: 1em
+      border-radius: $radius-rounded
+    .pagination-link
+      border-radius: $radius-rounded
+
+.pagination,
+.pagination-list
+  align-items: center
+  display: flex
+  justify-content: center
+  text-align: center
+
+.pagination-previous,
+.pagination-next,
+.pagination-link,
+.pagination-ellipsis
+  @extend %control
+  @extend %unselectable
+  font-size: $pagination-item-font-size
+  justify-content: center
+  margin: $pagination-item-margin
+  padding-left: $pagination-item-padding-left
+  padding-right: $pagination-item-padding-right
+  text-align: center
+
+.pagination-previous,
+.pagination-next,
+.pagination-link
+  border-color: $pagination-border-color
+  color: $pagination-color
+  min-width: $pagination-min-width
+  &:hover
+    border-color: $pagination-hover-border-color
+    color: $pagination-hover-color
+  &:focus
+    border-color: $pagination-focus-border-color
+  &:active
+    box-shadow: $pagination-shadow-inset
+  &[disabled]
+    background-color: $pagination-disabled-background-color
+    border-color: $pagination-disabled-border-color
+    box-shadow: none
+    color: $pagination-disabled-color
+    opacity: 0.5
+
+.pagination-previous,
+.pagination-next
+  padding-left: $pagination-nav-padding-left
+  padding-right: $pagination-nav-padding-right
+  white-space: nowrap
+
+.pagination-link
+  &.is-current
+    background-color: $pagination-current-background-color
+    border-color: $pagination-current-border-color
+    color: $pagination-current-color
+
+.pagination-ellipsis
+  color: $pagination-ellipsis-color
+  pointer-events: none
+
+.pagination-list
+  flex-wrap: wrap
+  li
+    list-style: none
+
++mobile
+  .pagination
+    flex-wrap: wrap
+  .pagination-previous,
+  .pagination-next
+    flex-grow: 1
+    flex-shrink: 1
+  .pagination-list
+    li
+      flex-grow: 1
+      flex-shrink: 1
+
++tablet
+  .pagination-list
+    flex-grow: 1
+    flex-shrink: 1
+    justify-content: flex-start
+    order: 1
+  .pagination-previous,
+  .pagination-next,
+  .pagination-link,
+  .pagination-ellipsis
+    margin-bottom: 0
+    margin-top: 0
+  .pagination-previous
+    order: 2
+  .pagination-next
+    order: 3
+  .pagination
+    justify-content: space-between
+    margin-bottom: 0
+    margin-top: 0
+    &.is-centered
+      .pagination-previous
+        order: 1
+      .pagination-list
+        justify-content: center
+        order: 2
+      .pagination-next
+        order: 3
+    &.is-right
+      .pagination-previous
+        order: 1
+      .pagination-next
+        order: 2
+      .pagination-list
+        justify-content: flex-end
+        order: 3

bookwyrm/static/css/vendor/bulma/sass/components/panel.sass

@@ -0,0 +1,121 @@
+@import "../utilities/mixins"
+
+$panel-margin: $block-spacing !default
+$panel-item-border: 1px solid $border-light !default
+$panel-radius: $radius-large !default
+$panel-shadow: $shadow !default
+
+$panel-heading-background-color: $border-light !default
+$panel-heading-color: $text-strong !default
+$panel-heading-line-height: 1.25 !default
+$panel-heading-padding: 0.75em 1em !default
+$panel-heading-radius: $radius !default
+$panel-heading-size: 1.25em !default
+$panel-heading-weight: $weight-bold !default
+
+$panel-tabs-font-size: 0.875em !default
+$panel-tab-border-bottom: 1px solid $border !default
+$panel-tab-active-border-bottom-color: $link-active-border !default
+$panel-tab-active-color: $link-active !default
+
+$panel-list-item-color: $text !default
+$panel-list-item-hover-color: $link !default
+
+$panel-block-color: $text-strong !default
+$panel-block-hover-background-color: $background !default
+$panel-block-active-border-left-color: $link !default
+$panel-block-active-color: $link-active !default
+$panel-block-active-icon-color: $link !default
+
+$panel-icon-color: $text-light !default
+$panel-colors: $colors !default
+
+.panel
+  border-radius: $panel-radius
+  box-shadow: $panel-shadow
+  font-size: $size-normal
+  &:not(:last-child)
+    margin-bottom: $panel-margin
+  // Colors
+  @each $name, $components in $panel-colors
+    $color: nth($components, 1)
+    $color-invert: nth($components, 2)
+    &.is-#{$name}
+      .panel-heading
+        background-color: $color
+        color: $color-invert
+      .panel-tabs a.is-active
+        border-bottom-color: $color
+      .panel-block.is-active .panel-icon
+        color: $color
+
+.panel-tabs,
+.panel-block
+  &:not(:last-child)
+    border-bottom: $panel-item-border
+
+.panel-heading
+  background-color: $panel-heading-background-color
+  border-radius: $panel-radius $panel-radius 0 0
+  color: $panel-heading-color
+  font-size: $panel-heading-size
+  font-weight: $panel-heading-weight
+  line-height: $panel-heading-line-height
+  padding: $panel-heading-padding
+
+.panel-tabs
+  align-items: flex-end
+  display: flex
+  font-size: $panel-tabs-font-size
+  justify-content: center
+  a
+    border-bottom: $panel-tab-border-bottom
+    margin-bottom: -1px
+    padding: 0.5em
+    // Modifiers
+    &.is-active
+      border-bottom-color: $panel-tab-active-border-bottom-color
+      color: $panel-tab-active-color
+
+.panel-list
+  a
+    color: $panel-list-item-color
+    &:hover
+      color: $panel-list-item-hover-color
+
+.panel-block
+  align-items: center
+  color: $panel-block-color
+  display: flex
+  justify-content: flex-start
+  padding: 0.5em 0.75em
+  input[type="checkbox"]
+    +ltr-property("margin", 0.75em)
+  & > .control
+    flex-grow: 1
+    flex-shrink: 1
+    width: 100%
+  &.is-wrapped
+    flex-wrap: wrap
+  &.is-active
+    border-left-color: $panel-block-active-border-left-color
+    color: $panel-block-active-color
+    .panel-icon
+      color: $panel-block-active-icon-color
+  &:last-child
+    border-bottom-left-radius: $panel-radius
+    border-bottom-right-radius: $panel-radius
+
+a.panel-block,
+label.panel-block
+  cursor: pointer
+  &:hover
+    background-color: $panel-block-hover-background-color
+
+.panel-icon
+  +fa(14px, 1em)
+  color: $panel-icon-color
+  +ltr-property("margin", 0.75em)
+  .fa
+    font-size: inherit
+    line-height: inherit

bookwyrm/static/css/vendor/bulma/sass/components/tabs.sass

@@ -0,0 +1,176 @@
+@import "../utilities/mixins"
+
+$tabs-border-bottom-color: $border !default
+$tabs-border-bottom-style: solid !default
+$tabs-border-bottom-width: 1px !default
+$tabs-link-color: $text !default
+$tabs-link-hover-border-bottom-color: $text-strong !default
+$tabs-link-hover-color: $text-strong !default
+$tabs-link-active-border-bottom-color: $link !default
+$tabs-link-active-color: $link !default
+$tabs-link-padding: 0.5em 1em !default
+
+$tabs-boxed-link-radius: $radius !default
+$tabs-boxed-link-hover-background-color: $background !default
+$tabs-boxed-link-hover-border-bottom-color: $border !default
+
+$tabs-boxed-link-active-background-color: $scheme-main !default
+$tabs-boxed-link-active-border-color: $border !default
+$tabs-boxed-link-active-border-bottom-color: transparent !default
+
+$tabs-toggle-link-border-color: $border !default
+$tabs-toggle-link-border-style: solid !default
+$tabs-toggle-link-border-width: 1px !default
+$tabs-toggle-link-hover-background-color: $background !default
+$tabs-toggle-link-hover-border-color: $border-hover !default
+$tabs-toggle-link-radius: $radius !default
+$tabs-toggle-link-active-background-color: $link !default
+$tabs-toggle-link-active-border-color: $link !default
+$tabs-toggle-link-active-color: $link-invert !default
+
+.tabs
+  @extend %block
+  +overflow-touch
+  @extend %unselectable
+  align-items: stretch
+  display: flex
+  font-size: $size-normal
+  justify-content: space-between
+  overflow: hidden
+  overflow-x: auto
+  white-space: nowrap
+  a
+    align-items: center
+    border-bottom-color: $tabs-border-bottom-color
+    border-bottom-style: $tabs-border-bottom-style
+    border-bottom-width: $tabs-border-bottom-width
+    color: $tabs-link-color
+    display: flex
+    justify-content: center
+    margin-bottom: -#{$tabs-border-bottom-width}
+    padding: $tabs-link-padding
+    vertical-align: top
+    &:hover
+      border-bottom-color: $tabs-link-hover-border-bottom-color
+      color: $tabs-link-hover-color
+  li
+    display: block
+    &.is-active
+      a
+        border-bottom-color: $tabs-link-active-border-bottom-color
+        color: $tabs-link-active-color
+  ul
+    align-items: center
+    border-bottom-color: $tabs-border-bottom-color
+    border-bottom-style: $tabs-border-bottom-style
+    border-bottom-width: $tabs-border-bottom-width
+    display: flex
+    flex-grow: 1
+    flex-shrink: 0
+    justify-content: flex-start
+    &.is-left
+      padding-right: 0.75em
+    &.is-center
+      flex: none
+      justify-content: center
+      padding-left: 0.75em
+      padding-right: 0.75em
+    &.is-right
+      justify-content: flex-end
+      padding-left: 0.75em
+  .icon
+    &:first-child
+      +ltr-property("margin", 0.5em)
+    &:last-child
+      +ltr-property("margin", 0.5em, false)
+  // Alignment
+  &.is-centered
+    ul
+      justify-content: center
+  &.is-right
+    ul
+      justify-content: flex-end
+  // Styles
+  &.is-boxed
+    a
+      border: 1px solid transparent
+      +ltr
+        border-radius: $tabs-boxed-link-radius $tabs-boxed-link-radius 0 0
+      +rtl
+        border-radius: 0 0 $tabs-boxed-link-radius $tabs-boxed-link-radius
+      &:hover
+        background-color: $tabs-boxed-link-hover-background-color
+        border-bottom-color: $tabs-boxed-link-hover-border-bottom-color
+    li
+      &.is-active
+        a
+          background-color: $tabs-boxed-link-active-background-color
+          border-color: $tabs-boxed-link-active-border-color
+          border-bottom-color: $tabs-boxed-link-active-border-bottom-color !important
+  &.is-fullwidth
+    li
+      flex-grow: 1
+      flex-shrink: 0
+  &.is-toggle
+    a
+      border-color: $tabs-toggle-link-border-color
+      border-style: $tabs-toggle-link-border-style
+      border-width: $tabs-toggle-link-border-width
+      margin-bottom: 0
+      position: relative
+      &:hover
+        background-color: $tabs-toggle-link-hover-background-color
+        border-color: $tabs-toggle-link-hover-border-color
+        z-index: 2
+    li
+      & + li
+        +ltr-property("margin", -#{$tabs-toggle-link-border-width}, false)
+      &:first-child a
+        +ltr
+          border-top-left-radius: $tabs-toggle-link-radius
+          border-bottom-left-radius: $tabs-toggle-link-radius
+        +rtl
+          border-top-right-radius: $tabs-toggle-link-radius
+          border-bottom-right-radius: $tabs-toggle-link-radius
+      &:last-child a
+        +ltr
+          border-top-right-radius: $tabs-toggle-link-radius
+          border-bottom-right-radius: $tabs-toggle-link-radius
+        +rtl
+          border-top-left-radius: $tabs-toggle-link-radius
+          border-bottom-left-radius: $tabs-toggle-link-radius
+      &.is-active
+        a
+          background-color: $tabs-toggle-link-active-background-color
+          border-color: $tabs-toggle-link-active-border-color
+          color: $tabs-toggle-link-active-color
+          z-index: 1
+    ul
+      border-bottom: none
+    &.is-toggle-rounded
+      li
+        &:first-child a
+          +ltr
+            border-bottom-left-radius: $radius-rounded
+            border-top-left-radius: $radius-rounded
+            padding-left: 1.25em
+          +rtl
+            border-bottom-right-radius: $radius-rounded
+            border-top-right-radius: $radius-rounded
+            padding-right: 1.25em
+        &:last-child a
+          +ltr
+            border-bottom-right-radius: $radius-rounded
+            border-top-right-radius: $radius-rounded
+            padding-right: 1.25em
+          +rtl
+            border-bottom-left-radius: $radius-rounded
+            border-top-left-radius: $radius-rounded
+            padding-left: 1.25em
+  // Sizes
+  &.is-small
+    font-size: $size-small
+  &.is-medium
+    font-size: $size-medium
+  &.is-large
+    font-size: $size-large

bookwyrm/static/css/vendor/bulma/sass/elements/_all.sass

@@ -0,0 +1,16 @@
+/* Bulma Elements */
+@charset "utf-8"
+
+@import "box"
+@import "button"
+@import "container"
+@import "content"
+@import "icon"
+@import "image"
+@import "notification"
+@import "progress"
+@import "table"
+@import "tag"
+@import "title"
+
+@import "other"

bookwyrm/static/css/vendor/bulma/sass/elements/box.sass

@@ -0,0 +1,26 @@
+@import "../utilities/mixins"
+
+$box-color: $text !default
+$box-background-color: $scheme-main !default
+$box-radius: $radius-large !default
+$box-shadow: $shadow !default
+$box-padding: 1.25rem !default
+
+$box-link-hover-shadow: 0 0.5em 1em -0.125em rgba($scheme-invert, 0.1), 0 0 0 1px $link !default
+$box-link-active-shadow: inset 0 1px 2px rgba($scheme-invert, 0.2), 0 0 0 1px $link !default
+
+.box
+  @extend %block
+  background-color: $box-background-color
+  border-radius: $box-radius
+  box-shadow: $box-shadow
+  color: $box-color
+  display: block
+  padding: $box-padding
+
+a.box
+  &:hover,
+  &:focus
+    box-shadow: $box-link-hover-shadow
+  &:active
+    box-shadow: $box-link-active-shadow

bookwyrm/static/css/vendor/bulma/sass/elements/button.sass

@@ -0,0 +1,345 @@
+@import "../utilities/controls"
+@import "../utilities/mixins"
+
+$button-color: $text-strong !default
+$button-background-color: $scheme-main !default
+$button-family: false !default
+
+$button-border-color: $border !default
+$button-border-width: $control-border-width !default
+
+$button-padding-vertical: calc(0.5em - #{$button-border-width}) !default
+$button-padding-horizontal: 1em !default
+
+$button-hover-color: $link-hover !default
+$button-hover-border-color: $link-hover-border !default
+
+$button-focus-color: $link-focus !default
+$button-focus-border-color: $link-focus-border !default
+$button-focus-box-shadow-size: 0 0 0 0.125em !default
+$button-focus-box-shadow-color: bulmaRgba($link, 0.25) !default
+
+$button-active-color: $link-active !default
+$button-active-border-color: $link-active-border !default
+
+$button-text-color: $text !default
+$button-text-decoration: underline !default
+$button-text-hover-background-color: $background !default
+$button-text-hover-color: $text-strong !default
+
+$button-ghost-background: none !default
+$button-ghost-border-color: transparent !default
+$button-ghost-color: $link !default
+$button-ghost-decoration: none !default
+$button-ghost-hover-color: $link !default
+$button-ghost-hover-decoration: underline !default
+
+$button-disabled-background-color: $scheme-main !default
+$button-disabled-border-color: $border !default
+$button-disabled-shadow: none !default
+$button-disabled-opacity: 0.5 !default
+
+$button-static-color: $text-light !default
+$button-static-background-color: $scheme-main-ter !default
+$button-static-border-color: $border !default
+
+$button-colors: $colors !default
+
+// The button sizes use mixins so they can be used at different breakpoints
+=button-small
+  &:not(.is-rounded)
+    border-radius: $radius-small
+  font-size: $size-small
+=button-normal
+  font-size: $size-normal
+=button-medium
+  font-size: $size-medium
+=button-large
+  font-size: $size-large
+
+.button
+  @extend %control
+  @extend %unselectable
+  background-color: $button-background-color
+  border-color: $button-border-color
+  border-width: $button-border-width
+  color: $button-color
+  cursor: pointer
+  @if $button-family
+    font-family: $button-family
+  justify-content: center
+  padding-bottom: $button-padding-vertical
+  padding-left: $button-padding-horizontal
+  padding-right: $button-padding-horizontal
+  padding-top: $button-padding-vertical
+  text-align: center
+  white-space: nowrap
+  strong
+    color: inherit
+  .icon
+    &,
+    &.is-small,
+    &.is-medium,
+    &.is-large
+      height: 1.5em
+      width: 1.5em
+    &:first-child:not(:last-child)
+      +ltr-property("margin", calc(#{-0.5 * $button-padding-horizontal} - #{$button-border-width}), false)
+      +ltr-property("margin", $button-padding-horizontal * 0.25)
+    &:last-child:not(:first-child)
+      +ltr-property("margin", $button-padding-horizontal * 0.25, false)
+      +ltr-property("margin", calc(#{-0.5 * $button-padding-horizontal} - #{$button-border-width}))
+    &:first-child:last-child
+      margin-left: calc(#{-0.5 * $button-padding-horizontal} - #{$button-border-width})
+      margin-right: calc(#{-0.5 * $button-padding-horizontal} - #{$button-border-width})
+  // States
+  &:hover,
+  &.is-hovered
+    border-color: $button-hover-border-color
+    color: $button-hover-color
+  &:focus,
+  &.is-focused
+    border-color: $button-focus-border-color
+    color: $button-focus-color
+    &:not(:active)
+      box-shadow: $button-focus-box-shadow-size $button-focus-box-shadow-color
+  &:active,
+  &.is-active
+    border-color: $button-active-border-color
+    color: $button-active-color
+  // Colors
+  &.is-text
+    background-color: transparent
+    border-color: transparent
+    color: $button-text-color
+    text-decoration: $button-text-decoration
+    &:hover,
+    &.is-hovered,
+    &:focus,
+    &.is-focused
+      background-color: $button-text-hover-background-color
+      color: $button-text-hover-color
+    &:active,
+    &.is-active
+      background-color: bulmaDarken($button-text-hover-background-color, 5%)
+      color: $button-text-hover-color
+    &[disabled],
+    fieldset[disabled] &
+      background-color: transparent
+      border-color: transparent
+      box-shadow: none
+  &.is-ghost
+    background: $button-ghost-background
+    border-color: $button-ghost-border-color
+    color: $button-ghost-color
+    text-decoration: $button-ghost-decoration
+    &:hover,
+    &.is-hovered
+      color: $button-ghost-hover-color
+      text-decoration: $button-ghost-hover-decoration
+  @each $name, $pair in $button-colors
+    $color: nth($pair, 1)
+    $color-invert: nth($pair, 2)
+    &.is-#{$name}
+      background-color: $color
+      border-color: transparent
+      color: $color-invert
+      &:hover,
+      &.is-hovered
+        background-color: bulmaDarken($color, 2.5%)
+        border-color: transparent
+        color: $color-invert
+      &:focus,
+      &.is-focused
+        border-color: transparent
+        color: $color-invert
+        &:not(:active)
+          box-shadow: $button-focus-box-shadow-size bulmaRgba($color, 0.25)
+      &:active,
+      &.is-active
+        background-color: bulmaDarken($color, 5%)
+        border-color: transparent
+        color: $color-invert
+      &[disabled],
+      fieldset[disabled] &
+        background-color: $color
+        border-color: transparent
+        box-shadow: none
+      &.is-inverted
+        background-color: $color-invert
+        color: $color
+        &:hover,
+        &.is-hovered
+          background-color: bulmaDarken($color-invert, 5%)
+        &[disabled],
+        fieldset[disabled] &
+          background-color: $color-invert
+          border-color: transparent
+          box-shadow: none
+          color: $color
+      &.is-loading
+        &::after
+          border-color: transparent transparent $color-invert $color-invert !important
+      &.is-outlined
+        background-color: transparent
+        border-color: $color
+        color: $color
+        &:hover,
+        &.is-hovered,
+        &:focus,
+        &.is-focused
+          background-color: $color
+          border-color: $color
+          color: $color-invert
+        &.is-loading
+          &::after
+            border-color: transparent transparent $color $color !important
+          &:hover,
+          &.is-hovered,
+          &:focus,
+          &.is-focused
+            &::after
+              border-color: transparent transparent $color-invert $color-invert !important
+        &[disabled],
+        fieldset[disabled] &
+          background-color: transparent
+          border-color: $color
+          box-shadow: none
+          color: $color
+      &.is-inverted.is-outlined
+        background-color: transparent
+        border-color: $color-invert
+        color: $color-invert
+        &:hover,
+        &.is-hovered,
+        &:focus,
+        &.is-focused
+          background-color: $color-invert
+          color: $color
+        &.is-loading
+          &:hover,
+          &.is-hovered,
+          &:focus,
+          &.is-focused
+            &::after
+              border-color: transparent transparent $color $color !important
+        &[disabled],
+        fieldset[disabled] &
+          background-color: transparent
+          border-color: $color-invert
+          box-shadow: none
+          color: $color-invert
+      // If light and dark colors are provided
+      @if length($pair) >= 4
+        $color-light: nth($pair, 3)
+        $color-dark: nth($pair, 4)
+        &.is-light
+          background-color: $color-light
+          color: $color-dark
+          &:hover,
+          &.is-hovered
+            background-color: bulmaDarken($color-light, 2.5%)
+            border-color: transparent
+            color: $color-dark
+          &:active,
+          &.is-active
+            background-color: bulmaDarken($color-light, 5%)
+            border-color: transparent
+            color: $color-dark
+  // Sizes
+  &.is-small
+    +button-small
+  &.is-normal
+    +button-normal
+  &.is-medium
+    +button-medium
+  &.is-large
+    +button-large
+  // Modifiers
+  &[disabled],
+  fieldset[disabled] &
+    background-color: $button-disabled-background-color
+    border-color: $button-disabled-border-color
+    box-shadow: $button-disabled-shadow
+    opacity: $button-disabled-opacity
+  &.is-fullwidth
+    display: flex
+    width: 100%
+  &.is-loading
+    color: transparent !important
+    pointer-events: none
+    &::after
+      @extend %loader
+      +center(1em)
+      position: absolute !important
+  &.is-static
+    background-color: $button-static-background-color
+    border-color: $button-static-border-color
+    color: $button-static-color
+    box-shadow: none
+    pointer-events: none
+  &.is-rounded
+    border-radius: $radius-rounded
+    padding-left: calc(#{$button-padding-horizontal} + 0.25em)
+    padding-right: calc(#{$button-padding-horizontal} + 0.25em)
+
+.buttons
+  align-items: center
+  display: flex
+  flex-wrap: wrap
+  justify-content: flex-start
+  .button
+    margin-bottom: 0.5rem
+    &:not(:last-child):not(.is-fullwidth)
+      +ltr-property("margin", 0.5rem)
+  &:last-child
+    margin-bottom: -0.5rem
+  &:not(:last-child)
+    margin-bottom: 1rem
+  // Sizes
+  &.are-small
+    .button:not(.is-normal):not(.is-medium):not(.is-large)
+      +button-small
+  &.are-medium
+    .button:not(.is-small):not(.is-normal):not(.is-large)
+      +button-medium
+  &.are-large
+    .button:not(.is-small):not(.is-normal):not(.is-medium)
+      +button-large
+  &.has-addons
+    .button
+      &:not(:first-child)
+        border-bottom-left-radius: 0
+        border-top-left-radius: 0
+      &:not(:last-child)
+        border-bottom-right-radius: 0
+        border-top-right-radius: 0
+        +ltr-property("margin", -1px)
+      &:last-child
+        +ltr-property("margin", 0)
+      &:hover,
+      &.is-hovered
+        z-index: 2
+      &:focus,
+      &.is-focused,
+      &:active,
+      &.is-active,
+      &.is-selected
+        z-index: 3
+        &:hover
+          z-index: 4
+      &.is-expanded
+        flex-grow: 1
+        flex-shrink: 1
+  &.is-centered
+    justify-content: center
+    &:not(.has-addons)
+      .button:not(.is-fullwidth)
+        margin-left: 0.25rem
+        margin-right: 0.25rem
+  &.is-right
+    justify-content: flex-end
+    &:not(.has-addons)
+      .button:not(.is-fullwidth)
+        margin-left: 0.25rem
+        margin-right: 0.25rem

bookwyrm/static/css/vendor/bulma/sass/elements/container.sass

@@ -0,0 +1,29 @@
+@import "../utilities/mixins"
+
+$container-offset: (2 * $gap) !default
+$container-max-width: $fullhd !default
+
+.container
+  flex-grow: 1
+  margin: 0 auto
+  position: relative
+  width: auto
+  &.is-fluid
+    max-width: none !important
+    padding-left: $gap
+    padding-right: $gap
+    width: 100%
+  +desktop
+    max-width: $desktop - $container-offset
+  +until-widescreen
+    &.is-widescreen:not(.is-max-desktop)
+      max-width: min($widescreen, $container-max-width) - $container-offset
+  +until-fullhd
+    &.is-fullhd:not(.is-max-desktop):not(.is-max-widescreen)
+      max-width: min($fullhd, $container-max-width) - $container-offset
+  +widescreen
+    &:not(.is-max-desktop)
+      max-width: min($widescreen, $container-max-width) - $container-offset
+  +fullhd
+    &:not(.is-max-desktop):not(.is-max-widescreen)
+      max-width: min($fullhd, $container-max-width) - $container-offset

bookwyrm/static/css/vendor/bulma/sass/elements/content.sass

@@ -0,0 +1,159 @@
+@import "../utilities/mixins"
+
+$content-heading-color: $text-strong !default
+$content-heading-weight: $weight-semibold !default
+$content-heading-line-height: 1.125 !default
+
+$content-blockquote-background-color: $background !default
+$content-blockquote-border-left: 5px solid $border !default
+$content-blockquote-padding: 1.25em 1.5em !default
+
+$content-pre-padding: 1.25em 1.5em !default
+
+$content-table-cell-border: 1px solid $border !default
+$content-table-cell-border-width: 0 0 1px !default
+$content-table-cell-padding: 0.5em 0.75em !default
+$content-table-cell-heading-color: $text-strong !default
+$content-table-head-cell-border-width: 0 0 2px !default
+$content-table-head-cell-color: $text-strong !default
+$content-table-foot-cell-border-width: 2px 0 0 !default
+$content-table-foot-cell-color: $text-strong !default
+
+.content
+  @extend %block
+  // Inline
+  li + li
+    margin-top: 0.25em
+  // Block
+  p,
+  dl,
+  ol,
+  ul,
+  blockquote,
+  pre,
+  table
+    &:not(:last-child)
+      margin-bottom: 1em
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6
+    color: $content-heading-color
+    font-weight: $content-heading-weight
+    line-height: $content-heading-line-height
+  h1
+    font-size: 2em
+    margin-bottom: 0.5em
+    &:not(:first-child)
+      margin-top: 1em
+  h2
+    font-size: 1.75em
+    margin-bottom: 0.5714em
+    &:not(:first-child)
+      margin-top: 1.1428em
+  h3
+    font-size: 1.5em
+    margin-bottom: 0.6666em
+    &:not(:first-child)
+      margin-top: 1.3333em
+  h4
+    font-size: 1.25em
+    margin-bottom: 0.8em
+  h5
+    font-size: 1.125em
+    margin-bottom: 0.8888em
+  h6
+    font-size: 1em
+    margin-bottom: 1em
+  blockquote
+    background-color: $content-blockquote-background-color
+    +ltr-property("border", $content-blockquote-border-left, false)
+    padding: $content-blockquote-padding
+  ol
+    list-style-position: outside
+    +ltr-property("margin", 2em, false)
+    margin-top: 1em
+    &:not([type])
+      list-style-type: decimal
+      &.is-lower-alpha
+        list-style-type: lower-alpha
+      &.is-lower-roman
+        list-style-type: lower-roman
+      &.is-upper-alpha
+        list-style-type: upper-alpha
+      &.is-upper-roman
+        list-style-type: upper-roman
+  ul
+    list-style: disc outside
+    +ltr-property("margin", 2em, false)
+    margin-top: 1em
+    ul
+      list-style-type: circle
+      margin-top: 0.5em
+      ul
+        list-style-type: square
+  dd
+    +ltr-property("margin", 2em, false)
+  figure
+    margin-left: 2em
+    margin-right: 2em
+    text-align: center
+    &:not(:first-child)
+      margin-top: 2em
+    &:not(:last-child)
+      margin-bottom: 2em
+    img
+      display: inline-block
+    figcaption
+      font-style: italic
+  pre
+    +overflow-touch
+    overflow-x: auto
+    padding: $content-pre-padding
+    white-space: pre
+    word-wrap: normal
+  sup,
+  sub
+    font-size: 75%
+  table
+    width: 100%
+    td,
+    th
+      border: $content-table-cell-border
+      border-width: $content-table-cell-border-width
+      padding: $content-table-cell-padding
+      vertical-align: top
+    th
+      color: $content-table-cell-heading-color
+      &:not([align])
+        text-align: inherit
+    thead
+      td,
+      th
+        border-width: $content-table-head-cell-border-width
+        color: $content-table-head-cell-color
+    tfoot
+      td,
+      th
+        border-width: $content-table-foot-cell-border-width
+        color: $content-table-foot-cell-color
+    tbody
+      tr
+        &:last-child
+          td,
+          th
+            border-bottom-width: 0
+  .tabs
+    li + li
+      margin-top: 0
+  // Sizes
+  &.is-small
+    font-size: $size-small
+  &.is-normal
+    font-size: $size-normal
+  &.is-medium
+    font-size: $size-medium
+  &.is-large
+    font-size: $size-large

bookwyrm/static/css/vendor/bulma/sass/elements/form.sass

@@ -0,0 +1 @@
+@warn "The form.sass file is DEPRECATED. It has moved into its own /form folder. Please import sass/form/_all instead."

bookwyrm/static/css/vendor/bulma/sass/elements/icon.sass

@@ -0,0 +1,46 @@
+$icon-dimensions: 1.5rem !default
+$icon-dimensions-small: 1rem !default
+$icon-dimensions-medium: 2rem !default
+$icon-dimensions-large: 3rem !default
+$icon-text-spacing: 0.25em !default
+
+.icon
+  align-items: center
+  display: inline-flex
+  justify-content: center
+  height: $icon-dimensions
+  width: $icon-dimensions
+  // Sizes
+  &.is-small
+    height: $icon-dimensions-small
+    width: $icon-dimensions-small
+  &.is-medium
+    height: $icon-dimensions-medium
+    width: $icon-dimensions-medium
+  &.is-large
+    height: $icon-dimensions-large
+    width: $icon-dimensions-large
+
+.icon-text
+  align-items: flex-start
+  color: inherit
+  display: inline-flex
+  flex-wrap: wrap
+  line-height: $icon-dimensions
+  vertical-align: top
+  .icon
+    flex-grow: 0
+    flex-shrink: 0
+    &:not(:last-child)
+      +ltr
+        margin-right: $icon-text-spacing
+      +rtl
+        margin-left: $icon-text-spacing
+    &:not(:first-child)
+      +ltr
+        margin-left: $icon-text-spacing
+      +rtl
+        margin-right: $icon-text-spacing
+
+div.icon-text
+  display: flex

bookwyrm/static/css/vendor/bulma/sass/elements/image.sass

@@ -0,0 +1,73 @@
+@import "../utilities/mixins"
+
+$dimensions: 16 24 32 48 64 96 128 !default
+
+.image
+  display: block
+  position: relative
+  img
+    display: block
+    height: auto
+    width: 100%
+    &.is-rounded
+      border-radius: $radius-rounded
+  &.is-fullwidth
+    width: 100%
+  // Ratio
+  &.is-square,
+  &.is-1by1,
+  &.is-5by4,
+  &.is-4by3,
+  &.is-3by2,
+  &.is-5by3,
+  &.is-16by9,
+  &.is-2by1,
+  &.is-3by1,
+  &.is-4by5,
+  &.is-3by4,
+  &.is-2by3,
+  &.is-3by5,
+  &.is-9by16,
+  &.is-1by2,
+  &.is-1by3
+    img,
+    .has-ratio
+      @extend %overlay
+      height: 100%
+      width: 100%
+  &.is-square,
+  &.is-1by1
+    padding-top: 100%
+  &.is-5by4
+    padding-top: 80%
+  &.is-4by3
+    padding-top: 75%
+  &.is-3by2
+    padding-top: 66.6666%
+  &.is-5by3
+    padding-top: 60%
+  &.is-16by9
+    padding-top: 56.25%
+  &.is-2by1
+    padding-top: 50%
+  &.is-3by1
+    padding-top: 33.3333%
+  &.is-4by5
+    padding-top: 125%
+  &.is-3by4
+    padding-top: 133.3333%
+  &.is-2by3
+    padding-top: 150%
+  &.is-3by5
+    padding-top: 166.6666%
+  &.is-9by16
+    padding-top: 177.7777%
+  &.is-1by2
+    padding-top: 200%
+  &.is-1by3
+    padding-top: 300%
+  // Sizes
+  @each $dimension in $dimensions
+    &.is-#{$dimension}x#{$dimension}
+      height: $dimension * 1px
+      width: $dimension * 1px

bookwyrm/static/css/vendor/bulma/sass/elements/notification.sass

@@ -0,0 +1,52 @@
+@import "../utilities/mixins"
+
+$notification-background-color: $background !default
+$notification-code-background-color: $scheme-main !default
+$notification-radius: $radius !default
+$notification-padding: 1.25rem 2.5rem 1.25rem 1.5rem !default
+$notification-padding-ltr: 1.25rem 2.5rem 1.25rem 1.5rem !default
+$notification-padding-rtl: 1.25rem 1.5rem 1.25rem 2.5rem !default
+
+$notification-colors: $colors !default
+
+.notification
+  @extend %block
+  background-color: $notification-background-color
+  border-radius: $notification-radius
+  position: relative
+  +ltr
+    padding: $notification-padding-ltr
+  +rtl
+    padding: $notification-padding-rtl
+  a:not(.button):not(.dropdown-item)
+    color: currentColor
+    text-decoration: underline
+  strong
+    color: currentColor
+  code,
+  pre
+    background: $notification-code-background-color
+  pre code
+    background: transparent
+  & > .delete
+    +ltr-position(0.5rem)
+    position: absolute
+    top: 0.5rem
+  .title,
+  .subtitle,
+  .content
+    color: currentColor
+  // Colors
+  @each $name, $pair in $notification-colors
+    $color: nth($pair, 1)
+    $color-invert: nth($pair, 2)
+    &.is-#{$name}
+      background-color: $color
+      color: $color-invert
+      // If light and dark colors are provided
+      @if length($pair) >= 4
+        $color-light: nth($pair, 3)
+        $color-dark: nth($pair, 4)
+        &.is-light
+          background-color: $color-light
+          color: $color-dark

bookwyrm/static/css/vendor/bulma/sass/elements/other.sass

@@ -0,0 +1,31 @@
+@import "../utilities/mixins"
+
+.block
+  @extend %block
+
+.delete
+  @extend %delete
+
+.heading
+  display: block
+  font-size: 11px
+  letter-spacing: 1px
+  margin-bottom: 5px
+  text-transform: uppercase
+
+.loader
+  @extend %loader
+
+.number
+  align-items: center
+  background-color: $background
+  border-radius: $radius-rounded
+  display: inline-flex
+  font-size: $size-medium
+  height: 2em
+  justify-content: center
+  margin-right: 1.5rem
+  min-width: 2.5em
+  padding: 0.25rem 0.5rem
+  text-align: center
+  vertical-align: top

bookwyrm/static/css/vendor/bulma/sass/elements/progress.sass

@@ -0,0 +1,73 @@
+@import "../utilities/mixins"
+
+$progress-bar-background-color: $border-light !default
+$progress-value-background-color: $text !default
+$progress-border-radius: $radius-rounded !default
+
+$progress-indeterminate-duration: 1.5s !default
+
+$progress-colors: $colors !default
+
+.progress
+  @extend %block
+  -moz-appearance: none
+  -webkit-appearance: none
+  border: none
+  border-radius: $progress-border-radius
+  display: block
+  height: $size-normal
+  overflow: hidden
+  padding: 0
+  width: 100%
+  &::-webkit-progress-bar
+    background-color: $progress-bar-background-color
+  &::-webkit-progress-value
+    background-color: $progress-value-background-color
+  &::-moz-progress-bar
+    background-color: $progress-value-background-color
+  &::-ms-fill
+    background-color: $progress-value-background-color
+    border: none
+  // Colors
+  @each $name, $pair in $progress-colors
+    $color: nth($pair, 1)
+    &.is-#{$name}
+      &::-webkit-progress-value
+        background-color: $color
+      &::-moz-progress-bar
+        background-color: $color
+      &::-ms-fill
+        background-color: $color
+      &:indeterminate
+        background-image: linear-gradient(to right, $color 30%, $progress-bar-background-color 30%)
+
+  &:indeterminate
+    animation-duration: $progress-indeterminate-duration
+    animation-iteration-count: infinite
+    animation-name: moveIndeterminate
+    animation-timing-function: linear
+    background-color: $progress-bar-background-color
+    background-image: linear-gradient(to right, $text 30%, $progress-bar-background-color 30%)
+    background-position: top left
+    background-repeat: no-repeat
+    background-size: 150% 150%
+    &::-webkit-progress-bar
+      background-color: transparent
+    &::-moz-progress-bar
+      background-color: transparent
+    &::-ms-fill
+      animation-name: none
+
+  // Sizes
+  &.is-small
+    height: $size-small
+  &.is-medium
+    height: $size-medium
+  &.is-large
+    height: $size-large
+
+@keyframes moveIndeterminate
+  from
+    background-position: 200% 0
+  to
+    background-position: -200% 0

bookwyrm/static/css/vendor/bulma/sass/elements/table.sass

@@ -0,0 +1,133 @@
+@import "../utilities/mixins"
+
+$table-color: $text-strong !default
+$table-background-color: $scheme-main !default
+
+$table-cell-border: 1px solid $border !default
+$table-cell-border-width: 0 0 1px !default
+$table-cell-padding: 0.5em 0.75em !default
+$table-cell-heading-color: $text-strong !default
+
+$table-head-cell-border-width: 0 0 2px !default
+$table-head-cell-color: $text-strong !default
+$table-foot-cell-border-width: 2px 0 0 !default
+$table-foot-cell-color: $text-strong !default
+
+$table-head-background-color: transparent !default
+$table-body-background-color: transparent !default
+$table-foot-background-color: transparent !default
+
+$table-row-hover-background-color: $scheme-main-bis !default
+
+$table-row-active-background-color: $primary !default
+$table-row-active-color: $primary-invert !default
+
+$table-striped-row-even-background-color: $scheme-main-bis !default
+$table-striped-row-even-hover-background-color: $scheme-main-ter !default
+
+$table-colors: $colors !default
+
+.table
+  @extend %block
+  background-color: $table-background-color
+  color: $table-color
+  td,
+  th
+    border: $table-cell-border
+    border-width: $table-cell-border-width
+    padding: $table-cell-padding
+    vertical-align: top
+    // Colors
+    @each $name, $pair in $table-colors
+      $color: nth($pair, 1)
+      $color-invert: nth($pair, 2)
+      &.is-#{$name}
+        background-color: $color
+        border-color: $color
+        color: $color-invert
+    // Modifiers
+    &.is-narrow
+      white-space: nowrap
+      width: 1%
+    &.is-selected
+      background-color: $table-row-active-background-color
+      color: $table-row-active-color
+      a,
+      strong
+        color: currentColor
+    &.is-vcentered
+      vertical-align: middle
+  th
+    color: $table-cell-heading-color
+    &:not([align])
+      text-align: inherit
+  tr
+    &.is-selected
+      background-color: $table-row-active-background-color
+      color: $table-row-active-color
+      a,
+      strong
+        color: currentColor
+      td,
+      th
+        border-color: $table-row-active-color
+        color: currentColor
+  thead
+    background-color: $table-head-background-color
+    td,
+    th
+      border-width: $table-head-cell-border-width
+      color: $table-head-cell-color
+  tfoot
+    background-color: $table-foot-background-color
+    td,
+    th
+      border-width: $table-foot-cell-border-width
+      color: $table-foot-cell-color
+  tbody
+    background-color: $table-body-background-color
+    tr
+      &:last-child
+        td,
+        th
+          border-bottom-width: 0
+  // Modifiers
+  &.is-bordered
+    td,
+    th
+      border-width: 1px
+    tr
+      &:last-child
+        td,
+        th
+          border-bottom-width: 1px
+  &.is-fullwidth
+    width: 100%
+  &.is-hoverable
+    tbody
+      tr:not(.is-selected)
+        &:hover
+          background-color: $table-row-hover-background-color
+    &.is-striped
+      tbody
+        tr:not(.is-selected)
+          &:hover
+            background-color: $table-row-hover-background-color
+            &:nth-child(even)
+              background-color: $table-striped-row-even-hover-background-color
+  &.is-narrow
+    td,
+    th
+      padding: 0.25em 0.5em
+  &.is-striped
+    tbody
+      tr:not(.is-selected)
+        &:nth-child(even)
+          background-color: $table-striped-row-even-background-color
+
+.table-container
+  @extend %block
+  +overflow-touch
+  overflow: auto
+  overflow-y: hidden
+  max-width: 100%

bookwyrm/static/css/vendor/bulma/sass/elements/tag.sass

@@ -0,0 +1,140 @@
+@import "../utilities/mixins"
+
+$tag-background-color: $background !default
+$tag-color: $text !default
+$tag-radius: $radius !default
+$tag-delete-margin: 1px !default
+
+$tag-colors: $colors !default
+
+.tags
+  align-items: center
+  display: flex
+  flex-wrap: wrap
+  justify-content: flex-start
+  .tag
+    margin-bottom: 0.5rem
+    &:not(:last-child)
+      +ltr-property("margin", 0.5rem)
+  &:last-child
+    margin-bottom: -0.5rem
+  &:not(:last-child)
+    margin-bottom: 1rem
+  // Sizes
+  &.are-medium
+    .tag:not(.is-normal):not(.is-large)
+      font-size: $size-normal
+  &.are-large
+    .tag:not(.is-normal):not(.is-medium)
+      font-size: $size-medium
+  &.is-centered
+    justify-content: center
+    .tag
+      margin-right: 0.25rem
+      margin-left: 0.25rem
+  &.is-right
+    justify-content: flex-end
+    .tag
+      &:not(:first-child)
+        margin-left: 0.5rem
+      &:not(:last-child)
+        margin-right: 0
+  &.has-addons
+    .tag
+      +ltr-property("margin", 0)
+      &:not(:first-child)
+        +ltr-property("margin", 0, false)
+        +ltr
+          border-top-left-radius: 0
+          border-bottom-left-radius: 0
+        +rtl
+          border-top-right-radius: 0
+          border-bottom-right-radius: 0
+      &:not(:last-child)
+        +ltr
+          border-top-right-radius: 0
+          border-bottom-right-radius: 0
+        +rtl
+          border-top-left-radius: 0
+          border-bottom-left-radius: 0
+
+.tag:not(body)
+  align-items: center
+  background-color: $tag-background-color
+  border-radius: $tag-radius
+  color: $tag-color
+  display: inline-flex
+  font-size: $size-small
+  height: 2em
+  justify-content: center
+  line-height: 1.5
+  padding-left: 0.75em
+  padding-right: 0.75em
+  white-space: nowrap
+  .delete
+    +ltr-property("margin", 0.25rem, false)
+    +ltr-property("margin", -0.375rem)
+  // Colors
+  @each $name, $pair in $tag-colors
+    $color: nth($pair, 1)
+    $color-invert: nth($pair, 2)
+    &.is-#{$name}
+      background-color: $color
+      color: $color-invert
+      // If a light and dark colors are provided
+      @if length($pair) > 3
+        $color-light: nth($pair, 3)
+        $color-dark: nth($pair, 4)
+        &.is-light
+          background-color: $color-light
+          color: $color-dark
+  // Sizes
+  &.is-normal
+    font-size: $size-small
+  &.is-medium
+    font-size: $size-normal
+  &.is-large
+    font-size: $size-medium
+  .icon
+    &:first-child:not(:last-child)
+      +ltr-property("margin", -0.375em, false)
+      +ltr-property("margin", 0.1875em)
+    &:last-child:not(:first-child)
+      +ltr-property("margin", 0.1875em, false)
+      +ltr-property("margin", -0.375em)
+    &:first-child:last-child
+      +ltr-property("margin", -0.375em, false)
+      +ltr-property("margin", -0.375em)
+  // Modifiers
+  &.is-delete
+    +ltr-property("margin", $tag-delete-margin, false)
+    padding: 0
+    position: relative
+    width: 2em
+    &::before,
+    &::after
+      background-color: currentColor
+      content: ""
+      display: block
+      left: 50%
+      position: absolute
+      top: 50%
+      transform: translateX(-50%) translateY(-50%) rotate(45deg)
+      transform-origin: center center
+    &::before
+      height: 1px
+      width: 50%
+    &::after
+      height: 50%
+      width: 1px
+    &:hover,
+    &:focus
+      background-color: darken($tag-background-color, 5%)
+    &:active
+      background-color: darken($tag-background-color, 10%)
+  &.is-rounded
+    border-radius: $radius-rounded
+
+a.tag
+  &:hover
+    text-decoration: underline

bookwyrm/static/css/vendor/bulma/sass/elements/title.sass

@@ -0,0 +1,70 @@
+@import "../utilities/mixins"
+
+$title-color: $text-strong !default
+$title-family: false !default
+$title-size: $size-3 !default
+$title-weight: $weight-semibold !default
+$title-line-height: 1.125 !default
+$title-strong-color: inherit !default
+$title-strong-weight: inherit !default
+$title-sub-size: 0.75em !default
+$title-sup-size: 0.75em !default
+
+$subtitle-color: $text !default
+$subtitle-family: false !default
+$subtitle-size: $size-5 !default
+$subtitle-weight: $weight-normal !default
+$subtitle-line-height: 1.25 !default
+$subtitle-strong-color: $text-strong !default
+$subtitle-strong-weight: $weight-semibold !default
+$subtitle-negative-margin: -1.25rem !default
+
+.title,
+.subtitle
+  @extend %block
+  word-break: break-word
+  em,
+  span
+    font-weight: inherit
+  sub
+    font-size: $title-sub-size
+  sup
+    font-size: $title-sup-size
+  .tag
+    vertical-align: middle
+
+.title
+  color: $title-color
+  @if $title-family
+    font-family: $title-family
+  font-size: $title-size
+  font-weight: $title-weight
+  line-height: $title-line-height
+  strong
+    color: $title-strong-color
+    font-weight: $title-strong-weight
+  &:not(.is-spaced) + .subtitle
+    margin-top: $subtitle-negative-margin
+  // Sizes
+  @each $size in $sizes
+    $i: index($sizes, $size)
+    &.is-#{$i}
+      font-size: $size
+
+.subtitle
+  color: $subtitle-color
+  @if $subtitle-family
+    font-family: $subtitle-family
+  font-size: $subtitle-size
+  font-weight: $subtitle-weight
+  line-height: $subtitle-line-height
+  strong
+    color: $subtitle-strong-color
+    font-weight: $subtitle-strong-weight
+  &:not(.is-spaced) + .title
+    margin-top: $subtitle-negative-margin
+  // Sizes
+  @each $size in $sizes
+    $i: index($sizes, $size)
+    &.is-#{$i}
+      font-size: $size

bookwyrm/static/css/vendor/bulma/sass/form/_all.sass

@@ -0,0 +1,9 @@
+/* Bulma Form */
+@charset "utf-8"
+
+@import "shared"
+@import "input-textarea"
+@import "checkbox-radio"
+@import "select"
+@import "file"
+@import "tools"

bookwyrm/static/css/vendor/bulma/sass/form/checkbox-radio.sass

@@ -0,0 +1,22 @@
+%checkbox-radio
+  cursor: pointer
+  display: inline-block
+  line-height: 1.25
+  position: relative
+  input
+    cursor: pointer
+  &:hover
+    color: $input-hover-color
+  &[disabled],
+  fieldset[disabled] &,
+  input[disabled]
+    color: $input-disabled-color
+    cursor: not-allowed
+
+.checkbox
+  @extend %checkbox-radio
+
+.radio
+  @extend %checkbox-radio
+  & + .radio
+    +ltr-property("margin", 0.5em, false)

bookwyrm/static/css/vendor/bulma/sass/form/file.sass

@@ -0,0 +1,184 @@
+$file-border-color: $border !default
+$file-radius: $radius !default
+
+$file-cta-background-color: $scheme-main-ter !default
+$file-cta-color: $text !default
+$file-cta-hover-color: $text-strong !default
+$file-cta-active-color: $text-strong !default
+
+$file-name-border-color: $border !default
+$file-name-border-style: solid !default
+$file-name-border-width: 1px 1px 1px 0 !default
+$file-name-max-width: 16em !default
+
+$file-colors: $form-colors !default
+
+.file
+  @extend %unselectable
+  align-items: stretch
+  display: flex
+  justify-content: flex-start
+  position: relative
+  // Colors
+  @each $name, $pair in $file-colors
+    $color: nth($pair, 1)
+    $color-invert: nth($pair, 2)
+    &.is-#{$name}
+      .file-cta
+        background-color: $color
+        border-color: transparent
+        color: $color-invert
+      &:hover,
+      &.is-hovered
+        .file-cta
+          background-color: bulmaDarken($color, 2.5%)
+          border-color: transparent
+          color: $color-invert
+      &:focus,
+      &.is-focused
+        .file-cta
+          border-color: transparent
+          box-shadow: 0 0 0.5em bulmaRgba($color, 0.25)
+          color: $color-invert
+      &:active,
+      &.is-active
+        .file-cta
+          background-color: bulmaDarken($color, 5%)
+          border-color: transparent
+          color: $color-invert
+  // Sizes
+  &.is-small
+    font-size: $size-small
+  &.is-normal
+    font-size: $size-normal
+  &.is-medium
+    font-size: $size-medium
+    .file-icon
+      .fa
+        font-size: 21px
+  &.is-large
+    font-size: $size-large
+    .file-icon
+      .fa
+        font-size: 28px
+  // Modifiers
+  &.has-name
+    .file-cta
+      border-bottom-right-radius: 0
+      border-top-right-radius: 0
+    .file-name
+      border-bottom-left-radius: 0
+      border-top-left-radius: 0
+    &.is-empty
+      .file-cta
+        border-radius: $file-radius
+      .file-name
+        display: none
+  &.is-boxed
+    .file-label
+      flex-direction: column
+    .file-cta
+      flex-direction: column
+      height: auto
+      padding: 1em 3em
+    .file-name
+      border-width: 0 1px 1px
+    .file-icon
+      height: 1.5em
+      width: 1.5em
+      .fa
+        font-size: 21px
+    &.is-small
+      .file-icon .fa
+        font-size: 14px
+    &.is-medium
+      .file-icon .fa
+        font-size: 28px
+    &.is-large
+      .file-icon .fa
+        font-size: 35px
+    &.has-name
+      .file-cta
+        border-radius: $file-radius $file-radius 0 0
+      .file-name
+        border-radius: 0 0 $file-radius $file-radius
+        border-width: 0 1px 1px
+  &.is-centered
+    justify-content: center
+  &.is-fullwidth
+    .file-label
+      width: 100%
+    .file-name
+      flex-grow: 1
+      max-width: none
+  &.is-right
+    justify-content: flex-end
+    .file-cta
+      border-radius: 0 $file-radius $file-radius 0
+    .file-name
+      border-radius: $file-radius 0 0 $file-radius
+      border-width: 1px 0 1px 1px
+      order: -1
+
+.file-label
+  align-items: stretch
+  display: flex
+  cursor: pointer
+  justify-content: flex-start
+  overflow: hidden
+  position: relative
+  &:hover
+    .file-cta
+      background-color: bulmaDarken($file-cta-background-color, 2.5%)
+      color: $file-cta-hover-color
+    .file-name
+      border-color: bulmaDarken($file-name-border-color, 2.5%)
+  &:active
+    .file-cta
+      background-color: bulmaDarken($file-cta-background-color, 5%)
+      color: $file-cta-active-color
+    .file-name
+      border-color: bulmaDarken($file-name-border-color, 5%)
+
+.file-input
+  height: 100%
+  left: 0
+  opacity: 0
+  outline: none
+  position: absolute
+  top: 0
+  width: 100%
+
+.file-cta,
+.file-name
+  @extend %control
+  border-color: $file-border-color
+  border-radius: $file-radius
+  font-size: 1em
+  padding-left: 1em
+  padding-right: 1em
+  white-space: nowrap
+
+.file-cta
+  background-color: $file-cta-background-color
+  color: $file-cta-color
+
+.file-name
+  border-color: $file-name-border-color
+  border-style: $file-name-border-style
+  border-width: $file-name-border-width
+  display: block
+  max-width: $file-name-max-width
+  overflow: hidden
+  text-align: inherit
+  text-overflow: ellipsis
+
+.file-icon
+  align-items: center
+  display: flex
+  height: 1em
+  justify-content: center
+  +ltr-property("margin", 0.5em)
+  width: 1em
+  .fa
+    font-size: 14px

bookwyrm/static/css/vendor/bulma/sass/form/input-textarea.sass

@@ -0,0 +1,66 @@
+$textarea-padding: $control-padding-horizontal !default
+$textarea-max-height: 40em !default
+$textarea-min-height: 8em !default
+
+$textarea-colors: $form-colors !default
+
+%input-textarea
+  @extend %input
+  box-shadow: $input-shadow
+  max-width: 100%
+  width: 100%
+  &[readonly]
+    box-shadow: none
+  // Colors
+  @each $name, $pair in $textarea-colors
+    $color: nth($pair, 1)
+    &.is-#{$name}
+      border-color: $color
+      &:focus,
+      &.is-focused,
+      &:active,
+      &.is-active
+        box-shadow: $input-focus-box-shadow-size bulmaRgba($color, 0.25)
+  // Sizes
+  &.is-small
+    +control-small
+  &.is-medium
+    +control-medium
+  &.is-large
+    +control-large
+  // Modifiers
+  &.is-fullwidth
+    display: block
+    width: 100%
+  &.is-inline
+    display: inline
+    width: auto
+
+.input
+  @extend %input-textarea
+  &.is-rounded
+    border-radius: $radius-rounded
+    padding-left: calc(#{$control-padding-horizontal} + 0.375em)
+    padding-right: calc(#{$control-padding-horizontal} + 0.375em)
+  &.is-static
+    background-color: transparent
+    border-color: transparent
+    box-shadow: none
+    padding-left: 0
+    padding-right: 0
+
+.textarea
+  @extend %input-textarea
+  display: block
+  max-width: 100%
+  min-width: 100%
+  padding: $textarea-padding
+  resize: vertical
+  &:not([rows])
+    max-height: $textarea-max-height
+    min-height: $textarea-min-height
+  &[rows]
+    height: initial
+  // Modifiers
+  &.has-fixed-size
+    resize: none

bookwyrm/static/css/vendor/bulma/sass/form/select.sass

@@ -0,0 +1,87 @@
+$select-colors: $form-colors !default
+
+.select
+  display: inline-block
+  max-width: 100%
+  position: relative
+  vertical-align: top
+  &:not(.is-multiple)
+    height: $input-height
+  &:not(.is-multiple):not(.is-loading)
+    &::after
+      @extend %arrow
+      border-color: $input-arrow
+      +ltr-position(1.125em)
+      z-index: 4
+  &.is-rounded
+    select
+      border-radius: $radius-rounded
+      +ltr-property("padding", 1em, false)
+  select
+    @extend %input
+    cursor: pointer
+    display: block
+    font-size: 1em
+    max-width: 100%
+    outline: none
+    &::-ms-expand
+      display: none
+    &[disabled]:hover,
+    fieldset[disabled] &:hover
+      border-color: $input-disabled-border-color
+    &:not([multiple])
+      +ltr-property("padding", 2.5em)
+    &[multiple]
+      height: auto
+      padding: 0
+      option
+        padding: 0.5em 1em
+  // States
+  &:not(.is-multiple):not(.is-loading):hover
+    &::after
+      border-color: $input-hover-color
+  // Colors
+  @each $name, $pair in $select-colors
+    $color: nth($pair, 1)
+    &.is-#{$name}
+      &:not(:hover)::after
+        border-color: $color
+      select
+        border-color: $color
+        &:hover,
+        &.is-hovered
+          border-color: bulmaDarken($color, 5%)
+        &:focus,
+        &.is-focused,
+        &:active,
+        &.is-active
+          box-shadow: $input-focus-box-shadow-size bulmaRgba($color, 0.25)
+  // Sizes
+  &.is-small
+    +control-small
+  &.is-medium
+    +control-medium
+  &.is-large
+    +control-large
+  // Modifiers
+  &.is-disabled
+    &::after
+      border-color: $input-disabled-color
+  &.is-fullwidth
+    width: 100%
+    select
+      width: 100%
+  &.is-loading
+    &::after
+      @extend %loader
+      margin-top: 0
+      position: absolute
+      +ltr-position(0.625em)
+      top: 0.625em
+      transform: none
+    &.is-small:after
+      font-size: $size-small
+    &.is-medium:after
+      font-size: $size-medium
+    &.is-large:after
+      font-size: $size-large

bookwyrm/static/css/vendor/bulma/sass/form/shared.sass

@@ -0,0 +1,60 @@
+@import "../utilities/controls"
+@import "../utilities/mixins"
+
+$form-colors: $colors !default
+
+$input-color: $text-strong !default
+$input-background-color: $scheme-main !default
+$input-border-color: $border !default
+$input-height: $control-height !default
+$input-shadow: inset 0 0.0625em 0.125em rgba($scheme-invert, 0.05) !default
+$input-placeholder-color: bulmaRgba($input-color, 0.3) !default
+
+$input-hover-color: $text-strong !default
+$input-hover-border-color: $border-hover !default
+
+$input-focus-color: $text-strong !default
+$input-focus-border-color: $link !default
+$input-focus-box-shadow-size: 0 0 0 0.125em !default
+$input-focus-box-shadow-color: bulmaRgba($link, 0.25) !default
+
+$input-disabled-color: $text-light !default
+$input-disabled-background-color: $background !default
+$input-disabled-border-color: $background !default
+$input-disabled-placeholder-color: bulmaRgba($input-disabled-color, 0.3) !default
+
+$input-arrow: $link !default
+
+$input-icon-color: $border !default
+$input-icon-active-color: $text !default
+
+$input-radius: $radius !default
+
+=input
+  @extend %control
+  background-color: $input-background-color
+  border-color: $input-border-color
+  border-radius: $input-radius
+  color: $input-color
+  +placeholder
+    color: $input-placeholder-color
+  &:hover,
+  &.is-hovered
+    border-color: $input-hover-border-color
+  &:focus,
+  &.is-focused,
+  &:active,
+  &.is-active
+    border-color: $input-focus-border-color
+    box-shadow: $input-focus-box-shadow-size $input-focus-box-shadow-color
+  &[disabled],
+  fieldset[disabled] &
+    background-color: $input-disabled-background-color
+    border-color: $input-disabled-border-color
+    box-shadow: none
+    color: $input-disabled-color
+    +placeholder
+      color: $input-disabled-placeholder-color
+
+%input
+  +input

bookwyrm/static/css/vendor/bulma/sass/form/tools.sass

@@ -0,0 +1,215 @@
+$label-color: $text-strong !default
+$label-weight: $weight-bold !default
+
+$help-size: $size-small !default
+
+$label-colors: $form-colors !default
+
+.label
+  color: $label-color
+  display: block
+  font-size: $size-normal
+  font-weight: $label-weight
+  &:not(:last-child)
+    margin-bottom: 0.5em
+  // Sizes
+  &.is-small
+    font-size: $size-small
+  &.is-medium
+    font-size: $size-medium
+  &.is-large
+    font-size: $size-large
+
+.help
+  display: block
+  font-size: $help-size
+  margin-top: 0.25rem
+  @each $name, $pair in $label-colors
+    $color: nth($pair, 1)
+    &.is-#{$name}
+      color: $color
+
+// Containers
+
+.field
+  &:not(:last-child)
+    margin-bottom: 0.75rem
+  // Modifiers
+  &.has-addons
+    display: flex
+    justify-content: flex-start
+    .control
+      &:not(:last-child)
+        +ltr-property("margin", -1px)
+      &:not(:first-child):not(:last-child)
+        .button,
+        .input,
+        .select select
+          border-radius: 0
+      &:first-child:not(:only-child)
+        .button,
+        .input,
+        .select select
+          +ltr
+            border-bottom-right-radius: 0
+            border-top-right-radius: 0
+          +rtl
+            border-bottom-left-radius: 0
+            border-top-left-radius: 0
+      &:last-child:not(:only-child)
+        .button,
+        .input,
+        .select select
+          +ltr
+            border-bottom-left-radius: 0
+            border-top-left-radius: 0
+          +rtl
+            border-bottom-right-radius: 0
+            border-top-right-radius: 0
+      .button,
+      .input,
+      .select select
+        &:not([disabled])
+          &:hover,
+          &.is-hovered
+            z-index: 2
+          &:focus,
+          &.is-focused,
+          &:active,
+          &.is-active
+            z-index: 3
+            &:hover
+              z-index: 4
+      &.is-expanded
+        flex-grow: 1
+        flex-shrink: 1
+    &.has-addons-centered
+      justify-content: center
+    &.has-addons-right
+      justify-content: flex-end
+    &.has-addons-fullwidth
+      .control
+        flex-grow: 1
+        flex-shrink: 0
+  &.is-grouped
+    display: flex
+    justify-content: flex-start
+    & > .control
+      flex-shrink: 0
+      &:not(:last-child)
+        margin-bottom: 0
+        +ltr-property("margin", 0.75rem)
+      &.is-expanded
+        flex-grow: 1
+        flex-shrink: 1
+    &.is-grouped-centered
+      justify-content: center
+    &.is-grouped-right
+      justify-content: flex-end
+    &.is-grouped-multiline
+      flex-wrap: wrap
+      & > .control
+        &:last-child,
+        &:not(:last-child)
+          margin-bottom: 0.75rem
+      &:last-child
+        margin-bottom: -0.75rem
+      &:not(:last-child)
+        margin-bottom: 0
+  &.is-horizontal
+    +tablet
+      display: flex
+
+.field-label
+  .label
+    font-size: inherit
+  +mobile
+    margin-bottom: 0.5rem
+  +tablet
+    flex-basis: 0
+    flex-grow: 1
+    flex-shrink: 0
+    +ltr-property("margin", 1.5rem)
+    text-align: right
+    &.is-small
+      font-size: $size-small
+      padding-top: 0.375em
+    &.is-normal
+      padding-top: 0.375em
+    &.is-medium
+      font-size: $size-medium
+      padding-top: 0.375em
+    &.is-large
+      font-size: $size-large
+      padding-top: 0.375em
+
+.field-body
+  .field .field
+    margin-bottom: 0
+  +tablet
+    display: flex
+    flex-basis: 0
+    flex-grow: 5
+    flex-shrink: 1
+    .field
+      margin-bottom: 0
+    & > .field
+      flex-shrink: 1
+      &:not(.is-narrow)
+        flex-grow: 1
+      &:not(:last-child)
+        +ltr-property("margin", 0.75rem)
+
+.control
+  box-sizing: border-box
+  clear: both
+  font-size: $size-normal
+  position: relative
+  text-align: inherit
+  // Modifiers
+  &.has-icons-left,
+  &.has-icons-right
+    .input,
+    .select
+      &:focus
+        & ~ .icon
+          color: $input-icon-active-color
+      &.is-small ~ .icon
+        font-size: $size-small
+      &.is-medium ~ .icon
+        font-size: $size-medium
+      &.is-large ~ .icon
+        font-size: $size-large
+    .icon
+      color: $input-icon-color
+      height: $input-height
+      pointer-events: none
+      position: absolute
+      top: 0
+      width: $input-height
+      z-index: 4
+  &.has-icons-left
+    .input,
+    .select select
+      padding-left: $input-height
+    .icon.is-left
+      left: 0
+  &.has-icons-right
+    .input,
+    .select select
+      padding-right: $input-height
+    .icon.is-right
+      right: 0
+  &.is-loading
+    &::after
+      @extend %loader
+      position: absolute !important
+      +ltr-position(0.625em)
+      top: 0.625em
+      z-index: 4
+    &.is-small:after
+      font-size: $size-small
+    &.is-medium:after
+      font-size: $size-medium
+    &.is-large:after
+      font-size: $size-large

bookwyrm/static/css/vendor/bulma/sass/grid/_all.sass

@@ -0,0 +1,5 @@
+/* Bulma Grid */
+@charset "utf-8"
+
+@import "columns"
+@import "tiles"

bookwyrm/static/css/vendor/bulma/sass/grid/columns.sass

@@ -0,0 +1,513 @@
+@import "../utilities/mixins"
+
+$column-gap: 0.75rem !default
+
+.column
+  display: block
+  flex-basis: 0
+  flex-grow: 1
+  flex-shrink: 1
+  padding: $column-gap
+  .columns.is-mobile > &.is-narrow
+    flex: none
+    width: unset
+  .columns.is-mobile > &.is-full
+    flex: none
+    width: 100%
+  .columns.is-mobile > &.is-three-quarters
+    flex: none
+    width: 75%
+  .columns.is-mobile > &.is-two-thirds
+    flex: none
+    width: 66.6666%
+  .columns.is-mobile > &.is-half
+    flex: none
+    width: 50%
+  .columns.is-mobile > &.is-one-third
+    flex: none
+    width: 33.3333%
+  .columns.is-mobile > &.is-one-quarter
+    flex: none
+    width: 25%
+  .columns.is-mobile > &.is-one-fifth
+    flex: none
+    width: 20%
+  .columns.is-mobile > &.is-two-fifths
+    flex: none
+    width: 40%
+  .columns.is-mobile > &.is-three-fifths
+    flex: none
+    width: 60%
+  .columns.is-mobile > &.is-four-fifths
+    flex: none
+    width: 80%
+  .columns.is-mobile > &.is-offset-three-quarters
+    +ltr-property("margin", 75%, false)
+  .columns.is-mobile > &.is-offset-two-thirds
+    +ltr-property("margin", 66.6666%, false)
+  .columns.is-mobile > &.is-offset-half
+    +ltr-property("margin", 50%, false)
+  .columns.is-mobile > &.is-offset-one-third
+    +ltr-property("margin", 33.3333%, false)
+  .columns.is-mobile > &.is-offset-one-quarter
+    +ltr-property("margin", 25%, false)
+  .columns.is-mobile > &.is-offset-one-fifth
+    +ltr-property("margin", 20%, false)
+  .columns.is-mobile > &.is-offset-two-fifths
+    +ltr-property("margin", 40%, false)
+  .columns.is-mobile > &.is-offset-three-fifths
+    +ltr-property("margin", 60%, false)
+  .columns.is-mobile > &.is-offset-four-fifths
+    +ltr-property("margin", 80%, false)
+  @for $i from 0 through 12
+    .columns.is-mobile > &.is-#{$i}
+      flex: none
+      width: percentage(divide($i, 12))
+    .columns.is-mobile > &.is-offset-#{$i}
+      +ltr-property("margin", percentage(divide($i, 12)), false)
+  +mobile
+    &.is-narrow-mobile
+      flex: none
+      width: unset
+    &.is-full-mobile
+      flex: none
+      width: 100%
+    &.is-three-quarters-mobile
+      flex: none
+      width: 75%
+    &.is-two-thirds-mobile
+      flex: none
+      width: 66.6666%
+    &.is-half-mobile
+      flex: none
+      width: 50%
+    &.is-one-third-mobile
+      flex: none
+      width: 33.3333%
+    &.is-one-quarter-mobile
+      flex: none
+      width: 25%
+    &.is-one-fifth-mobile
+      flex: none
+      width: 20%
+    &.is-two-fifths-mobile
+      flex: none
+      width: 40%
+    &.is-three-fifths-mobile
+      flex: none
+      width: 60%
+    &.is-four-fifths-mobile
+      flex: none
+      width: 80%
+    &.is-offset-three-quarters-mobile
+      +ltr-property("margin", 75%, false)
+    &.is-offset-two-thirds-mobile
+      +ltr-property("margin", 66.6666%, false)
+    &.is-offset-half-mobile
+      +ltr-property("margin", 50%, false)
+    &.is-offset-one-third-mobile
+      +ltr-property("margin", 33.3333%, false)
+    &.is-offset-one-quarter-mobile
+      +ltr-property("margin", 25%, false)
+    &.is-offset-one-fifth-mobile
+      +ltr-property("margin", 20%, false)
+    &.is-offset-two-fifths-mobile
+      +ltr-property("margin", 40%, false)
+    &.is-offset-three-fifths-mobile
+      +ltr-property("margin", 60%, false)
+    &.is-offset-four-fifths-mobile
+      +ltr-property("margin", 80%, false)
+    @for $i from 0 through 12
+      &.is-#{$i}-mobile
+        flex: none
+        width: percentage(divide($i, 12))
+      &.is-offset-#{$i}-mobile
+        +ltr-property("margin", percentage(divide($i, 12)), false)
+  +tablet
+    &.is-narrow,
+    &.is-narrow-tablet
+      flex: none
+      width: unset
+    &.is-full,
+    &.is-full-tablet
+      flex: none
+      width: 100%
+    &.is-three-quarters,
+    &.is-three-quarters-tablet
+      flex: none
+      width: 75%
+    &.is-two-thirds,
+    &.is-two-thirds-tablet
+      flex: none
+      width: 66.6666%
+    &.is-half,
+    &.is-half-tablet
+      flex: none
+      width: 50%
+    &.is-one-third,
+    &.is-one-third-tablet
+      flex: none
+      width: 33.3333%
+    &.is-one-quarter,
+    &.is-one-quarter-tablet
+      flex: none
+      width: 25%
+    &.is-one-fifth,
+    &.is-one-fifth-tablet
+      flex: none
+      width: 20%
+    &.is-two-fifths,
+    &.is-two-fifths-tablet
+      flex: none
+      width: 40%
+    &.is-three-fifths,
+    &.is-three-fifths-tablet
+      flex: none
+      width: 60%
+    &.is-four-fifths,
+    &.is-four-fifths-tablet
+      flex: none
+      width: 80%
+    &.is-offset-three-quarters,
+    &.is-offset-three-quarters-tablet
+      +ltr-property("margin", 75%, false)
+    &.is-offset-two-thirds,
+    &.is-offset-two-thirds-tablet
+      +ltr-property("margin", 66.6666%, false)
+    &.is-offset-half,
+    &.is-offset-half-tablet
+      +ltr-property("margin", 50%, false)
+    &.is-offset-one-third,
+    &.is-offset-one-third-tablet
+      +ltr-property("margin", 33.3333%, false)
+    &.is-offset-one-quarter,
+    &.is-offset-one-quarter-tablet
+      +ltr-property("margin", 25%, false)
+    &.is-offset-one-fifth,
+    &.is-offset-one-fifth-tablet
+      +ltr-property("margin", 20%, false)
+    &.is-offset-two-fifths,
+    &.is-offset-two-fifths-tablet
+      +ltr-property("margin", 40%, false)
+    &.is-offset-three-fifths,
+    &.is-offset-three-fifths-tablet
+      +ltr-property("margin", 60%, false)
+    &.is-offset-four-fifths,
+    &.is-offset-four-fifths-tablet
+      +ltr-property("margin", 80%, false)
+    @for $i from 0 through 12
+      &.is-#{$i},
+      &.is-#{$i}-tablet
+        flex: none
+        width: percentage(divide($i, 12))
+      &.is-offset-#{$i},
+      &.is-offset-#{$i}-tablet
+        +ltr-property("margin", percentage(divide($i, 12)), false)
+  +touch
+    &.is-narrow-touch
+      flex: none
+      width: unset
+    &.is-full-touch
+      flex: none
+      width: 100%
+    &.is-three-quarters-touch
+      flex: none
+      width: 75%
+    &.is-two-thirds-touch
+      flex: none
+      width: 66.6666%
+    &.is-half-touch
+      flex: none
+      width: 50%
+    &.is-one-third-touch
+      flex: none
+      width: 33.3333%
+    &.is-one-quarter-touch
+      flex: none
+      width: 25%
+    &.is-one-fifth-touch
+      flex: none
+      width: 20%
+    &.is-two-fifths-touch
+      flex: none
+      width: 40%
+    &.is-three-fifths-touch
+      flex: none
+      width: 60%
+    &.is-four-fifths-touch
+      flex: none
+      width: 80%
+    &.is-offset-three-quarters-touch
+      +ltr-property("margin", 75%, false)
+    &.is-offset-two-thirds-touch
+      +ltr-property("margin", 66.6666%, false)
+    &.is-offset-half-touch
+      +ltr-property("margin", 50%, false)
+    &.is-offset-one-third-touch
+      +ltr-property("margin", 33.3333%, false)
+    &.is-offset-one-quarter-touch
+      +ltr-property("margin", 25%, false)
+    &.is-offset-one-fifth-touch
+      +ltr-property("margin", 20%, false)
+    &.is-offset-two-fifths-touch
+      +ltr-property("margin", 40%, false)
+    &.is-offset-three-fifths-touch
+      +ltr-property("margin", 60%, false)
+    &.is-offset-four-fifths-touch
+      +ltr-property("margin", 80%, false)
+    @for $i from 0 through 12
+      &.is-#{$i}-touch
+        flex: none
+        width: percentage(divide($i, 12))
+      &.is-offset-#{$i}-touch
+        +ltr-property("margin", percentage(divide($i, 12)), false)
+  +desktop
+    &.is-narrow-desktop
+      flex: none
+      width: unset
+    &.is-full-desktop
+      flex: none
+      width: 100%
+    &.is-three-quarters-desktop
+      flex: none
+      width: 75%
+    &.is-two-thirds-desktop
+      flex: none
+      width: 66.6666%
+    &.is-half-desktop
+      flex: none
+      width: 50%
+    &.is-one-third-desktop
+      flex: none
+      width: 33.3333%
+    &.is-one-quarter-desktop
+      flex: none
+      width: 25%
+    &.is-one-fifth-desktop
+      flex: none
+      width: 20%
+    &.is-two-fifths-desktop
+      flex: none
+      width: 40%
+    &.is-three-fifths-desktop
+      flex: none
+      width: 60%
+    &.is-four-fifths-desktop
+      flex: none
+      width: 80%
+    &.is-offset-three-quarters-desktop
+      +ltr-property("margin", 75%, false)
+    &.is-offset-two-thirds-desktop
+      +ltr-property("margin", 66.6666%, false)
+    &.is-offset-half-desktop
+      +ltr-property("margin", 50%, false)
+    &.is-offset-one-third-desktop
+      +ltr-property("margin", 33.3333%, false)
+    &.is-offset-one-quarter-desktop
+      +ltr-property("margin", 25%, false)
+    &.is-offset-one-fifth-desktop
+      +ltr-property("margin", 20%, false)
+    &.is-offset-two-fifths-desktop
+      +ltr-property("margin", 40%, false)
+    &.is-offset-three-fifths-desktop
+      +ltr-property("margin", 60%, false)
+    &.is-offset-four-fifths-desktop
+      +ltr-property("margin", 80%, false)
+    @for $i from 0 through 12
+      &.is-#{$i}-desktop
+        flex: none
+        width: percentage(divide($i, 12))
+      &.is-offset-#{$i}-desktop
+        +ltr-property("margin", percentage(divide($i, 12)), false)
+  +widescreen
+    &.is-narrow-widescreen
+      flex: none
+      width: unset
+    &.is-full-widescreen
+      flex: none
+      width: 100%
+    &.is-three-quarters-widescreen
+      flex: none
+      width: 75%
+    &.is-two-thirds-widescreen
+      flex: none
+      width: 66.6666%
+    &.is-half-widescreen
+      flex: none
+      width: 50%
+    &.is-one-third-widescreen
+      flex: none
+      width: 33.3333%
+    &.is-one-quarter-widescreen
+      flex: none
+      width: 25%
+    &.is-one-fifth-widescreen
+      flex: none
+      width: 20%
+    &.is-two-fifths-widescreen
+      flex: none
+      width: 40%
+    &.is-three-fifths-widescreen
+      flex: none
+      width: 60%
+    &.is-four-fifths-widescreen
+      flex: none
+      width: 80%
+    &.is-offset-three-quarters-widescreen
+      +ltr-property("margin", 75%, false)
+    &.is-offset-two-thirds-widescreen
+      +ltr-property("margin", 66.6666%, false)
+    &.is-offset-half-widescreen
+      +ltr-property("margin", 50%, false)
+    &.is-offset-one-third-widescreen
+      +ltr-property("margin", 33.3333%, false)
+    &.is-offset-one-quarter-widescreen
+      +ltr-property("margin", 25%, false)
+    &.is-offset-one-fifth-widescreen
+      +ltr-property("margin", 20%, false)
+    &.is-offset-two-fifths-widescreen
+      +ltr-property("margin", 40%, false)
+    &.is-offset-three-fifths-widescreen
+      +ltr-property("margin", 60%, false)
+    &.is-offset-four-fifths-widescreen
+      +ltr-property("margin", 80%, false)
+    @for $i from 0 through 12
+      &.is-#{$i}-widescreen
+        flex: none
+        width: percentage(divide($i, 12))
+      &.is-offset-#{$i}-widescreen
+        +ltr-property("margin", percentage(divide($i, 12)), false)
+  +fullhd
+    &.is-narrow-fullhd
+      flex: none
+      width: unset
+    &.is-full-fullhd
+      flex: none
+      width: 100%
+    &.is-three-quarters-fullhd
+      flex: none
+      width: 75%
+    &.is-two-thirds-fullhd
+      flex: none
+      width: 66.6666%
+    &.is-half-fullhd
+      flex: none
+      width: 50%
+    &.is-one-third-fullhd
+      flex: none
+      width: 33.3333%
+    &.is-one-quarter-fullhd
+      flex: none
+      width: 25%
+    &.is-one-fifth-fullhd
+      flex: none
+      width: 20%
+    &.is-two-fifths-fullhd
+      flex: none
+      width: 40%
+    &.is-three-fifths-fullhd
+      flex: none
+      width: 60%
+    &.is-four-fifths-fullhd
+      flex: none
+      width: 80%
+    &.is-offset-three-quarters-fullhd
+      +ltr-property("margin", 75%, false)
+    &.is-offset-two-thirds-fullhd
+      +ltr-property("margin", 66.6666%, false)
+    &.is-offset-half-fullhd
+      +ltr-property("margin", 50%, false)
+    &.is-offset-one-third-fullhd
+      +ltr-property("margin", 33.3333%, false)
+    &.is-offset-one-quarter-fullhd
+      +ltr-property("margin", 25%, false)
+    &.is-offset-one-fifth-fullhd
+      +ltr-property("margin", 20%, false)
+    &.is-offset-two-fifths-fullhd
+      +ltr-property("margin", 40%, false)
+    &.is-offset-three-fifths-fullhd
+      +ltr-property("margin", 60%, false)
+    &.is-offset-four-fifths-fullhd
+      +ltr-property("margin", 80%, false)
+    @for $i from 0 through 12
+      &.is-#{$i}-fullhd
+        flex: none
+        width: percentage(divide($i, 12))
+      &.is-offset-#{$i}-fullhd
+        +ltr-property("margin", percentage(divide($i, 12)), false)
+
+.columns
+  +ltr-property("margin", (-$column-gap), false)
+  +ltr-property("margin", (-$column-gap))
+  margin-top: (-$column-gap)
+  &:last-child
+    margin-bottom: (-$column-gap)
+  &:not(:last-child)
+    margin-bottom: calc(1.5rem - #{$column-gap})
+  // Modifiers
+  &.is-centered
+    justify-content: center
+  &.is-gapless
+    +ltr-property("margin", 0, false)
+    +ltr-property("margin", 0)
+    margin-top: 0
+    & > .column
+      margin: 0
+      padding: 0 !important
+    &:not(:last-child)
+      margin-bottom: 1.5rem
+    &:last-child
+      margin-bottom: 0
+  &.is-mobile
+    display: flex
+  &.is-multiline
+    flex-wrap: wrap
+  &.is-vcentered
+    align-items: center
+  // Responsiveness
+  +tablet
+    &:not(.is-desktop)
+      display: flex
+  +desktop
+    // Modifiers
+    &.is-desktop
+      display: flex
+
+@if $variable-columns
+  .columns.is-variable
+    --columnGap: 0.75rem
+    +ltr-property("margin", calc(-1 * var(--columnGap)), false)
+    +ltr-property("margin", calc(-1 * var(--columnGap)))
+    > .column
+      padding-left: var(--columnGap)
+      padding-right: var(--columnGap)
+    @for $i from 0 through 8
+      &.is-#{$i}
+        --columnGap: #{$i * 0.25rem}
+      +mobile
+        &.is-#{$i}-mobile
+          --columnGap: #{$i * 0.25rem}
+      +tablet
+        &.is-#{$i}-tablet
+          --columnGap: #{$i * 0.25rem}
+      +tablet-only
+        &.is-#{$i}-tablet-only
+          --columnGap: #{$i * 0.25rem}
+      +touch
+        &.is-#{$i}-touch
+          --columnGap: #{$i * 0.25rem}
+      +desktop
+        &.is-#{$i}-desktop
+          --columnGap: #{$i * 0.25rem}
+      +desktop-only
+        &.is-#{$i}-desktop-only
+          --columnGap: #{$i * 0.25rem}
+      +widescreen
+        &.is-#{$i}-widescreen
+          --columnGap: #{$i * 0.25rem}
+      +widescreen-only
+        &.is-#{$i}-widescreen-only
+          --columnGap: #{$i * 0.25rem}
+      +fullhd
+        &.is-#{$i}-fullhd
+          --columnGap: #{$i * 0.25rem}

bookwyrm/static/css/vendor/bulma/sass/grid/tiles.sass

@@ -0,0 +1,36 @@
+@import "../utilities/mixins"
+
+$tile-spacing: 0.75rem !default
+
+.tile
+  align-items: stretch
+  display: block
+  flex-basis: 0
+  flex-grow: 1
+  flex-shrink: 1
+  min-height: min-content
+  // Modifiers
+  &.is-ancestor
+    margin-left: $tile-spacing * -1
+    margin-right: $tile-spacing * -1
+    margin-top: $tile-spacing * -1
+    &:last-child
+      margin-bottom: $tile-spacing * -1
+    &:not(:last-child)
+      margin-bottom: $tile-spacing
+  &.is-child
+    margin: 0 !important
+  &.is-parent
+    padding: $tile-spacing
+  &.is-vertical
+    flex-direction: column
+    & > .tile.is-child:not(:last-child)
+      margin-bottom: 1.5rem !important
+  // Responsiveness
+  +tablet
+    &:not(.is-child)
+      display: flex
+    @for $i from 1 through 12
+      &.is-#{$i}
+        flex: none
+        width: (divide($i, 12)) * 100%

bookwyrm/static/css/vendor/bulma/sass/helpers/_all.sass

@@ -0,0 +1,12 @@
+/* Bulma Helpers */
+@charset "utf-8"
+
+@import "color"
+@import "flexbox"
+@import "float"
+@import "other"
+@import "overflow"
+@import "position"
+@import "spacing"
+@import "typography"
+@import "visibility"

bookwyrm/static/css/vendor/bulma/sass/helpers/color.sass

@@ -0,0 +1,39 @@
+@import "../utilities/derived-variables"
+
+@each $name, $pair in $colors
+  $color: nth($pair, 1)
+  .has-text-#{$name}
+    color: $color !important
+  a.has-text-#{$name}
+    &:hover,
+    &:focus
+      color: bulmaDarken($color, 10%) !important
+  .has-background-#{$name}
+    background-color: $color !important
+  @if length($pair) >= 4
+    $color-light: nth($pair, 3)
+    $color-dark: nth($pair, 4)
+    // Light
+    .has-text-#{$name}-light
+      color: $color-light !important
+    a.has-text-#{$name}-light
+      &:hover,
+      &:focus
+        color: bulmaDarken($color-light, 10%) !important
+    .has-background-#{$name}-light
+      background-color: $color-light !important
+    // Dark
+    .has-text-#{$name}-dark
+      color: $color-dark !important
+    a.has-text-#{$name}-dark
+      &:hover,
+      &:focus
+        color: bulmaLighten($color-dark, 10%) !important
+    .has-background-#{$name}-dark
+      background-color: $color-dark !important
+
+@each $name, $shade in $shades
+  .has-text-#{$name}
+    color: $shade !important
+  .has-background-#{$name}
+    background-color: $shade !important

bookwyrm/static/css/vendor/bulma/sass/helpers/flexbox.sass

@@ -0,0 +1,35 @@
+$flex-direction-values: row, row-reverse, column, column-reverse
+@each $value in $flex-direction-values
+  .is-flex-direction-#{$value}
+    flex-direction: $value !important
+
+$flex-wrap-values: nowrap, wrap, wrap-reverse
+@each $value in $flex-wrap-values
+  .is-flex-wrap-#{$value}
+    flex-wrap: $value !important
+
+$justify-content-values: flex-start, flex-end, center, space-between, space-around, space-evenly, start, end, left, right
+@each $value in $justify-content-values
+  .is-justify-content-#{$value}
+    justify-content: $value !important
+
+$align-content-values: flex-start, flex-end, center, space-between, space-around, space-evenly, stretch, start, end, baseline
+@each $value in $align-content-values
+  .is-align-content-#{$value}
+    align-content: $value !important
+
+$align-items-values: stretch, flex-start, flex-end, center, baseline, start, end, self-start, self-end
+@each $value in $align-items-values
+  .is-align-items-#{$value}
+    align-items: $value !important
+
+$align-self-values: auto, flex-start, flex-end, center, baseline, stretch
+@each $value in $align-self-values
+  .is-align-self-#{$value}
+    align-self: $value !important
+
+$flex-operators: grow, shrink
+@each $operator in $flex-operators
+  @for $i from 0 through 5
+    .is-flex-#{$operator}-#{$i}
+      flex-#{$operator}: $i !important

bookwyrm/static/css/vendor/bulma/sass/helpers/float.sass

@@ -0,0 +1,10 @@
+@import "../utilities/mixins"
+
+.is-clearfix
+  +clearfix
+
+.is-pulled-left
+  float: left !important
+
+.is-pulled-right
+  float: right !important

bookwyrm/static/css/vendor/bulma/sass/helpers/other.sass

@@ -0,0 +1,14 @@
+@import "../utilities/mixins"
+
+.is-radiusless
+  border-radius: 0 !important
+
+.is-shadowless
+  box-shadow: none !important
+
+.is-clickable
+  cursor: pointer !important
+  pointer-events: all !important
+
+.is-unselectable
+  @extend %unselectable

bookwyrm/static/css/vendor/bulma/sass/helpers/overflow.sass

@@ -0,0 +1,2 @@
+.is-clipped
+  overflow: hidden !important

bookwyrm/static/css/vendor/bulma/sass/helpers/position.sass

@@ -0,0 +1,7 @@
+@import "../utilities/mixins"
+
+.is-overlay
+  @extend %overlay
+
+.is-relative
+  position: relative !important

bookwyrm/static/css/vendor/bulma/sass/helpers/spacing.sass

@@ -0,0 +1,31 @@
+.is-marginless
+  margin: 0 !important
+
+.is-paddingless
+  padding: 0 !important
+
+$spacing-shortcuts: ("margin": "m", "padding": "p") !default
+$spacing-directions: ("top": "t", "right": "r", "bottom": "b", "left": "l") !default
+$spacing-horizontal: "x" !default
+$spacing-vertical: "y" !default
+$spacing-values: ("0": 0, "1": 0.25rem, "2": 0.5rem, "3": 0.75rem, "4": 1rem, "5": 1.5rem, "6": 3rem, "auto": auto) !default
+
+@each $property, $shortcut in $spacing-shortcuts
+  @each $name, $value in $spacing-values
+    // All directions
+    .#{$shortcut}-#{$name}
+      #{$property}: $value !important
+    // Cardinal directions
+    @each $direction, $suffix in $spacing-directions
+      .#{$shortcut}#{$suffix}-#{$name}
+        #{$property}-#{$direction}: $value !important
+    // Horizontal axis
+    @if $spacing-horizontal != null
+      .#{$shortcut}#{$spacing-horizontal}-#{$name}
+        #{$property}-left: $value !important
+        #{$property}-right: $value !important
+    // Vertical axis
+    @if $spacing-vertical != null
+      .#{$shortcut}#{$spacing-vertical}-#{$name}
+        #{$property}-top: $value !important
+        #{$property}-bottom: $value !important

bookwyrm/static/css/vendor/bulma/sass/helpers/typography.sass

@@ -0,0 +1,103 @@
+@import "../utilities/mixins"
+
+=typography-size($target:'')
+  @each $size in $sizes
+    $i: index($sizes, $size)
+    .is-size-#{$i}#{if($target == '', '', '-' + $target)}
+      font-size: $size !important
+
++typography-size()
+
++mobile
+  +typography-size('mobile')
+
++tablet
+  +typography-size('tablet')
+
++touch
+  +typography-size('touch')
+
++desktop
+  +typography-size('desktop')
+
++widescreen
+  +typography-size('widescreen')
+
++fullhd
+  +typography-size('fullhd')
+
+$alignments: ('centered': 'center', 'justified': 'justify', 'left': 'left', 'right': 'right')
+
+@each $alignment, $text-align in $alignments
+  .has-text-#{$alignment}
+    text-align: #{$text-align} !important
+
+@each $alignment, $text-align in $alignments
+  +mobile
+    .has-text-#{$alignment}-mobile
+      text-align: #{$text-align} !important
+  +tablet
+    .has-text-#{$alignment}-tablet
+      text-align: #{$text-align} !important
+  +tablet-only
+    .has-text-#{$alignment}-tablet-only
+      text-align: #{$text-align} !important
+  +touch
+    .has-text-#{$alignment}-touch
+      text-align: #{$text-align} !important
+  +desktop
+    .has-text-#{$alignment}-desktop
+      text-align: #{$text-align} !important
+  +desktop-only
+    .has-text-#{$alignment}-desktop-only
+      text-align: #{$text-align} !important
+  +widescreen
+    .has-text-#{$alignment}-widescreen
+      text-align: #{$text-align} !important
+  +widescreen-only
+    .has-text-#{$alignment}-widescreen-only
+      text-align: #{$text-align} !important
+  +fullhd
+    .has-text-#{$alignment}-fullhd
+      text-align: #{$text-align} !important
+
+.is-capitalized
+  text-transform: capitalize !important
+
+.is-lowercase
+  text-transform: lowercase !important
+
+.is-uppercase
+  text-transform: uppercase !important
+
+.is-italic
+  font-style: italic !important
+  
+.is-underlined
+  text-decoration: underline !important
+
+.has-text-weight-light
+  font-weight: $weight-light !important
+.has-text-weight-normal
+  font-weight: $weight-normal !important
+.has-text-weight-medium
+  font-weight: $weight-medium !important
+.has-text-weight-semibold
+  font-weight: $weight-semibold !important
+.has-text-weight-bold
+  font-weight: $weight-bold !important
+
+.is-family-primary
+  font-family: $family-primary !important
+
+.is-family-secondary
+  font-family: $family-secondary !important
+
+.is-family-sans-serif
+  font-family: $family-sans-serif !important
+
+.is-family-monospace
+  font-family: $family-monospace !important
+
+.is-family-code
+  font-family: $family-code !important

bookwyrm/static/css/vendor/bulma/sass/helpers/visibility.sass

@@ -0,0 +1,122 @@
+@import "../utilities/mixins"
+
+$displays: 'block' 'flex' 'inline' 'inline-block' 'inline-flex'
+
+@each $display in $displays
+  .is-#{$display}
+    display: #{$display} !important
+  +mobile
+    .is-#{$display}-mobile
+      display: #{$display} !important
+  +tablet
+    .is-#{$display}-tablet
+      display: #{$display} !important
+  +tablet-only
+    .is-#{$display}-tablet-only
+      display: #{$display} !important
+  +touch
+    .is-#{$display}-touch
+      display: #{$display} !important
+  +desktop
+    .is-#{$display}-desktop
+      display: #{$display} !important
+  +desktop-only
+    .is-#{$display}-desktop-only
+      display: #{$display} !important
+  +widescreen
+    .is-#{$display}-widescreen
+      display: #{$display} !important
+  +widescreen-only
+    .is-#{$display}-widescreen-only
+      display: #{$display} !important
+  +fullhd
+    .is-#{$display}-fullhd
+      display: #{$display} !important
+
+.is-hidden
+  display: none !important
+
+.is-sr-only
+  border: none !important
+  clip: rect(0, 0, 0, 0) !important
+  height: 0.01em !important
+  overflow: hidden !important
+  padding: 0 !important
+  position: absolute !important
+  white-space: nowrap !important
+  width: 0.01em !important
+
++mobile
+  .is-hidden-mobile
+    display: none !important
+
++tablet
+  .is-hidden-tablet
+    display: none !important
+
++tablet-only
+  .is-hidden-tablet-only
+    display: none !important
+
++touch
+  .is-hidden-touch
+    display: none !important
+
++desktop
+  .is-hidden-desktop
+    display: none !important
+
++desktop-only
+  .is-hidden-desktop-only
+    display: none !important
+
++widescreen
+  .is-hidden-widescreen
+    display: none !important
+
++widescreen-only
+  .is-hidden-widescreen-only
+    display: none !important
+
++fullhd
+  .is-hidden-fullhd
+    display: none !important
+
+.is-invisible
+  visibility: hidden !important
+
++mobile
+  .is-invisible-mobile
+    visibility: hidden !important
+
++tablet
+  .is-invisible-tablet
+    visibility: hidden !important
+
++tablet-only
+  .is-invisible-tablet-only
+    visibility: hidden !important
+
++touch
+  .is-invisible-touch
+    visibility: hidden !important
+
++desktop
+  .is-invisible-desktop
+    visibility: hidden !important
+
++desktop-only
+  .is-invisible-desktop-only
+    visibility: hidden !important
+
++widescreen
+  .is-invisible-widescreen
+    visibility: hidden !important
+
++widescreen-only
+  .is-invisible-widescreen-only
+    visibility: hidden !important
+
++fullhd
+  .is-invisible-fullhd
+    visibility: hidden !important

bookwyrm/static/css/vendor/bulma/sass/layout/_all.sass

@@ -0,0 +1,6 @@
+/* Bulma Layout */
+@charset "utf-8"
+
+@import "hero"
+@import "section"
+@import "footer"

bookwyrm/static/css/vendor/bulma/sass/layout/footer.sass

@@ -0,0 +1,11 @@
+@import "../utilities/derived-variables"
+
+$footer-background-color: $scheme-main-bis !default
+$footer-color: false !default
+$footer-padding: 3rem 1.5rem 6rem !default
+
+.footer
+  background-color: $footer-background-color
+  padding: $footer-padding
+  @if $footer-color
+    color: $footer-color