Initial repository

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 mikael-ros
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

readme.md

@@ -0,0 +1,20 @@
+# GitHub language card
+![](./profile-card.svg)
+
+This is a profile card made in a SVG, to be imported into a GitHub profile readme (or elsewhere). It works by using a ``foreignObject`` in a SVG.
+
+---
+
+## Usage
+To use the card, either copy the contents of [``profile-card.svg``](./profile-card.svg) or otherwise download it. Then paste it into your personal git repository, and add an image tag in your readme, displaying the SVG, like this: ``![](path/to/profile-card.svg)``
+
+### How to modify
+Simply go into the SVG and add entries accordingly. There are 6 categories, all identified by ids; see the SVG as an example.
+
+Note you may need to modify the CSS to accomodate more languages.
+
+### Quirks
+Don't forget to change the SVG height and width!
+
+## Acknowledgements
+While making this, I used [this CSS animation](https://codepen.io/alvaromontoro/pen/rNwVpdd) as reference, and [this guide](https://css-tricks.com/snippets/css/typewriter-effect/). Otherwise everything else is my own work.