Skip to content
GitLab
Explore
Sign in
Primary navigation
Search or go to…
Project
S
SVG on the Web - Use Cases
Manage
Activity
Members
Labels
Plan
Issues
Issue boards
Milestones
Wiki
Code
Merge requests
Repository
Branches
Commits
Tags
Repository graph
Compare revisions
Snippets
Build
Pipelines
Jobs
Pipeline schedules
Artifacts
Deploy
Releases
Package Registry
Container Registry
Model registry
Operate
Environments
Terraform modules
Monitor
Incidents
Analyze
Value stream analytics
Contributor analytics
CI/CD analytics
Repository analytics
Model experiments
Help
Help
Support
GitLab documentation
Compare GitLab plans
Community forum
Contribute to GitLab
Provide feedback
Terms and privacy
Keyboard shortcuts
?
Snippets
Groups
Projects
Show more breadcrumbs
Heider, Martin
SVG on the Web - Use Cases
Commits
b8853849
Commit
b8853849
authored
9 months ago
by
Heider, Martin
Browse files
Options
Downloads
Patches
Plain Diff
added readme.md
parent
38e90e3a
Branches
main
No related tags found
No related merge requests found
Changes
1
Hide whitespace changes
Inline
Side-by-side
Showing
1 changed file
README.md
+74
-0
74 additions, 0 deletions
README.md
with
74 additions
and
0 deletions
README.md
0 → 100644
+
74
−
0
View file @
b8853849
# SVG on the web
In this project we show typical use-cases of SVGs on the web and
a basic project structure.
We also include a tool for stripping unnecessary style elements
in order to manipulate them via code on the final page.
## 1 SVG use cases
On the sample web page we show SVGs the following use-cases:
-
Changing the color of icons.
-
Scaling icons to create the illusion of flipping a switch.
-
Changing the font of text inside an SVG
-
Hover effects to show enabled and disabled icons.
Most these changes are attached to the CSS of the web
page and can be manipulated by the JS code as well.
## 2 SVG to inline Typescript
We provide a tool to strip SVGs from formatting and
add them to an icon-definitions.ts file.
Usage:
```
npm install
npx gulp
```
## 3 Team
Some of the code was reused from
[
Rslidy
](
https://github.com/tugraz-isds/rslidy
)
The following people have contributed to Rslidy:
-
Keith Andrews
[
kandrews@iicm.edu
](
mailto:kandrews@iicm.edu?subject=Rslidy
)
Project Leader
-
Patrick Hipp
Master's Thesis, main developer
-
Christopher Kopel
-
Gsellmann Inge, Heider Martin, Leitner Lukas, Patel Vrutanjali Rakesh
IAweb WS 2023 G1
-
Angelika Droisner, Ana Korotaj
IAweb WS 2018 G1a
-
Thomas Eibl, Michael Glatzhofer, Christoph Heidenreich, Verena Schiffer
IAweb WS 2017 G1
-
Rok Kogovšek, Alexei Kruglov, Fernando Pulido Ruiz, Helmut Zöhrer
IAweb WS 2016 G5
-
Markus Schofnegger
BSc 02 Nov 2015
-
Filippo Garolla, Sabine Lukas, Matthias Schlesinger, Karin Wilding
IAweb WS 2014 G1
-
Elias Zeitfogel, Patrick Kasper, Karina Priebernig, Clemens Meinhart
IAweb WS 2013 G4
The following people have contributed to this project:
-
Martin Heider
IVIS SS24 G1
\ No newline at end of file
This diff is collapsed.
Click to expand it.
Preview
0%
Loading
Try again
or
attach a new file
.
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Save comment
Cancel
Please
register
or
sign in
to comment