other components... (2)
This commit is contained in:
Paolo Arena
303
src/components/CEventsCalendar/CEventsCalendar.scss
Executable file
303
src/components/CEventsCalendar/CEventsCalendar.scss
Executable file
@@ -0,0 +1,303 @@
|
||||
$graytext: #555;
|
||||
|
||||
.calendar {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.my-event {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.my-event-rel {
|
||||
width: 100%;
|
||||
font-size: 0.75rem;
|
||||
line-height: 1.25rem;
|
||||
text-align: center;
|
||||
vertical-align: center;
|
||||
margin-bottom: 5px;
|
||||
cursor: pointer;
|
||||
padding: 4px 2px 4px 2px !important;
|
||||
}
|
||||
|
||||
.flex-container {
|
||||
background-color: #ccc;
|
||||
padding: 10px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
.flex-item {
|
||||
background-color: #9f9f9f;
|
||||
padding: 10px;
|
||||
margin: 10px;
|
||||
color: #fff;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.cal {
|
||||
color: black;
|
||||
font-size: 0.75rem;
|
||||
font-weight: 400;
|
||||
line-height: 1.25rem;
|
||||
letter-spacing: 0.03333em;
|
||||
|
||||
&__title {
|
||||
color: white;
|
||||
font-weight: 700;
|
||||
font-size: 1rem;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
&__details {
|
||||
color: black;
|
||||
}
|
||||
|
||||
&__hours {
|
||||
color: blue;
|
||||
&-title {
|
||||
color: $graytext;
|
||||
}
|
||||
&-content {
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
|
||||
&__where {
|
||||
margin-top: 5px;
|
||||
color: blue;
|
||||
|
||||
&-title {
|
||||
color: $graytext;
|
||||
}
|
||||
&-content {
|
||||
color: darkblue;
|
||||
}
|
||||
}
|
||||
|
||||
&__when {
|
||||
margin-top: 5px;
|
||||
color: blue;
|
||||
|
||||
&-title {
|
||||
color: $graytext;
|
||||
}
|
||||
&-content {
|
||||
color: darkblue;
|
||||
}
|
||||
}
|
||||
|
||||
&__teacher {
|
||||
margin-top: 5px;
|
||||
&-title {
|
||||
color: $graytext;
|
||||
}
|
||||
&-content {
|
||||
color: darkblue;
|
||||
}
|
||||
}
|
||||
|
||||
&__quota {
|
||||
margin-top: 5px;
|
||||
&-title {
|
||||
color: $graytext;
|
||||
}
|
||||
&-content {
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
&__img {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.listaev {
|
||||
color: black;
|
||||
font-size: 0.75rem;
|
||||
font-weight: 400;
|
||||
line-height: 1.25rem;
|
||||
letter-spacing: 0.03333em;
|
||||
|
||||
&__date {
|
||||
color: #061220;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
&__title {
|
||||
color: red;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.066em;
|
||||
}
|
||||
|
||||
&__details {
|
||||
color: black;
|
||||
}
|
||||
|
||||
&__tdimg {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
}
|
||||
|
||||
&__tdimg_small {
|
||||
width: auto;
|
||||
height: 50px !important;
|
||||
@media (max-width: 800px) {
|
||||
height: 40px !important;
|
||||
}
|
||||
}
|
||||
|
||||
&__table {
|
||||
margin: 10px;
|
||||
border: solid 1px #4198ef;
|
||||
border-radius: 1rem;
|
||||
padding: 2px;
|
||||
}
|
||||
&__table tr {
|
||||
border: solid 1px #4198ef;
|
||||
border-radius: 1rem;
|
||||
}
|
||||
|
||||
&__table tr:hover {
|
||||
background-color: #deecef;
|
||||
}
|
||||
|
||||
&__align_center_mobile {
|
||||
text-align: left;
|
||||
@media (max-width: 718px) {
|
||||
text-align: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
&__align_chips {
|
||||
text-align: left;
|
||||
@media (max-width: 718px) {
|
||||
text-align: center;
|
||||
display: flex;
|
||||
flex-direction: column-reverse;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
&__img {
|
||||
padding: 0.25rem !important;
|
||||
float: left;
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
border-radius: 1rem;
|
||||
|
||||
@media (max-width: 718px) {
|
||||
// PER VERSIONE MOBILE
|
||||
float: none;
|
||||
text-align: center;
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
|
||||
&__img:hover {
|
||||
transition: transform .2s;
|
||||
transform: scale(1.05);
|
||||
border: inset;
|
||||
border-color: blue;
|
||||
border-width: 1px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media (max-width: 718px) {
|
||||
.q-chip__content {
|
||||
white-space: normal !important;
|
||||
}
|
||||
|
||||
.q-chip > div {
|
||||
white-space: normal !important;
|
||||
}
|
||||
.inline > div {
|
||||
white-space: normal !important;
|
||||
}
|
||||
}
|
||||
|
||||
.mytoolbar {
|
||||
padding: 0 2px !important;
|
||||
}
|
||||
|
||||
.margin_avatar, .margin_avatar2, .margin_with {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
@media (max-width: 400px) {
|
||||
.margin_avatar {
|
||||
margin-left: 28px;
|
||||
}
|
||||
|
||||
.margin_avatar2 {
|
||||
margin-left: 38px;
|
||||
}
|
||||
|
||||
.margin_with {
|
||||
margin-left: 7px;
|
||||
}
|
||||
}
|
||||
|
||||
.chipbooked {
|
||||
|
||||
position: absolute;
|
||||
left: 40px;
|
||||
@media (max-width: 400px) {
|
||||
left: initial;
|
||||
position: initial;
|
||||
}
|
||||
}
|
||||
|
||||
.chipnews {
|
||||
|
||||
position: absolute;
|
||||
right: 0;
|
||||
@media (max-width: 400px) {
|
||||
position: initial;
|
||||
right: initial;
|
||||
}
|
||||
}
|
||||
|
||||
.chipmodif {
|
||||
|
||||
position: absolute;
|
||||
margin-top: -10px;
|
||||
overflow: hidden;
|
||||
z-index: 1000;
|
||||
box-sizing: border-box;
|
||||
right: 0;
|
||||
@media (max-width: 400px) {
|
||||
position: initial;
|
||||
right: initial;
|
||||
}
|
||||
}
|
||||
|
||||
.windowcol {
|
||||
background-color: #ffffff;
|
||||
// background: radial-gradient(circle, #ffffff 0%, #94dbfb 100%)
|
||||
}
|
||||
|
||||
.mysel {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.myflex {
|
||||
display: flex;
|
||||
flex: 1;
|
||||
@media (max-width: 400px) {
|
||||
flex-flow: column;
|
||||
}
|
||||
}
|
||||
.itemprenota{
|
||||
align-self: center;
|
||||
color: blue;
|
||||
}
|
||||
Reference in New Issue
Block a user