@transfermarkt/global-styles 1.23.0 → 1.25.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@transfermarkt/global-styles",
-  "version": "1.23.0",
+  "version": "1.25.0",
   "description": "Shared styles and Global configuration for stylelint rules of the Transfermarkt projects",
   "author": "Transfermarkt",
   "license": "MIT",

package/scss/utils/components/buttons/buttons.scss

@@ -8,6 +8,9 @@
 .tm-btn {
   $font-size-small: rem-calc(12);
   $font-size-medium: rem-calc(14);
+  $font-size-large: rem-calc(16);
+  $border-radius: rem-calc(8);
+  $gap: rem-calc(8);
   $position: 'right';
 
   align-items: center;
@@ -60,23 +63,56 @@
     background-color: tm-color('light-blue-new');
 
     &--large {
-      height: rem-calc(40);
+      border-radius: $border-radius;
+      font-size: ($font-size-large + rem-calc(2));
+      gap: $gap;
+      height: rem-calc(56);
       letter-spacing: rem-calc(1);
+      line-height: rem-calc(28);
+      min-width: rem-calc(36);
+      padding: rem-calc(8) rem-calc(16);
       text-transform: uppercase;
+
+      @include breakpoint(laptop) {
+        font-size: $font-size-large;
+        height: rem-calc(48);
+        line-height: rem-calc(24);
+        min-width: rem-calc(36);
+      }
     }
 
     &--medium {
-      font-size: $font-size-medium;
-      height: rem-calc(36);
-      line-height: rem-calc(20);
+      border-radius: $border-radius;
+      font-size: ($font-size-medium + rem-calc(2));
+      gap: $gap;
+      height: rem-calc(48);
+      line-height: rem-calc(24);
+      min-width: rem-calc(36);
       padding: rem-calc(8) rem-calc(16);
+
+      @include breakpoint(laptop) {
+        font-size: $font-size-medium;
+        height: rem-calc(40);
+        line-height: rem-calc(22);
+        min-width: rem-calc(36);
+      }
     }
 
     &--small {
-      font-size: $font-size-small;
-      height: rem-calc(30);
-      line-height: normal;
-      padding: rem-calc(8) rem-calc(12);
+      border-radius: $border-radius;
+      font-size: ($font-size-small + rem-calc(2));
+      gap: $gap;
+      height: rem-calc(40);
+      line-height: rem-calc(22);
+      min-width: rem-calc(36);
+      padding: rem-calc(4) rem-calc(12);
+
+      @include breakpoint(laptop) {
+        font-size: $font-size-small;
+        height: rem-calc(32);
+        line-height: rem-calc(18);
+        min-width: rem-calc(36);
+      }
     }
 
     &:hover {
@@ -314,19 +350,31 @@
     @include tm-icon-color('admiral');
 
     &--large {
-      @include tm-icon-size(16px);
+      @include tm-icon-size(22px);
+
+      @include breakpoint(laptop) {
+        @include tm-icon-size(20px);
+      }
 
       stroke-width: 1.8;
     }
 
     &--medium {
-      @include tm-icon-size(16px);
+      @include tm-icon-size(20px);
+
+      @include breakpoint(laptop) {
+        @include tm-icon-size(16px);
+      }
 
       stroke-width: 1.5;
     }
 
     &--small {
-      @include tm-icon-size(14px);
+      @include tm-icon-size(16px);
+
+      @include breakpoint(laptop) {
+        @include tm-icon-size(12px);
+      }
 
       stroke-width: 1.2;
     }

package/scss/variables/_colors.scss

@@ -142,3 +142,4 @@ $tm-colors: (
   'brand-community': #1d75a3,
   'brand-wahretabelle': #429535
 );
+

package/.github/workflows/publish-on-npm.yml

@@ -1,35 +0,0 @@
-name: Release to NPM
-on: [push]
-jobs:
-  Release-to-NPM:
-    runs-on: ubuntu-latest
-    container:
-      image: bitnami/node:22
-    steps:
-      # Checkout the repository
-      - name: Check out repository
-        uses: actions/checkout@v4
-
-      # Setup Node with pinned node.js version through package.json (volta.node)
-      - name: Setup Bun
-        uses: oven-sh/setup-bun@v2
-        with:
-          bun-version: latest
-
-      - name: Install dependencies
-        run: bun i
-
-      # Lint SCSS files
-      - name: Linting scss files
-        run: bun run lint
-
-      # Run semantic-release
-      - name: Semantic Release Action
-        id: semantic
-        uses: codfish/semantic-release-action@v3
-        with:
-          repository-url: ${{ gitea.event.repository.html_url }}
-
-    env:
-      GITEA_TOKEN: ${{ secrets.RELEASE_USER_TOKEN }}
-      NPM_TOKEN: ${{ secrets.NPM_AUTH_TOKEN }}