diff --git a/Resources/templates/responsive/faq/index.php b/Resources/templates/responsive/faq/index.php new file mode 100644 index 0000000000..ec4d9a62d0 --- /dev/null +++ b/Resources/templates/responsive/faq/index.php @@ -0,0 +1,48 @@ +layout('faq/layout') ?> + +section('faq-content') ?> + + +
+
+
+
+ + +
+ +
+
+

text('faq-title') ?>

+
+
+
+ + faq_sections as $section): ?> + + + getFaqbySection(3); ?> + + + + +replace() ?> diff --git a/Resources/templates/responsive/faq/individual.php b/Resources/templates/responsive/faq/individual.php new file mode 100644 index 0000000000..2382c43ab3 --- /dev/null +++ b/Resources/templates/responsive/faq/individual.php @@ -0,0 +1,67 @@ +layout('faq/layout') ?> + +section('faq-content') ?> + + +
+
+
+
+ + +
+ +
+
+

faq_section->name ?>

+

faq->title ?>

+
+
+
+
+
+ + +
+
+ +replace() ?> diff --git a/Resources/templates/responsive/faq/layout.php b/Resources/templates/responsive/faq/layout.php new file mode 100644 index 0000000000..6aaa3eb81a --- /dev/null +++ b/Resources/templates/responsive/faq/layout.php @@ -0,0 +1,19 @@ +layout('layout', [ + 'bodyClass' => 'faq', + 'title' => $this->meta_title, + 'meta_description' => $this->meta_description + ]); + +$this->section('content'); + +?> + +
+ + supply('faq-content') ?> + +
+ +replace() ?> diff --git a/Resources/templates/responsive/faq/section.php b/Resources/templates/responsive/faq/section.php new file mode 100644 index 0000000000..c9ca3bad36 --- /dev/null +++ b/Resources/templates/responsive/faq/section.php @@ -0,0 +1,58 @@ +layout('faq/layout', ['title' => $faq_section->name]) ?> + +section('faq-content') ?> + + + +
+
+
+
+ + +
+ +
+
+

FAQs

+

faq_section->name ?>

+
+
+
+
+
+ + subsections as $subsection): ?> + + getFaqbySubsection(100); ?> + +
+
+

name ?>

+
    + + + slug ? $faq->slug : $faq->id; ?> + +
  • title ?>
    • + + +
+
+
+ + + +
+ + +replace() ?> diff --git a/public/assets/img/faq/Icono/donantes@1x.svg b/public/assets/img/faq/Icono/donantes@1x.svg new file mode 100644 index 0000000000..834b79b0da --- /dev/null +++ b/public/assets/img/faq/Icono/donantes@1x.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/public/assets/img/faq/Icono/impulsores@1x.svg b/public/assets/img/faq/Icono/impulsores@1x.svg new file mode 100644 index 0000000000..28bb0562ba --- /dev/null +++ b/public/assets/img/faq/Icono/impulsores@1x.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/public/assets/img/faq/Icono/matchers@1x.svg b/public/assets/img/faq/Icono/matchers@1x.svg new file mode 100644 index 0000000000..f61b9e5450 --- /dev/null +++ b/public/assets/img/faq/Icono/matchers@1x.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/public/assets/img/faq/Icono/sobre-goteo@1x.svg b/public/assets/img/faq/Icono/sobre-goteo@1x.svg new file mode 100644 index 0000000000..94ec375159 --- /dev/null +++ b/public/assets/img/faq/Icono/sobre-goteo@1x.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/public/assets/img/faq/icones/arrow-right-primary.svg b/public/assets/img/faq/icones/arrow-right-primary.svg new file mode 100644 index 0000000000..1aa14f3bd3 --- /dev/null +++ b/public/assets/img/faq/icones/arrow-right-primary.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/assets/img/faq/icones/caret-down.svg b/public/assets/img/faq/icones/caret-down.svg new file mode 100644 index 0000000000..a313efe210 --- /dev/null +++ b/public/assets/img/faq/icones/caret-down.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/public/assets/img/faq/icones/caret-up.svg b/public/assets/img/faq/icones/caret-up.svg new file mode 100644 index 0000000000..ae4071d40e --- /dev/null +++ b/public/assets/img/faq/icones/caret-up.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/public/assets/img/faq/icones/search.svg b/public/assets/img/faq/icones/search.svg new file mode 100644 index 0000000000..fef0ae22a2 --- /dev/null +++ b/public/assets/img/faq/icones/search.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/assets/img/faq/pattern/donantes@1x.svg b/public/assets/img/faq/pattern/donantes@1x.svg new file mode 100644 index 0000000000..cf904ac290 --- /dev/null +++ b/public/assets/img/faq/pattern/donantes@1x.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/public/assets/img/faq/pattern/impulsores@1x.svg b/public/assets/img/faq/pattern/impulsores@1x.svg new file mode 100644 index 0000000000..dfdcc6f316 --- /dev/null +++ b/public/assets/img/faq/pattern/impulsores@1x.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/public/assets/img/faq/pattern/matchers@1x.svg b/public/assets/img/faq/pattern/matchers@1x.svg new file mode 100644 index 0000000000..ec1090fd13 --- /dev/null +++ b/public/assets/img/faq/pattern/matchers@1x.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/public/assets/img/faq/pattern/sobre_goteo@1x.svg b/public/assets/img/faq/pattern/sobre_goteo@1x.svg new file mode 100644 index 0000000000..fe5d0825f3 --- /dev/null +++ b/public/assets/img/faq/pattern/sobre_goteo@1x.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/public/assets/sass/layouts/_faq.scss b/public/assets/sass/layouts/_faq.scss new file mode 100644 index 0000000000..bea28debbf --- /dev/null +++ b/public/assets/sass/layouts/_faq.scss @@ -0,0 +1,540 @@ +@import "compass/css3"; + +/* faq styles */ + +body.faq { + font-family: 'Roboto', sans-serif; + font-weight: 400; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + color: #3A3A3A; + + article[class^='col-'] { + display: flex; + flex-flow: row wrap; + } + .row { + &:before { + display: flex; + } + &:after { + display: flex; + } + } + + #breadcrumb { + font-weight: 400; + font-size: 13px; + color: #19B4B2; + letter-spacing: 0.24px; + line-height: 22px; + background-color: #E1F1F1; + padding: 12px 0; + a { + color: #1A1A1A; + font-weight: 500; + text-decoration: underline; + &:hover { + color: #19B4B2; + } + } + .slash { + color: #19B4B2; + } + } + #header_faqs { + position: relative; + min-height: 264px; + background-color: #DDF4F4; + display: flex; + flex-flow: wrap column; + justify-content: flex-start; + align-content: center; + background-size: 96px; + margin-bottom: 72px; + padding-top: 24px; + padding-bottom: 48px; + h1 { + font-size: 50px; + font-weight: 700; + color: #ffffff; + letter-spacing: 1.25px; + text-align: center; + margin: 16px auto 0 auto; + } + h3 { + font-size: 24px; + color: #ffffff; + letter-spacing: 0.24px; + text-align: center; + margin-bottom: 0px; + >a { + color: #FFFFFF; + text-decoration: underline; + &:hover { + color: #19B4B2; + } + } + } + .barra_superior { + margin-bottom: 8px; + .buscador_faqs { + display: flex; + flex-flow: row wrap; + align-items: flex-start; + justify-content: flex-start; + >label { + width: 211px; + >input[type=search] { + width: 100%; + height: 44px; + background: #FFFFFF; + border: 1px solid #D1D1D1; + background: #FFFFFF; + font-family: Roboto-Regular; + font-weight: 400; + font-size: 15px; + color: #3A3A3A; + letter-spacing: 0.16px; + padding: 5px 15px; + } + } + >button.search-submit { + position: relative; + width: 44px; + height: 44px; + border-left: none; + &:after { + position: absolute; + content: ''; + width: 100%; + height: 100%; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: url('../img/faq/icones/search.svg') center center/24px no-repeat; + } + } + } + } + } + #header_faqs.home_faqs { + min-height: 292px; + margin-bottom: 0; + h1 { + color: #3A3A3A; + } + } + #header_faqs.about { + background: url('../img/faq/pattern/sobre_goteo@1x.svg') center center/96px repeat #FFEC61; + h1 { + color: #3A3A3A; + } + h3 { + color: #3A3A3A; + >a { + color: #3A3A3A; + &:hover { + color: #19B4B2; + } + } + } + } + + #header_faqs.sponsors { + background: url('../img/faq/pattern/impulsores@1x.svg') center center/96px repeat #A65387; + } + + #header_faqs.donors { + background: url('../img/faq/pattern/donantes@1x.svg') center center/96px repeat #18508C; + } + + #header_faqs.matchers { + background: url('../img/faq/pattern/matchers@1x.svg') center center/96px repeat #582470; + } + + .a-hidden { + border: 0; + clip: rect(0,0,0,0); + width: 1px; + height: 1px; + margin: -1px; + overflow: hidden; + padding: 0; + position: absolute; + } + .pas1 { + margin-top: -48px; + margin-bottom: 88px; + .row { + display: flex; + flex-flow: row wrap; + } + } + .pas1s { + .row { + .col-lg-3 { + display: flex; + } + } + } + .modul_faqs { + border-left: 1px solid #E3E3E3; + >header { + display: flex; + flex-flow: wrap column; + align-content: flex-start; + padding: 0 30px; + } + header { + >h2 { + font-size: 23px; + font-weight: 700; + color: #1A1A1A; + line-height: 22px; + letter-spacing: 0.3px; + margin: 4px 0 0; + &:after { + position: absolute; + content: ''; + width: 48px; + height: 48px; + background-size: 48px 48px; + top: -56px; + left: calc(50% - 24px); + } + } + } + header.about { + >h2 { + &:after { + background: url('../img/faq/Icono/sobre-goteo@1x.svg') center center no-repeat; + } + } + } + header.sponsors { + >h2 { + &:after { + background: url('../img/faq/Icono/impulsores@1x.svg') center center no-repeat; + } + } + } + header.donors { + >h2 { + &:after { + background: url('../img/faq/Icono/donantes@1x.svg') center center no-repeat; + } + } + } + header.matchers { + >h2 { + &:after { + background: url('../img/faq/Icono/matchers@1x.svg') center center no-repeat; + } + } + } + >ul { + list-style: none; + padding: 32px 30px; + >li { + font-weight: 500; + line-height: 1.375em; + letter-spacing: 0.01875em; + color: #3A3A3A; + position: relative; + margin-bottom: 1em; + padding-left: 1em; + >a { + color: #3A3A3A; + text-decoration: none; + &:hover { + color: #19b4b2; + text-decoration: none; + } + } + &:after { + position: absolute; + content: ''; + width: 8px; + height: 2px; + top: 10px; + left: 0; + background-color: #19B4B2; + } + } + } + } + .modul_faqs.card { + position: relative; + border: none; + background: #FFFFFF; + box-shadow: 0 2px 5px 0 rgba(0,0,0,0.15); + border-radius: 5px; + padding-bottom: 24px; + >header { + border-radius: 5px 5px 0px 0px; + align-content: center; + } + header.about { + background: url('../img/faq/pattern/sobre_goteo@1x.svg') center center/48px repeat #FFEC61; + h2 { + color: #3A3A3A; + } + } + header.sponsors { + background: url('../img/faq/pattern/impulsores@1x.svg') center center/48px repeat #A65387; + } + header.donors { + background: url('../img/faq/pattern/donantes@1x.svg') center center/48px repeat #18508C; + } + header.matchers { + background: url('../img/faq/pattern/matchers@1x.svg') center center/48px repeat #582470; + } + header { + >h2 { + font-size: 26px; + font-weight: 900; + color: #FFFFFF; + letter-spacing: 0.26px; + text-align: center; + position: relative; + margin: 80px auto 24px; + } + } + >ul { + list-style: none; + padding: 32px 20px; + } + } + hr { + margin: 0; + border-color: #E3E3E3; + width: 100%; + } + .ver_todo { + position: absolute; + bottom: 0; + width: 100%; + padding: 0 20px; + >a { + position: relative; + display: inline-block; + font-weight: 700; + font-size: 14px; + color: #3A3A3A; + text-transform: uppercase; + margin: 1em 1.5em 1.250em; + margin: 1em 4px 1.250em; + &:hover { + color: #19b4b2; + } + &:after { + position: absolute; + content: ''; + width: 24px; + height: 24px; + top: -2px; + right: -24px; + background: url('../img/faq/icones/arrow-right-primary.svg') 0 0/24px no-repeat; + } + } + } + .pas2 { + .row { + display: flex; + flex-flow: row wrap; + .col-lg-4 { + display: flex; + } + } + } + footer.no_resuelto { + width: 100%; + margin-top: 64px; + padding-top: 32px; + border-top: 1px solid #E3E3E3; + text-align: center; + margin-bottom: 88px; + a.btn { + background: #19B4B2; + border-radius: 3px; + padding: 14px; + font-size: 14px; + color: #FFFFFF; + text-transform: uppercase; + font-weight: 700; + } + a { + &:hover.btn { + background: #118887; + color: #FFFFFF; + } + } + } + p { + font-size: 16px; + color: #3A3A3A; + letter-spacing: 0.3px; + line-height: 22px; + } + aside { + margin-bottom: 88px; + >h2.otras_preguntas { + display: none; + } + section { + margin-bottom: 24px; + >ul { + list-style: none; + padding: 0 4px 8px; + >li { + font-size: 15px; + font-weight: 500; + line-height: 1.375em; + letter-spacing: 0.01875em; + color: #3A3A3A; + position: relative; + margin-bottom: 1em; + padding-left: 1em; + >a { + color: #3A3A3A; + text-decoration: none; + &:hover { + color: #19b4b2; + text-decoration: none; + } + } + &:after { + position: absolute; + content: ''; + width: 8px; + height: 2px; + top: 10px; + left: 0; + background-color: #19B4B2; + } + } + >li.select { + color: #19b4b2; + text-decoration: none; + } + } + >h3 { + position: relative; + font-size: 17px; + font-weight: 700; + color: #3A3A3A; + letter-spacing: 0.23px; + line-height: 22px; + padding: 0 0 6px 4px; + margin-top: 0; + margin-bottom: 16px; + border-bottom: 1px solid #3A3A3A; + &:before { + position: absolute; + content: ''; + width: 24px; + height: 24px; + top: 0; + right: 4px; + background: url('../img/faq/icones/caret-down.svg') center center/18px no-repeat; + } + } + >h3.open { + &:before { + background: url('../img/faq/icones/caret-up.svg') center center/18px no-repeat; + } + } + } + } + @media only screen and (max-width: 767px) { + #header_faqs { + min-height: 192px; + margin-bottom: 32px; + .barra_superior { + .buscador_faqs { + justify-content: center; + >label { + >input[type=search] { + height: 36px; + } + } + >button.search-submit { + width: 36px; + height: 36px; + } + } + } + h1 { + font-size: 32px; + letter-spacing: 0.3px; + margin-top: 8px; + } + h3 { + font-size: 18px; + letter-spacing: 0.2px; + } + } + #header_faqs.home_faqs { + min-height: 192px; + } + .pas1 { + margin-bottom: 48px; + } + .modul_faqs { + border-left: none; + &:not(.card) { + >header { + padding: 0 4px 6px; + border-bottom: 1px solid #3A3A3A; + } + header { + >h2 { + font-size: 21px; + letter-spacing: 0.3px; + line-height: 26px; + } + } + } + >ul { + padding: 18px 8px 8px; + } + } + footer.no_resuelto { + margin-top: 32px; + margin-bottom: 48px; + a.btn { + width: 100%; + } + } + aside { + >h2.otras_preguntas { + display: inline-block; + font-weight: 700; + font-size: 23px; + color: #1A1A1A; + letter-spacing: 0.3px; + line-height: 26px; + max-width: 60%; + margin-bottom: 24px; + } + margin-bottom: 48px; + } + } + @media only screen and (max-width: 1199px) { + .modul_faqs.card { + margin-bottom: 24px; + } + } + @media only screen and (min-width: 992px) { + #header_faqs { + h1 { + max-width: 75%; + } + } + } + + +// End body +} diff --git a/src/Goteo/Controller/FaqController.php b/src/Goteo/Controller/FaqController.php new file mode 100644 index 0000000000..2b2c4eedf3 --- /dev/null +++ b/src/Goteo/Controller/FaqController.php @@ -0,0 +1,78 @@ + + * + * For the full copyright and license information, please view the README.md + * and LICENSE files that was distributed with this source code. + */ + +namespace Goteo\Controller; + +use Goteo\Application\View; +use Goteo\Core\Controller; +use Goteo\Core\Traits\LoggerTrait; +use Goteo\Library\Text; +use Goteo\Model\Faq; +use Goteo\Model\Faq\FaqSection; +use Goteo\Model\Faq\FaqSubsection; +use Symfony\Component\HttpFoundation\Request; +use Symfony\Component\HttpFoundation\Response; + +class FaqController extends Controller { + use LoggerTrait; + + public function __construct() { + // Cache & replica read activated in this controller + $this->dbReplica(true); + $this->dbCache(true); + View::setTheme('responsive'); + } + + public function indexAction (Request $request, string $section='', string $tag='' ): Response + { + $faq_sections=FaqSection::getList(); + + return $this->viewResponse('faq/index', [ + 'meta_title' => Text::get('faq-meta-title'), + 'meta_description' => Text::get('faq-meta-description'), + 'faq_sections' => $faq_sections + ] + ); + } + + public function sectionAction(Request $request, string $section): Response + { + $faq_section = FaqSection::getBySlug($section); + $subsections = FaqSubsection::getList(['section' => $faq_section->id]); + + return $this->viewResponse('faq/section', [ + 'meta_title' => $faq_section->name.' :: Faq', + 'meta_description' => Text::get('faq-meta-description'), + 'faq_section' => $faq_section, + 'subsections' => $subsections + ]); + } + + public function individualAction(Request $request, string $faq): Response + { + $faq = Faq::getBySlug($faq); + $faq_subsection = FaqSubsection::get($faq->subsection_id); + $faq_section = FaqSection::getById($faq_subsection->section_id); + + // Sidebar menu + $subsections = FaqSubsection::getList(['section' => $faq_section->id]); + + return $this->viewResponse('faq/individual', [ + 'meta_title' => $faq->title.' :: Faq', + 'meta_description' => Text::get('faq-meta-description'), + 'faq' => $faq, + 'faq_section' => $faq_section, + 'subsections' => $subsections + ]); + } + +} + + diff --git a/src/Routes/faq_routes.php b/src/Routes/faq_routes.php new file mode 100644 index 0000000000..96dd92aa57 --- /dev/null +++ b/src/Routes/faq_routes.php @@ -0,0 +1,40 @@ + + * + * For the full copyright and license information, please view the README.md + * and LICENSE files that was distributed with this source code. + */ + +use Symfony\Component\Routing\Route; +use Symfony\Component\Routing\RouteCollection; +use Symfony\Component\HttpFoundation\RedirectResponse; +use Symfony\Component\HttpFoundation\Request; + + +$faq = new RouteCollection(); + +//// FAQ ///// + + + +// New all-in-one controller +$faq->add('faq-section', new Route( + '/{section}', + [ + '_controller' => 'Goteo\Controller\FaqController::sectionAction' + ] +)); + +$faq->add('faq-individual', new Route( + '/{section}/{faq}', + [ + '_controller' => 'Goteo\Controller\FaqController::individualAction' + ] +)); + + + +return $faq; diff --git a/src/routes.php b/src/routes.php index 7d4a72f0ec..32c6d5226f 100644 --- a/src/routes.php +++ b/src/routes.php @@ -40,6 +40,15 @@ $invest_routes->addPrefix('/invest'); $routes->addCollection($invest_routes); +// Faq routes +$routes->add('faq', new Route( + '/faq', + array('_controller' => 'Goteo\Controller\FaqController::indexAction') +)); +$faq_routes = include __DIR__ . '/Routes/faq_routes.php'; +$faq_routes->addPrefix('/faq'); +$routes->addCollection($faq_routes); + // Pool routes // Pool invest main route // Notify URL for gateways that need it @@ -57,7 +66,7 @@ if(Config::get('donate.landing')) { $routes->add('donate-landing', new Route( '/donate', - array('_controller' => 'Goteo\Controller\DonateLandingController::indexAction') + array('_controller' => 'Goteo\Controller\DonateController::donateLandingAction') )); } diff --git a/tests/Goteo/Controller/FaqControllerTest.php b/tests/Goteo/Controller/FaqControllerTest.php new file mode 100644 index 0000000000..d9babbc94e --- /dev/null +++ b/tests/Goteo/Controller/FaqControllerTest.php @@ -0,0 +1,20 @@ +assertInstanceOf(FaqController::class, $controller); + + return $controller; + } +} diff --git a/translations/es/faq.yml b/translations/es/faq.yml index 0276df6f87..7f6c8cad7a 100644 --- a/translations/es/faq.yml +++ b/translations/es/faq.yml @@ -1,4 +1,8 @@ --- +faq-meta-title: 'FAQ :: Goteo' +faq-meta-description: 'Preguntas frecuentes dirigidas a resolver dudas de impulsores, donantes, y usuarios Goteo en general.' +faq-title: 'FAQs' +faq-search: '¿Qué estás buscando?' faq-ask-question: "¿No has podido resolver tu duda? Envía un mensaje con tu pregunta." faq-investors-section-header: 'Para cofinanciador@s' faq-main-section-header: 'Sobre Goteo'