Changes for page Home

Last modified by Jesse Veentjer on 06-5-2024 05:01
From version 219.7
edited by Jesse Veentjer
on 15-2-2024 04:33
Change comment: There is no comment for this version
To version 219.11
edited by Jesse Veentjer
on 15-2-2024 05:00
Change comment: There is no comment for this version

Summary

Details

XWiki.StyleSheetExtension[0]
Code
... ... @@ -6,68 +6,22 @@
6 6   /* Styling for the button */
7 7   .login-btn {
8 8   display: inline-block;
9 - padding: 12px 24px; /* Increased padding for a slightly bigger button */
10 - background-color: rgb(217, 217, 217); /* Grijs (formulier - header) */
9 + padding: 25% 50%;
10 + /* padding: 24px 48px; /* Increased padding for a slightly bigger button */
11 + background-color: #D9D9D9; /* Grijs (formulier - header) */
11 11   color: #000; /* Text color */
12 12   border: none;
13 13   border-radius: 5px;
14 14   font-size: 18px; /* Increased font size for a slightly larger button */
15 15   cursor: pointer;
16 - position: relative;
17 + position: center;
17 17   overflow: hidden;
18 - transition: all 0.3s ease;
19 - }
20 -
21 - /* Styling for the button hover effect */
22 - .login-btn:hover {
23 - background-color: #ccc; /* Lighter shade of grey on hover */
24 - }
25 -
26 - /* Styling for the button before animation */
27 - .login-btn:before {
28 - content: "";
29 - position: absolute;
30 - top: 50%;
31 - left: 50%;
32 - width: 300%;
33 - height: 300%;
34 - background-color: rgba(255, 255, 255, 0.1);
35 35   transition: all 0.5s ease;
36 - border-radius: 50%;
37 - z-index: 0;
38 - transform: translate(-50%, -50%);
39 39   }
40 40  
41 - /* Animation when button is clicked */
42 - .login-btn.clicked:before {
43 - width: 0;
44 - height: 0;
45 - opacity: 0;
46 - }
47 -
48 - /* Styling for the button text */
49 - .login-btn span {
50 - position: relative;
51 - z-index: 1;
52 - }
53 -/* Styling for the button */
54 - .login-btn {
55 - display: inline-block;
56 - padding: 10px 20px;
57 - background-color: #007bff;
58 - color: #fff;
59 - border: none;
60 - border-radius: 5px;
61 - font-size: 16px;
62 - cursor: pointer;
63 - position: relative;
64 - overflow: hidden;
65 - transition: all 0.3s ease;
66 - }
67 -
68 68   /* Styling for the button hover effect */
69 69   .login-btn:hover {
70 - background-color: #0056b3;
24 + background-color: #F2F2F2; /* Lighter shade of grey on hover */
71 71   }
72 72  
73 73   /* Styling for the button before animation */
... ... @@ -78,7 +78,7 @@
78 78   left: 50%;
79 79   width: 300%;
80 80   height: 300%;
81 - background-color: rgba(255, 255, 255, 0.1);
35 + background-color: #878787;
82 82   transition: all 0.5s ease;
83 83   border-radius: 50%;
84 84   z-index: 0;
... ... @@ -87,8 +87,8 @@
87 87  
88 88   /* Animation when button is clicked */
89 89   .login-btn.clicked:before {
90 - width: 0;
91 - height: 0;
44 + width: 50%%;
45 + height: 50%;
92 92   opacity: 0;
93 93   }
94 94  
... ... @@ -97,3 +97,4 @@
97 97   position: relative;
98 98   z-index: 1;
99 99   }
54 + }