infrastructure/extensions-website
4
8
Fork 10
Code Issues 20 Pull Requests 2 Projects Releases Wiki Activity

Implement Web Assets' theme system and selection, and add 'light' theme #118

Merged
Márton Lente merged 97 commits from martonlente/extensions-website:ui/theme-light into main 2024-05-08 14:20:07 +02:00
Conversation 0 Commits 97 Files Changed 6 +132 -132
34 changed files with 132 additions and 132 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 43ca92d5f9 - Show all commits

4
abuse/templates/abuse/abusereport_detail.html
View File

@ -24,7 +24,7 @@
<div class="ext-detail-tagline">
<a href="{{ extension.get_absolute_url }}">{{ extension.name }}</a>
</div>
<div class="ext-detail-authors ml-3">
<div class="ext-detail-authors ms-3">
<a href="{% url 'extensions:by-type' type_slug=extension.type_slug %}">
{{ extension.get_type_display }}
</a>
@ -44,7 +44,7 @@
{% block hero_tabs %}
<nav class="hero-tabs">
<span class="ml-auto"></span>
<span class="ms-auto"></span>
<div class="btn-row mb-1">
{% if request.user.is_staff %}

4
common/static/common/scripts/galleria.js
View File

@ -5,7 +5,7 @@ function galleriaCloneFirstItem() {
let firstGalleriaItem = galleriaCarrousel.firstElementChild.cloneNode(true);
firstGalleriaItem.classList.remove('js-galleria-item-preview', 'is-active');
firstGalleriaItem.classList.add('js-expand-on-click');
firstGalleriaItem.id = 'galleria-item-large';
firstGalleriaItem.id = 'galleria-item-lg';
document.getElementById("galleria-container").prepend(firstGalleriaItem);
}
@ -13,7 +13,7 @@ function galleriaCloneFirstItem() {
function galleriaSetLargePreview(item) {
let previewsContainer = document.getElementById('galleria-items');
let previewLarge = document.getElementById('galleria-item-large');
let previewLarge = document.getElementById('galleria-item-lg');
let thumbnails = document.getElementsByClassName("js-galleria-item-preview");
[].forEach.call(thumbnails, function(el) {
el.classList.remove("is-active");

12
common/static/common/styles/_activity.sass
View File

@ -4,7 +4,7 @@
z-index: 0
> li
--border-color: var(--box-background-color)
--border-color: var(--box-bg-color)
position: relative
&:first-child
@ -64,7 +64,7 @@
top: 1.25rem
.activity-status-change
color: var(--text-color-tertiary)
color: var(--color-text-tertiary)
.profile-avatar
+margin(3, right)
@ -73,7 +73,7 @@
left: 0
strong
color: var(--text-color-secondary)
color: var(--color-text-secondary)
.badge
border: none
@ -88,12 +88,12 @@
.activity-icon
align-items: center
background-color: var(--background-color)
background-color: var(--color-bg)
border-radius: 100%
border: var(--border-width) solid var(--border-color)
color: var(--text-color-tertiary)
color: var(--color-text-tertiary)
display: flex
font-size: var(--font-size-small)
font-size: var(--fs-sm)
height: 1.5rem
justify-content: center
left: -.66rem

10
common/static/common/styles/_badge.sass
View File

@ -1,17 +1,17 @@
a.badge-tag
--badge-color: var(--text-color-secondary)
--badge-bg: var(--text-color-tertiary)
--badge-color: var(--color-text-secondary)
--badge-bg: var(--color-text-tertiary)
background-color: transparent
text-decoration: none !important
&:hover
background-color: transparent
border-color: var(--text-color)
color: var(--text-color)
border-color: var(--color-text)
color: var(--color-text)
.badge-tag
font-size: var(--font-size-extra-small)
font-size: var(--fs-xs)
.badge-status
&-approved

6
common/static/common/styles/_comments.sass
View File

@ -11,7 +11,7 @@
z-index: 0
&:before
background-color: var(--box-background-color)
background-color: var(--box-bg-color)
border-radius: .25rem
content: ''
display: block
@ -27,8 +27,8 @@
margin-bottom: 0
header
color: var(--text-color-secondary)
font-size: var(--font-size-small)
color: var(--color-text-secondary)
font-size: var(--fs-sm)
+margin(2, bottom)
ul

96
common/static/common/styles/_extension.sass
View File

@ -1,12 +1,12 @@
.hero.extension-detail
--hero-max-height: 0
--hero-min-height: 240px
--font-size-hero-title: clamp(3rem, 4vw + 1rem, 48px)
--font-size-large: 18px
--fs-hero-title: clamp(3rem, 4vw + 1rem, 48px)
--fs-lg: 18px
--border-width: 2px
--hero-background-color: hsl(213, 10%, 14%)
--hero-bg-color: hsl(213, 10%, 14%)
background-color: var(--hero-background-color)
background-color: var(--hero-bg-color)
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40'%3E%3Cg fill-rule='evenodd'%3E%3Cg fill='%233e4248' fill-opacity='0.21'%3E%3Cpath d='M0 38.59l2.83-2.83 1.41 1.41L1.41 40H0v-1.41zM0 1.4l2.83 2.83 1.41-1.41L1.41 0H0v1.41zM38.59 40l-2.83-2.83 1.41-1.41L40 38.59V40h-1.41zM40 1.41l-2.83 2.83-1.41-1.41L38.59 0H40v1.41zM20 18.6l2.83-2.83 1.41 1.41L21.41 20l2.83 2.83-1.41 1.41L20 21.41l-2.83 2.83-1.41-1.41L18.59 20l-2.83-2.83 1.41-1.41L20 18.59z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E")
background-size: 40px
flex-direction: column
@ -24,7 +24,7 @@
.hero-overlay
background-color: transparent
background-image: linear-gradient(0deg, var(--background-color), hsla(213, 10%, 14%, 0))
background-image: linear-gradient(0deg, var(--color-bg), hsla(213, 10%, 14%, 0))
&.extension-review
--hero-min-height: 210px
@ -42,8 +42,8 @@
@extend .alert
@extend .alert-danger
border-radius: 0
font-size: var(--font-size-small)
+font-weight-bold
font-size: var(--fs-sm)
+fw-bold
+padding(1, y)
text-align: center
@ -54,17 +54,17 @@
color: var(--color-warning-text);
.hero-breadcrumbs
font-size: var(--font-size-small)
font-size: var(--fs-sm)
a
color: var(--text-color-secondary)
color: var(--color-text-secondary)
display: inline-block
+padding(2)
.ext-detail-name
font-size: var(--font-size-title-massive)
+font-weight-title
line-height: var(--font-size-title-massive)
font-size: var(--fs-title-massive)
+fw-title
line-height: var(--fs-title-massive)
margin-bottom: 0
.ext-detail-info-authors
@ -72,7 +72,7 @@
flex-wrap: wrap
.ext-detail-authors
color: var(--text-color-secondary)
color: var(--color-text-secondary)
.ext-detail-tagline
+margin(2, bottom)
@ -83,7 +83,7 @@
.ext-detail-info
dd
color: var(--text-color)
color: var(--color-text)
overflow: hidden
text-overflow: ellipsis
white-space: nowrap
@ -93,8 +93,8 @@
margin-bottom: 0
dt
color: var(--text-color-secondary)
font-size: var(--font-size-small)
color: var(--color-text-secondary)
font-size: var(--fs-sm)
dd
font-family: var(--font-family-body)
@ -108,7 +108,7 @@
white-space: nowrap
&:hover
color: var(--text-color-primary)
color: var(--color-text-primary)
.dl-col
overflow: hidden
@ -134,10 +134,10 @@
padding: 0
strong
font-size: var(--font-size-large)
font-size: var(--fs-lg)
i
font-size: var(--font-size-large)
font-size: var(--fs-lg)
+margin(3, right)
.ext-detail-download
@ -160,16 +160,16 @@
summary
.date
+margin(2, left)
color: var(--text-color-secondary)
+font-weight-normal
color: var(--color-text-secondary)
+fw-normal
.cards-list
.cards
+media-sm
--cards-list-items-per-row: 2
--cards-items-per-row: 2
+media-md
--cards-list-items-per-row: 3
--cards-items-per-row: 3
+media-lg
--cards-list-items-per-row: 4
--cards-items-per-row: 4
.ext-card
+box-card
@ -182,13 +182,13 @@
&:hover
box-shadow: 10px 10px 20px 0px rgba(0, 0, 0, .04), -10px 0 20px 0px rgba(0, 0, 0, .04)
&.is-background-blur
&.is-bg-blur
background-color: hsl(213, 10%, 21%)
border: thin solid hsl(213, 10%, 20%)
position: relative
.ext-card-body
--text-color-secondary: hsla(213, 40%, 90%, .6)
--color-text-secondary: hsla(213, 40%, 90%, .6)
border-bottom-left-radius: var(--border-radius-lg)
border-bottom-right-radius: var(--border-radius-lg)
@ -202,11 +202,11 @@
border-radius: 0
.ext-card-thumbnail-img
-webkit-mask-image: -webkit-gradient(linear, left 60%, left bottom, from(rgba(0,0,0,1)), to(rgba(0,0,0,0)))
-webkit-mask-img: -webkit-gradient(linear, left 60%, left bottom, from(rgba(0,0,0,1)), to(rgba(0,0,0,0)))
.ext-card-thumbnail:hover
&+.ext-card-body .ext-card-title
color: var(--text-color-primary)
color: var(--color-text-primary)
&.ext-card-row
flex-direction: row
@ -264,7 +264,7 @@
line-height: 1.2
.ext-card-title
font-size: var(--font-size-large)
font-size: var(--fs-lg)
+margin(3, bottom)
transition: color var(--transition-speed)
@ -275,8 +275,8 @@
@extend .list-inline
align-items: center
color: var(--text-color-secondary)
font-size: var(--font-size-small)
color: var(--color-text-secondary)
font-size: var(--fs-sm)
margin: auto 0 0 0
&+.ext-list-details
@ -333,7 +333,7 @@
width: var(--preview-thumbnail-max-size)
.previews-list-item-thumbnail-img
background-color: var(--background-color)
background-color: var(--color-bg)
background-position: center
background-size: cover
border-radius: var(--border-radius)
@ -344,7 +344,7 @@
flex: 1
label
font-size: var(--font-size-small)
font-size: var(--fs-sm)
ul
+list-unstyled
@ -365,7 +365,7 @@
.form-control
&[type="file"]
font-size: var(--font-size-extra-small)
font-size: var(--fs-xs)
max-width: 50%
.ext-version-history
@ -374,15 +374,15 @@
ul
@extend .list-inline
color: var(--text-color-secondary)
+font-weight-normal
color: var(--color-text-secondary)
+fw-normal
gap: 0 1rem
margin: 0
+margin(3, right)
.blender-version
color: var(--text-color-secondary)
+font-weight-normal
color: var(--color-text-secondary)
+fw-normal
+margin(3, left)
details[open]
@ -392,31 +392,31 @@
.ext-detail-info
.ext-detail-permissions
strong
font-size: var(--font-size-normal)
font-size: var(--fs-normal)
small
display: block
i
font-size: var(--font-size-normal)
font-size: var(--fs-normal)
+margin(2, right)
/* Settings */
.settings
.form-control
&[disabled]
--input-bg-color: var(--background-color)
--input-color-bg: var(--color-bg)
background-color: var(--input-bg-color)
color: var(--text-color-secondary)
background-color: var(--input-color-bg)
color: var(--color-text-secondary)
&:hover
--input-bg-color-hover: var(--input-bg-color)
--input-color-bg-hover: var(--input-color-bg)
cursor: not-allowed
& + i.i-lock
color: var(--text-color-secondary)
color: var(--color-text-secondary)
position: absolute
right: var(--spacer)
@ -430,7 +430,7 @@
+margin(2, right)
.ext-review-list
color: var(--text-color-secondary)
color: var(--color-text-secondary)
th
+padding(3, x)
@ -440,7 +440,7 @@
transition: background-color var(--transition-speed-fast)
a
color: var(--text-color)
color: var(--color-text)
+padding(1, y)
padding-inline: 0 !important

8
common/static/common/styles/_galleria.sass
View File

@ -1,7 +1,7 @@
.galleria-container
--extension-thumbnail-width: 140px
background-color: var(--background-color-secondary)
background-color: var(--color-bg-secondary)
border-radius: var(--border-radius-lg)
+padding(2)
@ -33,7 +33,7 @@
border-radius: 999em
&::-webkit-scrollbar-track
background-color: hsl(var(--background-color-h), var(--background-color-s), 80%)
background-color: hsl(var(--color-bg-h), var(--color-bg-s), 80%)
.galleria-item
cursor: pointer
@ -73,7 +73,7 @@
&.is-active
background-color: var(--color-primary)
background-color: var(--color-accent)
img
clip-path: inset(0.2rem 0.2rem 0.2rem 0.2rem)
@ -176,7 +176,7 @@
background-color: rgba(black, .5)
bottom: 1rem
color: white
+font-weight-bold
+fw-bold
min-width: 3ch
+padding(2, x)
position: absolute

4
common/static/common/styles/_hero.sass
View File

@ -23,7 +23,7 @@
> a:not(.btn)
background-color: transparent
border-radius: 0
color: var(--text-color-secondary)
color: var(--color-text-secondary)
display: inline-block
+padding(4, x)
+padding(2, y)
@ -48,7 +48,7 @@
opacity: 1
&.is-active
+font-weight-bold
+fw-bold
color: white
&::after

10
common/static/common/styles/_list.sass
View File

@ -3,12 +3,12 @@
.list-filters
+box-card
background-color: var(--background-color-tertiary)
background-color: var(--color-bg-tertiary)
+padding(3)
h3
border-bottom: var(--border-width) solid var(--border-color)
color: var(--text-color-secondary)
color: var(--color-text-secondary)
+padding(2, bottom)
ul
@ -17,12 +17,12 @@
li
&.is-active
color: var(--text-color-primary)
+font-weight-bold
color: var(--color-text-primary)
+fw-bold
a
display: block
&:hover
color: var(--text-color-primary)
color: var(--color-text-primary)
text-decoration: none

10
common/static/common/styles/_utilities.sass
View File

@ -1,17 +1,17 @@
.background-color
background-color: var(--background-color)
background-color: var(--color-bg)
.background-color-primary
background-color: var(--background-color-primary)
background-color: var(--color-bg-primary)
.background-color-secondary
background-color: var(--background-color-secondary)
background-color: var(--color-bg-secondary)
.background-color-tertiary
background-color: var(--background-color-tertiary)
background-color: var(--color-bg-tertiary)
.border-bottom-tertiary
border-bottom: thin solid var(--background-color-tertiary)
border-bottom: thin solid var(--color-bg-tertiary)
.cursor-move
&:hover

6
common/static/common/styles/main.sass
View File

@ -47,7 +47,7 @@ $container-width: map-get($container-max-widths, 'xl')
width: 26px
.search-highlight
background-color: var(--btn-bg-color)
background-color: var(--btn-color-bg)
border-radius: var(--border-radius)
color: var(--btn-color)
font-style: normal
@ -63,8 +63,8 @@ $container-width: map-get($container-max-widths, 'xl')
border-radius: var(--border-radius)
color: hsl(0, 100%, 90%) !important
display: flex
+font-weight-bold
font-size: var(--font-size-extra-small)
+fw-bold
font-size: var(--fs-xs)
justify-content: center
padding-block: .1rem
padding-inline: .4rem

4
common/static/common/styles/tagger.scss
View File

@ -40,12 +40,12 @@
.tagger > ul > li:not(.tagger-new) a:visited,
.tagger-new ul a,
.tagger-new ul a:visited {
color: var(--text-color);
color: var(--color-text);
}
.tagger > ul > li:not(.tagger-new) > a,
.tagger li:not(.tagger-new) > span,
.tagger .tagger-new ul {
background: var(--btn-bg-color);
background: var(--btn-color-bg);
border-radius: var(--border-radius);
padding: 4px 4px 4px 8px;

2
common/templates/common/base.html
View File

@ -124,7 +124,7 @@
</li>
{% block nav-upload %}
<li class="mr-2">
<li class="me-2">
<a href="{% url 'extensions:submit' %}" class="btn btn-primary text-primary">
<i class="i-upload"></i>
<span>Upload Extension</span>

12
extensions/static/extensions/scripts/manage.js
View File

@ -1,8 +1,8 @@
// TODO: improve and refactor variable namings
const formsetContainer = document.getElementById('add-image-container');
const formsetContainer = document.getElementById('add-img-container');
const form = document.getElementById('update-extension-form');
const btnAddImage = document.getElementById('btn-add-image');
const btnAddImage = document.getElementById('btn-add-img');
const formsetPrefix = 'form';
const inputTotalForms = document.getElementById(`id_${formsetPrefix}-TOTAL_FORMS`);
const tagInput = document.getElementById('id_tags');
@ -28,10 +28,10 @@ function appendImageUploadForm() {
const formRow = document.createElement('div');
const newFormHTML = `
<div class="previews-list-item">
<div class="align-items-center d-flex previews-list-item-thumbnail pl-3">
<div class="align-items-center d-flex previews-list-item-thumbnail ps-3">
<div class="js-input-img-thumbnail previews-list-item-thumbnail-img" title="Preview">
<div class="align-items-center d-flex js-input-img-thumbnail-icon justify-content-center">
<i class="i-image"></i>
<i class="i-img"></i>
</div>
</div>
</div>
@ -44,10 +44,10 @@ function appendImageUploadForm() {
<input accept="image/*" class="form-control js-input-img" id="id_${formsetPrefix}-${i}-source" type="file" name="${formsetPrefix}-${i}-source">
<ul class="pt-0">
<li>
<button class="btn btn-link btn-sm js-btn-reset-img-upload-form pl-2 pr-0"><i class="i-refresh"></i> Reset</button>
<button class="btn btn-link btn-sm js-btn-reset-img-upload-form ps-2 pe-0"><i class="i-refresh"></i> Reset</button>
</li>
<li>
<button class="btn btn-link btn-sm js-btn-remove-img-upload-form pl-2 pr-0"><i class="i-trash"></i> Delete</button>
<button class="btn btn-link btn-sm js-btn-remove-img-upload-form ps-2 pe-0"><i class="i-trash"></i> Delete</button>
</li>
</ul>
</div>

2
extensions/templates/extensions/base.html
View File

@ -71,7 +71,7 @@
{% trans "Version History" %}
</a>
<span class="ml-auto"></span>
<span class="ms-auto"></span>
<div class="btn-row">
{% if is_maintainer %}

2
extensions/templates/extensions/components/badge_support.html
View File

@ -1,5 +1,5 @@
<a href="{% url "extensions:by-support" support_slug=slug %}" title="Support: {{ name }}"
class="badge text-decoration-none align-middle {% if not small %}px-3 py-2 my-1{% endif %} badge-dark{#% if slug == 'official' %}primary{% elif slug == 'community' %}success{% else %}warning{% endif % #}"
style="{% if not small %}font-size: var(--font-size-base);{% endif %}">
style="{% if not small %}font-size: var(--fs-base);{% endif %}">
<b>{{ name }}</b>
</a>

2
extensions/templates/extensions/components/badge_tag.html
View File

@ -1,6 +1,6 @@
{% load extensions %}
<a href="{% url "extensions:by-tag" tag_slug=tag.slug %}" title="{{ tag.name }}"
class="badge badge-tag{% if not small %} badge-lg{% endif %} {{ class }}">
class="badge badge-tag{% if not small %} badgefs-lg{% endif %} {{ class }}">
{{ tag.name }}
</a>

4
extensions/templates/extensions/components/card.html
View File

@ -1,7 +1,7 @@
{% load common filters %}
{% with latest=extension.latest_version %}
<div class="ext-card {% if blur %}is-background-blur{% endif %}">
<div class="ext-card {% if blur %}is-bg-blur{% endif %}">
{% if blur %}
<div class="ext-card-thumbnail-blur" style="background-image: url({{ extension.previews.listed.first.source.url }});"></div>
{% endif %}
@ -47,7 +47,7 @@
{% endif %}
{% if show_type %}
<li class="ml-auto">
<li class="ms-auto">
{{ extension.get_type_display }}
</li>
{% endif %}

4
extensions/templates/extensions/detail.html
View File

@ -80,7 +80,7 @@
</ul>
</div>
{% else %}
<p class="mb-0"><i class="i-check mr-0"></i> This extension does not require special permissions.</p>
<p class="mb-0"><i class="i-check me-0"></i> This extension does not require special permissions.</p>
{% endif %}
</section>
{% endif %}
@ -272,7 +272,7 @@
{% trans 'Reviews' %}
</a>
</h2>
<a href="{{ extension.get_ratings_url }}" class="ml-auto">See all</a>
<a href="{{ extension.get_ratings_url }}" class="ms-auto">See all</a>
</div>
</div>
</div>

12
extensions/templates/extensions/home.html
View File

@ -25,7 +25,7 @@
</div>
</div>
<div class="hero-background" style="background-image: url(https://www.blender.org/wp-content/uploads/2022/08/piotr-krynski-scanislands-blender-33lts-crop.jpg); background-position-y: 50%"></div>
<div class="hero-bg" style="background-image: url(https://www.blender.org/wp-content/uploads/2022/08/piotr-krynski-scanislands-blender-33lts-crop.jpg); background-position-y: 50%"></div>
<div class="hero-overlay"></div>
<div class="hero-credits"></div>
</div>
@ -37,10 +37,10 @@
<h2>
<a href="{% url 'extensions:by-type' type_slug='add-ons' %}">Add-ons</a>
</h2>
<a href="{% url 'extensions:by-type' type_slug='add-ons' %}" class="ml-auto">See all</a>
<a href="{% url 'extensions:by-type' type_slug='add-ons' %}" class="ms-auto">See all</a>
</div>
<p>Extend Blender capabilities with these add-ons by the community.</p>
<div class="cards-list mt-3">
<div class="cards mt-3">
{% for extension in addons %}
{% include "extensions/components/card.html" %}
{% endfor %}
@ -52,12 +52,12 @@
<h2>
<a href="{% url 'extensions:by-type' type_slug='themes' %}">Themes</a>
</h2>
<a href="{% url 'extensions:by-type' type_slug='themes' %}" class="ml-auto fw-normal">
<a href="{% url 'extensions:by-type' type_slug='themes' %}" class="ms-auto fw-normal">
See all
</a>
</div>
<p>Blender themes to your liking. Dark, light, flat, colorful, and everything in between.</p>
<div class="cards-list mt-3">
<div class="cards mt-3">
{% for extension in themes %}
{% include "extensions/components/card.html" %}
{% endfor %}
@ -65,7 +65,7 @@
<div class="my-5 text-center">
Got an add-on or theme to share with the community?
<a href="{% url 'extensions:submit' %}" class="text-primary ml-2">
<a href="{% url 'extensions:submit' %}" class="text-primary ms-2">
Upload
<i class="i-chevron-right"></i>
</a>

4
extensions/templates/extensions/list.html
View File

@ -35,7 +35,7 @@
{% endif %}
{% if tag %}
<h2 class="d-flex align-items-center">
<span class="mr-3">{% blocktranslate %}Extensions with the tag{% endblocktranslate %}</span>
<span class="me-3">{% blocktranslate %}Extensions with the tag{% endblocktranslate %}</span>
{% include "extensions/components/badge_tag.html" %}
</h2>
{% endif %}
@ -49,7 +49,7 @@
<div class="row">
<div class="col">
{% if object_list %}
<div class="cards-list card-layout-horizontal cards-3">
<div class="cards card-layout-horizontal cards-3">
{% for extension in object_list %}
{% include "extensions/components/card.html" with show_type=False %}
{% endfor %}

10
extensions/templates/extensions/manage/components/add_previews.html
View File

@ -2,17 +2,17 @@
{# Upload new preview images #}
{% load i18n %}
<div class="previews-upload">
<div id="add-image-container" class="previews-list">
<div id="add-img-container" class="previews-list">
{{ add_preview_formset.management_form }}
{{ add_preview_formset.non_form_errors }}
{% for newform in add_preview_formset %}
{% with inlineform=newform|add_form_classes %}
<div class="ext-edit-field-row js-ext-edit-field-row">
<div class="previews-list-item">
<div class="align-items-center d-flex previews-list-item-thumbnail pl-3">
<div class="align-items-center d-flex previews-list-item-thumbnail ps-3">
<div class="js-input-img-thumbnail previews-list-item-thumbnail-img" title="Preview">
<div class="align-items-center d-flex js-input-img-thumbnail-icon justify-content-center">
<i class="i-image"></i>
<i class="i-img"></i>
</div>
</div>
</div>
@ -24,7 +24,7 @@
{% include "common/components/field.html" with field=inlineform.source label='File' %}
<ul class="pt-0">
<li>
<button class="btn btn-link btn-sm js-btn-reset-img-upload-form pl-2 pr-0"><i class="i-refresh"></i> Reset</button>
<button class="btn btn-link btn-sm js-btn-reset-img-upload-form ps-2 pe-0"><i class="i-refresh"></i> Reset</button>
</li>
</ul>
</div>
@ -38,7 +38,7 @@
</div>
<div class="row">
<div class="col text-right mt-3">
<a id="btn-add-image" class="btn">
<a id="btn-add-img" class="btn">
<i class="i-plus"></i>
<span>{% trans 'Add Preview' %}</span>
</a>

2
extensions/templates/extensions/manage/list.html
View File

@ -25,7 +25,7 @@
<div class="row mt-4">
<div class="col">
{% if object_list %}
<div class="cards-list">
<div class="cards">
{% for extension in object_list %}
{% include "extensions/manage/components/card.html" with show_type=True %}
{% endfor %}

4
extensions/templates/extensions/manage/update.html
View File

@ -68,7 +68,7 @@
<small>Source File</small>
</a>
</li>
<li class="ml-auto">
<li class="ms-auto">
{% include "common/components/field.html" with field=inlineform.DELETE %}
</li>
<li>
@ -157,7 +157,7 @@
const previewDragContainer = document.querySelector('.js-previews-drag-container');
const previewDragClass = 'js-preview-drag';
{% comment %} dragula([document.querySelector('.js-preview-drag'), document.querySelector('.cards-list')]); {% endcomment %}
{% comment %} dragula([document.querySelector('.js-preview-drag'), document.querySelector('.cards')]); {% endcomment %}
dragula([previewDragContainer, previewDragContainer], {
moves: function (el, container, handle) {
return handle.className.includes(previewDragClass);

2
extensions/templates/extensions/version_list.html
View File

@ -29,7 +29,7 @@
<span class="show-on-collapse blender-version">
{% include "extensions/components/blender_version.html" with version=version %}
</span>
<ul class="ml-auto">
<ul class="ms-auto">
<li class="show-on-collapse">{{ version.file.size_bytes|filesizeformat }}</li>
<li class="show-on-collapse"><i class="i-download"></i> {{ version.download_count }}</li>
<li>

2
playbooks/templates/nginx/errors/5xx.html
View File

@ -32,7 +32,7 @@
h1 {
background: linear-gradient(to right, #0cc, violet);
background-clip: text;
-webkit-background-clip: text;
-webkit-bg-clip: text;
-webkit-text-fill-color: transparent;
font-weight: 300;
font-size: 1.6em;

4
ratings/static/ratings/styles/_stars.sass
View File

@ -87,9 +87,9 @@
text-decoration: none
span
color: var(--text-color-secondary)
color: var(--color-text-secondary)
display: block
font-size: var(--font-size-base)
font-size: var(--fs-base)
.stars
+margin(auto, x)

2
ratings/templates/ratings/components/rating.html
View File

@ -14,7 +14,7 @@
{{ rating.user }}
</a>
</li>
<li class="mr-auto">
<li class="me-auto">
{% with score_percentage=rating.score %}
<a href="{{ extension.get_ratings_url }}?score={{ rating.score }}">
{% include "ratings/components/average.html" with score=rating.score %}

2
ratings/templates/ratings/rating_list.html
View File

@ -13,7 +13,7 @@
{% endif %}
</h2>
{% if score %}
<div class="ml-auto">
<div class="ms-auto">
<a href="{{ extension.get_ratings_url }}" class="text-muted">See all</a>
</div>
{% endif %}

2
reviewers/templates/reviewers/components/review_list_item.html
View File

@ -18,7 +18,7 @@
</a>
{% if extension.review_activity.all %}
<a href="{{ extension.get_review_url }}#activity-{{ extension.review_activity.all.last.id }}" class="ml-3">
<a href="{{ extension.get_review_url }}#activity-{{ extension.review_activity.all.last.id }}" class="ms-3">
<span>{{ extension.review_activity.all.last.date_created|naturaltime_compact }}</span>
</a>
{% endif %}

6
reviewers/templates/reviewers/extensions_review_detail.html
View File

@ -24,7 +24,7 @@
{% trans "Version History" %}
</a>
<span class="ml-auto"></span>
<span class="ms-auto"></span>
<div class="btn-row">
{% if is_maintainer %}
@ -137,7 +137,7 @@
{{ activity.user }}
</a>
</li>
<li class="ml-auto">
<li class="ms-auto">
<a href="#activity-{{ activity.id }}" title="{{ activity.date_created }}">
{{ activity.date_created|naturaltime_compact }}
</a>
@ -165,7 +165,7 @@
{% include "common/components/field.html" with field=form.message %}
<div class="d-flex align-items-center">
<div class="btn-row ml-3 w-100 justify-content-end">
<div class="btn-row ms-3 w-100 justify-content-end">
{% if is_maintainer or request.user.is_moderator %}
{% include "common/components/field.html" with field=form.type %}
{% endif %}

2
users/templates/users/components/badges.html
View File

@ -1,3 +1,3 @@
{% for _slug, badge in badges.items %}
<img class="mr-2" width="{{ width }}" src="{{ badge.image }}" title="{{ badge.description }}" label="{{ badge.label }}" />
<img class="me-2" width="{{ width }}" src="{{ badge.image }}" title="{{ badge.description }}" label="{{ badge.label }}" />
{% endfor %}

2
users/templates/users/components/profile_display.html
View File

@ -1,7 +1,7 @@
{% load static %}
<img src="{% if user.image %}{{ user.image.url }}{% else %}{% static 'common/images/blank-profile-pic.png' %}{% endif %}" class="profile-avatar {{ classes }}">
{% if show_name %}
<span class="ml-2">
<span class="ms-2">
{% firstof user.full_name user.username %}
</span>
{% endif %}

6
users/templates/users/settings/profile.html
View File

@ -27,12 +27,12 @@
</div>
<div class="col-md-6 mb-4">
<label class="mb-2 h3" for="email">
<span class="mr-1">Email</span>
<span class="me-1">Email</span>
{% if user.confirmed_email_at %}
<span class="align-middle badge badge-sm badge-success"><i class="i-check"></i>Confirmed</span>
<span class="align-middle badge badgefs-xs badge-success"><i class="i-check"></i>Confirmed</span>
{% else %}
<span class="align-middle badge badge-sm badge-warning"><i class="i-alert-triangle"></i>Not yet confirmed</span>
<span class="align-middle badge badgefs-xs badge-warning"><i class="i-alert-triangle"></i>Not yet confirmed</span>
{% endif %}
</label>
<div class="align-items-center d-flex position-relative">