chamilo
/
chamilo-lms
mirror of https://github.com/chamilo/chamilo-lms/tree/1.11.x
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

new accordion design - refs #2681

Browse Source
pull/2744/head
Alex Aragón 6 years ago
parent 3177113fab
commit d2e532bf25
5 changed files with 106 additions and 26 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 9
      assets/css/base.css
  2. 95
      assets/css/scss/_base.scss
  3. 4
      assets/css/scss/_variables.scss
  4. 14
      assets/css/themes/chamilo/images/logo_chamilo.svg
  5. 10
      main/template/default/course_home/activity.html.twig

9
assets/css/base.css
Unescape View File

@ -10,7 +10,10 @@
Version: 1.0
*/
/*------------------------------*/
.admin-block-version {
font-size: 12px;
padding: 5%;
@ -4547,13 +4550,9 @@ i.size-32.icon-new-work {
.top-mediapost .msg-content p,
.sub-mediapost .rep-post .msg-content p {
/* border-top:1px solid #ECF0F1; */
/* padding-top: 10px; */
/* padding-bottom: 20px; */
margin-top: 5px;
margin-bottom: 20px;
line-height: 22px;
/* padding-left: 10px; */
padding-right: 10px;
color: #666666;
}

95
assets/css/scss/_base.scss
Unescape View File

@ -424,6 +424,9 @@ footer {
border-radius: 2px;
.card-body{
padding: 1.88rem 1.81rem;
@include landscape($breakpoint-sm) {
padding: 0;
}
}
}
/* CATEGORY CLASSIC */
@ -614,17 +617,90 @@ footer {
}
}
}
/******************* Accordion B4 *****************/
.course-accordion{
.card-header{
.accordion-b4 {
.card {
border: 0 none;
box-shadow: none;
}
.card-header {
padding: 0;
background-color: $default-white;
.btn-link{
display: inline-block;
width: 100%;
background: #fff;
border: none;
}
.card-title a {
display: block;
position: relative;
background: transparent;
color: $menu-background;
font-size: 14px;
font-weight: bolder;
text-transform: uppercase;
margin-bottom: 15px;
padding: 15px 50px;
border-bottom: 2px solid $menu-background;
border-radius: 0 15px 0 15px;
transition: all 0.10s linear 0s;
cursor: pointer;
&.collapsed {
color: #808080;
border-bottom: 1px solid #d3d3d3;
margin: 0;
}
i {
color: $menu-background;
position: absolute;
top: 15px;
left: 20px;
font-size: 20px;
}
&:before {
content: "";
position: absolute;
bottom: -15px;
left: 36px;
border: 7px solid transparent;
border-top: 7px solid $menu-background;
}
&.collapsed {
&:before {
content: "";
position: absolute;
bottom: -15px;
left: 36px;
border: 0 none;
}
&:hover {
color: #6a6060;
}
}
&:after {
content: "\f106";
font-family: "Font Awesome 5 Free", serif;
font-weight: 900;
color: $menu-secondary;
font-size: 20px;
line-height: 20px;
position: absolute;
top: 18px;
right: 25px;
}
&.collapsed:after {
font-family: "Font Awesome 5 Free", serif;
font-weight: 900;
font-size: 20px;
line-height: 20px;
position: absolute;
top: 18px;
right: 25px;
content: "\f107";
color: #808080;
}
}
.card-body{
.card-body {
border-top: 0 none;
color: #808080;
.tools{
width: 160px;
height: 160px;
@ -640,7 +716,7 @@ footer {
height: 84px;
top: 40%;
margin-top: -50px;
left: 40%;
left: 44%;
margin-left: -32px;
text-align: center;
border: 1px solid rgba(0, 0, 0, 0.125) ;
@ -649,7 +725,7 @@ footer {
img{
transition: transform .2s ease-in;
&:hover{
transform: scale(0.85);
transform: scale(1.15);
}
}
a{
@ -668,3 +744,4 @@ footer {
}
}
}

4
assets/css/scss/_variables.scss
Unescape View File

@ -43,9 +43,11 @@ $default-link : rgb(0, 153, 255);
// ---------------------------------------------------------
// COLORS PAGE
// ---------------------------------------------------------
// linear-gradient(120deg, #00a5e4, #4a71d0);
$page-background : #ffffff;
$menu-background :linear-gradient(120deg, #00a5e4, #4a71d0);
$menu-background : #4a71d0;
$menu-secondary : #ff3c7e;
$sidebar-link : #54667A;
$sidebar-bg : #FFFFFF;
$sidebar-focus : rgba(0, 0, 0, 0.07);

14
assets/css/themes/chamilo/images/logo_chamilo.svg
Unescape View File

@ -9,7 +9,7 @@
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="190"
width="205"
height="64"
id="svg3034"
version="1.1"
@ -25,14 +25,14 @@
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="3.3976798"
inkscape:cx="82.614165"
inkscape:cx="90.266446"
inkscape:cy="10.778402"
inkscape:document-units="px"
inkscape:current-layer="layer1"
showgrid="false"
inkscape:window-width="1319"
inkscape:window-width="1366"
inkscape:window-height="713"
inkscape:window-x="47"
inkscape:window-x="0"
inkscape:window-y="27"
inkscape:window-maximized="1"
showguides="false" />
@ -44,7 +44,7 @@
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
@ -62,7 +62,7 @@
y="988.36218" />
<g
id="g916"
transform="matrix(0.22497727,0,0,0.22497727,-20.196607,831.88814)">
transform="matrix(0.20546527,0,0,0.20546527,-15.452839,848.85023)">
<path
style="fill:#2e75a3;fill-opacity:1;stroke-width:2.08000803"
id="path3202"
@ -118,7 +118,7 @@
</g>
<g
id="g920"
transform="matrix(0.16570371,0,0,0.16570371,5.2710663,882.31968)"
transform="matrix(0.16570371,0,0,0.16570371,5.2710663,880.31968)"
style="fill:#2e75a3;fill-opacity:1">
<path
d="m 1055.4417,888.63524 v -22.046 c 7.283,0 13.418,-2.492 18.402,-7.667 4.793,-5.176 7.285,-11.887 7.285,-19.938 0,-8.053 -2.299,-14.762 -7.285,-19.748 -4.791,-4.984 -10.926,-7.476 -18.402,-7.476 v -22.43 c 8.627,0.191 17.061,2.301 24.73,6.709 7.859,4.41 13.994,10.545 18.404,18.212 4.408,7.479 6.518,15.721 6.518,24.539 0,9.012 -2.109,17.254 -6.518,25.115 -4.602,7.859 -10.545,13.803 -18.213,18.212 -7.476,4.408 -15.911,6.518 -24.921,6.518 z m 0,-99.306 v 22.43 h -0.193 c -7.285,0 -13.42,2.492 -18.404,7.478 -4.791,5.176 -7.283,11.693 -7.283,19.746 0,8.242 2.492,14.953 7.283,19.938 4.793,5.175 10.928,7.667 18.404,7.667 0,0 0,0 0.193,0 v 22.046 c -0.193,0 -0.193,0 -0.385,0 -13.611,0 -25.113,-4.793 -34.699,-14.378 -9.586,-9.777 -14.379,-21.47 -14.379,-35.273 0,-14.762 5.369,-26.84 16.297,-36.81 9.393,-8.435 20.32,-12.844 32.59,-12.844 0.191,0 0.383,0 0.576,0 z m -370.19195,99.114 v -21.472 c 7.476,0 13.61,-2.684 18.403,-7.859 4.984,-5.176 7.477,-11.887 7.477,-20.322 0,-8.242 -2.492,-14.953 -7.477,-19.938 -4.793,-4.984 -10.927,-7.477 -18.403,-7.477 v -21.663 c 3.833,0.384 7.476,1.342 10.927,2.876 4.984,2.108 9.586,5.368 13.803,9.585 v -10.352 h 23.771 v 94.512 h -23.771 v -10.16 c -4.602,4.602 -9.201,7.667 -13.994,9.585 -3.26,1.535 -6.903,2.302 -10.736,2.685 z m 72.274,-96.621 h 23.771 v 10.928 c 4.025,-4.602 8.627,-7.86 13.611,-9.969 4.984,-2.301 10.354,-3.451 16.104,-3.451 5.943,0 11.311,1.533 16.104,4.409 4.793,2.876 8.627,7.093 11.504,12.653 3.643,-5.561 8.434,-9.777 13.803,-12.653 5.559,-2.876 11.502,-4.409 18.02,-4.409 6.711,0 12.654,1.533 17.639,4.793 5.176,3.066 8.818,7.093 11.119,12.27 2.107,4.983 3.258,13.037 3.258,24.347 v 55.595 h -23.771 v -48.118 c 0,-10.736 -1.342,-18.021 -4.025,-21.664 -2.683,-3.643 -6.711,-5.559 -12.078,-5.559 -4.025,0 -7.668,1.15 -10.928,3.452 -3.258,2.107 -5.559,5.367 -7.094,9.393 -1.725,4.219 -2.492,10.736 -2.492,19.746 v 42.751 h -23.771 v -45.817 c 0,-8.627 -0.768,-14.762 -1.916,-18.404 -1.344,-3.834 -3.26,-6.518 -5.752,-8.436 -2.492,-1.725 -5.367,-2.684 -9.01,-2.684 -3.836,0 -7.479,1.15 -10.736,3.452 -3.068,2.107 -5.561,5.559 -7.094,9.777 -1.725,4.217 -2.492,10.926 -2.492,19.938 v 42.175 h -23.771 v -94.515 z m 176.947,-38.91799 c 4.219,0 7.67,1.53399 10.736,4.40999 2.875,3.067 4.40998,6.709 4.40998,10.928 0,4.408 -1.34198,7.859 -4.40998,10.927 -2.875,3.067 -6.518,4.409 -10.543,4.409 -4.219,0 -7.861,-1.533 -10.928,-4.601 -2.877,-2.876 -4.41,-6.71 -4.41,-10.928 0,-4.218 1.533,-7.86 4.41,-10.735 2.876,-3.06799 6.518,-4.40999 10.735,-4.40999 z m -11.885,38.91799 h 23.771 v 94.512 h -23.771 z m 42.74998,-36.618 h 23.773 v 131.129 h -23.773 z m -450.70898,25.881 -17.062,16.296 c -11.694,-12.27 -24.73,-18.404 -39.108,-18.404 -12.27,0 -22.622,4.218 -30.865,12.461 -8.436,8.436 -12.653,18.596 -12.653,30.674 0,8.627 1.917,16.104 5.56,22.812 3.643,6.52 9.011,11.695 15.721,15.529 6.901,3.833 14.378,5.558 22.621,5.558 7.094,0 13.611,-1.148 19.363,-3.833 5.942,-2.684 12.461,-7.477 19.362,-14.377 l 16.487,17.062 c -9.394,9.393 -18.404,15.721 -26.84,19.363 -8.243,3.449 -17.829,5.176 -28.756,5.176 -19.746,0 -36.042,-6.135 -48.887,-18.789 -12.653,-12.652 -18.979,-28.755 -18.979,-48.501 0,-12.653 2.875,-23.964 8.819,-33.933 5.751,-9.777 13.994,-17.829 24.73,-23.771 10.735,-6.135 22.238,-9.203 34.699,-9.203 10.544,0 20.705,2.301 30.482,6.71 9.778,4.601 18.212,10.927 25.306,19.17 z m 170.623,8.627 v 21.663 h -0.191 c -7.477,0 -13.42,2.493 -18.404,7.477 -4.793,5.176 -7.285,11.887 -7.285,19.938 0,8.244 2.492,14.953 7.477,20.322 4.984,5.175 11.119,7.859 18.213,7.859 0.191,0 0.191,0 0.191,0 v 21.472 c -1.342,0.191 -2.875,0.191 -4.408,0.191 -12.27,0 -22.814,-4.602 -31.825,-14.187 -8.818,-9.393 -13.229,-21.279 -13.229,-35.273 0,-14.57 4.217,-26.457 12.844,-35.851 8.627,-9.201 19.172,-13.994 31.442,-13.994 1.915,0 3.45,0.192 5.175,0.383 z m -151.836,-34.508 h 23.581 v 46.203 c 4.602,-4.026 9.395,-7.094 13.994,-9.011 4.793,-2.108 9.395,-3.067 14.188,-3.067 9.201,0 17.254,3.259 23.58,9.777 5.561,5.559 8.244,13.996 8.244,24.73 v 62.497 h -23.389 v -41.601 c 0,-10.928 -0.385,-18.404 -1.535,-22.238 -0.957,-3.834 -2.875,-6.518 -5.176,-8.436 -2.492,-1.917 -5.559,-2.875 -9.201,-2.875 -4.984,0 -9.012,1.534 -12.461,4.793 -3.451,2.875 -5.943,7.285 -7.285,12.844 -0.576,2.877 -0.959,9.203 -0.959,19.363 v 38.149 h -23.581 z"

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 29 KiB

After

Width:  |  Height:  |  Size: 29 KiB

10
main/template/default/course_home/activity.html.twig
Unescape View File

@ -1,12 +1,14 @@
{% if app.user.status != 5 %} <!-- main/template/default/course_home/activity.html.twig -->
<div class="accordion course-accordion" id="course-tools">
<div class="accordion accordion-b4" id="course-tools">
{% for block in blocks %}
<div class="card">
<div class="card-header" id="heading-{{ block.class }}">
{% if block.title %}
<button class="btn btn-link" type="button" data-toggle="collapse" data-target="#collapse-{{ block.class }}" aria-expanded="true" aria-controls="collapse-{{ block.class }}">
{{ block.title }}
</button>
<h5 class="card-title">
<a class="{{ ( block.title == 'Authoring') ? ' ' : 'collapse' }}" role="button" data-toggle="collapse" data-target="#collapse-{{ block.class }}" aria-expanded="{{ ( block.title == 'Authoring') ? 'true' : 'false' }}" aria-controls="collapse-{{ block.class }}">
<i class="fas fa-clone"></i> {{ block.title }}
</a>
</h5>
{% endif %}
</div>

Write Preview
Loading…
Cancel
Save