sageTheDm/IMS-java
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

PAIN.CSS

Browse source
This commit is contained in:
sageTheDM 2025-01-07 09:37:45 +01:00
parent 04c687bd2a
commit 7836821c51
2 changed files with 74 additions and 48 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

61
Code/ost/JAVA-FX-PROJECT/_javafx_website_task/src/main/resources/com/example/styles.css
View file

@ -18,7 +18,7 @@
-fx-border-color: #8e44ad; -fx-border-color: #8e44ad;
-fx-border-width: 0 0 2px 0; -fx-border-width: 0 0 2px 0;
-fx-alignment: center; -fx-alignment: center;
-fx-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.1); -fx-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
} }
.mainTitle { .mainTitle {
@ -35,7 +35,7 @@
-fx-background-color: #6a1b9a; -fx-background-color: #6a1b9a;
-fx-padding: 25px; -fx-padding: 25px;
-fx-alignment: center; -fx-alignment: center;
-fx-box-shadow: 0px -5px 15px rgba(0, 0, 0, 0.1); -fx-box-shadow: 0 -5px 15px rgba(0, 0, 0, 0.1);
} }
.footerHeading { .footerHeading {
@ -45,7 +45,9 @@
-fx-text-fill: #ffffff; -fx-text-fill: #ffffff;
} }
.footerText, .footerLink, .footerCopy { .footerText,
.footerLink,
.footerCopy {
-fx-text-fill: #ffffff; -fx-text-fill: #ffffff;
} }
@ -68,7 +70,7 @@
.cardDiv { .cardDiv {
-fx-background-color: rgba(156, 89, 182, 0.7); -fx-background-color: rgba(156, 89, 182, 0.7);
-fx-border-color: transparent; -fx-border-color: transparent;
-fx-border-width: 0px; -fx-border-width: 0;
-fx-border-radius: 12px; -fx-border-radius: 12px;
-fx-background-radius: 12px; -fx-background-radius: 12px;
-fx-padding: 15; -fx-padding: 15;
@ -83,7 +85,6 @@
} }
.cardTitel { .cardTitel {
-fx-font-size: 18px; -fx-font-size: 18px;
-fx-font-weight: 600; -fx-font-weight: 600;
@ -163,7 +164,7 @@
-fx-background-radius: 20px; -fx-background-radius: 20px;
-fx-padding: 8px 16px; -fx-padding: 8px 16px;
-fx-border-color: transparent; -fx-border-color: transparent;
-fx-border-width: 0px; -fx-border-width: 0;
-fx-cursor: hand; -fx-cursor: hand;
-fx-transition: background-color 0.3s ease; -fx-transition: background-color 0.3s ease;
} }
@ -173,35 +174,41 @@
} }
/* Header Buttons */ /* Header Buttons */
.cartBtn, .loginBtn { .cartBtn,
.loginBtn {
-fx-font-size: 14px; -fx-font-size: 14px;
-fx-background-color: #8e44ad; -fx-background-color: #8e44ad;
-fx-text-fill: #ffffff; -fx-text-fill: #ffffff;
-fx-background-radius: 20px; -fx-background-radius: 20px;
-fx-padding: 8px 16px; -fx-padding: 8px 16px;
-fx-border-color: transparent; -fx-border-color: transparent;
-fx-border-width: 0px; -fx-border-width: 0;
-fx-transition: background-color 0.3s ease; -fx-transition: background-color 0.3s ease;
} }
.cartBtn:hover, .loginBtn:hover { .cartBtn:hover,
.loginBtn:hover {
-fx-background-color: #732d91; -fx-background-color: #732d91;
} }
/* Form Buttons */ /* Form Buttons */
.btnCreateAccount, .btnLogin, .btnCheckOut { .btnCreateAccount,
.btnLogin,
.btnCheckOut {
-fx-font-size: 14px; -fx-font-size: 14px;
-fx-background-color: #8e44ad; -fx-background-color: #8e44ad;
-fx-text-fill: #ffffff; -fx-text-fill: #ffffff;
-fx-background-radius: 20px; -fx-background-radius: 20px;
-fx-padding: 8px 20px; -fx-padding: 8px 20px;
-fx-border-color: transparent; -fx-border-color: transparent;
-fx-border-width: 0px; -fx-border-width: 0;
-fx-cursor: hand; -fx-cursor: hand;
-fx-transition: background-color 0.3s ease; -fx-transition: background-color 0.3s ease;
} }
.btnCreateAccount:hover, .btnLogin:hover, .btnCheckOut:hover { .btnCreateAccount:hover,
.btnLogin:hover,
.btnCheckOut:hover {
-fx-background-color: #732d91; -fx-background-color: #732d91;
} }
@ -213,7 +220,7 @@
-fx-background-radius: 20px; -fx-background-radius: 20px;
-fx-padding: 10px 20px; -fx-padding: 10px 20px;
-fx-border-color: transparent; -fx-border-color: transparent;
-fx-border-width: 0px; -fx-border-width: 0;
-fx-cursor: hand; -fx-cursor: hand;
-fx-transition: background-color 0.3s ease; -fx-transition: background-color 0.3s ease;
} }
@ -223,7 +230,8 @@
} }
/* Forms */ /* Forms */
.formTitle, .cartTitle { .formTitle,
.cartTitle {
-fx-font-size: 26px; -fx-font-size: 26px;
-fx-font-weight: 700; -fx-font-weight: 700;
-fx-text-fill: #6a1b9a; -fx-text-fill: #6a1b9a;
@ -231,7 +239,7 @@
-fx-padding: 10 0 20 0; -fx-padding: 10 0 20 0;
} }
.cartTitle{ .cartTitle {
-fx-text-fill: #ffffff; -fx-text-fill: #ffffff;
} }
@ -342,7 +350,7 @@
/* Media Queries - Responsive Design */ /* Media Queries - Responsive Design */
/* For screens up to 1200px (large tablets and smaller desktops) */ /* For screens up to 1200px (large tablets and smaller desktops) */
@media screen and (max-width: 1200px) { @media screen and(max-width: 1200px) {
#main { #main {
-fx-hgap: 15; -fx-hgap: 15;
-fx-vgap: 15; -fx-vgap: 15;
@ -363,14 +371,15 @@
-fx-font-size: 12px; -fx-font-size: 12px;
} }
.cartBtn, .loginBtn { .cartBtn,
.loginBtn {
-fx-font-size: 13px; -fx-font-size: 13px;
-fx-padding: 7px 14px; -fx-padding: 7px 14px;
} }
} }
/* For screens up to 1024px (tablets and medium-sized devices) */ /* For screens up to 1024px (tablets and medium-sized devices) */
@media screen and (max-width: 1024px) { @media screen and(max-width: 1024px) {
#main { #main {
-fx-hgap: 15; -fx-hgap: 15;
-fx-vgap: 15; -fx-vgap: 15;
@ -391,14 +400,15 @@
-fx-font-size: 12px; -fx-font-size: 12px;
} }
.cartBtn, .loginBtn { .cartBtn,
.loginBtn {
-fx-font-size: 14px; -fx-font-size: 14px;
-fx-padding: 8px 15px; -fx-padding: 8px 15px;
} }
} }
/* For screens up to 768px (mobile devices and small tablets) */ /* For screens up to 768px (mobile devices and small tablets) */
@media screen and (max-width: 768px) { @media screen and(max-width: 768px) {
#main { #main {
-fx-hgap: 10; -fx-hgap: 10;
-fx-vgap: 10; -fx-vgap: 10;
@ -428,14 +438,15 @@
-fx-font-size: 10px; -fx-font-size: 10px;
} }
.cartBtn, .loginBtn { .cartBtn,
.loginBtn {
-fx-font-size: 12px; -fx-font-size: 12px;
-fx-padding: 6px 12px; -fx-padding: 6px 12px;
} }
} }
/* For screens up to 480px (very small screens like smartphones in portrait mode) */ /* For screens up to 480px (very small screens like smartphones in portrait mode) */
@media screen and (max-width: 480px) { @media screen and(max-width: 480px) {
#main { #main {
-fx-hgap: 5; -fx-hgap: 5;
-fx-vgap: 5; -fx-vgap: 5;
@ -464,12 +475,14 @@
-fx-font-size: 8px; -fx-font-size: 8px;
} }
.cartBtn, .loginBtn { .cartBtn,
.loginBtn {
-fx-font-size: 12px; -fx-font-size: 12px;
-fx-padding: 5px 10px; -fx-padding: 5px 10px;
} }
.formTitle, .cartTitle { .formTitle,
.cartTitle {
-fx-font-size: 20px; -fx-font-size: 20px;
} }

61
Code/ost/JAVA-FX-PROJECT/_javafx_website_task/target/classes/com/example/styles.css
View file

@ -18,7 +18,7 @@
-fx-border-color: #8e44ad; -fx-border-color: #8e44ad;
-fx-border-width: 0 0 2px 0; -fx-border-width: 0 0 2px 0;
-fx-alignment: center; -fx-alignment: center;
-fx-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.1); -fx-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
} }
.mainTitle { .mainTitle {
@ -35,7 +35,7 @@
-fx-background-color: #6a1b9a; -fx-background-color: #6a1b9a;
-fx-padding: 25px; -fx-padding: 25px;
-fx-alignment: center; -fx-alignment: center;
-fx-box-shadow: 0px -5px 15px rgba(0, 0, 0, 0.1); -fx-box-shadow: 0 -5px 15px rgba(0, 0, 0, 0.1);
} }
.footerHeading { .footerHeading {
@ -45,7 +45,9 @@
-fx-text-fill: #ffffff; -fx-text-fill: #ffffff;
} }
.footerText, .footerLink, .footerCopy { .footerText,
.footerLink,
.footerCopy {
-fx-text-fill: #ffffff; -fx-text-fill: #ffffff;
} }
@ -68,7 +70,7 @@
.cardDiv { .cardDiv {
-fx-background-color: rgba(156, 89, 182, 0.7); -fx-background-color: rgba(156, 89, 182, 0.7);
-fx-border-color: transparent; -fx-border-color: transparent;
-fx-border-width: 0px; -fx-border-width: 0;
-fx-border-radius: 12px; -fx-border-radius: 12px;
-fx-background-radius: 12px; -fx-background-radius: 12px;
-fx-padding: 15; -fx-padding: 15;
@ -83,7 +85,6 @@
} }
.cardTitel { .cardTitel {
-fx-font-size: 18px; -fx-font-size: 18px;
-fx-font-weight: 600; -fx-font-weight: 600;
@ -163,7 +164,7 @@
-fx-background-radius: 20px; -fx-background-radius: 20px;
-fx-padding: 8px 16px; -fx-padding: 8px 16px;
-fx-border-color: transparent; -fx-border-color: transparent;
-fx-border-width: 0px; -fx-border-width: 0;
-fx-cursor: hand; -fx-cursor: hand;
-fx-transition: background-color 0.3s ease; -fx-transition: background-color 0.3s ease;
} }
@ -173,35 +174,41 @@
} }
/* Header Buttons */ /* Header Buttons */
.cartBtn, .loginBtn { .cartBtn,
.loginBtn {
-fx-font-size: 14px; -fx-font-size: 14px;
-fx-background-color: #8e44ad; -fx-background-color: #8e44ad;
-fx-text-fill: #ffffff; -fx-text-fill: #ffffff;
-fx-background-radius: 20px; -fx-background-radius: 20px;
-fx-padding: 8px 16px; -fx-padding: 8px 16px;
-fx-border-color: transparent; -fx-border-color: transparent;
-fx-border-width: 0px; -fx-border-width: 0;
-fx-transition: background-color 0.3s ease; -fx-transition: background-color 0.3s ease;
} }
.cartBtn:hover, .loginBtn:hover { .cartBtn:hover,
.loginBtn:hover {
-fx-background-color: #732d91; -fx-background-color: #732d91;
} }
/* Form Buttons */ /* Form Buttons */
.btnCreateAccount, .btnLogin, .btnCheckOut { .btnCreateAccount,
.btnLogin,
.btnCheckOut {
-fx-font-size: 14px; -fx-font-size: 14px;
-fx-background-color: #8e44ad; -fx-background-color: #8e44ad;
-fx-text-fill: #ffffff; -fx-text-fill: #ffffff;
-fx-background-radius: 20px; -fx-background-radius: 20px;
-fx-padding: 8px 20px; -fx-padding: 8px 20px;
-fx-border-color: transparent; -fx-border-color: transparent;
-fx-border-width: 0px; -fx-border-width: 0;
-fx-cursor: hand; -fx-cursor: hand;
-fx-transition: background-color 0.3s ease; -fx-transition: background-color 0.3s ease;
} }
.btnCreateAccount:hover, .btnLogin:hover, .btnCheckOut:hover { .btnCreateAccount:hover,
.btnLogin:hover,
.btnCheckOut:hover {
-fx-background-color: #732d91; -fx-background-color: #732d91;
} }
@ -213,7 +220,7 @@
-fx-background-radius: 20px; -fx-background-radius: 20px;
-fx-padding: 10px 20px; -fx-padding: 10px 20px;
-fx-border-color: transparent; -fx-border-color: transparent;
-fx-border-width: 0px; -fx-border-width: 0;
-fx-cursor: hand; -fx-cursor: hand;
-fx-transition: background-color 0.3s ease; -fx-transition: background-color 0.3s ease;
} }
@ -223,7 +230,8 @@
} }
/* Forms */ /* Forms */
.formTitle, .cartTitle { .formTitle,
.cartTitle {
-fx-font-size: 26px; -fx-font-size: 26px;
-fx-font-weight: 700; -fx-font-weight: 700;
-fx-text-fill: #6a1b9a; -fx-text-fill: #6a1b9a;
@ -231,7 +239,7 @@
-fx-padding: 10 0 20 0; -fx-padding: 10 0 20 0;
} }
.cartTitle{ .cartTitle {
-fx-text-fill: #ffffff; -fx-text-fill: #ffffff;
} }
@ -342,7 +350,7 @@
/* Media Queries - Responsive Design */ /* Media Queries - Responsive Design */
/* For screens up to 1200px (large tablets and smaller desktops) */ /* For screens up to 1200px (large tablets and smaller desktops) */
@media screen and (max-width: 1200px) { @media screen and(max-width: 1200px) {
#main { #main {
-fx-hgap: 15; -fx-hgap: 15;
-fx-vgap: 15; -fx-vgap: 15;
@ -363,14 +371,15 @@
-fx-font-size: 12px; -fx-font-size: 12px;
} }
.cartBtn, .loginBtn { .cartBtn,
.loginBtn {
-fx-font-size: 13px; -fx-font-size: 13px;
-fx-padding: 7px 14px; -fx-padding: 7px 14px;
} }
} }
/* For screens up to 1024px (tablets and medium-sized devices) */ /* For screens up to 1024px (tablets and medium-sized devices) */
@media screen and (max-width: 1024px) { @media screen and(max-width: 1024px) {
#main { #main {
-fx-hgap: 15; -fx-hgap: 15;
-fx-vgap: 15; -fx-vgap: 15;
@ -391,14 +400,15 @@
-fx-font-size: 12px; -fx-font-size: 12px;
} }
.cartBtn, .loginBtn { .cartBtn,
.loginBtn {
-fx-font-size: 14px; -fx-font-size: 14px;
-fx-padding: 8px 15px; -fx-padding: 8px 15px;
} }
} }
/* For screens up to 768px (mobile devices and small tablets) */ /* For screens up to 768px (mobile devices and small tablets) */
@media screen and (max-width: 768px) { @media screen and(max-width: 768px) {
#main { #main {
-fx-hgap: 10; -fx-hgap: 10;
-fx-vgap: 10; -fx-vgap: 10;
@ -428,14 +438,15 @@
-fx-font-size: 10px; -fx-font-size: 10px;
} }
.cartBtn, .loginBtn { .cartBtn,
.loginBtn {
-fx-font-size: 12px; -fx-font-size: 12px;
-fx-padding: 6px 12px; -fx-padding: 6px 12px;
} }
} }
/* For screens up to 480px (very small screens like smartphones in portrait mode) */ /* For screens up to 480px (very small screens like smartphones in portrait mode) */
@media screen and (max-width: 480px) { @media screen and(max-width: 480px) {
#main { #main {
-fx-hgap: 5; -fx-hgap: 5;
-fx-vgap: 5; -fx-vgap: 5;
@ -464,12 +475,14 @@
-fx-font-size: 8px; -fx-font-size: 8px;
} }
.cartBtn, .loginBtn { .cartBtn,
.loginBtn {
-fx-font-size: 12px; -fx-font-size: 12px;
-fx-padding: 5px 10px; -fx-padding: 5px 10px;
} }
.formTitle, .cartTitle { .formTitle,
.cartTitle {
-fx-font-size: 20px; -fx-font-size: 20px;
} }