add some geojson layer

This commit is contained in:
vergiLgood1 2025-05-07 09:03:52 +07:00
parent 05ba4ab920
commit 3448945f4d
63 changed files with 4023 additions and 485 deletions

View File

@ -1,6 +1,7 @@
import { Geist } from "next/font/google";
import { ThemeProvider } from "next-themes";
import "@/app/_styles/globals.css";
import "@/app/_styles/ui.css";
import ReactQueryProvider from "@/app/_lib/react-query-provider";
import { Toaster } from "@/app/_components/ui/sonner";

View File

@ -218,7 +218,7 @@ export default function CrimeMap() {
<Button onClick={() => window.location.reload()}>Retry</Button>
</div>
) : (
<div className="relative h-[600px]" ref={mapContainerRef}>
<div className="mapbox-container relative h-[600px]" ref={mapContainerRef}>
<div className={cn(
"transition-all duration-300 ease-in-out",
!sidebarCollapsed && isFullscreen && "ml-[400px]"

View File

@ -0,0 +1,124 @@
"use client"
import React, { useEffect } from 'react';
import mapboxgl from 'mapbox-gl';
interface CoastlineLayerProps {
map: mapboxgl.Map | null;
visible?: boolean;
}
export default function CoastlineLayer({ map, visible = true }: CoastlineLayerProps) {
useEffect(() => {
if (!map) return;
// Function to add coastline layer
function addCoastline() {
const sourceId = 'coastline';
const layerId = 'outline-coastline';
// Make sure map is defined
if (!map) return;
try {
// Check if the source already exists
if (!map.getSource(sourceId)) {
// Add coastline data source
fetch('/geojson/garis_pantai.geojson')
.then(response => response.json())
.then(data => {
// Add coastline data source
map.addSource(sourceId, {
type: 'geojson',
generateId: true,
data: data
});
// Add coastline layer
map.addLayer({
'id': layerId,
'type': 'line',
'source': sourceId,
'layout': {
'visibility': visible ? 'visible' : 'none',
},
'paint': {
'line-color': ['get', 'color'],
'line-width': 5,
'line-opacity': 1
}
});
})
.catch((error) => {
console.error('Error fetching coastline data:', error);
});
} else if (map.getLayer(layerId)) {
// If the layer exists, just update its visibility
map.setLayoutProperty(
layerId,
'visibility',
visible ? 'visible' : 'none'
);
}
} catch (error) {
console.warn("Error adding coastline:", error);
}
}
// Function to clean up layers
function cleanupCoastline() {
try {
if (!map || !map.getStyle()) return;
const layerId = 'outline-coastline';
const sourceId = 'coastline';
if (map.getLayer(layerId)) {
map.removeLayer(layerId);
}
if (map.getSource(sourceId)) {
map.removeSource(sourceId);
}
} catch (error) {
console.warn("Error cleaning up coastline:", error);
}
}
let timeoutId: NodeJS.Timeout | undefined;
// Try to add the layers now or set up listeners for when map is ready
try {
if (map.loaded() && map.isStyleLoaded()) {
addCoastline();
} else {
// Use multiple events to catch map ready state
map.on('load', addCoastline);
map.on('style.load', addCoastline);
map.on('styledata', addCoastline);
// Fallback timeout
timeoutId = setTimeout(() => {
addCoastline();
}, 2000);
}
} catch (error) {
console.warn("Error setting up coastline:", error);
}
// Single cleanup function
return () => {
if (timeoutId) clearTimeout(timeoutId);
if (map) {
map.off('load', addCoastline);
map.off('style.load', addCoastline);
map.off('styledata', addCoastline);
}
cleanupCoastline();
};
}, [map, visible]);
return null;
}

View File

@ -0,0 +1,117 @@
"use client"
import React, { useEffect } from 'react';
import mapboxgl from 'mapbox-gl';
interface FaultLinesLayerProps {
map: mapboxgl.Map | null;
visible?: boolean;
}
export default function FaultLinesLayer({ map, visible = true }: FaultLinesLayerProps) {
useEffect(() => {
if (!map) return;
// Function to add fault lines layer
function addFaultLines() {
const sourceId = 'indo_faults_lines';
const layerId = 'indo_faults_line_layer';
// Make sure map is defined
if (!map) return;
try {
// Check if the source already exists
if (!map.getSource(sourceId)) {
// Add fault lines data source
const url = "/geojson/indo_faults_lines.geojson";
map.addSource(sourceId, {
'type': 'geojson',
'generateId': true,
'data': url
});
// Add a line layer to visualize the fault lines
map.addLayer({
'id': layerId,
'type': 'line',
'source': sourceId,
'layout': {
'visibility': visible ? 'visible' : 'none'
},
'paint': {
'line-color': 'red',
'line-width': 1,
'line-opacity': 0.5
}
});
} else if (map.getLayer(layerId)) {
// If the layer exists, just update its visibility
map.setLayoutProperty(
layerId,
'visibility',
visible ? 'visible' : 'none'
);
}
} catch (error) {
console.warn("Error adding fault lines:", error);
}
}
// Function to clean up layers
function cleanupFaultLines() {
try {
if (!map || !map.getStyle()) return;
const layerId = 'indo_faults_line_layer';
const sourceId = 'indo_faults_lines';
if (map.getLayer(layerId)) {
map.removeLayer(layerId);
}
if (map.getSource(sourceId)) {
map.removeSource(sourceId);
}
} catch (error) {
console.warn("Error cleaning up fault lines:", error);
}
}
let timeoutId: NodeJS.Timeout | undefined;
// Try to add the layers now or set up listeners for when map is ready
try {
if (map.loaded() && map.isStyleLoaded()) {
addFaultLines();
} else {
// Use multiple events to catch map ready state
map.on('load', addFaultLines);
map.on('style.load', addFaultLines);
map.on('styledata', addFaultLines);
// Fallback timeout
timeoutId = setTimeout(() => {
addFaultLines();
}, 2000);
}
} catch (error) {
console.warn("Error setting up fault lines:", error);
}
// Single cleanup function
return () => {
if (timeoutId) clearTimeout(timeoutId);
if (map) {
map.off('load', addFaultLines);
map.off('style.load', addFaultLines);
map.off('styledata', addFaultLines);
}
cleanupFaultLines();
};
}, [map, visible]);
return null;
}

View File

@ -20,7 +20,9 @@ import type { IUnits } from "@/app/_utils/types/units"
import UnitsLayer from "./units-layer"
import DistrictFillLineLayer from "./district-layer"
import CrimePopup from "../pop-up/crime-popup"
import TimeZonesDisplay from "../timezone"
import TimeZonesDisplay from "./timezone"
import TimezoneLayer from "./timezone"
import FaultLinesLayer from "./fault-lines"
// Interface for crime incident
interface ICrimeIncident {
@ -102,31 +104,31 @@ export default function Layers({
setSelectedIncident(null)
setFocusedDistrictId(null)
// Reset map view/camera
if (map) {
map.easeTo({
zoom: BASE_ZOOM,
pitch: BASE_PITCH,
bearing: BASE_BEARING,
duration: 1500,
easing: (t) => t * (2 - t), // easeOutQuad
})
// Reset map view/camera
if (map) {
map.easeTo({
zoom: BASE_ZOOM,
pitch: BASE_PITCH,
bearing: BASE_BEARING,
duration: 1500,
easing: (t) => t * (2 - t), // easeOutQuad
})
// Show all clusters again when closing popup
if (map.getLayer("clusters")) {
map.getMap().setLayoutProperty("clusters", "visibility", "visible")
}
if (map.getLayer("unclustered-point")) {
map.getMap().setLayoutProperty("unclustered-point", "visibility", "visible")
// Show all clusters again when closing popup
if (map.getLayer("clusters")) {
map.getMap().setLayoutProperty("clusters", "visibility", "visible")
}
if (map.getLayer("unclustered-point")) {
map.getMap().setLayoutProperty("unclustered-point", "visibility", "visible")
}
// Update fill color for all districts
if (map.getLayer("district-fill")) {
const fillColorExpression = createFillColorExpression(null, crimeDataByDistrict)
map.getMap().setPaintProperty("district-fill", "fill-color", fillColorExpression as any)
}
}
// Update fill color for all districts
if (map.getLayer("district-fill")) {
const fillColorExpression = createFillColorExpression(null, crimeDataByDistrict)
map.getMap().setPaintProperty("district-fill", "fill-color", fillColorExpression as any)
}
}
}, [map, crimeDataByDistrict])
}, [map, crimeDataByDistrict])
// Handle district popup close specifically
const handleCloseDistrictPopup = useCallback(() => {
@ -173,8 +175,8 @@ export default function Layers({
}
}
},
[map],
)
[map],
)
// Set up custom event handler for fly-to events
useEffect(() => {
@ -212,88 +214,88 @@ export default function Layers({
const customEvent = e as CustomEvent
console.log("Received incident_click event in layers:", customEvent.detail)
// Enhanced error checking
if (!customEvent.detail) {
console.error("Empty incident click event data")
return
}
// Enhanced error checking
if (!customEvent.detail) {
console.error("Empty incident click event data")
return
}
// Allow for different property names in the event data
const incidentId = customEvent.detail.id || customEvent.detail.incidentId || customEvent.detail.incident_id
// Allow for different property names in the event data
const incidentId = customEvent.detail.id || customEvent.detail.incidentId || customEvent.detail.incident_id
if (!incidentId) {
console.error("No incident ID found in event data:", customEvent.detail)
return
}
if (!incidentId) {
console.error("No incident ID found in event data:", customEvent.detail)
return
}
console.log("Looking for incident with ID:", incidentId)
console.log("Looking for incident with ID:", incidentId)
// Improved incident finding
let foundIncident: ICrimeIncident | undefined
// Improved incident finding
let foundIncident: ICrimeIncident | undefined
// First try to use the data directly from the event if it has all needed properties
if (
customEvent.detail.latitude !== undefined &&
customEvent.detail.longitude !== undefined &&
customEvent.detail.category !== undefined
) {
foundIncident = {
id: incidentId,
district: customEvent.detail.district,
category: customEvent.detail.category,
type_category: customEvent.detail.type,
description: customEvent.detail.description,
status: customEvent.detail.status || "Unknown",
timestamp: customEvent.detail.timestamp ? new Date(customEvent.detail.timestamp) : undefined,
latitude: customEvent.detail.latitude,
longitude: customEvent.detail.longitude,
address: customEvent.detail.address,
}
} else {
// Otherwise search through the crimes data
for (const crime of crimes) {
for (const incident of crime.crime_incidents) {
if (incident.id === incidentId || incident.id?.toString() === incidentId?.toString()) {
console.log("Found matching incident:", incident)
foundIncident = {
id: incident.id,
district: crime.districts.name,
description: incident.description,
status: incident.status || "unknown",
timestamp: incident.timestamp,
category: incident.crime_categories.name,
type_category: incident.crime_categories.type,
address: incident.locations.address,
latitude: incident.locations.latitude,
longitude: incident.locations.longitude,
}
break
}
}
if (foundIncident) break
}
}
// First try to use the data directly from the event if it has all needed properties
if (
customEvent.detail.latitude !== undefined &&
customEvent.detail.longitude !== undefined &&
customEvent.detail.category !== undefined
) {
foundIncident = {
id: incidentId,
district: customEvent.detail.district,
category: customEvent.detail.category,
type_category: customEvent.detail.type,
description: customEvent.detail.description,
status: customEvent.detail.status || "Unknown",
timestamp: customEvent.detail.timestamp ? new Date(customEvent.detail.timestamp) : undefined,
latitude: customEvent.detail.latitude,
longitude: customEvent.detail.longitude,
address: customEvent.detail.address,
}
} else {
// Otherwise search through the crimes data
for (const crime of crimes) {
for (const incident of crime.crime_incidents) {
if (incident.id === incidentId || incident.id?.toString() === incidentId?.toString()) {
console.log("Found matching incident:", incident)
foundIncident = {
id: incident.id,
district: crime.districts.name,
description: incident.description,
status: incident.status || "unknown",
timestamp: incident.timestamp,
category: incident.crime_categories.name,
type_category: incident.crime_categories.type,
address: incident.locations.address,
latitude: incident.locations.latitude,
longitude: incident.locations.longitude,
}
break
}
}
if (foundIncident) break
}
}
if (!foundIncident) {
console.error("Could not find incident with ID:", incidentId)
return
}
if (!foundIncident) {
console.error("Could not find incident with ID:", incidentId)
return
}
if (!foundIncident.latitude || !foundIncident.longitude) {
console.error("Found incident has invalid coordinates:", foundIncident)
return
}
if (!foundIncident.latitude || !foundIncident.longitude) {
console.error("Found incident has invalid coordinates:", foundIncident)
return
}
console.log("Setting selected incident:", foundIncident)
console.log("Setting selected incident:", foundIncident)
// Clear any existing district selection first
setSelectedDistrict(null)
selectedDistrictRef.current = null
setFocusedDistrictId(null)
// Clear any existing district selection first
setSelectedDistrict(null)
selectedDistrictRef.current = null
setFocusedDistrictId(null)
// Set the selected incident
setSelectedIncident(foundIncident)
}
// Set the selected incident
setSelectedIncident(foundIncident)
}
// Add event listeners to both the map canvas and document
mapboxMap.getCanvas().addEventListener("incident_click", handleIncidentClickEvent as EventListener)
@ -317,67 +319,67 @@ export default function Layers({
const districtId = selectedDistrictRef.current.id
const districtCrime = crimes.find((crime) => crime.district_id === districtId)
if (districtCrime) {
const selectedYearNum = year ? Number.parseInt(year) : new Date().getFullYear()
if (districtCrime) {
const selectedYearNum = year ? Number.parseInt(year) : new Date().getFullYear()
let demographics = districtCrime.districts.demographics?.find((d) => d.year === selectedYearNum)
let demographics = districtCrime.districts.demographics?.find((d) => d.year === selectedYearNum)
if (!demographics && districtCrime.districts.demographics?.length) {
demographics = districtCrime.districts.demographics.sort((a, b) => b.year - a.year)[0]
}
if (!demographics && districtCrime.districts.demographics?.length) {
demographics = districtCrime.districts.demographics.sort((a, b) => b.year - a.year)[0]
}
let geographics = districtCrime.districts.geographics?.find((g) => g.year === selectedYearNum)
let geographics = districtCrime.districts.geographics?.find((g) => g.year === selectedYearNum)
if (!geographics && districtCrime.districts.geographics?.length) {
const validGeographics = districtCrime.districts.geographics
.filter((g) => g.year !== null)
.sort((a, b) => (b.year || 0) - (a.year || 0))
if (!geographics && districtCrime.districts.geographics?.length) {
const validGeographics = districtCrime.districts.geographics
.filter((g) => g.year !== null)
.sort((a, b) => (b.year || 0) - (a.year || 0))
geographics = validGeographics.length > 0 ? validGeographics[0] : districtCrime.districts.geographics[0]
}
geographics = validGeographics.length > 0 ? validGeographics[0] : districtCrime.districts.geographics[0]
}
if (!demographics || !geographics) {
console.error("Missing district data:", { demographics, geographics })
return
}
if (!demographics || !geographics) {
console.error("Missing district data:", { demographics, geographics })
return
}
const crime_incidents = districtCrime.crime_incidents
.filter((incident) => filterCategory === "all" || incident.crime_categories.name === filterCategory)
.map((incident) => ({
id: incident.id,
timestamp: incident.timestamp,
description: incident.description,
status: incident.status || "",
category: incident.crime_categories.name,
type: incident.crime_categories.type || "",
address: incident.locations.address || "",
latitude: incident.locations.latitude,
longitude: incident.locations.longitude,
}))
const crime_incidents = districtCrime.crime_incidents
.filter((incident) => filterCategory === "all" || incident.crime_categories.name === filterCategory)
.map((incident) => ({
id: incident.id,
timestamp: incident.timestamp,
description: incident.description,
status: incident.status || "",
category: incident.crime_categories.name,
type: incident.crime_categories.type || "",
address: incident.locations.address || "",
latitude: incident.locations.latitude,
longitude: incident.locations.longitude,
}))
const updatedDistrict: IDistrictFeature = {
...selectedDistrictRef.current,
number_of_crime: crimeDataByDistrict[districtId]?.number_of_crime || 0,
level: crimeDataByDistrict[districtId]?.level || selectedDistrictRef.current.level,
demographics: {
number_of_unemployed: demographics.number_of_unemployed,
population: demographics.population,
population_density: demographics.population_density,
year: demographics.year,
},
geographics: {
address: geographics.address || "",
land_area: geographics.land_area || 0,
year: geographics.year || 0,
latitude: geographics.latitude,
longitude: geographics.longitude,
},
crime_incidents,
selectedYear: year,
selectedMonth: month,
}
const updatedDistrict: IDistrictFeature = {
...selectedDistrictRef.current,
number_of_crime: crimeDataByDistrict[districtId]?.number_of_crime || 0,
level: crimeDataByDistrict[districtId]?.level || selectedDistrictRef.current.level,
demographics: {
number_of_unemployed: demographics.number_of_unemployed,
population: demographics.population,
population_density: demographics.population_density,
year: demographics.year,
},
geographics: {
address: geographics.address || "",
land_area: geographics.land_area || 0,
year: geographics.year || 0,
latitude: geographics.latitude,
longitude: geographics.longitude,
},
crime_incidents,
selectedYear: year,
selectedMonth: month,
}
selectedDistrictRef.current = updatedDistrict
selectedDistrictRef.current = updatedDistrict
setSelectedDistrict((prevDistrict) => {
if (
@ -391,7 +393,7 @@ export default function Layers({
})
}
}
}, [crimes, filterCategory, year, month, crimeDataByDistrict])
}, [crimes, filterCategory, year, month, crimeDataByDistrict])
// Make sure we have a defined handler for setFocusedDistrictId
const handleSetFocusedDistrictId = useCallback((id: string | null, isMarkerClick = false) => {
@ -431,114 +433,119 @@ export default function Layers({
crimeDataByDistrict={crimeDataByDistrict}
showFill={showDistrictFill}
activeControl={activeControl}
onDistrictClick={handleDistrictClick} // Add this prop to pass the click handler
/>
onDistrictClick={handleDistrictClick} // Add this prop to pass the click handler
/>
{/* Heatmap Layer */}
<HeatmapLayer
crimes={crimes}
year={year}
month={month}
filterCategory={filterCategory}
visible={showHeatmapLayer}
useAllData={useAllData}
enableInteractions={true}
setFocusedDistrictId={handleSetFocusedDistrictId}
/>
{/* Heatmap Layer */}
<HeatmapLayer
crimes={crimes}
year={year}
month={month}
filterCategory={filterCategory}
visible={showHeatmapLayer}
useAllData={useAllData}
enableInteractions={true}
setFocusedDistrictId={handleSetFocusedDistrictId}
/>
{/* Timeline Layer - make sure this is the only visible layer in timeline mode */}
<TimelineLayer
crimes={crimes}
year={year}
month={month}
filterCategory={filterCategory}
visible={showTimelineLayer}
map={mapboxMap}
useAllData={useAllData}
/>
{/* Timeline Layer - make sure this is the only visible layer in timeline mode */}
<TimelineLayer
crimes={crimes}
year={year}
month={month}
filterCategory={filterCategory}
visible={showTimelineLayer}
map={mapboxMap}
useAllData={useAllData}
/>
{/* Units Layer - always show incidents when Units is active */}
<UnitsLayer
crimes={crimes}
units={units}
filterCategory={filterCategory}
visible={showUnitsLayer}
map={mapboxMap}
/>
{/* Units Layer - always show incidents when Units is active */}
<UnitsLayer
crimes={crimes}
units={units}
filterCategory={filterCategory}
visible={showUnitsLayer}
map={mapboxMap}
/>
{/* Cluster Layer - only enable when the clusters control is active and NOT in timeline mode */}
<ClusterLayer
visible={visible && activeControl === "clusters"}
map={mapboxMap}
crimes={crimes}
filterCategory={filterCategory}
focusedDistrictId={focusedDistrictId}
clusteringEnabled={activeControl === "clusters"}
showClusters={activeControl === "clusters"}
/>
{/* Cluster Layer - only enable when the clusters control is active and NOT in timeline mode */}
<ClusterLayer
visible={visible && activeControl === "clusters"}
map={mapboxMap}
crimes={crimes}
filterCategory={filterCategory}
focusedDistrictId={focusedDistrictId}
clusteringEnabled={activeControl === "clusters"}
showClusters={activeControl === "clusters"}
/>
{/* Unclustered Points Layer - now show for both incidents and units modes */}
<UnclusteredPointLayer
visible={visible && showIncidentMarkers && !focusedDistrictId}
map={mapboxMap}
crimes={crimes}
filterCategory={filterCategory}
focusedDistrictId={focusedDistrictId}
/>
{/* Unclustered Points Layer - now show for both incidents and units modes */}
<UnclusteredPointLayer
visible={visible && showIncidentMarkers && !focusedDistrictId}
map={mapboxMap}
crimes={crimes}
filterCategory={filterCategory}
focusedDistrictId={focusedDistrictId}
/>
{/* District Popup */}
{selectedDistrict && !selectedIncident && (
<>
<DistrictPopup
longitude={selectedDistrict.longitude || 0}
latitude={selectedDistrict.latitude || 0}
onClose={handleCloseDistrictPopup}
district={selectedDistrict}
year={year}
month={month}
filterCategory={filterCategory}
/>
{/* District Popup */}
{selectedDistrict && !selectedIncident && (
<>
<DistrictPopup
longitude={selectedDistrict.longitude || 0}
latitude={selectedDistrict.latitude || 0}
onClose={handleCloseDistrictPopup}
district={selectedDistrict}
year={year}
month={month}
filterCategory={filterCategory}
/>
<DistrictExtrusionLayer
visible={visible}
map={mapboxMap}
tilesetId={tilesetId}
focusedDistrictId={focusedDistrictId}
crimeDataByDistrict={crimeDataByDistrict}
/>
</>
)}
<DistrictExtrusionLayer
visible={visible}
map={mapboxMap}
tilesetId={tilesetId}
focusedDistrictId={focusedDistrictId}
crimeDataByDistrict={crimeDataByDistrict}
/>
</>
)}
{/* Timeline Layer - only show if active control is timeline */}
<TimeZonesDisplay />
<TimezoneLayer map={mapboxMap} />
{/* Incident Popup */}
{selectedIncident && selectedIncident.latitude && selectedIncident.longitude && (
<CrimePopup
longitude={selectedIncident.longitude}
latitude={selectedIncident.latitude}
onClose={handleCloseIncidentPopup}
incident={selectedIncident}
/>
)}
{/* Fault line layer */}
<FaultLinesLayer map={mapboxMap} />
{/* Debug info for development */}
<div
className="text-red-500 bg-accent"
style={{
position: "absolute",
bottom: 10,
left: 10,
backgroundColor: "rgba(255,255,255,0.7)",
padding: "5px",
zIndex: 999,
display: process.env.NODE_ENV === "development" ? "block" : "none",
}}
>
<div>Selected District: {selectedDistrict ? selectedDistrict.name : "None"}</div>
<div>Selected Incident: {selectedIncident ? selectedIncident.id : "None"}</div>
<div>Focused District ID: {focusedDistrictId || "None"}</div>
</div>
</>
)
<CoastlineLayer
{/* Incident Popup */}
{selectedIncident && selectedIncident.latitude && selectedIncident.longitude && (
<CrimePopup
longitude={selectedIncident.longitude}
latitude={selectedIncident.latitude}
onClose={handleCloseIncidentPopup}
incident={selectedIncident}
/>
)}
{/* Debug info for development */}
{/* <div
className="text-red-500 bg-accent"
style={{
position: "absolute",
bottom: 10,
left: 10,
backgroundColor: "rgba(255,255,255,0.7)",
padding: "5px",
zIndex: 999,
display: process.env.NODE_ENV === "development" ? "block" : "none",
}}
>
<div>Selected District: {selectedDistrict ? selectedDistrict.name : "None"}</div>
<div>Selected Incident: {selectedIncident ? selectedIncident.id : "None"}</div>
<div>Focused District ID: {focusedDistrictId || "None"}</div>
</div> */}
</>
)
}

View File

@ -7,7 +7,7 @@ import type mapboxgl from "mapbox-gl"
import { format } from "date-fns"
import { calculateAverageTimeOfDay } from "@/app/_utils/time"
import TimelinePopup from "../pop-up/timeline-popup"
import TimeZonesDisplay from "../timezone"
import TimeZonesDisplay from "./timezone"
interface TimelineLayerProps {
crimes: ICrimes[]

View File

@ -0,0 +1,146 @@
"use client"
import React, { useEffect, useRef } from 'react';
import mapboxgl from 'mapbox-gl';
import { createRoot } from 'react-dom/client';
import { Badge } from "@/app/_components/ui/badge";
interface TimezoneLayerProps {
map: mapboxgl.Map | null;
}
// Component to display time in a specific timezone
function Jam({ timeZone }: { timeZone: string }) {
const [time, setTime] = React.useState<string>("");
useEffect(() => {
function updateTime() {
const now = new Date();
const options: Intl.DateTimeFormatOptions = {
hour: '2-digit',
minute: '2-digit',
hour12: false,
timeZone
};
setTime(now.toLocaleTimeString('id-ID', options));
}
updateTime();
const interval = setInterval(updateTime, 1000);
return () => clearInterval(interval);
}, [timeZone]);
return <>{time}</>;
}
export default function TimezoneLayer({ map }: TimezoneLayerProps) {
const hoverTimezone = useRef<any>(null);
const markersRef = useRef<mapboxgl.Marker[]>([]);
useEffect(() => {
if (!map) return;
// Function to add timezone data and markers
function addTimezoneLayers() {
// Add timezone data source
const url = "/geojson/timezones_wVVG8.geojson"; // Changed path to public folder
if (map && !map.getSource('timezone')) {
map.addSource('timezone', {
'type': 'geojson',
'generateId': true,
'data': url
});
// Add timezone boundaries
map.addLayer({
'id': 'timezone-line',
'type': 'line',
'source': 'timezone',
'layout': {},
'paint': {
'line-color': 'orange',
'line-width': 1,
'line-opacity': 0.5
}
});
// Create markers for Indonesian time zones
const createTimeMarker = (lngLat: [number, number], timeZone: string, label: string) => {
const markerElement = document.createElement('div');
const root = createRoot(markerElement);
root.render(
<div className='bordered p-1 text-time show-pop-up text-center'>
<p className="uppercase text-xl" style={{
lineHeight: "1rem"
}}>
<Jam timeZone={timeZone} />
</p>
<Badge variant="outline" className="text-xs mt-1">{label}</Badge>
</div>
);
const marker = new mapboxgl.Marker(markerElement)
.setLngLat(lngLat)
.addTo(map);
markersRef.current.push(marker);
return marker;
};
// WIB (GMT+7)
createTimeMarker([107.4999769225339, 3.4359354227361933], "Asia/Jakarta", "WIB / GMT+7");
// WITA (GMT+8)
createTimeMarker([119.1174733337183, 3.4359354227361933], "Asia/Makassar", "WITA / GMT+8");
// WIT (GMT+9)
createTimeMarker([131.58387377752751, 3.4359354227361933], "Asia/Jayapura", "WIT / GMT+9");
}
}
// Check if style is loaded, otherwise wait for it
if (map.isStyleLoaded()) {
addTimezoneLayers();
} else {
// Use both 'load' and 'style.load' events to ensure we catch the style loading
map.on('load', addTimezoneLayers);
map.on('style.load', addTimezoneLayers);
// Fallback: If style hasn't loaded within 2 seconds, try again
const timeoutId = setTimeout(() => {
if (map.isStyleLoaded()) {
addTimezoneLayers();
}
}, 2000);
// Clean up the timeout if component unmounts
return () => {
clearTimeout(timeoutId);
map.off('load', addTimezoneLayers);
map.off('style.load', addTimezoneLayers);
cleanupLayers();
};
}
function cleanupLayers() {
if (map && map.getLayer('timezone-line')) {
map.removeLayer('timezone-line');
}
if (map && map.getSource('timezone')) {
map.removeSource('timezone');
}
// Remove all markers
markersRef.current.forEach(marker => marker.remove());
markersRef.current = [];
}
// Clean up function
return () => {
cleanupLayers();
};
}, [map]);
return null;
}

View File

@ -7,8 +7,9 @@ import { FullscreenControl } from "react-map-gl/mapbox"
import { BASE_BEARING, BASE_LATITUDE, BASE_LONGITUDE, BASE_PITCH, BASE_ZOOM, MAPBOX_STYLES, type MapboxStyle } from "@/app/_utils/const/map"
import "mapbox-gl/dist/mapbox-gl.css"
import MapboxGeocoder from '@mapbox/mapbox-gl-geocoder';
import '@mapbox/mapbox-gl-geocoder/dist/mapbox-gl-geocoder.css';
import mapboxgl from "mapbox-gl"
import TimezoneLayer from './layers/timezone';
interface MapViewProps {
children?: React.ReactNode
@ -20,6 +21,7 @@ interface MapViewProps {
mapboxApiAccessToken?: string
onMoveEnd?: (viewState: ViewState) => void
customControls?: React.ReactNode
showTimezones?: boolean // Add option to show timezones
}
export default function MapView({
@ -31,6 +33,7 @@ export default function MapView({
height = "100%",
mapboxApiAccessToken = process.env.NEXT_PUBLIC_MAPBOX_ACCESS_TOKEN,
onMoveEnd,
showTimezones = false, // Add option to show timezones
}: MapViewProps) {
const mapContainerRef = useRef<MapRef | null>(null);
const mapRef = useRef<MapRef | null>(null);
@ -122,6 +125,8 @@ export default function MapView({
{/* <FullscreenControl position="top-right" />
<NavigationControl position="top-right" showCompass={false} /> */}
{/* {showTimezones && mapRef.current && <TimezoneLayer map={mapRef.current.getMap()} />} */}
{children}
</Map>
</div>

View File

@ -1,83 +1,42 @@
"use client"
import { useState, useEffect } from "react"
import { Marker } from "react-map-gl/mapbox"
import React, { useEffect, useState } from 'react';
interface DigitalClockMarkerProps {
longitude: number
latitude: number
time: string
timeOfDay: string
onClick?: () => void
interface DigitalClockProps {
timeZone: string;
className?: string;
format?: '12h' | '24h';
showSeconds?: boolean;
}
export default function DigitalClockMarker({ longitude, latitude, time, timeOfDay, onClick }: DigitalClockMarkerProps) {
const [isBlinking, setIsBlinking] = useState(false)
export default function DigitalClock({
timeZone,
className = "",
format = '24h',
showSeconds = false
}: DigitalClockProps) {
const [time, setTime] = useState<string>("");
// Blink effect for the colon in the time display
useEffect(() => {
const interval = setInterval(() => {
setIsBlinking((prev) => !prev)
}, 1000)
return () => clearInterval(interval)
}, [])
// Get background color based on time of day
const getBackgroundColor = () => {
switch (timeOfDay) {
case "morning":
return "#FFEB3B" // yellow
case "afternoon":
return "#FF9800" // orange
case "evening":
return "#3F51B5" // indigo
case "night":
return "#263238" // dark blue-grey
default:
return "#4CAF50" // green fallback
}
function updateTime() {
const now = new Date();
const options: Intl.DateTimeFormatOptions = {
hour: '2-digit',
minute: '2-digit',
second: showSeconds ? '2-digit' : undefined,
hour12: format === '12h',
timeZone
};
setTime(now.toLocaleTimeString('id-ID', options));
}
// Get text color based on time of day
const getTextColor = () => {
switch (timeOfDay) {
case "morning":
case "afternoon":
return "#000000"
case "evening":
case "night":
return "#FFFFFF"
default:
return "#000000"
}
}
// Format time with blinking colon
const formatTime = (timeString: string) => {
if (!isBlinking) {
return timeString
}
return timeString.replace(":", " ")
}
// Update immediately, then every second
updateTime();
const interval = setInterval(updateTime, 1000);
return () => clearInterval(interval);
}, [timeZone, format, showSeconds]);
return (
<Marker longitude={longitude} latitude={latitude}>
<div className="cursor-pointer transform -translate-x-1/2 -translate-y-1/2" onClick={onClick}>
<div
className="px-2 py-1 rounded-md border-2 border-black"
style={{
backgroundColor: getBackgroundColor(),
color: getTextColor(),
fontFamily: "monospace",
fontWeight: "bold",
fontSize: "0.875rem",
boxShadow: "0 0 5px rgba(0, 0, 0, 0.5)",
}}
>
{formatTime(time)}
</div>
</div>
</Marker>
)
<span className={className}>{time}</span>
);
}

View File

@ -1,72 +0,0 @@
"use client"
import { useEffect, useState } from "react"
import { Marker } from "react-map-gl/mapbox"
interface TimeZoneMarker {
name: string
offset: number
longitude: number
latitude: number
}
const TIME_ZONES: TimeZoneMarker[] = [
{ name: "WIB", offset: 7, longitude: 110.5, latitude: -3.3 }, // Between Java and Sumatra
{ name: "WITA", offset: 8, longitude: 118.8, latitude: -2.5 }, // Between Java and Kalimantan
{ name: "WIT", offset: 9, longitude: 128.0, latitude: -2.0 }, // Between Sulawesi and Papua
]
export default function TimeZonesDisplay() {
const [currentTimes, setCurrentTimes] = useState<Record<string, string>>({})
useEffect(() => {
const updateTimes = () => {
const now = new Date()
const times: Record<string, string> = {}
TIME_ZONES.forEach((zone) => {
const localTime = new Date(now.getTime())
localTime.setHours(now.getUTCHours() + zone.offset)
const hours = localTime.getHours().toString().padStart(2, "0")
const minutes = localTime.getMinutes().toString().padStart(2, "0")
const seconds = localTime.getSeconds().toString().padStart(2, "0")
times[zone.name] = `${hours}:${minutes}:${seconds}`
})
setCurrentTimes(times)
}
// Update immediately and then every second
updateTimes()
const interval = setInterval(updateTimes, 1000)
return () => clearInterval(interval)
}, [])
return (
<>
{TIME_ZONES.map((zone) => (
<Marker key={zone.name} longitude={zone.longitude} latitude={zone.latitude}>
<div className="relative">
<div className="absolute -translate-x-1/2 -translate-y-1/2 pointer-events-none">
<div className="bg-black/90 border-2 border-orange-600/70 rounded-lg p-2 shadow-lg">
<div className="text-center text-orange-500 text-xs font-bold">{zone.name} / GMT+{zone.offset}</div>
<div
className="digital-clock font-mono font-bold text-amber-500 text-xl md:text-2xl tracking-wider"
style={{
textShadow: '0 0 5px rgba(255,170,0,0.7)',
fontFamily: "'Digital', monospace"
}}
>
{currentTimes[zone.name] || "00:00:00"}
</div>
</div>
</div>
</div>
</Marker>
))}
</>
)
}

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,40 @@
DS-Font's TrueType Fonts
Font name: DS-Digital (Normal, Bold, Italic, Bold Italic), Version 1.0
Author: Dusit Supasawat
Web Site: http://ds-font.hypermart.net
Contact me: Dusit Supasawat, 325/38 Suksawat32 Ratburana Bangkok Thailand 10140
Email address: dusit@mailcity.com
Thanks for trying! We hope you really enjoy this my typeface. This font is
distributed as shareware. You can use this font for a long time as you want.
After all, when you think this font can be usefulness for you. You can send
me some money, that would be way cool.
I'm only asking $20 US shareware fee per this typeface for personal use.
And $45 US is the usual amount per this typeface for commercial use.
Distribution: You are free to distribute this archive so long as this text
file is distributed with the archive, the font file have not been modified,
and it is understood that the font's copyright remains with the original
author (Dusit Supasawat).
To register send your payment to:
Dusit Supasawat
325/38 Suksawat32 Ratburana
Bangkok Thailand 10140
And fill out something as this order form, and send it in with your payment.
Font name:_________________________________________
Your information
Name:______________________________________________
Address:___________________________________________
City, State : _____________________________________
Zip Code:__________________________________________
Country:___________________________________________
E-MAIL address:____________________________________
You will receive fonts which you order by Email after registration. These fonts
will be generated for you by specify your name in font information.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

View File

@ -0,0 +1,5 @@
<svg width="584" height="507" viewBox="0 0 584 507" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M145.77 507L0 253.5L145.77 -3.05176e-05H437.28L583.05 253.5L437.28 507H145.77Z" fill="#E60003"/>
<path d="M149.046 500.648L6.92932 253.5L149.046 6.35181H433.253L575.37 253.5L433.253 500.648H149.046Z" fill="black"/>
<path d="M155.007 492L18 253.5L155.007 15H428.993L566 253.5L428.993 492H155.007Z" fill="#E60003"/>
</svg>

After

Width:  |  Height:  |  Size: 430 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 557 B

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="49" viewBox="0 0 28 49"><g fill-rule="evenodd"><g id="hexagons" fill="#000" fill-rule="nonzero"><path d="M13.99 9.25l13 7.5v15l-13 7.5L1 31.75v-15l12.99-7.5zM3 17.9v12.7l10.99 6.34 11-6.35V17.9l-11-6.34L3 17.9zM0 15l12.98-7.5V0h-2v6.35L0 12.69v2.3zm0 18.5L12.98 41v8h-2v-6.85L0 35.81v-2.3zM15 0v7.5L27.99 15H28v-2.31h-.01L17 6.35V0h-2zm0 49v-8l12.99-7.5H28v2.31h-.01L17 42.15V49h-2z"/></g></g></svg>

After

Width:  |  Height:  |  Size: 458 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.3 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.4 KiB

View File

@ -0,0 +1,5 @@
<svg width="1564" height="510" viewBox="0 0 1564 510" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M307 0H1257L1417.74 6.10352e-05L1564 254.622L1417.74 509.245H1125.26L1125.12 509H438.884L438.743 509.245H146.257L0 254.622L146.257 6.10352e-05L307 0Z" fill="#E60003"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M311 5H1253V5.00021H1412.83L1557.86 255.129L1412.83 505.258H1122.8L1122.65 505H442.205L442.056 505.258H152.028L7 255.129L152.028 5.00021H311V5Z" fill="black"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M318 15H1246V15.0001H1403.11L1546 254.645L1403.11 494.289H1117.36L1117.18 494H446.817L446.644 494.289H160.891L18 254.645L160.891 15.0001H318V15Z" fill="#E60003"/>
</svg>

After

Width:  |  Height:  |  Size: 747 B

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 394 80"><path fill="#000" d="M262 0h68.5v12.7h-27.2v66.6h-13.6V12.7H262V0ZM149 0v12.7H94v20.4h44.3v12.6H94v21h55v12.6H80.5V0h68.7zm34.3 0h-17.8l63.8 79.4h17.9l-32-39.7 32-39.6h-17.9l-23 28.6-23-28.6zm18.3 56.7-9-11-27.1 33.7h17.8l18.3-22.7z"/><path fill="#000" d="M81 79.3 17 0H0v79.3h13.6V17l50.2 62.3H81Zm252.6-.4c-1 0-1.8-.4-2.5-1s-1.1-1.6-1.1-2.6.3-1.8 1-2.5 1.6-1 2.6-1 1.8.3 2.5 1a3.4 3.4 0 0 1 .6 4.3 3.7 3.7 0 0 1-3 1.8zm23.2-33.5h6v23.3c0 2.1-.4 4-1.3 5.5a9.1 9.1 0 0 1-3.8 3.5c-1.6.8-3.5 1.3-5.7 1.3-2 0-3.7-.4-5.3-1s-2.8-1.8-3.7-3.2c-.9-1.3-1.4-3-1.4-5h6c.1.8.3 1.6.7 2.2s1 1.2 1.6 1.5c.7.4 1.5.5 2.4.5 1 0 1.8-.2 2.4-.6a4 4 0 0 0 1.6-1.8c.3-.8.5-1.8.5-3V45.5zm30.9 9.1a4.4 4.4 0 0 0-2-3.3 7.5 7.5 0 0 0-4.3-1.1c-1.3 0-2.4.2-3.3.5-.9.4-1.6 1-2 1.6a3.5 3.5 0 0 0-.3 4c.3.5.7.9 1.3 1.2l1.8 1 2 .5 3.2.8c1.3.3 2.5.7 3.7 1.2a13 13 0 0 1 3.2 1.8 8.1 8.1 0 0 1 3 6.5c0 2-.5 3.7-1.5 5.1a10 10 0 0 1-4.4 3.5c-1.8.8-4.1 1.2-6.8 1.2-2.6 0-4.9-.4-6.8-1.2-2-.8-3.4-2-4.5-3.5a10 10 0 0 1-1.7-5.6h6a5 5 0 0 0 3.5 4.6c1 .4 2.2.6 3.4.6 1.3 0 2.5-.2 3.5-.6 1-.4 1.8-1 2.4-1.7a4 4 0 0 0 .8-2.4c0-.9-.2-1.6-.7-2.2a11 11 0 0 0-2.1-1.4l-3.2-1-3.8-1c-2.8-.7-5-1.7-6.6-3.2a7.2 7.2 0 0 1-2.4-5.7 8 8 0 0 1 1.7-5 10 10 0 0 1 4.3-3.5c2-.8 4-1.2 6.4-1.2 2.3 0 4.4.4 6.2 1.2 1.8.8 3.2 2 4.3 3.4 1 1.4 1.5 3 1.5 5h-5.8z"/></svg>

After

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.6 KiB

View File

@ -0,0 +1,7 @@
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<!-- Uploaded to: SVG Repo, www.svgrepo.com, Transformed by: SVG Repo Mixer Tools -->
<svg fill="#ff0000" width="800px" height="800px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" stroke="#ff0000">
<g id="SVGRepo_bgCarrier" stroke-width="0"/>
<g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"/>
<g id="SVGRepo_iconCarrier"> <title>radar-dish</title> <path d="M14.313 1.003l0 0 0-0zM30.467 8.066c-0.54-0.935-1.735-1.255-2.671-0.715-0.705 0.407-1.060 1.187-0.962 1.947l-6.583 2-5.938-10.294c-3.469 3.284-5.122 8.047-4.481 12.693l-2.235 0.393 0.666 3.779-2.624 2.456 1.166 2.004 3.661-1.11 0.469 0.617-7.11 8.881h15.83l-1.046-5.642c3.083 1.285 6.584 1.506 9.889 0.52l-5.938-10.294 5.020-4.704c0.609 0.468 1.463 0.551 2.17 0.143 0.935-0.541 1.256-1.737 0.717-2.672z"/> </g>
</svg>

After

Width:  |  Height:  |  Size: 931 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.6 KiB

View File

@ -0,0 +1,25 @@
<svg width="956" height="97" viewBox="0 0 956 97" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_8_3)">
<rect x="48.8978" y="-23.3853" width="26" height="144.546" transform="rotate(21.9808 48.8978 -23.3853)" fill="#FC3B16"/>
<rect x="108.111" y="-23.3853" width="26" height="144.546" transform="rotate(21.9808 108.111 -23.3853)" fill="#FC3B16"/>
<rect x="167.324" y="-23.3853" width="26" height="144.546" transform="rotate(21.9808 167.324 -23.3853)" fill="#FC3B16"/>
<rect x="226.537" y="-23.3853" width="26" height="144.546" transform="rotate(21.9808 226.537 -23.3853)" fill="#FC3B16"/>
<rect x="285.75" y="-23.3853" width="26" height="144.546" transform="rotate(21.9808 285.75 -23.3853)" fill="#FC3B16"/>
<rect x="344.964" y="-23.3853" width="26" height="144.546" transform="rotate(21.9808 344.964 -23.3853)" fill="#FC3B16"/>
<rect x="404.177" y="-23.3853" width="26" height="144.546" transform="rotate(21.9808 404.177 -23.3853)" fill="#FC3B16"/>
<rect x="463.39" y="-23.3853" width="26" height="144.546" transform="rotate(21.9808 463.39 -23.3853)" fill="#FC3B16"/>
<rect x="522.603" y="-23.3853" width="26" height="144.546" transform="rotate(21.9808 522.603 -23.3853)" fill="#FC3B16"/>
<rect x="581.816" y="-23.3853" width="26" height="144.546" transform="rotate(21.9808 581.816 -23.3853)" fill="#FC3B16"/>
<rect x="641.03" y="-23.3853" width="26" height="144.546" transform="rotate(21.9808 641.03 -23.3853)" fill="#FC3B16"/>
<rect x="700.243" y="-23.3853" width="26" height="144.546" transform="rotate(21.9808 700.243 -23.3853)" fill="#FC3B16"/>
<rect x="759.456" y="-23.3853" width="26" height="144.546" transform="rotate(21.9808 759.456 -23.3853)" fill="#FC3B16"/>
<rect x="818.669" y="-23.3853" width="26" height="144.546" transform="rotate(21.9808 818.669 -23.3853)" fill="#FC3B16"/>
<rect x="877.882" y="-23.3853" width="26" height="144.546" transform="rotate(21.9808 877.882 -23.3853)" fill="#FC3B16"/>
<rect x="937.095" y="-23.3853" width="26" height="144.546" transform="rotate(21.9808 937.095 -23.3853)" fill="#FC3B16"/>
</g>
<defs>
<clipPath id="clip0_8_3">
<rect width="956" height="97" fill="white"/>
</clipPath>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 2.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.4 KiB

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 283 64"><path fill="black" d="M141 16c-11 0-19 7-19 18s9 18 20 18c7 0 13-3 16-7l-7-5c-2 3-6 4-9 4-5 0-9-3-10-7h28v-3c0-11-8-18-19-18zm-9 15c1-4 4-7 9-7s8 3 9 7h-18zm117-15c-11 0-19 7-19 18s9 18 20 18c6 0 12-3 16-7l-8-5c-2 3-5 4-8 4-5 0-9-3-11-7h28l1-3c0-11-8-18-19-18zm-10 15c2-4 5-7 10-7s8 3 9 7h-19zm-39 3c0 6 4 10 10 10 4 0 7-2 9-5l8 5c-3 5-9 8-17 8-11 0-19-7-19-18s8-18 19-18c8 0 14 3 17 8l-8 5c-2-3-5-5-9-5-6 0-10 4-10 10zm83-29v46h-9V5h9zM37 0l37 64H0L37 0zm92 5-27 48L74 5h10l18 30 17-30h10zm59 12v10l-3-1c-6 0-10 4-10 10v15h-9V17h9v9c0-5 6-9 13-9z"/></svg>

After

Width:  |  Height:  |  Size: 629 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.3 KiB

View File

@ -0,0 +1,43 @@
<svg width="256" height="227" viewBox="0 0 256 227" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="3" y="3" width="250" height="221" fill="#E60003"/>
<rect x="3" y="3" width="250" height="221" stroke="black" stroke-width="6"/>
<g clip-path="url(#clip0_68_132)">
<rect width="247" height="68" transform="translate(5 159)" fill="#E60003"/>
<rect x="30.2562" y="123.635" width="12.5323" height="144.546" transform="rotate(21.9808 30.2562 123.635)" fill="black"/>
<rect x="51.9807" y="123.635" width="12.5323" height="144.546" transform="rotate(21.9808 51.9807 123.635)" fill="black"/>
<rect x="73.7052" y="123.635" width="12.5323" height="144.546" transform="rotate(21.9808 73.7052 123.635)" fill="black"/>
<rect x="95.4297" y="123.635" width="12.5323" height="144.546" transform="rotate(21.9808 95.4297 123.635)" fill="black"/>
<rect x="117.154" y="123.635" width="12.5323" height="144.546" transform="rotate(21.9808 117.154 123.635)" fill="black"/>
<rect x="138.879" y="123.635" width="12.5323" height="144.546" transform="rotate(21.9808 138.879 123.635)" fill="black"/>
<rect x="160.603" y="123.635" width="12.5323" height="144.546" transform="rotate(21.9808 160.603 123.635)" fill="black"/>
<rect x="182.328" y="123.635" width="12.5323" height="144.546" transform="rotate(21.9808 182.328 123.635)" fill="black"/>
<rect x="204.052" y="123.635" width="12.5323" height="144.546" transform="rotate(21.9808 204.052 123.635)" fill="black"/>
<rect x="225.777" y="123.635" width="12.5323" height="144.546" transform="rotate(21.9808 225.777 123.635)" fill="black"/>
<rect x="247.501" y="123.635" width="12.5323" height="144.546" transform="rotate(21.9808 247.501 123.635)" fill="black"/>
<rect x="269.226" y="123.635" width="12.5323" height="144.546" transform="rotate(21.9808 269.226 123.635)" fill="black"/>
</g>
<path d="M78.0543 84.3125C77.8554 83.6212 77.576 83.0104 77.2162 82.4801C76.8563 81.9403 76.416 81.4858 75.8952 81.1165C75.3838 80.7377 74.7967 80.4489 74.1338 80.25C73.4804 80.0511 72.756 79.9517 71.9605 79.9517C70.4738 79.9517 69.1669 80.321 68.0401 81.0597C66.9226 81.7983 66.0514 82.8731 65.4264 84.2841C64.8014 85.6856 64.4889 87.3996 64.4889 89.4261C64.4889 91.4527 64.7967 93.1761 65.4122 94.5966C66.0277 96.017 66.899 97.1013 68.0258 97.8494C69.1527 98.5881 70.4832 98.9574 72.0173 98.9574C73.4094 98.9574 74.5978 98.7112 75.5827 98.2188C76.577 97.7169 77.3346 97.0114 77.8554 96.1023C78.3857 95.1932 78.6508 94.1184 78.6508 92.8778L79.9008 93.0625H72.4009V88.4318H84.5741V92.0966C84.5741 94.6534 84.0344 96.8504 82.9548 98.6875C81.8753 100.515 80.3885 101.926 78.4946 102.92C76.6007 103.905 74.4321 104.398 71.9889 104.398C69.2616 104.398 66.8658 103.796 64.8014 102.594C62.737 101.382 61.1272 99.6629 59.9719 97.4375C58.826 95.2027 58.2531 92.5511 58.2531 89.483C58.2531 87.125 58.594 85.0227 59.2758 83.1761C59.9671 81.3201 60.933 79.7481 62.1736 78.4602C63.4141 77.1723 64.8582 76.1922 66.506 75.5199C68.1537 74.8475 69.9387 74.5114 71.8611 74.5114C73.5088 74.5114 75.0429 74.7528 76.4633 75.2358C77.8838 75.7093 79.1433 76.3816 80.2418 77.2528C81.3497 78.1241 82.2541 79.161 82.9548 80.3636C83.6556 81.5568 84.1054 82.8731 84.3043 84.3125H78.0543ZM89.1942 104V74.9091H108.796V79.9801H95.3447V86.9119H107.788V91.983H95.3447V98.929H108.853V104H89.1942ZM113.686 74.9091H121.272L129.283 94.4545H129.624L137.635 74.9091H145.22V104H139.255V85.0653H139.013L131.485 103.858H127.422L119.894 84.9943H119.652V104H113.686V74.9091ZM150.288 104V74.9091H161.765C163.972 74.9091 165.851 75.3305 167.404 76.1733C168.957 77.0066 170.141 78.1667 170.956 79.6534C171.779 81.1307 172.191 82.8352 172.191 84.767C172.191 86.6989 171.775 88.4034 170.941 89.8807C170.108 91.358 168.901 92.5085 167.319 93.3324C165.747 94.1562 163.844 94.5682 161.609 94.5682H154.294V89.6392H160.615C161.798 89.6392 162.774 89.4356 163.541 89.0284C164.317 88.6117 164.895 88.0388 165.274 87.3097C165.662 86.571 165.856 85.7235 165.856 84.767C165.856 83.8011 165.662 82.9583 165.274 82.2386C164.895 81.5095 164.317 80.946 163.541 80.5483C162.764 80.1411 161.779 79.9375 160.586 79.9375H156.438V104H150.288ZM177.841 104H171.25L181.293 74.9091H189.219L199.247 104H192.657L185.37 81.5568H185.142L177.841 104ZM177.429 92.5653H192.997V97.3665H177.429V92.5653ZM79.0379 152V122.909H90.6857C92.8258 122.909 94.6108 123.226 96.0408 123.861C97.4707 124.495 98.5455 125.376 99.2652 126.503C99.9849 127.62 100.345 128.908 100.345 130.366C100.345 131.503 100.117 132.502 99.6629 133.364C99.2084 134.216 98.5834 134.917 97.7879 135.466C97.0019 136.006 96.1023 136.389 95.0891 136.616V136.901C96.197 136.948 97.2339 137.26 98.1999 137.838C99.1752 138.416 99.966 139.225 100.572 140.267C101.178 141.299 101.481 142.53 101.481 143.96C101.481 145.504 101.098 146.882 100.331 148.094C99.573 149.296 98.4508 150.248 96.9641 150.949C95.4773 151.65 93.6449 152 91.4669 152H79.0379ZM85.1885 146.972H90.2027C91.9167 146.972 93.1667 146.645 93.9527 145.991C94.7387 145.329 95.1317 144.448 95.1317 143.349C95.1317 142.545 94.9375 141.834 94.5493 141.219C94.161 140.603 93.6071 140.12 92.8874 139.77C92.1771 139.42 91.3296 139.244 90.3447 139.244H85.1885V146.972ZM85.1885 135.082H89.7482C90.591 135.082 91.3391 134.936 91.9925 134.642C92.6553 134.339 93.1762 133.913 93.555 133.364C93.9432 132.814 94.1374 132.156 94.1374 131.389C94.1374 130.338 93.7633 129.491 93.0152 128.847C92.2766 128.203 91.2254 127.881 89.8618 127.881H85.1885V135.082ZM123.452 122.909H129.603V141.801C129.603 143.922 129.096 145.778 128.083 147.369C127.079 148.96 125.673 150.201 123.864 151.091C122.055 151.972 119.948 152.412 117.543 152.412C115.128 152.412 113.016 151.972 111.208 151.091C109.399 150.201 107.993 148.96 106.989 147.369C105.985 145.778 105.483 143.922 105.483 141.801V122.909H111.634V141.276C111.634 142.384 111.875 143.368 112.358 144.23C112.851 145.092 113.542 145.769 114.432 146.261C115.322 146.754 116.359 147 117.543 147C118.736 147 119.773 146.754 120.654 146.261C121.544 145.769 122.23 145.092 122.713 144.23C123.206 143.368 123.452 142.384 123.452 141.276V122.909ZM134.663 122.909H142.248L150.26 142.455H150.6L158.612 122.909H166.197V152H160.231V133.065H159.99L152.461 151.858H148.399L140.87 132.994H140.629V152H134.663V122.909ZM177.415 122.909V152H171.264V122.909H177.415Z" fill="black"/>
<g clip-path="url(#clip1_68_132)">
<rect width="247" height="68" transform="translate(5)" fill="#E60003"/>
<rect x="30.2562" y="-35.3647" width="12.5323" height="144.546" transform="rotate(21.9808 30.2562 -35.3647)" fill="black"/>
<rect x="51.9807" y="-35.3647" width="12.5323" height="144.546" transform="rotate(21.9808 51.9807 -35.3647)" fill="black"/>
<rect x="73.7052" y="-35.3647" width="12.5323" height="144.546" transform="rotate(21.9808 73.7052 -35.3647)" fill="black"/>
<rect x="95.4297" y="-35.3647" width="12.5323" height="144.546" transform="rotate(21.9808 95.4297 -35.3647)" fill="black"/>
<rect x="117.154" y="-35.3647" width="12.5323" height="144.546" transform="rotate(21.9808 117.154 -35.3647)" fill="black"/>
<rect x="138.879" y="-35.3647" width="12.5323" height="144.546" transform="rotate(21.9808 138.879 -35.3647)" fill="black"/>
<rect x="160.603" y="-35.3647" width="12.5323" height="144.546" transform="rotate(21.9808 160.603 -35.3647)" fill="black"/>
<rect x="182.328" y="-35.3647" width="12.5323" height="144.546" transform="rotate(21.9808 182.328 -35.3647)" fill="black"/>
<rect x="204.052" y="-35.3647" width="12.5323" height="144.546" transform="rotate(21.9808 204.052 -35.3647)" fill="black"/>
<rect x="225.777" y="-35.3647" width="12.5323" height="144.546" transform="rotate(21.9808 225.777 -35.3647)" fill="black"/>
<rect x="247.501" y="-35.3647" width="12.5323" height="144.546" transform="rotate(21.9808 247.501 -35.3647)" fill="black"/>
<rect x="269.226" y="-35.3647" width="12.5323" height="144.546" transform="rotate(21.9808 269.226 -35.3647)" fill="black"/>
</g>
<defs>
<clipPath id="clip0_68_132">
<rect width="247" height="68" fill="white" transform="translate(5 159)"/>
</clipPath>
<clipPath id="clip1_68_132">
<rect width="247" height="68" fill="white" transform="translate(5)"/>
</clipPath>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 7.9 KiB

View File

@ -0,0 +1,46 @@
<svg width="264" height="416" viewBox="0 0 264 416" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_68_61)">
<rect x="15.0967" y="-37.0891" width="11.0588" height="144.546" transform="rotate(21.9808 15.0967 -37.0891)" fill="#FCAE16"/>
<rect x="36.4548" y="-37.0891" width="11.0588" height="144.546" transform="rotate(21.9808 36.4548 -37.0891)" fill="#FCAE16"/>
<rect x="57.8128" y="-37.0891" width="11.0588" height="144.546" transform="rotate(21.9808 57.8128 -37.0891)" fill="#FCAE16"/>
<rect x="79.1709" y="-37.0891" width="11.0588" height="144.546" transform="rotate(21.9808 79.1709 -37.0891)" fill="#FCAE16"/>
<rect x="100.529" y="-37.0891" width="11.0588" height="144.546" transform="rotate(21.9808 100.529 -37.0891)" fill="#FCAE16"/>
<rect x="121.887" y="-37.0891" width="11.0588" height="144.546" transform="rotate(21.9808 121.887 -37.0891)" fill="#FCAE16"/>
<rect x="143.245" y="-37.0891" width="11.0588" height="144.546" transform="rotate(21.9808 143.245 -37.0891)" fill="#FCAE16"/>
<rect x="164.603" y="-37.0891" width="11.0588" height="144.546" transform="rotate(21.9808 164.603 -37.0891)" fill="#FCAE16"/>
<rect x="185.961" y="-37.0891" width="11.0588" height="144.546" transform="rotate(21.9808 185.961 -37.0891)" fill="#FCAE16"/>
<rect x="207.319" y="-37.0891" width="11.0588" height="144.546" transform="rotate(21.9808 207.319 -37.0891)" fill="#FCAE16"/>
<rect x="228.677" y="-37.0891" width="11.0588" height="144.546" transform="rotate(21.9808 228.677 -37.0891)" fill="#FCAE16"/>
<rect x="250.035" y="-37.0891" width="11.0588" height="144.546" transform="rotate(21.9808 250.035 -37.0891)" fill="#FCAE16"/>
<rect x="271.393" y="-37.0891" width="11.0588" height="144.546" transform="rotate(21.9808 271.393 -37.0891)" fill="#FCAE16"/>
<rect x="292.751" y="-37.0891" width="11.0588" height="144.546" transform="rotate(21.9808 292.751 -37.0891)" fill="#FCAE16"/>
</g>
<g clip-path="url(#clip1_68_61)">
<rect x="15.0967" y="314.911" width="11.0588" height="144.546" transform="rotate(21.9808 15.0967 314.911)" fill="#FCAE16"/>
<rect x="36.4548" y="314.911" width="11.0588" height="144.546" transform="rotate(21.9808 36.4548 314.911)" fill="#FCAE16"/>
<rect x="57.8128" y="314.911" width="11.0588" height="144.546" transform="rotate(21.9808 57.8128 314.911)" fill="#FCAE16"/>
<rect x="79.1709" y="314.911" width="11.0588" height="144.546" transform="rotate(21.9808 79.1709 314.911)" fill="#FCAE16"/>
<rect x="100.529" y="314.911" width="11.0588" height="144.546" transform="rotate(21.9808 100.529 314.911)" fill="#FCAE16"/>
<rect x="121.887" y="314.911" width="11.0588" height="144.546" transform="rotate(21.9808 121.887 314.911)" fill="#FCAE16"/>
<rect x="143.245" y="314.911" width="11.0588" height="144.546" transform="rotate(21.9808 143.245 314.911)" fill="#FCAE16"/>
<rect x="164.603" y="314.911" width="11.0588" height="144.546" transform="rotate(21.9808 164.603 314.911)" fill="#FCAE16"/>
<rect x="185.961" y="314.911" width="11.0588" height="144.546" transform="rotate(21.9808 185.961 314.911)" fill="#FCAE16"/>
<rect x="207.319" y="314.911" width="11.0588" height="144.546" transform="rotate(21.9808 207.319 314.911)" fill="#FCAE16"/>
<rect x="228.677" y="314.911" width="11.0588" height="144.546" transform="rotate(21.9808 228.677 314.911)" fill="#FCAE16"/>
<rect x="250.035" y="314.911" width="11.0588" height="144.546" transform="rotate(21.9808 250.035 314.911)" fill="#FCAE16"/>
<rect x="271.393" y="314.911" width="11.0588" height="144.546" transform="rotate(21.9808 271.393 314.911)" fill="#FCAE16"/>
<rect x="292.751" y="314.911" width="11.0588" height="144.546" transform="rotate(21.9808 292.751 314.911)" fill="#FCAE16"/>
</g>
<path d="M44.9498 102.039C44.6068 100.847 44.1249 99.793 43.5042 98.8782C42.8834 97.9471 42.1238 97.163 41.2254 96.5259C40.3433 95.8725 39.3305 95.3743 38.1871 95.0312C37.0599 94.6882 35.8103 94.5167 34.4381 94.5167C31.8735 94.5167 29.6192 95.1538 27.6753 96.4279C25.7478 97.7021 24.2449 99.5561 23.1668 101.99C22.0887 104.408 21.5496 107.364 21.5496 110.86C21.5496 114.356 22.0805 117.329 23.1423 119.779C24.2041 122.229 25.7069 124.1 27.6508 125.39C29.5947 126.664 31.8898 127.301 34.5361 127.301C36.9374 127.301 38.9875 126.877 40.6863 126.027C42.4015 125.162 43.7084 123.945 44.6068 122.376C45.5216 120.808 45.979 118.954 45.979 116.814L48.1352 117.133H35.1977V109.145H56.1966V115.467C56.1966 119.877 55.2655 123.667 53.4033 126.836C51.5411 129.989 48.9765 132.423 45.7094 134.138C42.4424 135.837 38.7016 136.686 34.4871 136.686C29.7826 136.686 25.6498 135.649 22.0887 133.574C18.5276 131.483 15.7506 128.518 13.7577 124.68C11.7812 120.825 10.7929 116.251 10.7929 110.958C10.7929 106.891 11.3809 103.264 12.5571 100.079C13.7496 96.8771 15.4157 94.1655 17.5557 91.9439C19.6956 89.7223 22.1867 88.0316 25.029 86.8718C27.8714 85.712 30.9506 85.1321 34.2666 85.1321C37.1089 85.1321 39.7552 85.5486 42.2055 86.3817C44.6558 87.1985 46.8284 88.3583 48.7233 89.8611C50.6345 91.364 52.1945 93.1527 53.4033 95.2273C54.6121 97.2855 55.3881 99.5561 55.7311 102.039H44.9498ZM64.1662 136V85.8182H97.9801V94.5657H74.7759V106.523H96.2404V115.271H74.7759V127.252H98.0781V136H64.1662ZM106.415 85.8182H119.5L133.319 119.534H133.907L147.727 85.8182H160.812V136H150.52V103.338H150.104L137.117 135.755H130.109L117.123 103.215H116.706V136H106.415V85.8182ZM169.553 136V85.8182H189.351C193.157 85.8182 196.4 86.5451 199.079 87.9989C201.758 89.4364 203.8 91.4375 205.205 94.0021C206.626 96.5504 207.336 99.4908 207.336 102.823C207.336 106.156 206.618 109.096 205.18 111.644C203.743 114.192 201.66 116.177 198.932 117.598C196.22 119.02 192.937 119.73 189.082 119.73H176.463V111.228H187.366C189.408 111.228 191.091 110.876 192.414 110.174C193.754 109.455 194.75 108.467 195.403 107.209C196.073 105.935 196.408 104.473 196.408 102.823C196.408 101.157 196.073 99.7031 195.403 98.4616C194.75 97.2038 193.754 96.2319 192.414 95.5458C191.075 94.8434 189.376 94.4922 187.317 94.4922H180.163V136H169.553ZM217.082 136H205.713L223.036 85.8182H236.709L254.008 136H242.639L230.069 97.2855H229.677L217.082 136ZM216.372 116.275H243.227V124.557H216.372V116.275Z" fill="#E60003"/>
<path d="M13.4432 217V147.182H41.3977C46.5341 147.182 50.8182 147.943 54.25 149.466C57.6818 150.989 60.2614 153.102 61.9886 155.807C63.7159 158.489 64.5795 161.58 64.5795 165.08C64.5795 167.807 64.0341 170.205 62.9432 172.273C61.8523 174.318 60.3523 176 58.4432 177.318C56.5568 178.614 54.3977 179.534 51.9659 180.08V180.761C54.625 180.875 57.1136 181.625 59.4318 183.011C61.7727 184.398 63.6705 186.341 65.125 188.841C66.5795 191.318 67.3068 194.273 67.3068 197.705C67.3068 201.409 66.3864 204.716 64.5455 207.625C62.7273 210.511 60.0341 212.795 56.4659 214.477C52.8977 216.159 48.5 217 43.2727 217H13.4432ZM28.2045 204.932H40.2386C44.3523 204.932 47.3523 204.148 49.2386 202.58C51.125 200.989 52.0682 198.875 52.0682 196.239C52.0682 194.307 51.6023 192.602 50.6705 191.125C49.7386 189.648 48.4091 188.489 46.6818 187.648C44.9773 186.807 42.9432 186.386 40.5795 186.386H28.2045V204.932ZM28.2045 176.398H39.1477C41.1705 176.398 42.9659 176.045 44.5341 175.341C46.125 174.614 47.375 173.591 48.2841 172.273C49.2159 170.955 49.6818 169.375 49.6818 167.534C49.6818 165.011 48.7841 162.977 46.9886 161.432C45.2159 159.886 42.6932 159.114 39.4205 159.114H28.2045V176.398ZM120.037 147.182H134.798V192.523C134.798 197.614 133.582 202.068 131.151 205.886C128.741 209.705 125.366 212.682 121.026 214.818C116.685 216.932 111.628 217.989 105.855 217.989C100.06 217.989 94.9915 216.932 90.6506 214.818C86.3097 212.682 82.9347 209.705 80.5256 205.886C78.1165 202.068 76.9119 197.614 76.9119 192.523V147.182H91.6733V191.261C91.6733 193.92 92.2528 196.284 93.4119 198.352C94.5938 200.42 96.2528 202.045 98.3892 203.227C100.526 204.409 103.014 205 105.855 205C108.719 205 111.207 204.409 113.321 203.227C115.457 202.045 117.105 200.42 118.264 198.352C119.446 196.284 120.037 193.92 120.037 191.261V147.182ZM146.943 147.182H165.148L184.375 194.091H185.193L204.42 147.182H222.625V217H208.307V171.557H207.727L189.659 216.659H179.909L161.841 171.386H161.261V217H146.943V147.182ZM249.548 147.182V217H234.787V147.182H249.548Z" fill="#E60003"/>
<rect x="4.5" y="233.5" width="255" height="101" stroke="#E60003" stroke-width="9"/>
<path d="M38.5057 307H27.9602L44.0284 260.455H56.7102L72.7557 307H62.2102L50.5511 271.091H50.1875L38.5057 307ZM37.8466 288.705H62.7557V296.386H37.8466V288.705ZM78.358 307V260.455H88.1989V298.886H108.153V307H78.358ZM114.67 307V260.455H146.034V268.568H124.511V279.659H144.42V287.773H124.511V298.886H146.125V307H114.67ZM153.858 307V260.455H172.222C175.737 260.455 178.737 261.083 181.222 262.341C183.722 263.583 185.623 265.348 186.926 267.636C188.244 269.909 188.903 272.583 188.903 275.659C188.903 278.75 188.237 281.409 186.903 283.636C185.57 285.848 183.638 287.545 181.108 288.727C178.593 289.909 175.547 290.5 171.972 290.5H159.676V282.591H170.381C172.259 282.591 173.82 282.333 175.062 281.818C176.305 281.303 177.229 280.53 177.835 279.5C178.456 278.47 178.767 277.189 178.767 275.659C178.767 274.114 178.456 272.811 177.835 271.75C177.229 270.689 176.297 269.886 175.04 269.341C173.797 268.78 172.229 268.5 170.335 268.5H163.699V307H153.858ZM178.994 285.818L190.562 307H179.699L168.381 285.818H178.994ZM194.085 268.568V260.455H232.312V268.568H218.062V307H208.335V268.568H194.085Z" fill="#E60003"/>
<defs>
<clipPath id="clip0_68_61">
<rect width="264" height="64" fill="white"/>
</clipPath>
<clipPath id="clip1_68_61">
<rect width="264" height="64" fill="white" transform="translate(0 352)"/>
</clipPath>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 9.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 19 KiB

View File

@ -0,0 +1,9 @@
<svg width="584" height="507" viewBox="0 0 584 507" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M145.77 507L0 253.5L145.77 -3.05176e-05H437.28L583.05 253.5L437.28 507H145.77Z" fill="#E60003"/>
<path d="M149.046 500.648L6.92932 253.5L149.046 6.35181H433.253L575.37 253.5L433.253 500.648H149.046Z" fill="black"/>
<path d="M155.007 492L18 253.5L155.007 15H428.993L566 253.5L428.993 492H155.007Z" fill="#E60003"/>
<path d="M158.256 485L25 253L158.256 21H424.744L558 253L424.744 485H158.256Z" fill="black"/>
<path d="M291 114L334.301 189H247.699L291 114Z" fill="#E60003"/>
<path d="M291 415L334.301 340H247.699L291 415Z" fill="#E60003"/>
<path d="M163.219 272.25L172.25 240.5H176.625L174.094 252.844L164.375 286H160.031L163.219 272.25ZM153.875 240.5L161.062 271.625L163.219 286H158.906L147.875 240.5H153.875ZM188.312 271.594L195.344 240.5H201.375L190.375 286H186.062L188.312 271.594ZM177.281 240.5L186.062 272.25L189.25 286H184.906L175.531 252.844L172.969 240.5H177.281ZM223.531 244.531L208.469 286H202.312L219.656 240.5H223.625L223.531 244.531ZM236.156 286L221.062 244.531L220.969 240.5H224.938L242.344 286H236.156ZM235.375 269.156V274.094H209.812V269.156H235.375ZM248.438 240.5H263.5C266.917 240.5 269.802 241.021 272.156 242.062C274.531 243.104 276.333 244.646 277.562 246.688C278.812 248.708 279.438 251.198 279.438 254.156C279.438 256.24 279.01 258.146 278.156 259.875C277.323 261.583 276.115 263.042 274.531 264.25C272.969 265.438 271.094 266.323 268.906 266.906L267.219 267.562H253.062L253 262.656H263.688C265.854 262.656 267.656 262.281 269.094 261.531C270.531 260.76 271.615 259.729 272.344 258.438C273.073 257.146 273.438 255.719 273.438 254.156C273.438 252.406 273.094 250.875 272.406 249.562C271.719 248.25 270.635 247.24 269.156 246.531C267.698 245.802 265.812 245.438 263.5 245.438H254.469V286H248.438V240.5ZM275.031 286L263.969 265.375L270.25 265.344L281.469 285.625V286H275.031ZM322.875 240.5V286H316.812L293.906 250.906V286H287.875V240.5H293.906L316.906 275.688V240.5H322.875ZM340.031 240.5V286H334V240.5H340.031ZM386 240.5V286H379.938L357.031 250.906V286H351V240.5H357.031L380.031 275.688V240.5H386ZM430.312 263.344V280C429.75 280.833 428.854 281.771 427.625 282.812C426.396 283.833 424.698 284.729 422.531 285.5C420.385 286.25 417.615 286.625 414.219 286.625C411.448 286.625 408.896 286.146 406.562 285.188C404.25 284.208 402.24 282.792 400.531 280.938C398.844 279.062 397.531 276.792 396.594 274.125C395.677 271.438 395.219 268.396 395.219 265V261.469C395.219 258.073 395.615 255.042 396.406 252.375C397.219 249.708 398.406 247.448 399.969 245.594C401.531 243.719 403.448 242.302 405.719 241.344C407.99 240.365 410.594 239.875 413.531 239.875C417.01 239.875 419.917 240.479 422.25 241.688C424.604 242.875 426.438 244.521 427.75 246.625C429.083 248.729 429.938 251.125 430.312 253.812H424.281C424.01 252.167 423.469 250.667 422.656 249.312C421.865 247.958 420.729 246.875 419.25 246.062C417.771 245.229 415.865 244.812 413.531 244.812C411.427 244.812 409.604 245.198 408.062 245.969C406.521 246.74 405.25 247.844 404.25 249.281C403.25 250.719 402.5 252.458 402 254.5C401.521 256.542 401.281 258.844 401.281 261.406V265C401.281 267.625 401.583 269.969 402.188 272.031C402.812 274.094 403.698 275.854 404.844 277.312C405.99 278.75 407.354 279.844 408.938 280.594C410.542 281.344 412.312 281.719 414.25 281.719C416.396 281.719 418.135 281.542 419.469 281.188C420.802 280.812 421.844 280.375 422.594 279.875C423.344 279.354 423.917 278.865 424.312 278.406V268.219H413.781V263.344H430.312Z" fill="#E60003"/>
</svg>

After

Width:  |  Height:  |  Size: 3.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

View File

@ -0,0 +1,5 @@
<svg width="584" height="507" viewBox="0 0 584 507" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M145.77 507L0 253.5L145.77 -3.05176e-05H437.28L583.05 253.5L437.28 507H145.77Z" fill="#E60003"/>
<path d="M149.046 500.648L6.92932 253.5L149.046 6.35181H433.253L575.37 253.5L433.253 500.648H149.046Z" fill="black"/>
<path d="M155.007 492L18 253.5L155.007 15H428.993L566 253.5L428.993 492H155.007Z" fill="#E60003"/>
</svg>

After

Width:  |  Height:  |  Size: 430 B

View File

@ -0,0 +1,3 @@
<svg width="115" height="100" viewBox="0 0 115 100" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M28.7204 100L0 50L28.7204 2.16244e-06H86.1557L114.876 50L86.1557 100H28.7204Z" fill="#E21B1B"/>
</svg>

After

Width:  |  Height:  |  Size: 212 B

View File

@ -0,0 +1,5 @@
<svg width="1564" height="510" viewBox="0 0 1564 510" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M307 0H1257L1417.74 6.10352e-05L1564 254.622L1417.74 509.245H1125.26L1125.12 509H438.884L438.743 509.245H146.257L0 254.622L146.257 6.10352e-05L307 0Z" fill="#E60003"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M311 5H1253V5.00021H1412.83L1557.86 255.129L1412.83 505.258H1122.8L1122.65 505H442.205L442.056 505.258H152.028L7 255.129L152.028 5.00021H311V5Z" fill="black"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M318 15H1246V15.0001H1403.11L1546 254.645L1403.11 494.289H1117.36L1117.18 494H446.817L446.644 494.289H160.891L18 254.645L160.891 15.0001H318V15Z" fill="#E60003"/>
</svg>

After

Width:  |  Height:  |  Size: 747 B

View File

@ -0,0 +1,43 @@
<svg width="256" height="227" viewBox="0 0 256 227" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="3" y="3" width="250" height="221" fill="#E60003"/>
<rect x="3" y="3" width="250" height="221" stroke="black" stroke-width="6"/>
<g clip-path="url(#clip0_68_132)">
<rect width="247" height="68" transform="translate(5 159)" fill="#E60003"/>
<rect x="30.2562" y="123.635" width="12.5323" height="144.546" transform="rotate(21.9808 30.2562 123.635)" fill="black"/>
<rect x="51.9807" y="123.635" width="12.5323" height="144.546" transform="rotate(21.9808 51.9807 123.635)" fill="black"/>
<rect x="73.7052" y="123.635" width="12.5323" height="144.546" transform="rotate(21.9808 73.7052 123.635)" fill="black"/>
<rect x="95.4297" y="123.635" width="12.5323" height="144.546" transform="rotate(21.9808 95.4297 123.635)" fill="black"/>
<rect x="117.154" y="123.635" width="12.5323" height="144.546" transform="rotate(21.9808 117.154 123.635)" fill="black"/>
<rect x="138.879" y="123.635" width="12.5323" height="144.546" transform="rotate(21.9808 138.879 123.635)" fill="black"/>
<rect x="160.603" y="123.635" width="12.5323" height="144.546" transform="rotate(21.9808 160.603 123.635)" fill="black"/>
<rect x="182.328" y="123.635" width="12.5323" height="144.546" transform="rotate(21.9808 182.328 123.635)" fill="black"/>
<rect x="204.052" y="123.635" width="12.5323" height="144.546" transform="rotate(21.9808 204.052 123.635)" fill="black"/>
<rect x="225.777" y="123.635" width="12.5323" height="144.546" transform="rotate(21.9808 225.777 123.635)" fill="black"/>
<rect x="247.501" y="123.635" width="12.5323" height="144.546" transform="rotate(21.9808 247.501 123.635)" fill="black"/>
<rect x="269.226" y="123.635" width="12.5323" height="144.546" transform="rotate(21.9808 269.226 123.635)" fill="black"/>
</g>
<path d="M78.0543 84.3125C77.8554 83.6212 77.576 83.0104 77.2162 82.4801C76.8563 81.9403 76.416 81.4858 75.8952 81.1165C75.3838 80.7377 74.7967 80.4489 74.1338 80.25C73.4804 80.0511 72.756 79.9517 71.9605 79.9517C70.4738 79.9517 69.1669 80.321 68.0401 81.0597C66.9226 81.7983 66.0514 82.8731 65.4264 84.2841C64.8014 85.6856 64.4889 87.3996 64.4889 89.4261C64.4889 91.4527 64.7967 93.1761 65.4122 94.5966C66.0277 96.017 66.899 97.1013 68.0258 97.8494C69.1527 98.5881 70.4832 98.9574 72.0173 98.9574C73.4094 98.9574 74.5978 98.7112 75.5827 98.2188C76.577 97.7169 77.3346 97.0114 77.8554 96.1023C78.3857 95.1932 78.6508 94.1184 78.6508 92.8778L79.9008 93.0625H72.4009V88.4318H84.5741V92.0966C84.5741 94.6534 84.0344 96.8504 82.9548 98.6875C81.8753 100.515 80.3885 101.926 78.4946 102.92C76.6007 103.905 74.4321 104.398 71.9889 104.398C69.2616 104.398 66.8658 103.796 64.8014 102.594C62.737 101.382 61.1272 99.6629 59.9719 97.4375C58.826 95.2027 58.2531 92.5511 58.2531 89.483C58.2531 87.125 58.594 85.0227 59.2758 83.1761C59.9671 81.3201 60.933 79.7481 62.1736 78.4602C63.4141 77.1723 64.8582 76.1922 66.506 75.5199C68.1537 74.8475 69.9387 74.5114 71.8611 74.5114C73.5088 74.5114 75.0429 74.7528 76.4633 75.2358C77.8838 75.7093 79.1433 76.3816 80.2418 77.2528C81.3497 78.1241 82.2541 79.161 82.9548 80.3636C83.6556 81.5568 84.1054 82.8731 84.3043 84.3125H78.0543ZM89.1942 104V74.9091H108.796V79.9801H95.3447V86.9119H107.788V91.983H95.3447V98.929H108.853V104H89.1942ZM113.686 74.9091H121.272L129.283 94.4545H129.624L137.635 74.9091H145.22V104H139.255V85.0653H139.013L131.485 103.858H127.422L119.894 84.9943H119.652V104H113.686V74.9091ZM150.288 104V74.9091H161.765C163.972 74.9091 165.851 75.3305 167.404 76.1733C168.957 77.0066 170.141 78.1667 170.956 79.6534C171.779 81.1307 172.191 82.8352 172.191 84.767C172.191 86.6989 171.775 88.4034 170.941 89.8807C170.108 91.358 168.901 92.5085 167.319 93.3324C165.747 94.1562 163.844 94.5682 161.609 94.5682H154.294V89.6392H160.615C161.798 89.6392 162.774 89.4356 163.541 89.0284C164.317 88.6117 164.895 88.0388 165.274 87.3097C165.662 86.571 165.856 85.7235 165.856 84.767C165.856 83.8011 165.662 82.9583 165.274 82.2386C164.895 81.5095 164.317 80.946 163.541 80.5483C162.764 80.1411 161.779 79.9375 160.586 79.9375H156.438V104H150.288ZM177.841 104H171.25L181.293 74.9091H189.219L199.247 104H192.657L185.37 81.5568H185.142L177.841 104ZM177.429 92.5653H192.997V97.3665H177.429V92.5653ZM79.0379 152V122.909H90.6857C92.8258 122.909 94.6108 123.226 96.0408 123.861C97.4707 124.495 98.5455 125.376 99.2652 126.503C99.9849 127.62 100.345 128.908 100.345 130.366C100.345 131.503 100.117 132.502 99.6629 133.364C99.2084 134.216 98.5834 134.917 97.7879 135.466C97.0019 136.006 96.1023 136.389 95.0891 136.616V136.901C96.197 136.948 97.2339 137.26 98.1999 137.838C99.1752 138.416 99.966 139.225 100.572 140.267C101.178 141.299 101.481 142.53 101.481 143.96C101.481 145.504 101.098 146.882 100.331 148.094C99.573 149.296 98.4508 150.248 96.9641 150.949C95.4773 151.65 93.6449 152 91.4669 152H79.0379ZM85.1885 146.972H90.2027C91.9167 146.972 93.1667 146.645 93.9527 145.991C94.7387 145.329 95.1317 144.448 95.1317 143.349C95.1317 142.545 94.9375 141.834 94.5493 141.219C94.161 140.603 93.6071 140.12 92.8874 139.77C92.1771 139.42 91.3296 139.244 90.3447 139.244H85.1885V146.972ZM85.1885 135.082H89.7482C90.591 135.082 91.3391 134.936 91.9925 134.642C92.6553 134.339 93.1762 133.913 93.555 133.364C93.9432 132.814 94.1374 132.156 94.1374 131.389C94.1374 130.338 93.7633 129.491 93.0152 128.847C92.2766 128.203 91.2254 127.881 89.8618 127.881H85.1885V135.082ZM123.452 122.909H129.603V141.801C129.603 143.922 129.096 145.778 128.083 147.369C127.079 148.96 125.673 150.201 123.864 151.091C122.055 151.972 119.948 152.412 117.543 152.412C115.128 152.412 113.016 151.972 111.208 151.091C109.399 150.201 107.993 148.96 106.989 147.369C105.985 145.778 105.483 143.922 105.483 141.801V122.909H111.634V141.276C111.634 142.384 111.875 143.368 112.358 144.23C112.851 145.092 113.542 145.769 114.432 146.261C115.322 146.754 116.359 147 117.543 147C118.736 147 119.773 146.754 120.654 146.261C121.544 145.769 122.23 145.092 122.713 144.23C123.206 143.368 123.452 142.384 123.452 141.276V122.909ZM134.663 122.909H142.248L150.26 142.455H150.6L158.612 122.909H166.197V152H160.231V133.065H159.99L152.461 151.858H148.399L140.87 132.994H140.629V152H134.663V122.909ZM177.415 122.909V152H171.264V122.909H177.415Z" fill="black"/>
<g clip-path="url(#clip1_68_132)">
<rect width="247" height="68" transform="translate(5)" fill="#E60003"/>
<rect x="30.2562" y="-35.3647" width="12.5323" height="144.546" transform="rotate(21.9808 30.2562 -35.3647)" fill="black"/>
<rect x="51.9807" y="-35.3647" width="12.5323" height="144.546" transform="rotate(21.9808 51.9807 -35.3647)" fill="black"/>
<rect x="73.7052" y="-35.3647" width="12.5323" height="144.546" transform="rotate(21.9808 73.7052 -35.3647)" fill="black"/>
<rect x="95.4297" y="-35.3647" width="12.5323" height="144.546" transform="rotate(21.9808 95.4297 -35.3647)" fill="black"/>
<rect x="117.154" y="-35.3647" width="12.5323" height="144.546" transform="rotate(21.9808 117.154 -35.3647)" fill="black"/>
<rect x="138.879" y="-35.3647" width="12.5323" height="144.546" transform="rotate(21.9808 138.879 -35.3647)" fill="black"/>
<rect x="160.603" y="-35.3647" width="12.5323" height="144.546" transform="rotate(21.9808 160.603 -35.3647)" fill="black"/>
<rect x="182.328" y="-35.3647" width="12.5323" height="144.546" transform="rotate(21.9808 182.328 -35.3647)" fill="black"/>
<rect x="204.052" y="-35.3647" width="12.5323" height="144.546" transform="rotate(21.9808 204.052 -35.3647)" fill="black"/>
<rect x="225.777" y="-35.3647" width="12.5323" height="144.546" transform="rotate(21.9808 225.777 -35.3647)" fill="black"/>
<rect x="247.501" y="-35.3647" width="12.5323" height="144.546" transform="rotate(21.9808 247.501 -35.3647)" fill="black"/>
<rect x="269.226" y="-35.3647" width="12.5323" height="144.546" transform="rotate(21.9808 269.226 -35.3647)" fill="black"/>
</g>
<defs>
<clipPath id="clip0_68_132">
<rect width="247" height="68" fill="white" transform="translate(5 159)"/>
</clipPath>
<clipPath id="clip1_68_132">
<rect width="247" height="68" fill="white" transform="translate(5)"/>
</clipPath>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 7.9 KiB

View File

@ -0,0 +1,46 @@
<svg width="264" height="416" viewBox="0 0 264 416" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_68_61)">
<rect x="15.0967" y="-37.0891" width="11.0588" height="144.546" transform="rotate(21.9808 15.0967 -37.0891)" fill="#FCAE16"/>
<rect x="36.4548" y="-37.0891" width="11.0588" height="144.546" transform="rotate(21.9808 36.4548 -37.0891)" fill="#FCAE16"/>
<rect x="57.8128" y="-37.0891" width="11.0588" height="144.546" transform="rotate(21.9808 57.8128 -37.0891)" fill="#FCAE16"/>
<rect x="79.1709" y="-37.0891" width="11.0588" height="144.546" transform="rotate(21.9808 79.1709 -37.0891)" fill="#FCAE16"/>
<rect x="100.529" y="-37.0891" width="11.0588" height="144.546" transform="rotate(21.9808 100.529 -37.0891)" fill="#FCAE16"/>
<rect x="121.887" y="-37.0891" width="11.0588" height="144.546" transform="rotate(21.9808 121.887 -37.0891)" fill="#FCAE16"/>
<rect x="143.245" y="-37.0891" width="11.0588" height="144.546" transform="rotate(21.9808 143.245 -37.0891)" fill="#FCAE16"/>
<rect x="164.603" y="-37.0891" width="11.0588" height="144.546" transform="rotate(21.9808 164.603 -37.0891)" fill="#FCAE16"/>
<rect x="185.961" y="-37.0891" width="11.0588" height="144.546" transform="rotate(21.9808 185.961 -37.0891)" fill="#FCAE16"/>
<rect x="207.319" y="-37.0891" width="11.0588" height="144.546" transform="rotate(21.9808 207.319 -37.0891)" fill="#FCAE16"/>
<rect x="228.677" y="-37.0891" width="11.0588" height="144.546" transform="rotate(21.9808 228.677 -37.0891)" fill="#FCAE16"/>
<rect x="250.035" y="-37.0891" width="11.0588" height="144.546" transform="rotate(21.9808 250.035 -37.0891)" fill="#FCAE16"/>
<rect x="271.393" y="-37.0891" width="11.0588" height="144.546" transform="rotate(21.9808 271.393 -37.0891)" fill="#FCAE16"/>
<rect x="292.751" y="-37.0891" width="11.0588" height="144.546" transform="rotate(21.9808 292.751 -37.0891)" fill="#FCAE16"/>
</g>
<g clip-path="url(#clip1_68_61)">
<rect x="15.0967" y="314.911" width="11.0588" height="144.546" transform="rotate(21.9808 15.0967 314.911)" fill="#FCAE16"/>
<rect x="36.4548" y="314.911" width="11.0588" height="144.546" transform="rotate(21.9808 36.4548 314.911)" fill="#FCAE16"/>
<rect x="57.8128" y="314.911" width="11.0588" height="144.546" transform="rotate(21.9808 57.8128 314.911)" fill="#FCAE16"/>
<rect x="79.1709" y="314.911" width="11.0588" height="144.546" transform="rotate(21.9808 79.1709 314.911)" fill="#FCAE16"/>
<rect x="100.529" y="314.911" width="11.0588" height="144.546" transform="rotate(21.9808 100.529 314.911)" fill="#FCAE16"/>
<rect x="121.887" y="314.911" width="11.0588" height="144.546" transform="rotate(21.9808 121.887 314.911)" fill="#FCAE16"/>
<rect x="143.245" y="314.911" width="11.0588" height="144.546" transform="rotate(21.9808 143.245 314.911)" fill="#FCAE16"/>
<rect x="164.603" y="314.911" width="11.0588" height="144.546" transform="rotate(21.9808 164.603 314.911)" fill="#FCAE16"/>
<rect x="185.961" y="314.911" width="11.0588" height="144.546" transform="rotate(21.9808 185.961 314.911)" fill="#FCAE16"/>
<rect x="207.319" y="314.911" width="11.0588" height="144.546" transform="rotate(21.9808 207.319 314.911)" fill="#FCAE16"/>
<rect x="228.677" y="314.911" width="11.0588" height="144.546" transform="rotate(21.9808 228.677 314.911)" fill="#FCAE16"/>
<rect x="250.035" y="314.911" width="11.0588" height="144.546" transform="rotate(21.9808 250.035 314.911)" fill="#FCAE16"/>
<rect x="271.393" y="314.911" width="11.0588" height="144.546" transform="rotate(21.9808 271.393 314.911)" fill="#FCAE16"/>
<rect x="292.751" y="314.911" width="11.0588" height="144.546" transform="rotate(21.9808 292.751 314.911)" fill="#FCAE16"/>
</g>
<path d="M44.9498 102.039C44.6068 100.847 44.1249 99.793 43.5042 98.8782C42.8834 97.9471 42.1238 97.163 41.2254 96.5259C40.3433 95.8725 39.3305 95.3743 38.1871 95.0312C37.0599 94.6882 35.8103 94.5167 34.4381 94.5167C31.8735 94.5167 29.6192 95.1538 27.6753 96.4279C25.7478 97.7021 24.2449 99.5561 23.1668 101.99C22.0887 104.408 21.5496 107.364 21.5496 110.86C21.5496 114.356 22.0805 117.329 23.1423 119.779C24.2041 122.229 25.7069 124.1 27.6508 125.39C29.5947 126.664 31.8898 127.301 34.5361 127.301C36.9374 127.301 38.9875 126.877 40.6863 126.027C42.4015 125.162 43.7084 123.945 44.6068 122.376C45.5216 120.808 45.979 118.954 45.979 116.814L48.1352 117.133H35.1977V109.145H56.1966V115.467C56.1966 119.877 55.2655 123.667 53.4033 126.836C51.5411 129.989 48.9765 132.423 45.7094 134.138C42.4424 135.837 38.7016 136.686 34.4871 136.686C29.7826 136.686 25.6498 135.649 22.0887 133.574C18.5276 131.483 15.7506 128.518 13.7577 124.68C11.7812 120.825 10.7929 116.251 10.7929 110.958C10.7929 106.891 11.3809 103.264 12.5571 100.079C13.7496 96.8771 15.4157 94.1655 17.5557 91.9439C19.6956 89.7223 22.1867 88.0316 25.029 86.8718C27.8714 85.712 30.9506 85.1321 34.2666 85.1321C37.1089 85.1321 39.7552 85.5486 42.2055 86.3817C44.6558 87.1985 46.8284 88.3583 48.7233 89.8611C50.6345 91.364 52.1945 93.1527 53.4033 95.2273C54.6121 97.2855 55.3881 99.5561 55.7311 102.039H44.9498ZM64.1662 136V85.8182H97.9801V94.5657H74.7759V106.523H96.2404V115.271H74.7759V127.252H98.0781V136H64.1662ZM106.415 85.8182H119.5L133.319 119.534H133.907L147.727 85.8182H160.812V136H150.52V103.338H150.104L137.117 135.755H130.109L117.123 103.215H116.706V136H106.415V85.8182ZM169.553 136V85.8182H189.351C193.157 85.8182 196.4 86.5451 199.079 87.9989C201.758 89.4364 203.8 91.4375 205.205 94.0021C206.626 96.5504 207.336 99.4908 207.336 102.823C207.336 106.156 206.618 109.096 205.18 111.644C203.743 114.192 201.66 116.177 198.932 117.598C196.22 119.02 192.937 119.73 189.082 119.73H176.463V111.228H187.366C189.408 111.228 191.091 110.876 192.414 110.174C193.754 109.455 194.75 108.467 195.403 107.209C196.073 105.935 196.408 104.473 196.408 102.823C196.408 101.157 196.073 99.7031 195.403 98.4616C194.75 97.2038 193.754 96.2319 192.414 95.5458C191.075 94.8434 189.376 94.4922 187.317 94.4922H180.163V136H169.553ZM217.082 136H205.713L223.036 85.8182H236.709L254.008 136H242.639L230.069 97.2855H229.677L217.082 136ZM216.372 116.275H243.227V124.557H216.372V116.275Z" fill="#E60003"/>
<path d="M13.4432 217V147.182H41.3977C46.5341 147.182 50.8182 147.943 54.25 149.466C57.6818 150.989 60.2614 153.102 61.9886 155.807C63.7159 158.489 64.5795 161.58 64.5795 165.08C64.5795 167.807 64.0341 170.205 62.9432 172.273C61.8523 174.318 60.3523 176 58.4432 177.318C56.5568 178.614 54.3977 179.534 51.9659 180.08V180.761C54.625 180.875 57.1136 181.625 59.4318 183.011C61.7727 184.398 63.6705 186.341 65.125 188.841C66.5795 191.318 67.3068 194.273 67.3068 197.705C67.3068 201.409 66.3864 204.716 64.5455 207.625C62.7273 210.511 60.0341 212.795 56.4659 214.477C52.8977 216.159 48.5 217 43.2727 217H13.4432ZM28.2045 204.932H40.2386C44.3523 204.932 47.3523 204.148 49.2386 202.58C51.125 200.989 52.0682 198.875 52.0682 196.239C52.0682 194.307 51.6023 192.602 50.6705 191.125C49.7386 189.648 48.4091 188.489 46.6818 187.648C44.9773 186.807 42.9432 186.386 40.5795 186.386H28.2045V204.932ZM28.2045 176.398H39.1477C41.1705 176.398 42.9659 176.045 44.5341 175.341C46.125 174.614 47.375 173.591 48.2841 172.273C49.2159 170.955 49.6818 169.375 49.6818 167.534C49.6818 165.011 48.7841 162.977 46.9886 161.432C45.2159 159.886 42.6932 159.114 39.4205 159.114H28.2045V176.398ZM120.037 147.182H134.798V192.523C134.798 197.614 133.582 202.068 131.151 205.886C128.741 209.705 125.366 212.682 121.026 214.818C116.685 216.932 111.628 217.989 105.855 217.989C100.06 217.989 94.9915 216.932 90.6506 214.818C86.3097 212.682 82.9347 209.705 80.5256 205.886C78.1165 202.068 76.9119 197.614 76.9119 192.523V147.182H91.6733V191.261C91.6733 193.92 92.2528 196.284 93.4119 198.352C94.5938 200.42 96.2528 202.045 98.3892 203.227C100.526 204.409 103.014 205 105.855 205C108.719 205 111.207 204.409 113.321 203.227C115.457 202.045 117.105 200.42 118.264 198.352C119.446 196.284 120.037 193.92 120.037 191.261V147.182ZM146.943 147.182H165.148L184.375 194.091H185.193L204.42 147.182H222.625V217H208.307V171.557H207.727L189.659 216.659H179.909L161.841 171.386H161.261V217H146.943V147.182ZM249.548 147.182V217H234.787V147.182H249.548Z" fill="#E60003"/>
<rect x="4.5" y="233.5" width="255" height="101" stroke="#E60003" stroke-width="9"/>
<path d="M38.5057 307H27.9602L44.0284 260.455H56.7102L72.7557 307H62.2102L50.5511 271.091H50.1875L38.5057 307ZM37.8466 288.705H62.7557V296.386H37.8466V288.705ZM78.358 307V260.455H88.1989V298.886H108.153V307H78.358ZM114.67 307V260.455H146.034V268.568H124.511V279.659H144.42V287.773H124.511V298.886H146.125V307H114.67ZM153.858 307V260.455H172.222C175.737 260.455 178.737 261.083 181.222 262.341C183.722 263.583 185.623 265.348 186.926 267.636C188.244 269.909 188.903 272.583 188.903 275.659C188.903 278.75 188.237 281.409 186.903 283.636C185.57 285.848 183.638 287.545 181.108 288.727C178.593 289.909 175.547 290.5 171.972 290.5H159.676V282.591H170.381C172.259 282.591 173.82 282.333 175.062 281.818C176.305 281.303 177.229 280.53 177.835 279.5C178.456 278.47 178.767 277.189 178.767 275.659C178.767 274.114 178.456 272.811 177.835 271.75C177.229 270.689 176.297 269.886 175.04 269.341C173.797 268.78 172.229 268.5 170.335 268.5H163.699V307H153.858ZM178.994 285.818L190.562 307H179.699L168.381 285.818H178.994ZM194.085 268.568V260.455H232.312V268.568H218.062V307H208.335V268.568H194.085Z" fill="#E60003"/>
<defs>
<clipPath id="clip0_68_61">
<rect width="264" height="64" fill="white"/>
</clipPath>
<clipPath id="clip1_68_61">
<rect width="264" height="64" fill="white" transform="translate(0 352)"/>
</clipPath>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 9.3 KiB

View File

@ -0,0 +1,9 @@
<svg width="584" height="507" viewBox="0 0 584 507" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M145.77 507L0 253.5L145.77 -3.05176e-05H437.28L583.05 253.5L437.28 507H145.77Z" fill="#E60003"/>
<path d="M149.046 500.648L6.92932 253.5L149.046 6.35181H433.253L575.37 253.5L433.253 500.648H149.046Z" fill="black"/>
<path d="M155.007 492L18 253.5L155.007 15H428.993L566 253.5L428.993 492H155.007Z" fill="#E60003"/>
<path d="M158.256 485L25 253L158.256 21H424.744L558 253L424.744 485H158.256Z" fill="black"/>
<path d="M291 114L334.301 189H247.699L291 114Z" fill="#E60003"/>
<path d="M291 415L334.301 340H247.699L291 415Z" fill="#E60003"/>
<path d="M163.219 272.25L172.25 240.5H176.625L174.094 252.844L164.375 286H160.031L163.219 272.25ZM153.875 240.5L161.062 271.625L163.219 286H158.906L147.875 240.5H153.875ZM188.312 271.594L195.344 240.5H201.375L190.375 286H186.062L188.312 271.594ZM177.281 240.5L186.062 272.25L189.25 286H184.906L175.531 252.844L172.969 240.5H177.281ZM223.531 244.531L208.469 286H202.312L219.656 240.5H223.625L223.531 244.531ZM236.156 286L221.062 244.531L220.969 240.5H224.938L242.344 286H236.156ZM235.375 269.156V274.094H209.812V269.156H235.375ZM248.438 240.5H263.5C266.917 240.5 269.802 241.021 272.156 242.062C274.531 243.104 276.333 244.646 277.562 246.688C278.812 248.708 279.438 251.198 279.438 254.156C279.438 256.24 279.01 258.146 278.156 259.875C277.323 261.583 276.115 263.042 274.531 264.25C272.969 265.438 271.094 266.323 268.906 266.906L267.219 267.562H253.062L253 262.656H263.688C265.854 262.656 267.656 262.281 269.094 261.531C270.531 260.76 271.615 259.729 272.344 258.438C273.073 257.146 273.438 255.719 273.438 254.156C273.438 252.406 273.094 250.875 272.406 249.562C271.719 248.25 270.635 247.24 269.156 246.531C267.698 245.802 265.812 245.438 263.5 245.438H254.469V286H248.438V240.5ZM275.031 286L263.969 265.375L270.25 265.344L281.469 285.625V286H275.031ZM322.875 240.5V286H316.812L293.906 250.906V286H287.875V240.5H293.906L316.906 275.688V240.5H322.875ZM340.031 240.5V286H334V240.5H340.031ZM386 240.5V286H379.938L357.031 250.906V286H351V240.5H357.031L380.031 275.688V240.5H386ZM430.312 263.344V280C429.75 280.833 428.854 281.771 427.625 282.812C426.396 283.833 424.698 284.729 422.531 285.5C420.385 286.25 417.615 286.625 414.219 286.625C411.448 286.625 408.896 286.146 406.562 285.188C404.25 284.208 402.24 282.792 400.531 280.938C398.844 279.062 397.531 276.792 396.594 274.125C395.677 271.438 395.219 268.396 395.219 265V261.469C395.219 258.073 395.615 255.042 396.406 252.375C397.219 249.708 398.406 247.448 399.969 245.594C401.531 243.719 403.448 242.302 405.719 241.344C407.99 240.365 410.594 239.875 413.531 239.875C417.01 239.875 419.917 240.479 422.25 241.688C424.604 242.875 426.438 244.521 427.75 246.625C429.083 248.729 429.938 251.125 430.312 253.812H424.281C424.01 252.167 423.469 250.667 422.656 249.312C421.865 247.958 420.729 246.875 419.25 246.062C417.771 245.229 415.865 244.812 413.531 244.812C411.427 244.812 409.604 245.198 408.062 245.969C406.521 246.74 405.25 247.844 404.25 249.281C403.25 250.719 402.5 252.458 402 254.5C401.521 256.542 401.281 258.844 401.281 261.406V265C401.281 267.625 401.583 269.969 402.188 272.031C402.812 274.094 403.698 275.854 404.844 277.312C405.99 278.75 407.354 279.844 408.938 280.594C410.542 281.344 412.312 281.719 414.25 281.719C416.396 281.719 418.135 281.542 419.469 281.188C420.802 280.812 421.844 280.375 422.594 279.875C423.344 279.354 423.917 278.865 424.312 278.406V268.219H413.781V263.344H430.312Z" fill="#E60003"/>
</svg>

After

Width:  |  Height:  |  Size: 3.5 KiB

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.