LESA/custum-hyprpanel
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Implemented the calendar menu that displays time, calendar and weather (WIP).

Browse Source
This commit is contained in:
Jas Singh
2024-06-27 02:07:44 -07:00
parent 4ff2392c48
commit cfaceac4c0
11 changed files with 686 additions and 202 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
scss/bar/bar.scss
View File

@@ -1,12 +1,13 @@
@import "../colors";
.bar {
background: $mantle;
background: $crust;
}
.bar_item_box_visible {
background: transparentize($surface0, 0.2);
background-color: $base2;
border-radius: 0.35em;
// border: 0.15em solid $surface0;
padding: 0.2rem 0.9rem;
margin: 0.5rem 0.25rem;

4
scss/bar/workspace.scss
View File

@@ -19,8 +19,8 @@
}
&.active {
color: $lavender;
background-color: $lavender;
color: $pink;
background-color: $pink;
min-width: 11em;
min-height: 4.5em;
}

1
scss/colors.scss
View File

@@ -38,6 +38,7 @@ $surface2: #585b70;
$surface1: #45475a;
$surface0: #313244;
$base: #1e1e2e;
$base2: #242438;
$mantle: #181825;
$crust: #11111b;

2
scss/main.scss
View File

@@ -1,7 +1,7 @@
* {
all: unset;
font-family: "Ubuntu Nerd Font";
font-size: 1.2rem;
font-size: 1.175rem;
font-weight: 600;
}

142
scss/menus/calendar.scss
View File

@@ -2,9 +2,9 @@
.calendar-content-container {
margin-top: 0em;
min-width: 16em;
min-width: 27em;
min-height: 6em;
background: $mantle;
background: $crust;
border: 0.13em solid $surface0; border-radius: 0.4em;
}
@@ -12,19 +12,30 @@
margin-right: 0.50em;
}
.calendar-content-items {
margin: 1em;
.calendar-menu-item-container {
border-radius: 0.4em;
margin-bottom: 1.35em;
background: $base;
}
.calendar-menu-calendar {
all: unset;
padding: 1em;
.calendar-content-items {
margin: 1.35em;
}
.calendar-container-box {
margin: 0.75em;
margin-bottom: 0em;
}
.calendar-menu-widget {
margin-top: 2em;
border-radius: 0.4em;
color: $text;
&:selected {
box-shadow: inset 0 -0.4em 0 0 $pink,
inset 0 -0.2em 0 0 $mantle,
inset 0 0 0 0.01em $mantle;
box-shadow: inset 0 -0.5em 0 0 $pink,
inset -0.4em -0.3em 0 0 $base,
inset 0.4em 0 0 0.01em $base;
color: $pink;
border-radius: 0em;
}
@@ -33,17 +44,122 @@
background-color: transparent;
color: $teal;
}
&.button {
color: $text;
font-weight: 900;
font-size: 900em;
}
&:hover {
color: $pink;
}
&.highlight {
border: 2em solid $pink;
background-color: transparent;
color: $pink;
}
&:indeterminate {
color: $surface2;
}
font-size: 1.1em;
padding: 0.2em;
padding: 0.35em;
}
.clock-content-items {
min-height: 6em;
.clock-content-time {
font-size: 4em;
color: $pink;
}
.clock-content-period {
font-size: 1.75em;
margin-bottom: 0.7em;
margin-right: -0.875em;
color: $teal;
}
}
.calendar-menu-item-container.weather {
margin-bottom: 0em;
}
.weather-container-box {
color: $red;
margin: 1.5em;
min-width: 3em;
// min-height: 10em;
.calendar-menu-weather.today.icon {
image {
color: $pink;
font-size: 5em;
// margin-right: 0.3em;
}
}
.calendar-menu-weather.today.temp.label {
color: $text;
margin-left: 0.2em;
font-size: 2.5em;
}
.calendar-menu-weather.today.condition.label {
color: $teal;
font-size: 1.75em;
margin-left: -1.4em;
}
// .calendar-menu-weather.today.condition.label.weather-color.red {
// color: $red;
// }
// .calendar-menu-weather.today.condition.label.weather-color.orange {
// color: $orange;
// }
// .calendar-menu-weather.today.condition.label.weather-color.lavender {
// color: $lavender;
// }
// .calendar-menu-weather.today.condition.label.weather-color.blue {
// color: $blue;
// }
// .calendar-menu-weather.today.condition.label.weather-color.sky {
// color: $sky;
// }
.calendar-menu-weather.today.temp.label.icon.weather-color.red {
color: $red;
}
.calendar-menu-weather.today.temp.label.icon.weather-color.orange {
color: $orange;
}
.calendar-menu-weather.today.temp.label.icon.weather-color.lavender {
color: $lavender;
}
.calendar-menu-weather.today.temp.label.icon.weather-color.blue {
color: $blue;
}
.calendar-menu-weather.today.temp.label.icon.weather-color.sky {
color: $sky;
}
}
.calendar-menu-weather.today.stats.container {
// margin-left: 2.2em;
color: $pink;
.weather.label {
margin-left: 0.35em;
}
}

24
scss/menus/power.scss
View File

@@ -10,35 +10,35 @@ $popover-padding: 0.6rem * 1.6;
window#verification .verification {
@include floating-widget;
padding: 0.5rem * 1.6 * 1.5;
min-width: 20rem;
min-height: 8rem;
padding: 0.35em * 1.6 * 1.5;
min-width: 20em;
min-height: 6em;
font-size: 1.3em;
.text-box {
margin-bottom: 0.4rem;
margin-bottom: 0.3em;
.title {
font-size: 1.5em;
color: $maroon;
margin-bottom: 0.75rem;
margin-bottom: 0.5em;
}
.desc {
color: $lavender;
font-size: 1em;
margin-bottom: 0.75rem;
padding: 1.15rem 2.25rem;
margin-bottom: 0.55em;
padding: 1em 3em;
}
}
.verification-button {
background: $crust;
padding: 0.75rem 0rem;
margin: 0.4rem 1.9rem;
border: 0.2rem solid;
padding: 0.7em 0em;
margin: 0.4em 1.7em;
border: 0.15em solid;
border-color: $crust;
border-radius: 0.4rem;
border-radius: 0.3em;
opacity: 1;
transition: border-color 0.2s ease-in-out;
transition: opacity .3s ease-in-out;
@@ -105,6 +105,8 @@ window#powermenu .powermenu {
.widget-button {
border-color: $crust;
min-width: 4.5em;
min-height: 4.5em;
opacity: 1;
transition: border-color 0.2s ease-in-out;
transition: opacity .3s ease-in-out;