CTRL + f in CSS
3446
Views
53
Comments
Implemented
Frontend (App Interfaces)
Development Environment 11.53.7 (Build 60881)

Hi everyone,


It would be great if we could text search a css class in the CSS like we do on adobe reader.

With this I believe a lot of time could be saved.


cheers.

You can do this by opening up the stylesheet and searching like this:


You can do this by opening up the stylesheet and searching like this:


Hi Justin, the idea would be being able to search directly in the css window instead of using the general search, because every time I search a css class, after hiting enter , the search bar closes. 

I find it very time-consuming every time I need to search the css class on various parts of the style sheet.

2016-04-21 20-09-55
J.
 
MVP

you do know you can hit F3 to search the next, right?


Merged this idea with '"Find" in CSS stylesheet' (created on 23 Aug 2018 13:04:12 by Ricardo Pereira)

Hi everyone!


Something that I think that is available in older versions of Service Studio 10 and dont't appear in the last versions is the "Find" option in the CSS stylesheet console.

I think that this is an powerfull tool that we can have. Many times I need to find classes in CSS code and it's much more easier if I have de find tool.


Best regards,

Ricardo



This comment was:
- originally posted on idea '"Find" in CSS stylesheet' (created on 23 Aug 2018 by Ricardo Pereira)
- merged to idea 'CTRL + f in CSS' on 25 Aug 2018 13:30:42 by Justin James

Great idea, it would make a great addition. Btw, can't believe this idea wasn't posted earlier, we can't be the only ones, right?



This comment was:
- originally posted on idea '"Find" in CSS stylesheet' (created on 23 Aug 2018 by Ricardo Pereira)
- merged to idea 'CTRL + f in CSS' on 25 Aug 2018 13:30:42 by Justin James

:)




This comment was:
- originally posted on idea '"Find" in CSS stylesheet' (created on 23 Aug 2018 by Ricardo Pereira)
- merged to idea 'CTRL + f in CSS' on 25 Aug 2018 13:30:42 by Justin James

I agree sometimes I use the normal search function but the 'Search in CSS' option is not available in the dropdown, would be useful to quickly search for this.



This comment was:
- originally posted on idea '"Find" in CSS stylesheet' (created on 23 Aug 2018 by Ricardo Pereira)
- merged to idea 'CTRL + f in CSS' on 25 Aug 2018 13:30:42 by Justin James
Merged this idea with 'Search/Replace in CSS/JavaScript' (created on 11 Jun 2018 17:42:40 by PJ M)
UserImage.jpg
PJ M

The editors for text like CSS and JavaScript need an update. As it is, we're basically forced to copy the code out of OutSystems into a more robust text editor in order to make any progress.

For example, if I want to update the border color on the footer, how do I do that? There are multiple CSS files with hundreds or thousands of lines of style in them.

It's a painful ordeal.



This comment was:
- originally posted on idea 'Search/Replace in CSS/JavaScript' (created on 11 Jun 2018 by PJ M)
- merged to idea 'CTRL + f in CSS' on 25 Aug 2018 13:31:37 by Justin James

Have you tried the CTRL+R version of find/replace? It works more like what you want, I believe (though not great, because it won't let you restrict scope to the CSS or JS).

J.Ja



This comment was:
- originally posted on idea 'Search/Replace in CSS/JavaScript' (created on 11 Jun 2018 by PJ M)
- merged to idea 'CTRL + f in CSS' on 25 Aug 2018 13:31:37 by Justin James

You can actually find/replace in CSS but you have to open CSS text editor and then search but it will only search in the last styleguide you looked into to. That's something that could be improved. 



This comment was:
- originally posted on idea 'Search/Replace in CSS/JavaScript' (created on 11 Jun 2018 by PJ M)
- merged to idea 'CTRL + f in CSS' on 25 Aug 2018 13:31:37 by Justin James
Changed the category to
Service Studio


This comment was:
- originally posted on idea 'Search/Replace in CSS/JavaScript' (created on 11 Jun 2018 by PJ M)
- merged to idea 'CTRL + f in CSS' on 25 Aug 2018 13:31:37 by Justin James
2014-02-07 17-02-43
Vasco Pessanha
Changed the status to
On our RadarOn our radar

Thanks!



This comment was:
- originally posted on idea 'Search/Replace in CSS/JavaScript' (created on 11 Jun 2018 by PJ M)
- merged to idea 'CTRL + f in CSS' on 25 Aug 2018 13:31:37 by Justin James
Merged this idea with 'Search in StyleSheet (CSS)' (created on 19 Dec 2019 11:03:48 by Palak Patel)

Dear Team, 

It would be better if we can have an option to search specific classes in Style Editor or CSS Editor so that we can easily find/identify classes which we are looking for. 


Currently its available to search from Global Search, but specific Style Search is not available in Platform 10.

Regards,



This comment was:
- originally posted on idea 'Search in StyleSheet (CSS)' (created on 19 Dec 2019 by Palak Patel)
- merged to idea 'CTRL + f in CSS' on 03 Jun 2020 03:04:13 by Justin James

If you have the CSS Editor open you can then use the Global Search to search the CSS, you should see something like CSS - Search for "something" in Style Sheet. If you don't see this, click on the CSS editor again. This is available on version 10.



This comment was:
- originally posted on idea 'Search in StyleSheet (CSS)' (created on 19 Dec 2019 by Palak Patel)
- merged to idea 'CTRL + f in CSS' on 03 Jun 2020 03:04:13 by Justin James
Changed the category to
Frontend


This comment was:
- originally posted on idea 'Search in StyleSheet (CSS)' (created on 19 Dec 2019 by Palak Patel)
- merged to idea 'CTRL + f in CSS' on 03 Jun 2020 03:04:13 by Justin James
Merged this idea with 'Search Inside CSS Style Sheet Editor' (created on 02 Jun 2020 14:39:36 by Inês Serralheiro)

This comment was:
- originally posted on idea 'Search in StyleSheet (CSS)' (created on 19 Dec 2019 by Palak Patel)
- merged to idea 'CTRL + f in CSS' on 03 Jun 2020 03:04:13 by Justin James

It would be great if we could search directly inside the CSS Style Sheet Editor (and possibly highlighting the searched text), instead of searching in the general search (control+F), which will only show where the style is applied.


When we have plenty of styles, we have to scroll down all over the style sheet window in order to find the style we need, which is not very user-friendly.


A possible mockup:



This comment was:
- originally posted on idea 'Search Inside CSS Style Sheet Editor' (created on 02 Jun 2020 by Inês Serralheiro)
- merged to idea 'Search in StyleSheet (CSS)' on 03 Jun 2020 03:03:19 by Justin James


This comment was:
- originally posted on idea 'Search in StyleSheet (CSS)' (created on 19 Dec 2019 by Palak Patel)
- merged to idea 'CTRL + f in CSS' on 03 Jun 2020 03:04:13 by Justin James
Merged this idea with 'Search for css' (created on 29 Jan 2019 11:36:32 by André Portugal)

Hi, 

sometimes we need to search for a tag or color in CSS. It would be good to have a search bar inside the Css window, where we can do the search.

Thanks,

André



This comment was:
- originally posted on idea 'Search for css' (created on 29 Jan 2019 by André Portugal)
- merged to idea 'CTRL + f in CSS' on 03 Jun 2020 03:09:21 by Justin James
2014-02-07 17-02-43
Vasco Pessanha
Changed the category to
Frontend


This comment was:
- originally posted on idea 'Search for css' (created on 29 Jan 2019 by André Portugal)
- merged to idea 'CTRL + f in CSS' on 03 Jun 2020 03:09:21 by Justin James

We have a top right search that searches css as well, but I'm also missing this feature. 



This comment was:
- originally posted on idea 'Search for css' (created on 29 Jan 2019 by André Portugal)
- merged to idea 'CTRL + f in CSS' on 03 Jun 2020 03:09:21 by Justin James

Hi,

You can press Ctrl+R and it opens a "Find and Replace" box where you can easy make that kind of search. Maybe this can fill your needs.


Regards,

Ricardo



This comment was:
- originally posted on idea 'Search for css' (created on 29 Jan 2019 by André Portugal)
- merged to idea 'CTRL + f in CSS' on 03 Jun 2020 03:09:21 by Justin James
Merged this idea with 'Built-In Keyword search for CSS and JS editors' (created on 15 Oct 2019 15:06:27 by Pedro Borges)

Sometimes I need to find a specific class on one of the editors mentioned in the title, and it's quite difficult to scroll down the whole document for this purpose



This comment was:
- originally posted on idea 'Built-In Keyword search for CSS and JS editors' (created on 15 Oct 2019 by Pedro Borges)
- merged to idea 'CTRL + f in CSS' on 03 Jun 2020 03:10:05 by Justin James
2022-03-01 15-42-44
Thiago Mari
Champion

Hi,


I guess in version 11 they already change that because when i need to find something, just click Ctrl + F to open the Search toolbox and just written the class and they appear (if exist).




This comment was:
- originally posted on idea 'Built-In Keyword search for CSS and JS editors' (created on 15 Oct 2019 by Pedro Borges)
- merged to idea 'CTRL + f in CSS' on 03 Jun 2020 03:10:05 by Justin James
Merged this idea with 'Search field inside Style Sheets' (created on 28 Apr 2020 14:43:29 by Lenon Manhães)

Hi, community.

I can't remember how many times this issue make my work slowly.

Every time I need to change a class in my stylesheets, is horrible to find inside the severals style sheet in the platform. Sometimes there are four or five style sheets feeding the application and is VERY hard to find an class.

My idea is to implement a search field inside the style sheets to make the front-end work more smooth. 


Best regards



This comment was:
- originally posted on idea 'Search field inside Style Sheets' (created on 28 Apr 2020 by Lenon Manhães)
- merged to idea 'CTRL + f in CSS' on 03 Jun 2020 03:12:33 by Justin James
Merged this idea with 'Search feature within OutSystems text editor' (created on 25 May 2020 14:07:29 by Akshay Puri)
2023-01-04 05-10-52
Akshay Puri
Champion

It would be really helpful to have a search feature within the OutSystems service studio text editor used for e.g. CSS, JavaScript etc. Currently for bigger CSS or JavaScripts we need copy the text outside the service studio and then search it.



This comment was:
- originally posted on idea 'Search feature within OutSystems text editor' (created on 25 May 2020 by Akshay Puri)
- merged to idea 'CTRL + f in CSS' on 03 Jun 2020 03:17:39 by Justin James
Merged this idea with 'CTRL + F (FINDING STYLE CLASSES NAME) inside the style sheet window' (created on 30 Jul 2019 06:37:36 by shuasugatan)

Implementing a search function inside the style sheet window for finding names of style classes :D



This comment was:
- originally posted on idea 'CTRL + F (FINDING STYLE CLASSES NAME) inside the style sheet window' (created on 30 Jul 2019 by shuasugatan)
- merged to idea 'CTRL + f in CSS' on 03 Jun 2020 03:18:32 by Justin James

Hi


You have a top right search that searches css as well.


Regards



This comment was:
- originally posted on idea 'CTRL + F (FINDING STYLE CLASSES NAME) inside the style sheet window' (created on 30 Jul 2019 by shuasugatan)
- merged to idea 'CTRL + f in CSS' on 03 Jun 2020 03:18:32 by Justin James

I often use Ctrl+R to search text inside css. Cheers!



This comment was:
- originally posted on idea 'CTRL + F (FINDING STYLE CLASSES NAME) inside the style sheet window' (created on 30 Jul 2019 by shuasugatan)
- merged to idea 'CTRL + f in CSS' on 03 Jun 2020 03:18:32 by Justin James

Thanks, Mukul Varshney! that what I was looking for :D



This comment was:
- originally posted on idea 'CTRL + F (FINDING STYLE CLASSES NAME) inside the style sheet window' (created on 30 Jul 2019 by shuasugatan)
- merged to idea 'CTRL + f in CSS' on 03 Jun 2020 03:18:32 by Justin James
Changed the category to
Service Studio
and the status to
Implemented
on 09 Oct 2017

Hi shuasugatan, as Alberto Ferreira already said, you can use Ctrl+F to search inside your CSS.
I'll mark this idea as implemented, but feel free to reach me if you need any further help.
Cheers,
Sofia Modesto.



This comment was:
- originally posted on idea 'CTRL + F (FINDING STYLE CLASSES NAME) inside the style sheet window' (created on 30 Jul 2019 by shuasugatan)
- merged to idea 'CTRL + f in CSS' on 03 Jun 2020 03:18:32 by Justin James
Merged this idea with 'Include an "input type =" search "" in the Style Sheet Editor' (created on 03 Jul 2020 08:25:43 by RENAN BERNARDELLI)

As a Front End Developer and beginner in the OutSystems platform, I often need to research classes and their properties on the Style Sheet Editor in order to reuse them and avoid to create the same class again. 

My suggestion is to create an Input Search to help find classes, variables, etc., within each tab of the editor.

Find attached an image of my idea.



This comment was:
- originally posted on idea 'Include an "input type =" search "" in the Style Sheet Editor' (created on 03 Jul 2020 by RENAN BERNARDELLI)
- merged to idea 'CTRL + f in CSS' on 04 Jul 2020 20:26:49 by Justin James
2014-02-07 17-02-43
Vasco Pessanha
Merged this idea with 'Find and line numbers in CSS Editor' (created on 20 Jan 2020 18:17:28 by Marco Gaspar)

It will be very useful to have the possibility to have a find css editor and line numbers. This would be the least to have a decent css editor. 

Keep up the great work.

Thank you.



This comment was:
- originally posted on idea 'Find and line numbers in CSS Editor' (created on 20 Jan 2020 by Marco Gaspar)
- merged to idea 'CTRL + f in CSS' on 11 Sep 2020 13:30:16 by Vasco Pessanha

+1



This comment was:
- originally posted on idea 'Find and line numbers in CSS Editor' (created on 20 Jan 2020 by Marco Gaspar)
- merged to idea 'CTRL + f in CSS' on 11 Sep 2020 13:30:16 by Vasco Pessanha

Consider to merge 

https://www.outsystems.com/ideas/7812/search-in-stylesheet-css?IsFromAdvancedSearch=True




This comment was:
- originally posted on idea 'Find and line numbers in CSS Editor' (created on 20 Jan 2020 by Marco Gaspar)
- merged to idea 'CTRL + f in CSS' on 11 Sep 2020 13:30:16 by Vasco Pessanha

I am supporting of all suggested improvements to the Outsystems CSS editor as it is very basic. We rarely use it for coding CSS other than making some minor tweaks to the CSS.



This comment was:
- originally posted on idea 'Find and line numbers in CSS Editor' (created on 20 Jan 2020 by Marco Gaspar)
- merged to idea 'CTRL + f in CSS' on 11 Sep 2020 13:30:16 by Vasco Pessanha

As a suggestion for the future, please put separate conceptual ideas into separate Ideas posts... there are two other Ideas I would like to merge this with... one for line numbers, one for better finding of CSS classes... but because this has two ideas in one post, I really don't have a good option to merge.

J.Ja



This comment was:
- originally posted on idea 'Find and line numbers in CSS Editor' (created on 20 Jan 2020 by Marco Gaspar)
- merged to idea 'CTRL + f in CSS' on 11 Sep 2020 13:30:16 by Vasco Pessanha
2014-02-07 17-02-43
Vasco Pessanha

Hey Marco,

Both Find and line numbering were already suggested in the community:


I will merge with the first!



This comment was:
- originally posted on idea 'Find and line numbers in CSS Editor' (created on 20 Jan 2020 by Marco Gaspar)
- merged to idea 'CTRL + f in CSS' on 11 Sep 2020 13:30:16 by Vasco Pessanha
2014-02-07 17-02-43
Vasco Pessanha
Changed the status to
Working on it
expected delivery in Q4 2020

Hey guys,

I'm happy to announce that we are working on this and we expect to have news until the end of the year.

Stay tuned and check the NextStep event to see what is coming!
We will have a presentation on the new Service Studio version in the AI-Powered Development booth.

Cheers,



Thansk for the update! Vasco.

Hey, everyone!

I am very happy to tell you that the mentioned feature: Search in the CSS is currently available in the Service Studio Beta Version!

If you have the chance to install it, please let me know your feedback!

We'll mark this idea as implemented as soon it is globally available for all the OutSystems Community.

Have a nice day!

This idea is implemented.

Changed the status to
Implemented
on 11 Jul 2022

This idea is already implemented, check the latest service studio stable version!