mirror of
https://github.com/Itsig0/pocketmovie.git
synced 2026-01-22 16:24:39 +00:00
+ baseline to the git
This commit is contained in:
Itsigo
80
cmd/web/assets/css/catppuccin.css
Normal file
80
cmd/web/assets/css/catppuccin.css
Normal file
@@ -0,0 +1,80 @@
|
||||
:root {
|
||||
--ctp-macchiato-rosewater: #f4dbd6;
|
||||
--ctp-macchiato-rosewater-rgb: 244 219 214;
|
||||
--ctp-macchiato-rosewater-hsl: 10.000 57.692% 89.804%;
|
||||
--ctp-macchiato-flamingo: #f0c6c6;
|
||||
--ctp-macchiato-flamingo-rgb: 240 198 198;
|
||||
--ctp-macchiato-flamingo-hsl: 0.000 58.333% 85.882%;
|
||||
--ctp-macchiato-pink: #f5bde6;
|
||||
--ctp-macchiato-pink-rgb: 245 189 230;
|
||||
--ctp-macchiato-pink-hsl: 316.071 73.684% 85.098%;
|
||||
--ctp-macchiato-mauve: #c6a0f6;
|
||||
--ctp-macchiato-mauve-rgb: 198 160 246;
|
||||
--ctp-macchiato-mauve-hsl: 266.512 82.692% 79.608%;
|
||||
--ctp-macchiato-red: #ed8796;
|
||||
--ctp-macchiato-red-rgb: 237 135 150;
|
||||
--ctp-macchiato-red-hsl: 351.176 73.913% 72.941%;
|
||||
--ctp-macchiato-maroon: #ee99a0;
|
||||
--ctp-macchiato-maroon-rgb: 238 153 160;
|
||||
--ctp-macchiato-maroon-hsl: 355.059 71.429% 76.667%;
|
||||
--ctp-macchiato-peach: #f5a97f;
|
||||
--ctp-macchiato-peach-rgb: 245 169 127;
|
||||
--ctp-macchiato-peach-hsl: 21.356 85.507% 72.941%;
|
||||
--ctp-macchiato-yellow: #eed49f;
|
||||
--ctp-macchiato-yellow-rgb: 238 212 159;
|
||||
--ctp-macchiato-yellow-hsl: 40.253 69.912% 77.843%;
|
||||
--ctp-macchiato-green: #a6da95;
|
||||
--ctp-macchiato-green-rgb: 166 218 149;
|
||||
--ctp-macchiato-green-hsl: 105.217 48.252% 71.961%;
|
||||
--ctp-macchiato-teal: #8bd5ca;
|
||||
--ctp-macchiato-teal-rgb: 139 213 202;
|
||||
--ctp-macchiato-teal-hsl: 171.081 46.835% 69.020%;
|
||||
--ctp-macchiato-sky: #91d7e3;
|
||||
--ctp-macchiato-sky-rgb: 145 215 227;
|
||||
--ctp-macchiato-sky-hsl: 188.780 59.420% 72.941%;
|
||||
--ctp-macchiato-sapphire: #7dc4e4;
|
||||
--ctp-macchiato-sapphire-rgb: 125 196 228;
|
||||
--ctp-macchiato-sapphire-hsl: 198.641 65.605% 69.216%;
|
||||
--ctp-macchiato-blue: #8aadf4;
|
||||
--ctp-macchiato-blue-rgb: 138 173 244;
|
||||
--ctp-macchiato-blue-hsl: 220.189 82.813% 74.902%;
|
||||
--ctp-macchiato-lavender: #b7bdf8;
|
||||
--ctp-macchiato-lavender-rgb: 183 189 248;
|
||||
--ctp-macchiato-lavender-hsl: 234.462 82.278% 84.510%;
|
||||
--ctp-macchiato-text: #cad3f5;
|
||||
--ctp-macchiato-text-rgb: 202 211 245;
|
||||
--ctp-macchiato-text-hsl: 227.442 68.254% 87.647%;
|
||||
--ctp-macchiato-subtext1: #b8c0e0;
|
||||
--ctp-macchiato-subtext1-rgb: 184 192 224;
|
||||
--ctp-macchiato-subtext1-hsl: 228.000 39.216% 80.000%;
|
||||
--ctp-macchiato-subtext0: #a5adcb;
|
||||
--ctp-macchiato-subtext0-rgb: 165 173 203;
|
||||
--ctp-macchiato-subtext0-hsl: 227.368 26.761% 72.157%;
|
||||
--ctp-macchiato-overlay2: #939ab7;
|
||||
--ctp-macchiato-overlay2-rgb: 147 154 183;
|
||||
--ctp-macchiato-overlay2-hsl: 228.333 20.000% 64.706%;
|
||||
--ctp-macchiato-overlay1: #8087a2;
|
||||
--ctp-macchiato-overlay1-rgb: 128 135 162;
|
||||
--ctp-macchiato-overlay1-hsl: 227.647 15.455% 56.863%;
|
||||
--ctp-macchiato-overlay0: #6e738d;
|
||||
--ctp-macchiato-overlay0-rgb: 110 115 141;
|
||||
--ctp-macchiato-overlay0-hsl: 230.323 12.351% 49.216%;
|
||||
--ctp-macchiato-surface2: #5b6078;
|
||||
--ctp-macchiato-surface2-rgb: 91 96 120;
|
||||
--ctp-macchiato-surface2-hsl: 229.655 13.744% 41.373%;
|
||||
--ctp-macchiato-surface1: #494d64;
|
||||
--ctp-macchiato-surface1-rgb: 73 77 100;
|
||||
--ctp-macchiato-surface1-hsl: 231.111 15.607% 33.922%;
|
||||
--ctp-macchiato-surface0: #363a4f;
|
||||
--ctp-macchiato-surface0-rgb: 54 58 79;
|
||||
--ctp-macchiato-surface0-hsl: 230.400 18.797% 26.078%;
|
||||
--ctp-macchiato-base: #24273a;
|
||||
--ctp-macchiato-base-rgb: 36 39 58;
|
||||
--ctp-macchiato-base-hsl: 231.818 23.404% 18.431%;
|
||||
--ctp-macchiato-mantle: #1e2030;
|
||||
--ctp-macchiato-mantle-rgb: 30 32 48;
|
||||
--ctp-macchiato-mantle-hsl: 233.333 23.077% 15.294%;
|
||||
--ctp-macchiato-crust: #181926;
|
||||
--ctp-macchiato-crust-rgb: 24 25 38;
|
||||
--ctp-macchiato-crust-hsl: 235.714 22.581% 12.157%;
|
||||
}
|
||||
10
cmd/web/assets/css/fonts.css
Normal file
10
cmd/web/assets/css/fonts.css
Normal file
@@ -0,0 +1,10 @@
|
||||
/* jersey-15-regular - latin */
|
||||
@font-face {
|
||||
font-display: swap;
|
||||
/* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
|
||||
font-family: 'Jersey 15';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url('./fonts/jersey15.woff2') format('woff2');
|
||||
/* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
|
||||
}
|
||||
182
cmd/web/assets/css/main.css
Normal file
182
cmd/web/assets/css/main.css
Normal file
@@ -0,0 +1,182 @@
|
||||
@import "fonts.css";
|
||||
@import "catppuccin.css";
|
||||
|
||||
:root {
|
||||
--pico-form-element-spacing-vertical: 0.5rem;
|
||||
--pico-form-element-spacing-horizontal: 0.75rem;
|
||||
|
||||
--pico-color: var(--ctp-macchiato-text);
|
||||
--pico-h1-color: var(--ctp-macchiato-text);
|
||||
--pico-primary-inverse: var(--ctp-macchiato-base);
|
||||
|
||||
--pico-primary: var(--ctp-macchiato-blue);
|
||||
--pico-primary-underline: var(--ctp-macchiato-blue);
|
||||
--pico-primary-background: var(--ctp-macchiato-blue);
|
||||
|
||||
--pico-primary-hover: var(--ctp-macchiato-mauve);
|
||||
--pico-primary-hover-background: var(--ctp-macchiato-mauve);
|
||||
|
||||
--pico-background-color: var(--ctp-macchiato-crust);
|
||||
}
|
||||
|
||||
.bg-red{
|
||||
color: hsl(351deg, 74%, 40%);
|
||||
background-color: var(--ctp-macchiato-red) !important;
|
||||
}
|
||||
|
||||
|
||||
.bg-green{
|
||||
color: hsl(105deg, 48%, 40%);
|
||||
background-color: var(--ctp-macchiato-green) !important;
|
||||
}
|
||||
|
||||
.red-link{
|
||||
color: var(--ctp-macchiato-red);
|
||||
text-decoration-color: var(--ctp-macchiato-red);
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-family: "Jersey 15";
|
||||
}
|
||||
|
||||
#search-dialog {
|
||||
& article {
|
||||
max-height: 700px;
|
||||
}
|
||||
|
||||
& tr {
|
||||
cursor: pointer;
|
||||
|
||||
& :hover {
|
||||
background-color: var(--pico-hover-background);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.center {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.flex-center {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.m-0 {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.grid-4 {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
grid-template-rows: 1fr;
|
||||
grid-column-gap: 1rem;
|
||||
grid-row-gap: 0px;
|
||||
}
|
||||
|
||||
.grid-3 {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
grid-template-rows: 1fr;
|
||||
grid-column-gap: 1rem;
|
||||
grid-row-gap: 0px;
|
||||
}
|
||||
|
||||
.movie-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(5, 1fr);
|
||||
grid-template-rows: 1fr;
|
||||
grid-column-gap: 1.5rem;
|
||||
grid-row-gap: 1.5rem;
|
||||
|
||||
& .movie-tile {
|
||||
|
||||
& div {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
background-color: rgba(0, 0, 0, 0.7);
|
||||
padding: 0.25rem;
|
||||
border-bottom-right-radius: var(--pico-border-radius);
|
||||
border-top-left-radius: var(--pico-border-radius);
|
||||
|
||||
& svg {
|
||||
width: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
& img {
|
||||
border-radius: var(--pico-border-radius);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.watched {
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
|
||||
& svg {
|
||||
width: 3rem;
|
||||
color: var(--pico-primary);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.ratingBox {
|
||||
text-align: center;
|
||||
|
||||
i {
|
||||
background-color: var(--pico-secondary);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.rated {
|
||||
background-color: var(--pico-primary);
|
||||
}
|
||||
|
||||
>i {
|
||||
|
||||
&:hover .icon,
|
||||
&:hover~.icon {
|
||||
background-color: var(--pico-secondary) !important;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover>.icon {
|
||||
background-color: var(--pico-primary);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
.listRating {
|
||||
i {
|
||||
width: 1.25rem;
|
||||
height: 1.25rem;
|
||||
background-color: var(--pico-secondary);
|
||||
}
|
||||
|
||||
.rated {
|
||||
background-color: var(--pico-primary);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.icon {
|
||||
display: inline-block;
|
||||
font-size: var(--pico-font-size);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
|
||||
&.star-full {
|
||||
mask: url('data:image/svg+xml,<svg viewBox="0 0 24 24" fill="%231C274C" xmlns="http://www.w3.org/2000/svg"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"><path d="M9.15316 5.40838C10.4198 3.13613 11.0531 2 12 2C12.9469 2 13.5802 3.13612 14.8468 5.40837L15.1745 5.99623C15.5345 6.64193 15.7144 6.96479 15.9951 7.17781C16.2757 7.39083 16.6251 7.4699 17.3241 7.62805L17.9605 7.77203C20.4201 8.32856 21.65 8.60682 21.9426 9.54773C22.2352 10.4886 21.3968 11.4691 19.7199 13.4299L19.2861 13.9372C18.8096 14.4944 18.5713 14.773 18.4641 15.1177C18.357 15.4624 18.393 15.8341 18.465 16.5776L18.5306 17.2544C18.7841 19.8706 18.9109 21.1787 18.1449 21.7602C17.3788 22.3417 16.2273 21.8115 13.9243 20.7512L13.3285 20.4768C12.6741 20.1755 12.3469 20.0248 12 20.0248C11.6531 20.0248 11.3259 20.1755 10.6715 20.4768L10.0757 20.7512C7.77268 21.8115 6.62118 22.3417 5.85515 21.7602C5.08912 21.1787 5.21588 19.8706 5.4694 17.2544L5.53498 16.5776C5.60703 15.8341 5.64305 15.4624 5.53586 15.1177C5.42868 14.773 5.19043 14.4944 4.71392 13.9372L4.2801 13.4299C2.60325 11.4691 1.76482 10.4886 2.05742 9.54773C2.35002 8.60682 3.57986 8.32856 6.03954 7.77203L6.67589 7.62805C7.37485 7.4699 7.72433 7.39083 8.00494 7.17781C8.28555 6.96479 8.46553 6.64194 8.82547 5.99623L9.15316 5.40838Z" ></path></g></svg>');
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user