aboutsummaryrefslogtreecommitdiff
path: root/src/partials/TechnologyBadge.astro
diff options
context:
space:
mode:
authorAriel Costas Guerrero <ariel@costas.dev>2025-06-05 20:03:27 +0200
committerAriel Costas Guerrero <ariel@costas.dev>2025-06-05 20:03:27 +0200
commita2830a0dd6f634147456406c7855881ff298078e (patch)
tree93af1b60258b0b19a739b294fa31f201c2d64158 /src/partials/TechnologyBadge.astro
parenta423c9b15bdf43d28390fb0424dfeec012d82828 (diff)
Refresh portfolio design and fonts
Diffstat (limited to 'src/partials/TechnologyBadge.astro')
-rw-r--r--src/partials/TechnologyBadge.astro134
1 files changed, 0 insertions, 134 deletions
diff --git a/src/partials/TechnologyBadge.astro b/src/partials/TechnologyBadge.astro
deleted file mode 100644
index c5e170e..0000000
--- a/src/partials/TechnologyBadge.astro
+++ /dev/null
@@ -1,134 +0,0 @@
----
-interface Technology {
- name: string;
- colour: string;
- text?: "light" | "dark";
- icon: string;
-}
-
-export const technologies: { [key: string]: Technology } = {
- java: {
- name: "Java",
- colour: "#e76f00",
- icon: "java",
- },
- dotnet: {
- name: ".NET",
- colour: "#512bd4",
- icon: "dotnet",
- },
- go: {
- name: "Go",
- colour: "#00add8",
- icon: "go",
- },
- mysql: {
- name: "MySQL",
- colour: "#3a75b0",
- icon: "mysql",
- },
- mongodb: {
- name: "MongoDB",
- colour: "#4db33d",
- icon: "mongodb",
- },
- sqlserver: {
- name: "SQL Server",
- colour: "#cc2927",
- icon: "sqlserver",
- },
- php: {
- name: "PHP",
- colour: "#8892be",
- icon: "php",
- },
- python: {
- name: "Python",
- colour: "#306998",
- icon: "python",
- },
- javascript: {
- name: "JavaScript",
- colour: "#ffe70b",
- text: "dark",
- icon: "javascript",
- },
- typescript: {
- name: "TypeScript",
- colour: "#007acc",
- icon: "typescript",
- },
- azure: {
- name: "Azure",
- colour: "#0089d6",
- icon: "azure",
- },
- linux: {
- name: "Linux",
- colour: "#010101",
- icon: "linux",
- },
- windows: {
- name: "Windows",
- colour: "#0078d6",
- icon: "windows",
- },
- astro: {
- name: "Astro",
- colour: "#3d50f5",
- icon: "astro",
- },
- rabbitmq: {
- name: "RabbitMQ",
- colour: "#ff6600",
- icon: "rabbitmq",
- },
-};
-
-interface Props {
- // tech must be name of the key of one of the technologies
- code: string;
-
- size?: "small" | "large";
-}
-
-const { code, size } = Astro.props;
-const tech = technologies[code] as Technology;
----
-
-<span class={`pill-${size ?? "small"} text-${tech.text ?? "light"}`}>
- {tech.name}
-</span>
-
-<style define:vars={{ colour: tech.colour }}>
- span {
- display: inline-block;
- background-color: var(--colour);
- font-weight: bold;
- text-transform: uppercase;
- border-radius: 0.5em;
- padding: 0.5em 1em;
- }
-
- .text-dark {
- color: #000;
- }
-
- .text-light {
- color: #fff;
- }
-
- .pill-small {
- padding: 0.35em 0.5em;
- border-radius: 0.25em;
-
- font-size: 0.75em;
- }
-
- .pill-large {
- padding: 0.35 0.75em;
- border-radius: 0.5em;
-
- font-size: 0.75em;
- }
-</style>