osem-fcy/app/assets/stylesheets/osem-schedule.scss
Ana c6906675f9 Make it possible to select favourites events
Make it possible for users to select events which they want to see in the public schedule and in the All events section of the public schedule.
2025-08-14 17:28:55 +02:00

333 lines
5.1 KiB
SCSS

#schedule-content .carousel-control{
width: 12%;
}
@media (min-width: 768px){
#schedule-content .carousel-control{
width: 5%;
}
}
.room-name{
font-weight: bold;
padding:10px;
margin-top: 30px;
border: 1px solid #848484;
background-color: #E6E6E6;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
height: 40px;
line-height: 25px;
overflow: hidden;
}
.schedule-room-slot{
padding: 2px 3px;
border: 1px solid #848484;
height: 58px;
line-height: 20px;
font-size: 13px;
}
.schedule-event{
padding: 7px;
border: 2px solid #151515;
position:relative;
z-index:1;
cursor:move;
}
.schedule-room-slot .schedule-event.compact {
margin-top: -23px;
margin-left: 20%;
width: 80%;
}
.schedule-event-text{
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
line-height: 23px;
overflow: hidden;
}
.schedule-event-delete-button {
font-weight:bold;
cursor: pointer;
padding: 0px 3px;
border: 1px solid grey;
margin-right: 5px;
}
#schedule td.event {
background-image: linear-gradient(to top, rgb(247,250,242) 24%, rgb(194,232,190) 97%, rgb(194,232,190) 100%);
cursor: pointer;
padding: 3px 2px;
}
#schedule td.event:hover
{
background-image: linear-gradient(to top, rgb(247,250,242) 24%, rgb(83,171,74) 97%, rgb(83,171,74) 100%);
}
.flexvideo {
position: relative;
padding-bottom: 56.25%; /* 16:9 */
padding-top: 25px;
height: 0;
}
.flexvideo iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.speakerinfo {
margin-top: 40px;
}
.speakerbio {
margin-top: 10px;
}
.schedule-title, .schedule-subtitle, .schedule-speaker, .schedule-track {
clear: none;
display: block;
}
.schedule-subtitle {
color: rgb(185, 74, 72);
}
a.unstyled-link {
text-decoration: none;
color: #333333;
outline: 0;
}
.program-dropdown, .schedule-dropdown{
margin-left: 20%;
margin-right: 20%;
margin-top: 40px;
margin-bottom: 20px;
}
.schedule-dropdown > button, .program-dropdown > button, .program-dropdown > .dropdown-menu, .schedule-dropdown > .dropdown-menu{
width: 100%;
}
.elipsis{
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
}
.break-words{
/* These are technically the same, but use both */
overflow-wrap: break-word;
word-wrap: break-word;
/* Warning: Needed for oldIE support, but words are broken up letter-by-letter */
-ms-word-break: break-all;
word-break: break-all;
/* Non standard for webkit */
word-break: break-word;
-ms-hyphens: auto;
-moz-hyphens: auto;
-webkit-hyphens: auto;
hyphens: auto;
}
.room, .event-title{
font-size: 11px;
line-height: 17px;
overflow: hidden;
}
td.room{
width: 15%;
padding: 3px !important;
max-width:15%;
}
th.date{
font-size: 12px;
padding: 4px 0px 4px 2px !important;
}
.speaker-pic{
padding: 4px 2px;
}
.schedule-table{
width: 100%;
margin:0px;
padding:0px;
}
td.no-padding{
padding:0px !important;
}
.all-events-title{
margin-top: 40px;
border-bottom: 1px solid #848484;
}
.date-title{
font-size: 23px;
font-weight: bold;
padding-bottom: 2px;
display:inline-block;
}
.start-time{
font-size: 16px;
padding-left: 30px;
margin-top: 32px;
}
.new-time-event{
margin-top: 20px;
}
.date-content{
border-bottom: 1px solid #6E6E6E;
margin-top: 30px;
}
.unscheduled-event{
margin-top: 8px;
}
.all-speaker-pic{
padding: 20px 10px 20px 10px;
}
.track{
padding: 0px 5px 0px 5px;
display: inline-block;
}
.event-panel{
cursor: pointer;
}
.program-dropdown{
margin-left: 20%;
margin-right: 20%;
margin-top: 40px;
}
.program-dropdown > button{
width: 100%;
}
.program-dropdown > .dropdown-menu{
width: 100%;
}
.no-events-day{
color: #D8D8D8 !important;
}
.schedule-label{
height: 14px;
line-height: 11px;
overflow: hidden;
display: inline-block;
white-space: normal;
padding-left: 1px;
padding-right: 1px;
font-size: 7px;
}
.non_schedulable{
opacity: 0.5;
}
#star{
margin-top: 8px;
}
#star-events{
margin-right: 5px;
vertical-align: text-top;
}
/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
.room, .event-title{
font-size: 12px;
}
td.room{
width: 12%;
max-width:12%;
}
th.date{
font-size: 13px;
}
td.event{
padding: 3px 3px !important;
}
.schedule-label{
padding-left: 2px;
padding-right: 3px;
}
}
/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
.room, .event-title{
font-size: 13px;
}
td.room{
width: 10%;
max-width: 10%;
}
.schedule-label{
height: 15px;
line-height: 12px;
font-size: 7px;
}
}
/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
.room, .event-title{
font-size: 14px;
}
.schedule-label{
padding-left: 2px;
padding-right: 2px;
font-size: 8px;
}
td.room{
width: 9%;
max-width: 9%;
}
td.event{
padding: 3px 6px !important;
}
th.date{
font-size: 14px;
}
}