im
Text deleted Text added
-## Time
-
-```html
-
-```
-
-
-
-For blinking animation, make the time bold
-
-```html
-
-```
-
-
-
## Progress bar
```html
diff --git a/sass/_alerts.scss b/sass/_alerts.scss
index 490ff1d..c8abc5f 100644
--- a/sass/_alerts.scss
+++ b/sass/_alerts.scss
@@ -1,13 +1,8 @@
blockquote {
&.note {
- border-left: 0.25rem solid var(--blue-fg);
+ border-inline-start: 0.25rem solid var(--blue-fg);
- :root[dir*="rtl"] & {
- border-right: 0.25rem solid var(--blue-fg);
- border-left: unset;
- }
-
- .alert-name {
+ .alert-title {
color: var(--blue-fg);
}
@@ -20,14 +15,9 @@ blockquote {
}
&.tip {
- border-left: 0.25rem solid var(--green-fg);
+ border-inline-start: 0.25rem solid var(--green-fg);
- :root[dir*="rtl"] & {
- border-right: 0.25rem solid var(--green-fg);
- border-left: unset;
- }
-
- .alert-name {
+ .alert-title {
color: var(--green-fg);
}
@@ -40,14 +30,9 @@ blockquote {
}
&.important {
- border-left: 0.25rem solid var(--purple-fg);
+ border-inline-start: 0.25rem solid var(--purple-fg);
- :root[dir*="rtl"] & {
- border-right: 0.25rem solid var(--purple-fg);
- border-left: unset;
- }
-
- .alert-name {
+ .alert-title {
color: var(--purple-fg);
}
@@ -60,14 +45,9 @@ blockquote {
}
&.warning {
- border-left: 0.25rem solid var(--yellow-fg);
+ border-inline-start: 0.25rem solid var(--yellow-fg);
- :root[dir*="rtl"] & {
- border-right: 0.25rem solid var(--yellow-fg);
- border-left: unset;
- }
-
- .alert-name {
+ .alert-title {
color: var(--yellow-fg);
}
@@ -80,14 +60,9 @@ blockquote {
}
&.caution {
- border-left: 0.25rem solid var(--red-fg);
+ border-inline-start: 0.25rem solid var(--red-fg);
- :root[dir*="rtl"] & {
- border-right: 0.25rem solid var(--red-fg);
- border-left: unset;
- }
-
- .alert-name {
+ .alert-title {
color: var(--red-fg);
}
@@ -99,9 +74,9 @@ blockquote {
}
}
- .alert-name {
+ .alert-title {
font-weight: bold;
- margin-bottom: -0.5rem;
+ margin-bottom: -0.75rem;
}
.icon {
diff --git a/sass/_article-list.scss b/sass/_article-list.scss
index 413a23d..436822e 100644
--- a/sass/_article-list.scss
+++ b/sass/_article-list.scss
@@ -9,12 +9,7 @@
position: relative;
h3 {
- margin-right: 8rem;
-
- :root[dir*="rtl"] & {
- margin-right: unset;
- margin-left: 8rem;
- }
+ margin-inline-end: 8rem;
}
}
@@ -132,6 +127,7 @@
.icon {
vertical-align: -0.125em;
+ margin-inline-end: 0.25rem;
width: 1rem;
height: 1rem;
}
@@ -159,7 +155,8 @@
color: var(--purple-fg);
.icon {
- $icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath d='M4 1a1 1 0 0 0-.926.625l-2 5A1 1 0 0 0 1 7v7s0 2 2 2h10s2 0 2-2l.004-6.937c0-.149-.004-.297-.074-.438l-2-5A1 1 0 0 0 12 1zm.676 2h6.644l1.203 3h-9.05zM7 8h2v3h2a1 1 0 0 1-.293.707l-2 2a1 1 0 0 1-1.414 0l-2-2a1 1 0 0 1-.285-.7L5 11h2zm0 0'/%3E%3C/svg%3E");
+ // $icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath d='M4 1a1 1 0 0 0-.926.625l-2 5A1 1 0 0 0 1 7v7s0 2 2 2h10s2 0 2-2l.004-6.937c0-.149-.004-.297-.074-.438l-2-5A1 1 0 0 0 12 1zm.676 2h6.644l1.203 3h-9.05zM7 8h2v3h2a1 1 0 0 1-.293.707l-2 2a1 1 0 0 1-1.414 0l-2-2a1 1 0 0 1-.285-.7L5 11h2zm0 0'/%3E%3C/svg%3E");
+ $icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath d='M2 1C.89 1 0 1.89 0 3v2c0 .751.41 1.402 1.018 1.744A2 2 0 0 0 1 7v7c0 1.11.89 2 2 2h10c1.11 0 2-.89 2-2V7a2 2 0 0 0-.018-.256A2 2 0 0 0 16 5V3c0-1.11-.89-2-2-2zm0 2h12v2H2zm1 4h10v7H3zm3 1v1h4V8z'/%3E%3C/svg%3E");
-webkit-mask-image: $icon;
mask-image: $icon;
background-color: var(--purple-fg);
diff --git a/sass/_comments.scss b/sass/_comments.scss
index 96ad686..7cd686a 100644
--- a/sass/_comments.scss
+++ b/sass/_comments.scss
@@ -43,16 +43,9 @@
&.comment-reply {
position: relative;
- border-left: 0.25rem solid var(--fg-muted-2);
+ border-inline-start: 0.25rem solid var(--fg-muted-2);
border-radius: 0.25rem;
- padding-left: 1rem;
-
- :root[dir*="rtl"] & {
- border-right: 0.25rem solid var(--fg-muted-2);
- border-left: unset;
- padding-right: 1rem;
- padding-left: unset;
- }
+ padding-inline-start: 1rem;
}
.avatar-link {
diff --git a/sass/_external.scss b/sass/_external.scss
index fd71c5d..dd62b37 100644
--- a/sass/_external.scss
+++ b/sass/_external.scss
@@ -6,7 +6,7 @@
opacity: 0.6;
mask-image: $icon;
mask-size: cover;
- margin-left: 0.25rem;
+ margin-inline-start: 0.25rem;
background-color: var(--primary-color);
width: 0.75em;
height: 0.75em;
@@ -14,7 +14,5 @@
:root[dir*="rtl"] & {
transform: scaleX(-100%);
- margin-right: 0.25rem;
- margin-left: unset;
}
}
diff --git a/sass/_nav.scss b/sass/_nav.scss
index 0983a76..8e3fc93 100644
--- a/sass/_nav.scss
+++ b/sass/_nav.scss
@@ -9,6 +9,11 @@
border-radius: 1.625rem;
background-color: var(--nav-bg);
max-width: min(var(--container-width), 90%);
+ transition: var(--transition);
+
+ &:has(#search-container.active) {
+ border-radius: 1.625rem 1.625rem 0 0;
+ }
nav {
padding: 0.5rem;
@@ -40,13 +45,15 @@
#search-container {
-webkit-backdrop-filter: var(--blur);
position: absolute;
- top: 0;
+ top: calc(100% - 1rem);
left: 0;
opacity: 0;
z-index: 999;
backdrop-filter: var(--blur);
transition: var(--transition);
- box-shadow: var(--edge-highlight), 0 0.75rem 1.5rem -1rem rgba(0, 0, 0, 0.5);
+ box-shadow:
+ // var(--edge-highlight),
+ 0 0.75rem 1.5rem -1rem rgba(0, 0, 0, 0.5);
border-radius: 1.625rem;
background-color: var(--nav-bg);
padding: 0.5rem;
@@ -54,9 +61,10 @@
pointer-events: none;
&.active {
- top: calc(100% + 0.5rem);
+ top: 100%;
opacity: 1;
pointer-events: unset;
+ border-radius: 0 0 1.625rem 1.625rem;
}
#search-bar {
@@ -134,12 +142,7 @@
home {
position: relative;
- margin-right: 0.625rem;
-
- :root[dir*="rtl"] & {
- margin-right: unset;
- margin-left: 0.625rem;
- }
+ margin-inline-end: 0.625rem;
&::after {
position: absolute;
diff --git a/sass/_not-found.scss b/sass/_not-found.scss
index 80110d9..121d043 100644
--- a/sass/_not-found.scss
+++ b/sass/_not-found.scss
@@ -1,7 +1,4 @@
#not-found {
- padding-top: 1rem;
- padding-right: 35%;
- padding-bottom: 1rem;
- padding-left: 35%;
+ padding: 0 35%;
width: 100%;
}
diff --git a/sass/_post-nav.scss b/sass/_post-nav.scss
index 07d0340..731e3c8 100644
--- a/sass/_post-nav.scss
+++ b/sass/_post-nav.scss
@@ -16,12 +16,10 @@
&.post-nav-prev {
transform-origin: left;
- padding-right: 1rem;
+ padding-inline-end: 1rem;
:root[dir*="rtl"] & {
transform-origin: right;
- padding-right: unset;
- padding-left: 1rem;
}
.nav-arrow::before {
@@ -35,16 +33,12 @@
&.post-nav-next {
transform-origin: right;
- margin-left: auto;
- padding-left: 1rem;
+ margin-inline-start: auto;
+ padding-inline-start: 1rem;
text-align: end;
:root[dir*="rtl"] & {
transform-origin: left;
- margin-right: auto;
- margin-left: unset;
- padding-right: 1rem;
- padding-left: unset;
}
.nav-arrow::after {
diff --git a/sass/_statements.scss b/sass/_statements.scss
index 0bef436..bfdcf0a 100644
--- a/sass/_statements.scss
+++ b/sass/_statements.scss
@@ -34,7 +34,8 @@
color: var(--purple-fg);
.icon {
- $icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath d='M4 1a1 1 0 0 0-.926.625l-2 5A1 1 0 0 0 1 7v7s0 2 2 2h10s2 0 2-2l.004-6.937c0-.149-.004-.297-.074-.438l-2-5A1 1 0 0 0 12 1zm.676 2h6.644l1.203 3h-9.05zM7 8h2v3h2a1 1 0 0 1-.293.707l-2 2a1 1 0 0 1-1.414 0l-2-2a1 1 0 0 1-.285-.7L5 11h2zm0 0'/%3E%3C/svg%3E");
+ // $icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath d='M4 1a1 1 0 0 0-.926.625l-2 5A1 1 0 0 0 1 7v7s0 2 2 2h10s2 0 2-2l.004-6.937c0-.149-.004-.297-.074-.438l-2-5A1 1 0 0 0 12 1zm.676 2h6.644l1.203 3h-9.05zM7 8h2v3h2a1 1 0 0 1-.293.707l-2 2a1 1 0 0 1-1.414 0l-2-2a1 1 0 0 1-.285-.7L5 11h2zm0 0'/%3E%3C/svg%3E");
+ $icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath d='M2 1C.89 1 0 1.89 0 3v2c0 .751.41 1.402 1.018 1.744A2 2 0 0 0 1 7v7c0 1.11.89 2 2 2h10c1.11 0 2-.89 2-2V7a2 2 0 0 0-.018-.256A2 2 0 0 0 16 5V3c0-1.11-.89-2-2-2zm0 2h12v2H2zm1 4h10v7H3zm3 1v1h4V8z'/%3E%3C/svg%3E");
-webkit-mask-image: $icon;
mask-image: $icon;
background-color: var(--purple-fg);
diff --git a/sass/_tags.scss b/sass/_tags.scss
index 64f9ced..f2c20b5 100644
--- a/sass/_tags.scss
+++ b/sass/_tags.scss
@@ -7,12 +7,7 @@
list-style: none;
&.inline {
- margin-left: 0.25rem;
-
- :root[dir*="rtl"] & {
- margin-right: 0.25rem;
- margin-left: unset;
- }
+ margin-inline-start: 0.25rem;
}
li {
diff --git a/sass/_typography.scss b/sass/_typography.scss
index 014e07d..64425c9 100644
--- a/sass/_typography.scss
+++ b/sass/_typography.scss
@@ -45,21 +45,15 @@ figcaption {
blockquote {
margin: 0;
- border-left: 0.25rem solid var(--primary-color);
+ border-inline-start: 0.25rem solid var(--primary-color);
border-radius: 0.25rem;
padding: 0 0.75rem;
color: var(--fg-muted-5);
-
- :root[dir*="rtl"] & {
- border-right: 0.25rem solid var(--primary-color);
- border-left: unset;
- }
}
mark,
del,
ins,
-time,
samp,
q {
box-shadow: var(--edge-highlight);
@@ -86,31 +80,6 @@ ins {
text-decoration-thickness: max(1px, 0.0625em);
}
-time {
- background-color: var(--primary-color-alpha);
- color: var(--primary-color);
- font-weight: bold;
-
- strong {
- animation: clock-blink 1s infinite;
- font-weight: bold;
-
- @keyframes clock-blink {
- from {
- color: var(--primary-color);
- }
-
- 25% {
- color: var(--primary-color-alpha);
- }
-
- 50% {
- color: var(--primary-color);
- }
- }
- }
-}
-
samp {
background-color: var(--fg-muted-1);
color: var(--fg-muted-5);
diff --git a/static/.domains b/static/.domains
deleted file mode 100644
index 95bdcf5..0000000
--- a/static/.domains
+++ /dev/null
@@ -1,2 +0,0 @@
-duckquill.daudix.one
-duckquill.daudix.codeberg.page
diff --git a/templates/shortcodes/alert.html b/templates/shortcodes/alert.html
index 959847a..74e26de 100644
--- a/templates/shortcodes/alert.html
+++ b/templates/shortcodes/alert.html
@@ -12,7 +12,7 @@
{% if warning %}warning{% endif %}
{% if caution %}caution{% endif %}
">
-
+
{%- if note -%}
{{ macros_translate::translate(key="note", default="Note", language_strings=language_strings) }}