wagtail-cjkcms 24.10.1__py2.py3-none-any.whl → 24.12.2__py2.py3-none-any.whl
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- cjkcms/.DS_Store +0 -0
- cjkcms/__init__.py +1 -1
- cjkcms/blocks/__init__.py +2 -0
- cjkcms/blocks/content/countdown.py +116 -0
- cjkcms/models/admin_sidebar.py +4 -1
- cjkcms/models/snippet_models.py +22 -7
- cjkcms/static/vendor/simplycountdown/css/circle.css +73 -0
- cjkcms/static/vendor/simplycountdown/css/cyber.css +155 -0
- cjkcms/static/vendor/simplycountdown/css/dark.css +85 -0
- cjkcms/static/vendor/simplycountdown/css/light.css +85 -0
- cjkcms/static/vendor/simplycountdown/css/losange.css +83 -0
- cjkcms/static/vendor/simplycountdown/js/simplyCountdown.umd.js +2 -0
- cjkcms/static/vendor/simplycountdown/js/simplyCountdown.umd.js.map +1 -0
- cjkcms/templates/.DS_Store +0 -0
- cjkcms/templates/cjkcms/.DS_Store +0 -0
- cjkcms/templates/cjkcms/blocks/button_block.html +1 -1
- cjkcms/templates/cjkcms/blocks/countdown.html +24 -0
- cjkcms/templates/cjkcms/pages/search.html +5 -0
- cjkcms/templatetags/cjkcms_tags.py +17 -6
- cjkcms/tests/media/images/test.original.png +0 -0
- cjkcms/tests/media/original_images/test.png +0 -0
- cjkcms/tests/test_countdown_block.py +100 -0
- cjkcms/tests/test_search_blocks.py +10 -10
- cjkcms/tests/test_urls.py +8 -6
- cjkcms/views.py +52 -43
- {wagtail_cjkcms-24.10.1.dist-info → wagtail_cjkcms-24.12.2.dist-info}/METADATA +1 -1
- {wagtail_cjkcms-24.10.1.dist-info → wagtail_cjkcms-24.12.2.dist-info}/RECORD +31 -16
- {wagtail_cjkcms-24.10.1.dist-info → wagtail_cjkcms-24.12.2.dist-info}/WHEEL +1 -1
- {wagtail_cjkcms-24.10.1.dist-info → wagtail_cjkcms-24.12.2.dist-info}/LICENSE +0 -0
- {wagtail_cjkcms-24.10.1.dist-info → wagtail_cjkcms-24.12.2.dist-info}/entry_points.txt +0 -0
- {wagtail_cjkcms-24.10.1.dist-info → wagtail_cjkcms-24.12.2.dist-info}/top_level.txt +0 -0
cjkcms/.DS_Store
ADDED
Binary file
|
cjkcms/__init__.py
CHANGED
cjkcms/blocks/__init__.py
CHANGED
@@ -34,6 +34,7 @@ from .content_blocks import ( # noqa
|
|
34
34
|
HighlightBlock,
|
35
35
|
)
|
36
36
|
from .content.events import PublicEventBlock, EventCalendarBlock
|
37
|
+
from .content.countdown import CountdownBlock
|
37
38
|
from .layout_blocks import CardGridBlock, GridBlock, HeroBlock
|
38
39
|
from cjkcms.settings import cms_settings
|
39
40
|
|
@@ -77,6 +78,7 @@ CONTENT_STREAMBLOCKS = HTML_STREAMBLOCKS + [
|
|
77
78
|
("reusable_content", ReusableContentBlock()),
|
78
79
|
("event_calendar", EventCalendarBlock()),
|
79
80
|
("highlight", HighlightBlock()),
|
81
|
+
("countdown", CountdownBlock()),
|
80
82
|
]
|
81
83
|
|
82
84
|
NAVIGATION_STREAMBLOCKS = [
|
@@ -0,0 +1,116 @@
|
|
1
|
+
from cjkcms.blocks.base_blocks import BaseBlock
|
2
|
+
from wagtail import blocks
|
3
|
+
from django.utils.translation import gettext_lazy as _
|
4
|
+
from datetime import datetime, timedelta, timezone
|
5
|
+
import re
|
6
|
+
|
7
|
+
|
8
|
+
def convert_to_utc(naive_dt, utc_offset_str):
|
9
|
+
# Parse the UTC offset string (e.g., "UTC+05:30" or "UTC-02:00")
|
10
|
+
match = re.match(r"UTC([+-])(\d{2}):(\d{2})", utc_offset_str)
|
11
|
+
if not match:
|
12
|
+
raise ValueError("Invalid UTC offset format. Use 'UTC±HH:MM'.")
|
13
|
+
|
14
|
+
sign = match.group(1)
|
15
|
+
hours = int(match.group(2))
|
16
|
+
minutes = int(match.group(3))
|
17
|
+
|
18
|
+
# Calculate the total offset in minutes
|
19
|
+
total_offset = timedelta(hours=hours, minutes=minutes)
|
20
|
+
if sign == "-":
|
21
|
+
total_offset = -total_offset
|
22
|
+
|
23
|
+
# Create a timezone with the given offset
|
24
|
+
tz = timezone(total_offset)
|
25
|
+
|
26
|
+
# Attach the offset to the naive datetime, making it timezone-aware
|
27
|
+
aware_local_dt = naive_dt.replace(tzinfo=tz)
|
28
|
+
|
29
|
+
# Convert the timezone-aware datetime to UTC
|
30
|
+
utc_dt = aware_local_dt.astimezone(timezone.utc)
|
31
|
+
|
32
|
+
return utc_dt
|
33
|
+
|
34
|
+
|
35
|
+
class CountdownBlock(BaseBlock):
|
36
|
+
"""
|
37
|
+
Display a countdown to a specific date
|
38
|
+
"""
|
39
|
+
|
40
|
+
title = blocks.CharBlock(
|
41
|
+
required=False,
|
42
|
+
max_length=255,
|
43
|
+
label=_("Title"),
|
44
|
+
)
|
45
|
+
|
46
|
+
start_date = blocks.DateTimeBlock(
|
47
|
+
required=True,
|
48
|
+
label=_("Start date and time"),
|
49
|
+
help_text=_("Format: YYYY-MM-DD HH:MM"),
|
50
|
+
)
|
51
|
+
|
52
|
+
timezone = blocks.CharBlock(
|
53
|
+
required=True,
|
54
|
+
default="UTC",
|
55
|
+
max_length=255,
|
56
|
+
label=_("Timezone"),
|
57
|
+
help_text=_("Timezone relative to UTC, e.g. UTC+01:00"),
|
58
|
+
)
|
59
|
+
|
60
|
+
url = blocks.URLBlock(
|
61
|
+
max_length=255,
|
62
|
+
label=_("Link"),
|
63
|
+
required=False,
|
64
|
+
help_text=_("Optional link"),
|
65
|
+
)
|
66
|
+
|
67
|
+
# hide_after_end_date = blocks.BooleanBlock(
|
68
|
+
# required=False,
|
69
|
+
# default=False,
|
70
|
+
# label=_("Hide after end date"),
|
71
|
+
# help_text=_("Hide this after end date, or show zeros if false"),
|
72
|
+
# )
|
73
|
+
|
74
|
+
theme = blocks.ChoiceBlock(
|
75
|
+
choices=[
|
76
|
+
("light", _("Light")),
|
77
|
+
("dark", _("Dark")),
|
78
|
+
("cyber", _("Cyberpunk")),
|
79
|
+
("losange", _("Losange")),
|
80
|
+
("circle", _("Circle")),
|
81
|
+
# ("flipbook", _("Flipbook")),
|
82
|
+
],
|
83
|
+
default="light",
|
84
|
+
label=_("Theme"),
|
85
|
+
)
|
86
|
+
|
87
|
+
def get_context(self, value, parent_context=None):
|
88
|
+
context = super().get_context(value, parent_context=parent_context)
|
89
|
+
sd = value.get("start_date")
|
90
|
+
|
91
|
+
naive_datetime = datetime(
|
92
|
+
sd.year, sd.month, sd.day, sd.hour, sd.minute
|
93
|
+
) # Naive datetime
|
94
|
+
|
95
|
+
tz = value.get("timezone")
|
96
|
+
if tz == "UTC" or tz == "":
|
97
|
+
tz = "UTC+00:00"
|
98
|
+
|
99
|
+
utc_offset_string = tz # String containing UTC offset
|
100
|
+
utc = convert_to_utc(naive_datetime, utc_offset_string)
|
101
|
+
|
102
|
+
# print(naive_datetime, utc, utc_offset_string)
|
103
|
+
context["year"] = utc.year
|
104
|
+
context["month"] = utc.month
|
105
|
+
context["day"] = utc.day
|
106
|
+
context["hour"] = utc.hour
|
107
|
+
context["minute"] = utc.minute
|
108
|
+
context["second"] = 0
|
109
|
+
return context
|
110
|
+
|
111
|
+
class Meta:
|
112
|
+
template = "cjkcms/blocks/countdown.html"
|
113
|
+
icon = "history"
|
114
|
+
label = "Countdown"
|
115
|
+
ordering = ["start_date"]
|
116
|
+
label_format = _("Countdown to {start_date}")
|
cjkcms/models/admin_sidebar.py
CHANGED
@@ -1,4 +1,4 @@
|
|
1
|
-
from .snippet_models import Navbar, EventCalendar
|
1
|
+
from .snippet_models import Navbar, NavbarForm, EventCalendar
|
2
2
|
from wagtail.snippets.views.snippets import SnippetViewSet
|
3
3
|
|
4
4
|
|
@@ -16,6 +16,9 @@ class NavbarSnippet(SnippetViewSet):
|
|
16
16
|
"name",
|
17
17
|
]
|
18
18
|
|
19
|
+
def get_form_class(self, for_update=False):
|
20
|
+
return NavbarForm
|
21
|
+
|
19
22
|
|
20
23
|
class EventCalendarSnippet(SnippetViewSet):
|
21
24
|
model = EventCalendar
|
cjkcms/models/snippet_models.py
CHANGED
@@ -25,6 +25,7 @@ from django.conf import settings
|
|
25
25
|
from cjkcms.fields import CjkcmsStreamField
|
26
26
|
from wagtail_color_panel.fields import ColorField
|
27
27
|
from wagtail_color_panel.edit_handlers import NativeColorPanel
|
28
|
+
from django.forms import ModelForm
|
28
29
|
|
29
30
|
|
30
31
|
@register_snippet
|
@@ -342,7 +343,7 @@ class Navbar(models.Model):
|
|
342
343
|
language = models.CharField(
|
343
344
|
blank=True,
|
344
345
|
max_length=10,
|
345
|
-
choices=[
|
346
|
+
choices=[],
|
346
347
|
default="_all_",
|
347
348
|
verbose_name=_("Show in language"),
|
348
349
|
help_text=_("Select a language to limit display to specific locale."),
|
@@ -371,24 +372,38 @@ class Navbar(models.Model):
|
|
371
372
|
def __str__(self):
|
372
373
|
return self.name
|
373
374
|
|
375
|
+
@staticmethod
|
376
|
+
def get_available_langs():
|
377
|
+
available_langs = [("_all_", _("All languages"))]
|
378
|
+
if hasattr(settings, "WAGTAIL_CONTENT_LANGUAGES"):
|
379
|
+
available_langs += settings.WAGTAIL_CONTENT_LANGUAGES
|
380
|
+
return available_langs
|
381
|
+
|
374
382
|
def __init__(self, *args, **kwargs):
|
375
383
|
"""
|
376
384
|
Inject custom choices and defaults into the form fields
|
377
385
|
to enable customization of settings without causing migration issues.
|
378
386
|
"""
|
379
387
|
super().__init__(*args, **kwargs)
|
380
|
-
# Set choices dynamically.
|
381
|
-
|
382
|
-
available_langs = [("_all_", _("All languages"))]
|
383
|
-
if hasattr(settings, "WAGTAIL_CONTENT_LANGUAGES"):
|
384
|
-
available_langs += settings.WAGTAIL_CONTENT_LANGUAGES
|
385
388
|
|
386
|
-
self._meta.get_field("language").choices =
|
389
|
+
self._meta.get_field("language").choices = Navbar.get_available_langs() # type: ignore
|
387
390
|
# Set default dynamically.
|
388
391
|
if not self.id: # type: ignore
|
389
392
|
self.language = "_all_"
|
390
393
|
|
391
394
|
|
395
|
+
class NavbarForm(ModelForm):
|
396
|
+
class Meta:
|
397
|
+
model = Navbar
|
398
|
+
fields = "__all__"
|
399
|
+
|
400
|
+
def __init__(self, *args, **kwargs):
|
401
|
+
super().__init__(*args, **kwargs)
|
402
|
+
|
403
|
+
# Set the dynamic choices
|
404
|
+
self.fields["language"].choices = Navbar.get_available_langs()
|
405
|
+
|
406
|
+
|
392
407
|
@register_snippet
|
393
408
|
class Footer(models.Model):
|
394
409
|
"""
|
@@ -0,0 +1,73 @@
|
|
1
|
+
.simply-countdown-circle {
|
2
|
+
--sc-circle-primary: #6366f1;
|
3
|
+
--sc-circle-secondary: #818cf8;
|
4
|
+
--sc-circle-bg: #1e1b4b;
|
5
|
+
--sc-circle-text: #fff;
|
6
|
+
|
7
|
+
display: flex;
|
8
|
+
flex-wrap: wrap;
|
9
|
+
justify-content: center;
|
10
|
+
gap: 1.5rem;
|
11
|
+
font-family: "Inter", sans-serif;
|
12
|
+
}
|
13
|
+
|
14
|
+
.simply-countdown-circle > .simply-section {
|
15
|
+
position: relative;
|
16
|
+
width: 100px;
|
17
|
+
height: 100px;
|
18
|
+
padding: 1rem;
|
19
|
+
display: flex;
|
20
|
+
align-items: center;
|
21
|
+
justify-content: center;
|
22
|
+
flex-direction: column;
|
23
|
+
border-radius: 50%;
|
24
|
+
background: linear-gradient(45deg, var(--sc-circle-primary), var(--sc-circle-secondary));
|
25
|
+
box-shadow: 0 0 25px -5px var(--sc-circle-primary);
|
26
|
+
animation: pulse-circle 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
|
27
|
+
}
|
28
|
+
|
29
|
+
.simply-countdown-circle > .simply-section::before {
|
30
|
+
content: "";
|
31
|
+
position: absolute;
|
32
|
+
inset: 6px;
|
33
|
+
border-radius: 50%;
|
34
|
+
background: var(--sc-circle-bg);
|
35
|
+
z-index: 0;
|
36
|
+
}
|
37
|
+
|
38
|
+
.simply-countdown-circle > .simply-section > div {
|
39
|
+
position: relative;
|
40
|
+
z-index: 1;
|
41
|
+
color: var(--sc-circle-text);
|
42
|
+
text-align: center;
|
43
|
+
}
|
44
|
+
|
45
|
+
.simply-countdown-circle .simply-amount {
|
46
|
+
display: block;
|
47
|
+
font-size: 1.75rem;
|
48
|
+
font-weight: 700;
|
49
|
+
line-height: 1;
|
50
|
+
background: linear-gradient(to right, var(--sc-circle-primary), var(--sc-circle-secondary));
|
51
|
+
-webkit-background-clip: text;
|
52
|
+
background-clip: text;
|
53
|
+
-webkit-text-fill-color: transparent;
|
54
|
+
}
|
55
|
+
|
56
|
+
.simply-countdown-circle .simply-word {
|
57
|
+
font-size: 0.7rem;
|
58
|
+
text-transform: uppercase;
|
59
|
+
letter-spacing: 0.05em;
|
60
|
+
opacity: 0.8;
|
61
|
+
}
|
62
|
+
|
63
|
+
@keyframes pulse-circle {
|
64
|
+
0%,
|
65
|
+
100% {
|
66
|
+
transform: scale(1);
|
67
|
+
opacity: 1;
|
68
|
+
}
|
69
|
+
50% {
|
70
|
+
transform: scale(0.98);
|
71
|
+
opacity: 0.9;
|
72
|
+
}
|
73
|
+
}
|
@@ -0,0 +1,155 @@
|
|
1
|
+
/**
|
2
|
+
* Project : simply-countdown
|
3
|
+
* File : simplyCountdown.theme.cyberpunk
|
4
|
+
* Author : Vincent Loy <vincent.loy1@gmail.com>
|
5
|
+
* Theme : Modern Cyberpunk
|
6
|
+
*/
|
7
|
+
|
8
|
+
.simply-countdown-cyber {
|
9
|
+
overflow: visible;
|
10
|
+
display: flex;
|
11
|
+
flex-wrap: wrap;
|
12
|
+
justify-content: center;
|
13
|
+
gap: 1.75rem;
|
14
|
+
font-family: "Inter", system-ui, -apple-system, sans-serif;
|
15
|
+
perspective: 1000px;
|
16
|
+
}
|
17
|
+
|
18
|
+
.simply-countdown-cyber > .simply-section {
|
19
|
+
width: 70px;
|
20
|
+
height: 70px;
|
21
|
+
padding: 1.5rem;
|
22
|
+
position: relative;
|
23
|
+
display: flex;
|
24
|
+
align-items: center;
|
25
|
+
justify-content: center;
|
26
|
+
background: linear-gradient(135deg, rgba(23, 25, 35, 0.9), rgba(15, 17, 25, 0.95));
|
27
|
+
border-radius: 0.5rem;
|
28
|
+
transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
|
29
|
+
backdrop-filter: blur(12px);
|
30
|
+
transform-style: preserve-3d;
|
31
|
+
}
|
32
|
+
|
33
|
+
.simply-countdown-cyber > .simply-section::before {
|
34
|
+
content: "";
|
35
|
+
position: absolute;
|
36
|
+
inset: -1px;
|
37
|
+
background: linear-gradient(135deg, rgba(120, 240, 255, 0.2), rgba(255, 90, 220, 0.2));
|
38
|
+
border-radius: 0.5rem;
|
39
|
+
z-index: -1;
|
40
|
+
opacity: 0;
|
41
|
+
transition: opacity 0.3s ease;
|
42
|
+
}
|
43
|
+
|
44
|
+
.simply-countdown-cyber > .simply-section::after {
|
45
|
+
content: "";
|
46
|
+
position: absolute;
|
47
|
+
inset: -2px;
|
48
|
+
background: linear-gradient(135deg, #78f0ff, #ff5adc);
|
49
|
+
border-radius: 0.5rem;
|
50
|
+
z-index: -2;
|
51
|
+
opacity: 0.15;
|
52
|
+
filter: blur(4px);
|
53
|
+
animation: pulse 4s ease-in-out infinite;
|
54
|
+
}
|
55
|
+
|
56
|
+
.simply-countdown-cyber > .simply-section .glass-overlay {
|
57
|
+
position: absolute;
|
58
|
+
inset: 0;
|
59
|
+
background: linear-gradient(135deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.05));
|
60
|
+
border-radius: 0.5rem;
|
61
|
+
}
|
62
|
+
|
63
|
+
.simply-countdown-cyber > .simply-section:hover {
|
64
|
+
transform: translateY(-4px) translateZ(10px) rotateX(5deg);
|
65
|
+
box-shadow: 0 20px 40px -10px rgba(0, 0, 0, 0.5), 0 0 20px rgba(120, 240, 255, 0.2), 0 0 0 1px rgba(120, 240, 255, 0.1);
|
66
|
+
}
|
67
|
+
|
68
|
+
.simply-countdown-cyber > .simply-section:hover::before {
|
69
|
+
opacity: 1;
|
70
|
+
}
|
71
|
+
|
72
|
+
.simply-countdown-cyber > .simply-section > div {
|
73
|
+
display: flex;
|
74
|
+
flex-direction: column;
|
75
|
+
gap: 0.4rem;
|
76
|
+
align-items: center;
|
77
|
+
transform-style: preserve-3d;
|
78
|
+
}
|
79
|
+
|
80
|
+
.simply-countdown-cyber > .simply-section .simply-amount {
|
81
|
+
font-size: 1.75rem;
|
82
|
+
font-weight: 700;
|
83
|
+
background: linear-gradient(to bottom right, #78f0ff, #ff5adc);
|
84
|
+
-webkit-background-clip: text;
|
85
|
+
background-clip: text;
|
86
|
+
color: transparent;
|
87
|
+
text-shadow: 0 0 20px rgba(120, 240, 255, 0.3), 0 0 40px rgba(120, 240, 255, 0.2);
|
88
|
+
letter-spacing: -0.02em;
|
89
|
+
transform: translateZ(10px);
|
90
|
+
}
|
91
|
+
|
92
|
+
.simply-countdown-cyber > .simply-section .simply-word {
|
93
|
+
font-size: 0.6rem;
|
94
|
+
font-weight: 500;
|
95
|
+
text-transform: uppercase;
|
96
|
+
letter-spacing: 0.2em;
|
97
|
+
color: rgba(255, 255, 255, 0.7);
|
98
|
+
transform: translateZ(5px);
|
99
|
+
position: relative;
|
100
|
+
}
|
101
|
+
|
102
|
+
.simply-countdown-cyber > .simply-section .simply-word::after {
|
103
|
+
content: "";
|
104
|
+
position: absolute;
|
105
|
+
left: -10%;
|
106
|
+
bottom: -4px;
|
107
|
+
width: 120%;
|
108
|
+
height: 1px;
|
109
|
+
background: linear-gradient(to right, rgba(120, 240, 255, 0), rgba(120, 240, 255, 0.5), rgba(255, 90, 220, 0.5), rgba(255, 90, 220, 0));
|
110
|
+
}
|
111
|
+
|
112
|
+
@media (min-width: 640px) {
|
113
|
+
.simply-countdown-cyber > .simply-section {
|
114
|
+
width: 80px;
|
115
|
+
height: 80px;
|
116
|
+
padding: 1.75rem;
|
117
|
+
}
|
118
|
+
|
119
|
+
.simply-countdown-cyber > .simply-section .simply-amount {
|
120
|
+
font-size: 2rem;
|
121
|
+
}
|
122
|
+
|
123
|
+
.simply-countdown-cyber > .simply-section .simply-word {
|
124
|
+
font-size: 0.75rem;
|
125
|
+
}
|
126
|
+
}
|
127
|
+
|
128
|
+
@media (min-width: 1024px) {
|
129
|
+
.simply-countdown-cyber > .simply-section {
|
130
|
+
width: 100px;
|
131
|
+
height: 100px;
|
132
|
+
padding: 2rem;
|
133
|
+
}
|
134
|
+
|
135
|
+
.simply-countdown-cyber > .simply-section .simply-amount {
|
136
|
+
font-size: 2.5rem;
|
137
|
+
}
|
138
|
+
|
139
|
+
.simply-countdown-cyber > .simply-section .simply-word {
|
140
|
+
font-size: 0.8rem;
|
141
|
+
}
|
142
|
+
}
|
143
|
+
|
144
|
+
/* Add subtle animation for extra futuristic feel */
|
145
|
+
@keyframes pulse {
|
146
|
+
0%,
|
147
|
+
100% {
|
148
|
+
opacity: 0.15;
|
149
|
+
transform: scale(1);
|
150
|
+
}
|
151
|
+
50% {
|
152
|
+
opacity: 0.25;
|
153
|
+
transform: scale(1.05);
|
154
|
+
}
|
155
|
+
}
|
@@ -0,0 +1,85 @@
|
|
1
|
+
/**
|
2
|
+
* Project : simply-countdown
|
3
|
+
* File : simplyCountdown.theme.dark
|
4
|
+
* Author : Vincent Loy <vincent.loy1@gmail.com>
|
5
|
+
* Theme : Dark Modern
|
6
|
+
*/
|
7
|
+
|
8
|
+
.simply-countdown-dark {
|
9
|
+
overflow: hidden;
|
10
|
+
display: flex;
|
11
|
+
flex-wrap: wrap;
|
12
|
+
justify-content: center;
|
13
|
+
gap: 1.25rem;
|
14
|
+
font-family: "Inter", system-ui, -apple-system, sans-serif;
|
15
|
+
}
|
16
|
+
|
17
|
+
.simply-countdown-dark > .simply-section {
|
18
|
+
width: 65px;
|
19
|
+
height: 65px;
|
20
|
+
padding: 1.5rem;
|
21
|
+
display: flex;
|
22
|
+
align-items: center;
|
23
|
+
justify-content: center;
|
24
|
+
background: rgba(15, 23, 42, 0.75);
|
25
|
+
border: 1px solid rgba(51, 65, 85, 0.6);
|
26
|
+
border-radius: 1rem;
|
27
|
+
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.2), 0 2px 4px -1px rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(255, 255, 255, 0.05);
|
28
|
+
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
|
29
|
+
backdrop-filter: blur(10px);
|
30
|
+
}
|
31
|
+
|
32
|
+
.simply-countdown-dark > .simply-section > div {
|
33
|
+
display: flex;
|
34
|
+
flex-direction: column;
|
35
|
+
line-height: 1;
|
36
|
+
align-items: center;
|
37
|
+
}
|
38
|
+
|
39
|
+
.simply-countdown-dark > .simply-section .simply-amount {
|
40
|
+
font-size: 1.5rem;
|
41
|
+
font-weight: 700;
|
42
|
+
color: #f1f5f9;
|
43
|
+
line-height: 1.2;
|
44
|
+
letter-spacing: -0.025em;
|
45
|
+
}
|
46
|
+
|
47
|
+
.simply-countdown-dark > .simply-section .simply-word {
|
48
|
+
font-size: 0.6rem;
|
49
|
+
font-weight: 500;
|
50
|
+
color: #94a3b8;
|
51
|
+
text-transform: uppercase;
|
52
|
+
letter-spacing: 0.1em;
|
53
|
+
}
|
54
|
+
|
55
|
+
@media (min-width: 640px) {
|
56
|
+
.simply-countdown-dark > .simply-section {
|
57
|
+
width: 75px;
|
58
|
+
height: 75px;
|
59
|
+
padding: 1.75rem;
|
60
|
+
}
|
61
|
+
|
62
|
+
.simply-countdown-dark > .simply-section .simply-amount {
|
63
|
+
font-size: 1.75rem;
|
64
|
+
}
|
65
|
+
|
66
|
+
.simply-countdown-dark > .simply-section .simply-word {
|
67
|
+
font-size: 0.75rem;
|
68
|
+
}
|
69
|
+
}
|
70
|
+
|
71
|
+
@media (min-width: 1024px) {
|
72
|
+
.simply-countdown-dark > .simply-section {
|
73
|
+
width: 90px;
|
74
|
+
height: 90px;
|
75
|
+
padding: 2rem;
|
76
|
+
}
|
77
|
+
|
78
|
+
.simply-countdown-dark > .simply-section .simply-amount {
|
79
|
+
font-size: 2rem;
|
80
|
+
}
|
81
|
+
|
82
|
+
.simply-countdown-dark > .simply-section .simply-word {
|
83
|
+
font-size: 0.8rem;
|
84
|
+
}
|
85
|
+
}
|
@@ -0,0 +1,85 @@
|
|
1
|
+
/**
|
2
|
+
* Project : simply-countdown
|
3
|
+
* File : simplyCountdown.theme.default
|
4
|
+
* Author : Vincent Loy <vincent.loy1@gmail.com>
|
5
|
+
* Theme : Light Modern
|
6
|
+
*/
|
7
|
+
|
8
|
+
.simply-countdown-light {
|
9
|
+
overflow: hidden;
|
10
|
+
display: flex;
|
11
|
+
flex-wrap: wrap;
|
12
|
+
justify-content: center;
|
13
|
+
gap: 1.25rem;
|
14
|
+
font-family: "Inter", system-ui, -apple-system, sans-serif;
|
15
|
+
}
|
16
|
+
|
17
|
+
.simply-countdown-light > .simply-section {
|
18
|
+
width: 65px;
|
19
|
+
height: 65px;
|
20
|
+
padding: 1.5rem;
|
21
|
+
display: flex;
|
22
|
+
align-items: center;
|
23
|
+
justify-content: center;
|
24
|
+
background: rgba(255, 255, 255, 0.9);
|
25
|
+
border: 1px solid rgba(226, 232, 240, 0.8);
|
26
|
+
border-radius: 1rem;
|
27
|
+
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.03), 0 0 0 1px rgba(0, 0, 0, 0.02);
|
28
|
+
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
|
29
|
+
backdrop-filter: blur(10px);
|
30
|
+
}
|
31
|
+
|
32
|
+
.simply-countdown-light > .simply-section > div {
|
33
|
+
display: flex;
|
34
|
+
flex-direction: column;
|
35
|
+
line-height: 1;
|
36
|
+
align-items: center;
|
37
|
+
}
|
38
|
+
|
39
|
+
.simply-countdown-light > .simply-section .simply-amount {
|
40
|
+
font-size: 1.5rem;
|
41
|
+
font-weight: 700;
|
42
|
+
color: #1e293b;
|
43
|
+
line-height: 1.2;
|
44
|
+
letter-spacing: -0.025em;
|
45
|
+
}
|
46
|
+
|
47
|
+
.simply-countdown-light > .simply-section .simply-word {
|
48
|
+
font-size: 0.6rem;
|
49
|
+
font-weight: 500;
|
50
|
+
color: #64748b;
|
51
|
+
text-transform: uppercase;
|
52
|
+
letter-spacing: 0.1em;
|
53
|
+
}
|
54
|
+
|
55
|
+
@media (min-width: 640px) {
|
56
|
+
.simply-countdown-light > .simply-section {
|
57
|
+
width: 75px;
|
58
|
+
height: 75px;
|
59
|
+
padding: 1.75rem;
|
60
|
+
}
|
61
|
+
|
62
|
+
.simply-countdown-light > .simply-section .simply-amount {
|
63
|
+
font-size: 1.75rem;
|
64
|
+
}
|
65
|
+
|
66
|
+
.simply-countdown-light > .simply-section .simply-word {
|
67
|
+
font-size: 0.75rem;
|
68
|
+
}
|
69
|
+
}
|
70
|
+
|
71
|
+
@media (min-width: 1024px) {
|
72
|
+
.simply-countdown-light > .simply-section {
|
73
|
+
width: 90px;
|
74
|
+
height: 90px;
|
75
|
+
padding: 2rem;
|
76
|
+
}
|
77
|
+
|
78
|
+
.simply-countdown-light > .simply-section .simply-amount {
|
79
|
+
font-size: 2rem;
|
80
|
+
}
|
81
|
+
|
82
|
+
.simply-countdown-light > .simply-section .simply-word {
|
83
|
+
font-size: 0.8rem;
|
84
|
+
}
|
85
|
+
}
|
@@ -0,0 +1,83 @@
|
|
1
|
+
/**
|
2
|
+
* Project : simply-countdown
|
3
|
+
* File : simplyCountdown.theme.losange
|
4
|
+
* Author : Vincent Loy <vincent.loy1@gmail.com>
|
5
|
+
*/
|
6
|
+
|
7
|
+
.simply-countdown-losange {
|
8
|
+
overflow: visible;
|
9
|
+
display: flex;
|
10
|
+
flex-wrap: wrap;
|
11
|
+
justify-content: center;
|
12
|
+
gap: 3rem;
|
13
|
+
font-family: "Inter", sans-serif;
|
14
|
+
}
|
15
|
+
|
16
|
+
.simply-countdown-losange > .simply-section {
|
17
|
+
width: 70px;
|
18
|
+
height: 70px;
|
19
|
+
display: flex;
|
20
|
+
justify-content: center;
|
21
|
+
align-items: center;
|
22
|
+
transform: rotate(-45deg);
|
23
|
+
background: linear-gradient(135deg, #4f46e5, #7c3aed);
|
24
|
+
border-radius: 0.5rem;
|
25
|
+
transition: all 0.2s ease-in-out;
|
26
|
+
}
|
27
|
+
|
28
|
+
.simply-countdown-losange > .simply-section > div {
|
29
|
+
transform: rotate(45deg);
|
30
|
+
display: flex;
|
31
|
+
flex-direction: column;
|
32
|
+
line-height: 1.2;
|
33
|
+
}
|
34
|
+
|
35
|
+
.simply-countdown-losange > .simply-section .simply-amount,
|
36
|
+
.simply-countdown-losange > .simply-section .simply-word {
|
37
|
+
display: block;
|
38
|
+
text-align: center;
|
39
|
+
}
|
40
|
+
|
41
|
+
.simply-countdown-losange > .simply-section .simply-amount {
|
42
|
+
font-size: 1.25rem;
|
43
|
+
font-weight: 700;
|
44
|
+
color: #fff;
|
45
|
+
}
|
46
|
+
|
47
|
+
.simply-countdown-losange > .simply-section .simply-word {
|
48
|
+
font-size: 0.65rem;
|
49
|
+
font-weight: 500;
|
50
|
+
color: rgba(255, 255, 255, 0.9);
|
51
|
+
text-transform: uppercase;
|
52
|
+
letter-spacing: 0.05em;
|
53
|
+
}
|
54
|
+
|
55
|
+
@media (min-width: 640px) {
|
56
|
+
.simply-countdown-losange > .simply-section {
|
57
|
+
width: 80px;
|
58
|
+
height: 80px;
|
59
|
+
}
|
60
|
+
|
61
|
+
.simply-countdown-losange > .simply-section .simply-amount {
|
62
|
+
font-size: 1.5rem;
|
63
|
+
}
|
64
|
+
|
65
|
+
.simply-countdown-losange > .simply-section .simply-word {
|
66
|
+
font-size: 0.7rem;
|
67
|
+
}
|
68
|
+
}
|
69
|
+
|
70
|
+
@media (min-width: 1024px) {
|
71
|
+
.simply-countdown-losange > .simply-section {
|
72
|
+
width: 90px;
|
73
|
+
height: 90px;
|
74
|
+
}
|
75
|
+
|
76
|
+
.simply-countdown-losange > .simply-section .simply-amount {
|
77
|
+
font-size: 1.75rem;
|
78
|
+
}
|
79
|
+
|
80
|
+
.simply-countdown-losange > .simply-section .simply-word {
|
81
|
+
font-size: 0.75rem;
|
82
|
+
}
|
83
|
+
}
|