Merge pull request 'fix: Remove material css' (!31) from chore/remove-material-styles into main
Reviewed-on: https://git.simonis.lol/projects/casino/pulls/31
This commit is contained in:
		
				commit
				
					
						695a1073a9
					
				
			
		
					 4 changed files with 27 additions and 34 deletions
				
			
		| 
						 | 
				
			
			@ -24,7 +24,6 @@
 | 
			
		|||
              }
 | 
			
		||||
            ],
 | 
			
		||||
            "styles": [
 | 
			
		||||
              "@angular/material/prebuilt-themes/azure-blue.css",
 | 
			
		||||
              "src/styles.css"
 | 
			
		||||
            ],
 | 
			
		||||
            "scripts": []
 | 
			
		||||
| 
						 | 
				
			
			@ -79,7 +78,6 @@
 | 
			
		|||
              }
 | 
			
		||||
            ],
 | 
			
		||||
            "styles": [
 | 
			
		||||
              "@angular/material/prebuilt-themes/azure-blue.css",
 | 
			
		||||
              "src/styles.css"
 | 
			
		||||
            ],
 | 
			
		||||
            "scripts": []
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -1,10 +1,10 @@
 | 
			
		|||
<app-navbar></app-navbar>
 | 
			
		||||
 | 
			
		||||
<div class="min-h-screen bg-deep-blue !text-text-primary">
 | 
			
		||||
<div class="min-h-screen bg-deep-blue text-text-primary">
 | 
			
		||||
  <div class="container mx-auto px-4 py-8 sm:py-12">
 | 
			
		||||
    <div class="max-w-5xl mx-auto">
 | 
			
		||||
      <div class="!text-center mb-12 sm:mb-16">
 | 
			
		||||
        <h1 class="!text-3xl sm:!text-4xl lg:!text-5xl section-heading mb-2 sm:mb-3">
 | 
			
		||||
      <div class="text-center mb-12 sm:mb-16">
 | 
			
		||||
        <h1 class="text-3xl sm:text-4xl lg:text-5xl section-heading mb-2 sm:mb-3">
 | 
			
		||||
          Willkommensbonus
 | 
			
		||||
        </h1>
 | 
			
		||||
        <div class="welcome-bonus">200% bis zu 500€</div>
 | 
			
		||||
| 
						 | 
				
			
			@ -16,7 +16,7 @@
 | 
			
		|||
      </div>
 | 
			
		||||
 | 
			
		||||
      <div class="relative mb-16">
 | 
			
		||||
        <h2 class="!text-xl sm:!text-2xl section-heading mb-4 sm:mb-6">Beliebte Spiele</h2>
 | 
			
		||||
        <h2 class="text-xl sm:text-2xl section-heading mb-4 sm:mb-6">Beliebte Spiele</h2>
 | 
			
		||||
        <div class="relative group">
 | 
			
		||||
          <div class="overflow-hidden rounded-lg">
 | 
			
		||||
            <div
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -6,13 +6,8 @@
 | 
			
		|||
    <base href="/" />
 | 
			
		||||
    <meta name="viewport" content="width=device-width, initial-scale=1" />
 | 
			
		||||
    <link rel="icon" type="image/x-icon" href="favicon.ico" />
 | 
			
		||||
    <link
 | 
			
		||||
      href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500&display=swap"
 | 
			
		||||
      rel="stylesheet"
 | 
			
		||||
    />
 | 
			
		||||
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet" />
 | 
			
		||||
  </head>
 | 
			
		||||
  <body class="mat-typography">
 | 
			
		||||
  <body>
 | 
			
		||||
    <app-root></app-root>
 | 
			
		||||
  </body>
 | 
			
		||||
</html>
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -19,12 +19,12 @@
 | 
			
		|||
}
 | 
			
		||||
 | 
			
		||||
body {
 | 
			
		||||
  @apply !bg-deep-blue !text-text-primary h-full;
 | 
			
		||||
  @apply bg-deep-blue text-text-primary h-full;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
button,
 | 
			
		||||
a {
 | 
			
		||||
  @apply cursor-pointer active:scale-95 !text-text-primary transition-all duration-200;
 | 
			
		||||
  @apply cursor-pointer active:scale-95 text-text-primary transition-all duration-200;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.card {
 | 
			
		||||
| 
						 | 
				
			
			@ -32,7 +32,7 @@ a {
 | 
			
		|||
}
 | 
			
		||||
 | 
			
		||||
.button-base {
 | 
			
		||||
  @apply bg-emerald hover:bg-emerald-dark !text-text-primary transition-all duration-300 active:scale-95 rounded;
 | 
			
		||||
  @apply bg-emerald hover:bg-emerald-dark text-text-primary transition-all duration-300 active:scale-95 rounded;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.game-card-content {
 | 
			
		||||
| 
						 | 
				
			
			@ -40,7 +40,7 @@ a {
 | 
			
		|||
}
 | 
			
		||||
 | 
			
		||||
.nav-button {
 | 
			
		||||
  @apply hidden lg:block absolute top-1/2 -translate-y-1/2 bg-deep-blue-contrast hover:bg-deep-blue-contrast/90 !text-text-primary p-3 rounded-full opacity-0 group-hover:opacity-100 transition-all duration-300 shadow-lg hover:scale-110;
 | 
			
		||||
  @apply hidden lg:block absolute top-1/2 -translate-y-1/2 bg-deep-blue-contrast hover:bg-deep-blue-contrast/90 text-text-primary p-3 rounded-full opacity-0 group-hover:opacity-100 transition-all duration-300 shadow-lg hover:scale-110;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.slider-container {
 | 
			
		||||
| 
						 | 
				
			
			@ -52,47 +52,47 @@ a {
 | 
			
		|||
}
 | 
			
		||||
 | 
			
		||||
.welcome-bonus {
 | 
			
		||||
  @apply !text-4xl sm:!text-5xl lg:!text-7xl !font-extrabold !text-emerald-light mb-3 sm:mb-4;
 | 
			
		||||
  @apply text-4xl sm:text-5xl lg:text-7xl font-extrabold text-emerald-light mb-3 sm:mb-4;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.bonus-description {
 | 
			
		||||
  @apply !text-text-secondary !text-base sm:!text-lg mb-6 sm:mb-8;
 | 
			
		||||
  @apply text-text-secondary text-base sm:text-lg mb-6 sm:mb-8;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.section-heading {
 | 
			
		||||
  @apply !font-bold !text-text-primary;
 | 
			
		||||
  @apply font-bold text-text-primary;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.game-heading {
 | 
			
		||||
  @apply !font-bold !text-text-primary !text-sm mb-2;
 | 
			
		||||
  @apply font-bold text-text-primary text-sm mb-2;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.game-text {
 | 
			
		||||
  @apply !text-text-secondary !text-sm mb-4;
 | 
			
		||||
  @apply text-text-secondary text-sm mb-4;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.stat-container {
 | 
			
		||||
  @apply bg-deep-blue-contrast rounded-lg shadow-lg p-4 sm:p-6 !text-center;
 | 
			
		||||
  @apply bg-deep-blue-contrast rounded-lg shadow-lg p-4 sm:p-6 text-center;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.stat-number {
 | 
			
		||||
  @apply !text-xl sm:!text-2xl !font-bold !text-emerald;
 | 
			
		||||
  @apply text-xl sm:text-2xl font-bold text-emerald;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.stat-text {
 | 
			
		||||
  @apply !text-text-secondary !text-sm;
 | 
			
		||||
  @apply text-text-secondary text-sm;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.nav-brand {
 | 
			
		||||
  @apply flex items-center !text-text-primary !text-xl !font-semibold;
 | 
			
		||||
  @apply flex items-center text-text-primary text-xl font-semibold;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.nav-link {
 | 
			
		||||
  @apply px-3 py-2 rounded-md !font-normal !text-sm !text-text-secondary hover:!text-text-primary hover:bg-deep-blue-contrast transition-all duration-200;
 | 
			
		||||
  @apply px-3 py-2 rounded-md font-normal text-sm text-text-secondary hover:text-text-primary hover:bg-deep-blue-contrast transition-all duration-200;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.nav-toggle {
 | 
			
		||||
  @apply !text-text-secondary hover:!text-text-primary transition-colors duration-200;
 | 
			
		||||
  @apply text-text-secondary hover:text-text-primary transition-colors duration-200;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.nav-mobile-menu {
 | 
			
		||||
| 
						 | 
				
			
			@ -100,7 +100,7 @@ a {
 | 
			
		|||
}
 | 
			
		||||
 | 
			
		||||
.nav-mobile-link {
 | 
			
		||||
  @apply block px-3 py-2 rounded-md !text-sm !text-text-secondary hover:!text-text-primary hover:bg-deep-blue-light transition-all duration-200;
 | 
			
		||||
  @apply block px-3 py-2 rounded-md text-sm text-text-secondary hover:text-text-primary hover:bg-deep-blue-light transition-all duration-200;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.footer-section {
 | 
			
		||||
| 
						 | 
				
			
			@ -108,11 +108,11 @@ a {
 | 
			
		|||
}
 | 
			
		||||
 | 
			
		||||
.footer-heading {
 | 
			
		||||
  @apply !text-text-primary !text-sm !font-semibold mb-4;
 | 
			
		||||
  @apply text-text-primary text-sm font-semibold mb-4;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.footer-link {
 | 
			
		||||
  @apply !text-text-secondary hover:!text-text-primary !text-sm transition-all duration-200;
 | 
			
		||||
  @apply text-text-secondary hover:text-text-primary text-sm transition-all duration-200;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.footer-payment-method {
 | 
			
		||||
| 
						 | 
				
			
			@ -120,19 +120,19 @@ a {
 | 
			
		|||
}
 | 
			
		||||
 | 
			
		||||
.footer-payment-icon {
 | 
			
		||||
  @apply !text-text-secondary !text-lg;
 | 
			
		||||
  @apply text-text-secondary text-lg;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.footer-payment-text {
 | 
			
		||||
  @apply !text-text-secondary !text-xs !whitespace-nowrap;
 | 
			
		||||
  @apply text-text-secondary text-xs whitespace-nowrap;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.footer-copyright {
 | 
			
		||||
  @apply !text-text-secondary !text-sm;
 | 
			
		||||
  @apply text-text-secondary text-sm;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.footer-disclaimer {
 | 
			
		||||
  @apply !text-xs;
 | 
			
		||||
  @apply text-xs;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.mat-mdc-dialog-container {
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Reference in a new issue